@nova-design-system/nova-react 3.5.0 → 3.7.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/README.md +6 -0
- package/dist/cjs/{timeline.animation-1b88f052-B8-vCVrY.js → collapse.animation-16e3af45-CChx_tQJ.js} +4 -25
- package/dist/cjs/fade.animation-71e8e34c-BAw_TYsB.js +68 -0
- package/dist/cjs/{index-Te0zRbKN.js → index-Cv7U-U85.js} +2237 -1595
- package/dist/cjs/index.js +3 -1
- package/dist/cjs/nv-accordion-item.entry-BgDBJjHO.js +178 -0
- package/dist/cjs/nv-accordion.entry-1dHBq_qo.js +164 -0
- package/dist/cjs/{nv-alert.entry-CPbApg9_.js → nv-alert.entry-6J-BEBxl.js} +10 -8
- package/dist/cjs/{nv-avatar.entry-CwM8IOei.js → nv-avatar.entry-Lav6aVEw.js} +2 -2
- package/dist/cjs/{nv-badge_2.entry-Bqu-2k7E.js → nv-badge_2.entry-DaAOJgy_.js} +14 -12
- package/dist/cjs/{nv-breadcrumb.entry-CmceXVS9.js → nv-breadcrumb.entry-BKoLlkWC.js} +2 -2
- package/dist/cjs/{nv-breadcrumbs.entry-B7xbEUl5.js → nv-breadcrumbs.entry-BdGgzdxC.js} +2 -2
- package/dist/cjs/{nv-button.entry-Cd_CE1fx.js → nv-button.entry-Pe2qJFy0.js} +2 -2
- package/dist/cjs/{nv-calendar.entry-B2lm2nvb.js → nv-calendar.entry-WRFrbZtz.js} +97 -67
- package/dist/cjs/{nv-col.entry-BF8XR4B1.js → nv-col.entry-C3IgKfxS.js} +2 -2
- package/dist/cjs/{nv-datagrid.entry-CcQ8XP6J.js → nv-datagrid.entry-Bh1mgk8D.js} +3 -3
- package/dist/cjs/{nv-datagridcolumn.entry-uGbQ4NMr.js → nv-datagridcolumn.entry-DopvtY6C.js} +2 -2
- package/dist/cjs/{nv-dialog.entry-DyK4wFFz.js → nv-dialog.entry-D8oF5B-9.js} +20 -7
- package/dist/cjs/{nv-dialogfooter_2.entry-DT3kR9Xn.js → nv-dialogfooter_2.entry-QE1dFuOh.js} +3 -3
- package/dist/cjs/{nv-fieldcheckbox.entry-D_wHbgcq.js → nv-fieldcheckbox.entry-BbC0JUWc.js} +5 -5
- package/dist/cjs/{nv-fielddate.entry-BaIcP2EG.js → nv-fielddate.entry-BIuQgdYW.js} +122 -36
- package/dist/cjs/{nv-fielddaterange.entry-BNcF2N2M.js → nv-fielddaterange.entry-C82h1WUR.js} +33 -5
- package/dist/cjs/{nv-fielddropdown.entry-DWlDvODi.js → nv-fielddropdown.entry-CWqg8M3_.js} +4 -4
- package/dist/cjs/{nv-fielddropdownitem.entry-BIy_GUKA.js → nv-fielddropdownitem.entry-KuL1iVS4.js} +2 -2
- package/dist/cjs/{nv-fieldmultiselect.entry-B74CLRuh.js → nv-fieldmultiselect.entry-CAdWlUw2.js} +96 -103
- package/dist/cjs/{nv-fieldnumber.entry-BQBy1EIj.js → nv-fieldnumber.entry-Bbk2wO5k.js} +4 -4
- package/dist/cjs/{nv-fieldpassword.entry-DNFZvmBx.js → nv-fieldpassword.entry-BOtLqrGx.js} +4 -4
- package/dist/cjs/{nv-fieldradio.entry-BIR29jv5.js → nv-fieldradio.entry-CY4txacC.js} +4 -4
- package/dist/cjs/{nv-fieldselect.entry-DulA_N5q.js → nv-fieldselect.entry-CRP6e7uq.js} +6 -6
- package/dist/cjs/{nv-fieldslider.entry-DCslY5gg.js → nv-fieldslider.entry-BLO9yOcu.js} +54 -10
- package/dist/cjs/{nv-fieldtext.entry-Dvv8KjJC.js → nv-fieldtext.entry-BqgV8SxD.js} +4 -4
- package/dist/cjs/{nv-fieldtextarea.entry-rVcnznae.js → nv-fieldtextarea.entry-dDaXddme.js} +4 -4
- package/dist/cjs/{nv-fieldtime.entry-_fXkWsoI.js → nv-fieldtime.entry-DAIYFHO7.js} +11 -11
- package/dist/cjs/{nv-icon.entry-BGyFETNH.js → nv-icon.entry-CxE0uTUN.js} +2 -2
- package/dist/cjs/{nv-iconbutton_2.entry-CtClzxKf.js → nv-iconbutton_2.entry-DAWQjqvb.js} +3 -3
- package/dist/cjs/{nv-menu.entry-B3vFxd1E.js → nv-menu.entry-Fg1jfAeH.js} +2 -2
- package/dist/cjs/{nv-menuitem.entry-BIWwr98d.js → nv-menuitem.entry-CGg4iJrd.js} +2 -2
- package/dist/cjs/{nv-popover.entry-vonHjF_y.js → nv-popover.entry-DsKxPxfa.js} +9 -8
- package/dist/cjs/{nv-row.entry-BYUhLZ0r.js → nv-row.entry-BsPFwLLA.js} +2 -2
- package/dist/cjs/{nv-stack.entry-Cxc6QmII.js → nv-stack.entry-4Ec3nJml.js} +2 -2
- package/dist/cjs/{nv-table.entry-DSBUXcSF.js → nv-table.entry-Bv0iDqou.js} +3 -3
- package/dist/cjs/{nv-tablecolumn.entry-BP857bqD.js → nv-tablecolumn.entry-XJJCmUC2.js} +1 -1
- package/dist/cjs/{nv-toggle.entry-CnquGUlJ.js → nv-toggle.entry-C72c_569.js} +3 -3
- package/dist/cjs/{nv-tooltip.entry-XvxL_FTH.js → nv-tooltip.entry-BNvm30iV.js} +4 -3
- package/dist/cjs/{fade.animation-2a077983-aKN0EDTo.js → stylefire.es-74da334a-y0piPjlz.js} +0 -64
- package/dist/cjs/timeline.animation-adf35ecb-CE6Dsdxr.js +23 -0
- package/dist/generated/components.js +18 -2
- package/dist/generated/components.server.js +23 -3
- package/dist/types/generated/components.d.ts +17 -3
- package/dist/types/generated/components.server.d.ts +17 -3
- package/package.json +1 -1
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-Cv7U-U85.js');
|
|
4
4
|
var inputmaskEdcad3c1 = require('./inputmask-edcad3c1-B9Omti4z.js');
|
|
5
5
|
var v4A79185f4 = require('./v4-a79185f4-2n0dOd_Y.js');
|
|
6
6
|
require('react');
|
|
7
7
|
require('./_commonjsHelpers-1789f0cf-BJu3ubxk.js');
|
|
8
8
|
|
|
9
|
-
const nvFielddateCss = "nv-fieldslider .slider-container .track-container:has(.thumb:hover) .track-range{background:var(--components-slider-track-filled-hover)}nv-fieldslider .slider-container .track-container:has(.thumb:hover) .thumb{border-color:var(--components-slider-track-filled-hover)}nv-fieldslider .slider-container .track-container:has(.thumb:focus) .track-range{background:var(--components-slider-track-filled-focus)}nv-fieldslider .slider-container .track-container:has(.thumb:focus) .thumb{border-color:var(--components-slider-track-filled-focus)}nv-fieldslider[error] .slider-container .track-container .track .track-range{background:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb{border-color:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb:hover{border-color:var(--components-slider-track-filled-error);outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-slider-track-filled-error);outline-offset:calc(var(--focus-outline-offset) * 1);background-color:var(--components-slider-handler-background-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb:focus{border-color:var(--components-slider-track-filled-error);outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-slider-track-filled-error);outline-offset:calc(var(--focus-outline-offset) * 1);background-color:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container:has(.thumb:hover) .track-range{background:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container:has(.thumb:hover) .thumb{border-color:var(--components-slider-track-filled-error)}nv-fielddate{--nv-field-border-default:var(--components-form-field-border-default);--nv-field-border-hover:var(--components-form-field-border-hover);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--components-form-field-border-default);--nv-field-border-readonly:var(--components-form-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-brand);--nv-field-background:var(--components-form-field-background-default);display:flex;flex-direction:column;align-items:flex-start;gap:var(--form-gap-y);box-sizing:border-box;max-width:480px}nv-fielddate[fluid]:not([fluid=false]){max-width:unset}nv-fielddate[readonly]:not([readonly=false]){--nv-field-border-default:var(--components-form-field-border-readonly);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-background:var(--components-form-field-background-readonly)}nv-fielddate[error]:not([error=false]){--nv-field-border-default:var(--components-form-field-border-error);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--nv-field-border-default);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-destructive-in-field)}nv-fielddate[success]:not([success=false]){--nv-field-border-default:var(--components-form-field-border-success);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--nv-field-border-default);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-success)}nv-fielddate[required]:not([required=false]) label::after{content:\"*\";color:var(--components-form-text-required);font-weight:700}nv-fielddate label{display:flex;align-items:center;gap:var(--form-label-gap);align-self:stretch;color:var(--components-form-text-label-default);font-family:\"TT Norms Pro\", sans-serif;font-size:var(--form-label-font-size);font-style:normal;font-weight:500;line-height:var(--form-label-line-height)}nv-fielddate nv-popover{width:100%;display:block}nv-fielddate nv-popover [data-scope=popover]{padding:0;background-color:var(--components-list-dropdown-background);border:1px solid var(--components-list-dropdown-border);width:auto}nv-fielddate nv-popover [slot=content]{display:block;width:100%}nv-fielddate nv-popover .datepicker-container{border:none}nv-fielddate .input-wrapper{display:flex;flex-wrap:wrap;gap:var(--form-gap-x);align-items:stretch;align-self:stretch;display:flex;align-items:center;gap:8px}nv-fielddate .input-wrapper .input-container{display:flex;flex-grow:1;justify-content:center;align-items:center;align-self:stretch;border-radius:var(--form-field-radius);border-width:1px;border-style:solid;border-color:var(--nv-field-border-default);opacity:var(--components-form-opacity-default, 1);background:var(--nv-field-background);transition:all 150ms ease-out}nv-fielddate .input-wrapper .input-container:hover{border-color:var(--nv-field-border-hover)}nv-fielddate .input-wrapper .input-container:focus-within,nv-fielddate .input-wrapper .input-container:focus-within:hover,nv-fielddate .input-wrapper .input-container:focus,nv-fielddate .input-wrapper .input-container:focus:hover{border-color:var(--nv-field-border-focus);box-shadow:0px 0px 0px var(--focus-field-stroke) var(--nv-field-focus-box-shadow)}nv-fielddate .input-wrapper .input-container:has(input:read-only){opacity:0.5;background-color:var(--components-form-field-background-readonly);border-color:var(--nv-field-border-readonly)}nv-fielddate .input-wrapper .input-container:has(input:disabled){opacity:0.5;background-color:var(--components-form-field-background-disabled);border-color:var(--nv-field-border-disabled)}nv-fielddate .input-wrapper .input-container input{display:flex;align-items:center;flex:1 0 0;overflow:hidden;background-color:transparent;color:var(--components-form-field-content-text);padding:var(--form-field-padding-y) var(--form-field-padding-x);font-size:var(--form-field-font-size);font-style:normal;font-weight:500;line-height:var(--form-field-line-height);width:100%;}nv-fielddate .input-wrapper .input-container input:focus{outline:none}nv-fielddate .input-wrapper .input-container input::placeholder{overflow:hidden;color:var(--components-form-field-content-placeholder);text-overflow:ellipsis;font-family:\"TT Norms Pro\", sans-serif;font-size:var(--form-field-font-size);font-style:normal;font-weight:400;line-height:var(--form-field-line-height)}nv-fielddate .input-wrapper .input-container input[type=password]::-ms-clear,nv-fielddate .input-wrapper .input-container input[type=password]::-ms-reveal{display:none;width:0;height:0}nv-fielddate .input-wrapper .input-container>nv-iconbutton{border:0px;border-radius:0px}nv-fielddate .input-wrapper .input-container>nv-iconbutton:focus-visible{border-radius:var(--button-md-border-radius);outline-offset:-3px}nv-fielddate .input-wrapper .input-container nv-icon.validation{color:var(--nv-field-border-default)}nv-fielddate .description{display:flex;align-items:center;align-self:stretch;gap:var(--spacing-1);color:var(--components-form-text-description-default);font-family:\"TT Norms Pro\", sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height)}nv-fielddate .error-description{display:flex;align-items:center;align-self:stretch;gap:var(--spacing-1);color:var(--components-form-text-description-default);font-family:\"TT Norms Pro\", sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height);color:var(--components-form-text-description-error)}";
|
|
9
|
+
const nvFielddateCss = "nv-fieldslider .slider-container .track-container:has(.thumb:hover) .track-range{background:var(--components-slider-track-filled-hover)}nv-fieldslider .slider-container .track-container:has(.thumb:hover) .thumb{border-color:var(--components-slider-track-filled-hover)}nv-fieldslider .slider-container .track-container:has(.thumb:focus) .track-range{background:var(--components-slider-track-filled-focus)}nv-fieldslider .slider-container .track-container:has(.thumb:focus) .thumb{border-color:var(--components-slider-track-filled-focus)}nv-fieldslider[error] .slider-container .track-container .track .track-range{background:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb{border-color:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb:hover{border-color:var(--components-slider-track-filled-error);outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-slider-track-filled-error);outline-offset:calc(var(--focus-outline-offset) * 1);background-color:var(--components-slider-handler-background-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb:focus{border-color:var(--components-slider-track-filled-error);outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-slider-track-filled-error);outline-offset:calc(var(--focus-outline-offset) * 1);background-color:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container:has(.thumb:hover) .track-range{background:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container:has(.thumb:hover) .thumb{border-color:var(--components-slider-track-filled-error)}nv-fielddate{--nv-field-border-default:var(--components-form-field-border-default);--nv-field-border-hover:var(--components-form-field-border-hover);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--components-form-field-border-default);--nv-field-border-readonly:var(--components-form-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-brand);--nv-field-background:var(--components-form-field-background-default);display:flex;flex-direction:column;align-items:flex-start;gap:var(--form-gap-y);box-sizing:border-box;max-width:480px}nv-fielddate[fluid]:not([fluid=false]){max-width:unset}nv-fielddate[readonly]:not([readonly=false]){--nv-field-border-default:var(--components-form-field-border-readonly);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-background:var(--components-form-field-background-readonly)}nv-fielddate[error]:not([error=false]){--nv-field-border-default:var(--components-form-field-border-error);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--nv-field-border-default);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-destructive-in-field)}nv-fielddate[success]:not([success=false]){--nv-field-border-default:var(--components-form-field-border-success);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--nv-field-border-default);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-success)}nv-fielddate[required]:not([required=false]) label::after{content:\"*\";color:var(--components-form-text-required);font-weight:700}nv-fielddate label{display:flex;align-items:center;gap:var(--form-label-gap);align-self:stretch;color:var(--components-form-text-label-default);font-family:\"TT Norms Pro\", sans-serif;font-size:var(--form-label-font-size);font-style:normal;font-weight:500;line-height:var(--form-label-line-height)}nv-fielddate nv-popover{width:100%;display:block}nv-fielddate nv-popover [data-scope=popover]{padding:0;background-color:var(--components-list-dropdown-background);border:1px solid var(--components-list-dropdown-border);width:auto}nv-fielddate nv-popover [slot=content]{display:block;width:100%}nv-fielddate nv-popover .datepicker-container{border:none}nv-fielddate .input-wrapper{display:flex;flex-wrap:wrap;gap:var(--form-gap-x);align-items:stretch;align-self:stretch;display:flex;align-items:center;gap:8px}nv-fielddate .input-wrapper .input-container{display:flex;flex-grow:1;justify-content:center;align-items:center;align-self:stretch;border-radius:var(--form-field-radius);border-width:1px;border-style:solid;border-color:var(--nv-field-border-default);opacity:var(--components-form-opacity-default, 1);background:var(--nv-field-background);transition:all 150ms ease-out}nv-fielddate .input-wrapper .input-container:hover{border-color:var(--nv-field-border-hover)}nv-fielddate .input-wrapper .input-container:focus-within,nv-fielddate .input-wrapper .input-container:focus-within:hover,nv-fielddate .input-wrapper .input-container:focus,nv-fielddate .input-wrapper .input-container:focus:hover{border-color:var(--nv-field-border-focus);box-shadow:0px 0px 0px var(--focus-field-stroke) var(--nv-field-focus-box-shadow)}nv-fielddate .input-wrapper .input-container:has(input:read-only){opacity:0.5;background-color:var(--components-form-field-background-readonly);border-color:var(--nv-field-border-readonly)}nv-fielddate .input-wrapper .input-container:has(input:disabled){opacity:0.5;background-color:var(--components-form-field-background-disabled);border-color:var(--nv-field-border-disabled)}nv-fielddate .input-wrapper .input-container input{display:flex;align-items:center;flex:1 0 0;overflow:hidden;background-color:transparent;color:var(--components-form-field-content-text);padding:var(--form-field-padding-y) var(--form-field-padding-x);font-size:var(--form-field-font-size);font-style:normal;font-weight:500;line-height:var(--form-field-line-height);width:100%;font-feature-settings:\"tnum\";font-family:\"TTNorms Pro Mono\", monospace}nv-fielddate .input-wrapper .input-container input:focus{outline:none}nv-fielddate .input-wrapper .input-container input::placeholder{overflow:hidden;color:var(--components-form-field-content-placeholder);text-overflow:ellipsis;font-family:\"TT Norms Pro\", sans-serif;font-size:var(--form-field-font-size);font-style:normal;font-weight:400;line-height:var(--form-field-line-height)}nv-fielddate .input-wrapper .input-container input[type=password]::-ms-clear,nv-fielddate .input-wrapper .input-container input[type=password]::-ms-reveal{display:none;width:0;height:0}nv-fielddate .input-wrapper .input-container>nv-iconbutton{border:0px;border-radius:0px}nv-fielddate .input-wrapper .input-container>nv-iconbutton:focus-visible{border-radius:var(--button-md-border-radius);outline-offset:-3px}nv-fielddate .input-wrapper .input-container nv-icon.validation{color:var(--nv-field-border-default)}nv-fielddate .description{display:flex;align-items:center;align-self:stretch;gap:var(--spacing-1);color:var(--components-form-text-description-default);font-family:\"TT Norms Pro\", sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height)}nv-fielddate .error-description{display:flex;align-items:center;align-self:stretch;gap:var(--spacing-1);color:var(--components-form-text-description-default);font-family:\"TT Norms Pro\", sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height);color:var(--components-form-text-description-error)}";
|
|
10
10
|
const NvFielddateStyle0 = nvFielddateCss;
|
|
11
11
|
|
|
12
12
|
const NvFielddate = class {
|
|
@@ -124,10 +124,7 @@ const NvFielddate = class {
|
|
|
124
124
|
this.inputElement.focus();
|
|
125
125
|
// Select the first characters based on the date format
|
|
126
126
|
const format = this.dateFormat;
|
|
127
|
-
if (format.startsWith('DD')) {
|
|
128
|
-
this.inputElement.setSelectionRange(0, 2);
|
|
129
|
-
}
|
|
130
|
-
else if (format.startsWith('MM')) {
|
|
127
|
+
if (format.startsWith('DD') || format.startsWith('MM')) {
|
|
131
128
|
this.inputElement.setSelectionRange(0, 2);
|
|
132
129
|
}
|
|
133
130
|
else if (format.startsWith('YYYY')) {
|
|
@@ -154,13 +151,66 @@ const NvFielddate = class {
|
|
|
154
151
|
}
|
|
155
152
|
};
|
|
156
153
|
/**
|
|
157
|
-
*
|
|
154
|
+
* Initializes the input mask.
|
|
158
155
|
*/
|
|
159
|
-
this.
|
|
160
|
-
|
|
156
|
+
this.initializeInputMask = () => {
|
|
157
|
+
this.currentPlaceholder = '';
|
|
158
|
+
if (this.inputElement.inputmask) {
|
|
161
159
|
return;
|
|
162
160
|
}
|
|
163
|
-
|
|
161
|
+
const inputMask = new inputmaskEdcad3c1.Inputmask({
|
|
162
|
+
alias: 'datetime',
|
|
163
|
+
inputFormat: this.convertToInputmaskFormat(this.dateFormat),
|
|
164
|
+
placeholder: ' ',
|
|
165
|
+
prefillYear: false,
|
|
166
|
+
clearIncomplete: false,
|
|
167
|
+
showMaskOnHover: false,
|
|
168
|
+
showMaskOnFocus: false,
|
|
169
|
+
clearMaskOnLostFocus: false,
|
|
170
|
+
insertMode: true,
|
|
171
|
+
rightAlign: false,
|
|
172
|
+
oncomplete: function (e) {
|
|
173
|
+
const input = e.target;
|
|
174
|
+
const event = new CustomEvent('input', { bubbles: true });
|
|
175
|
+
input.dispatchEvent(event);
|
|
176
|
+
},
|
|
177
|
+
});
|
|
178
|
+
inputMask.mask(this.inputElement);
|
|
179
|
+
// Set the value after applying the mask
|
|
180
|
+
if (this.inputElement.name === this.name && this.singleValue) {
|
|
181
|
+
requestAnimationFrame(() => {
|
|
182
|
+
this.inputElement.value = this.singleValue;
|
|
183
|
+
const event = new CustomEvent('input', { bubbles: true });
|
|
184
|
+
this.inputElement.dispatchEvent(event);
|
|
185
|
+
});
|
|
186
|
+
}
|
|
187
|
+
};
|
|
188
|
+
/**
|
|
189
|
+
* Handles keydown events on the input before the mask is initialized.
|
|
190
|
+
* Initializes the mask on the first number input.
|
|
191
|
+
* @param {KeyboardEvent} event - The keyboard event.
|
|
192
|
+
*/
|
|
193
|
+
this.handleKeydownBeforeMask = (event) => {
|
|
194
|
+
const allowedKeys = [
|
|
195
|
+
'Backspace',
|
|
196
|
+
'Delete',
|
|
197
|
+
'Tab',
|
|
198
|
+
'ArrowLeft',
|
|
199
|
+
'ArrowRight',
|
|
200
|
+
'ArrowUp',
|
|
201
|
+
'ArrowDown',
|
|
202
|
+
'Home',
|
|
203
|
+
'End',
|
|
204
|
+
];
|
|
205
|
+
if (/\d/.test(event.key)) {
|
|
206
|
+
this.initializeInputMask();
|
|
207
|
+
this.inputElement.removeEventListener('keydown', this.handleKeydownBeforeMask);
|
|
208
|
+
}
|
|
209
|
+
else if (!allowedKeys.includes(event.key) &&
|
|
210
|
+
!event.metaKey &&
|
|
211
|
+
!event.ctrlKey) {
|
|
212
|
+
event.preventDefault();
|
|
213
|
+
}
|
|
164
214
|
};
|
|
165
215
|
/**
|
|
166
216
|
* Handles focus events on the input element.
|
|
@@ -172,6 +222,16 @@ const NvFielddate = class {
|
|
|
172
222
|
event.target.blur();
|
|
173
223
|
return;
|
|
174
224
|
}
|
|
225
|
+
if (!this.inputElement.inputmask) {
|
|
226
|
+
this.inputElement.addEventListener('keydown', this.handleKeydownBeforeMask);
|
|
227
|
+
}
|
|
228
|
+
this.open = true;
|
|
229
|
+
};
|
|
230
|
+
/**
|
|
231
|
+
* Handles blur events on the input element.
|
|
232
|
+
*/
|
|
233
|
+
this.handleBlur = () => {
|
|
234
|
+
this.inputElement.removeEventListener('keydown', this.handleKeydownBeforeMask);
|
|
175
235
|
};
|
|
176
236
|
/**
|
|
177
237
|
* Prevents the valueChanged event from the calendar from propagating up.
|
|
@@ -194,6 +254,15 @@ const NvFielddate = class {
|
|
|
194
254
|
this.setInputRef = (el) => {
|
|
195
255
|
this.inputElement = el;
|
|
196
256
|
};
|
|
257
|
+
/**
|
|
258
|
+
* Toggles the opening/closing of the popover.
|
|
259
|
+
*/
|
|
260
|
+
this.toggleCalendar = () => {
|
|
261
|
+
if (this.readonly || this.disabled) {
|
|
262
|
+
return;
|
|
263
|
+
}
|
|
264
|
+
this.open = !this.open;
|
|
265
|
+
};
|
|
197
266
|
}
|
|
198
267
|
//#endregion PROPERTIES
|
|
199
268
|
/****************************************************************************/
|
|
@@ -204,20 +273,39 @@ const NvFielddate = class {
|
|
|
204
273
|
* @returns {string} Format adapted for Inputmask.
|
|
205
274
|
*/
|
|
206
275
|
convertToInputmaskFormat(format) {
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
276
|
+
// If the format is not specified, use the default format
|
|
277
|
+
if (!format) {
|
|
278
|
+
return 'dd/mm/yyyy';
|
|
279
|
+
}
|
|
280
|
+
const formatMap = {
|
|
281
|
+
'DD/MM/YYYY': 'dd/mm/yyyy',
|
|
282
|
+
'MM/DD/YYYY': 'mm/dd/yyyy',
|
|
283
|
+
'YYYY-MM-DD': 'yyyy-mm-dd',
|
|
284
|
+
'DD.MM.YYYY': 'dd.mm.yyyy',
|
|
285
|
+
'YYYYMMDD': 'yyyymmdd',
|
|
286
|
+
};
|
|
287
|
+
return formatMap[format] || 'dd/mm/yyyy';
|
|
288
|
+
}
|
|
289
|
+
/**
|
|
290
|
+
* Clears the current selection and resets the field to its initial state.
|
|
291
|
+
* This method can be called programmatically to reset the field.
|
|
292
|
+
*/
|
|
293
|
+
async clear() {
|
|
294
|
+
// Reset internal state
|
|
295
|
+
this.singleValue = '';
|
|
296
|
+
this.value = '';
|
|
297
|
+
// Reset the input element value
|
|
298
|
+
if (this.inputElement) {
|
|
299
|
+
this.inputElement.value = '';
|
|
300
|
+
// Remove the input mask and reinitialize if needed
|
|
301
|
+
if (this.inputElement.inputmask) {
|
|
302
|
+
this.inputElement.inputmask.remove();
|
|
303
|
+
}
|
|
220
304
|
}
|
|
305
|
+
// Emit events to notify about the change
|
|
306
|
+
this.valueChanged.emit('');
|
|
307
|
+
// Close the popover if open
|
|
308
|
+
this.open = false;
|
|
221
309
|
}
|
|
222
310
|
//#endregion METHODS
|
|
223
311
|
/****************************************************************************/
|
|
@@ -229,19 +317,17 @@ const NvFielddate = class {
|
|
|
229
317
|
if (this.value) {
|
|
230
318
|
this.singleValue = this.value;
|
|
231
319
|
}
|
|
320
|
+
this.currentPlaceholder = this.placeholder || this.dateFormat;
|
|
232
321
|
}
|
|
233
322
|
componentDidLoad() {
|
|
234
|
-
|
|
235
|
-
inputs.forEach((input) => {
|
|
236
|
-
inputmaskEdcad3c1.Inputmask({
|
|
237
|
-
alias: 'datetime',
|
|
238
|
-
inputFormat: this.convertToInputmaskFormat(this.dateFormat),
|
|
239
|
-
placeholder: '_'.repeat(this.dateFormat.length),
|
|
240
|
-
}).mask(input);
|
|
241
|
-
});
|
|
323
|
+
// Inputmask is now initialized on the first keypress
|
|
242
324
|
}
|
|
243
325
|
disconnectedCallback() {
|
|
244
326
|
document.removeEventListener('click', this.handleClickOutside);
|
|
327
|
+
if (this.inputElement &&
|
|
328
|
+
this.inputElement.inputmask) {
|
|
329
|
+
this.inputElement.inputmask.remove();
|
|
330
|
+
}
|
|
245
331
|
}
|
|
246
332
|
/**
|
|
247
333
|
* Handles the single date selection event from nv-calendar.
|
|
@@ -286,12 +372,12 @@ const NvFielddate = class {
|
|
|
286
372
|
/****************************************************************************/
|
|
287
373
|
//#region RENDER
|
|
288
374
|
render() {
|
|
289
|
-
return (index.h(index.Host, { key: '
|
|
290
|
-
this.el.querySelector('[slot="label"]')) && (index.h("label", { key: '
|
|
375
|
+
return (index.h(index.Host, { key: '45af13d8290479c8ec171c0702d9d695c5047610' }, ((this.label && this.label.length > 0) ||
|
|
376
|
+
this.el.querySelector('[slot="label"]')) && (index.h("label", { key: 'd30403c879f8ca0449d8d25d22bb401ece876758', htmlFor: this.inputId }, index.h("slot", { key: 'aec155a914cff6b7ea8170dbd1f0d9ee4f35172e', name: "label" }, this.label))), index.h("nv-popover", { key: '522969535f2b8340f1a9b425c4ea6291fc65cb7e', ref: this.setPopoverRef, id: this.popoverId, triggerMode: "controlled", placement: "bottom-start", open: this.open }, index.h("div", { key: 'eb1d5ab314fe654b3642afb22d9e3fbc340de969', slot: "trigger", class: "input-wrapper" }, index.h("slot", { key: '6c28354e914075c36db9bee659d140669a745cab', name: "before-input" }), index.h("div", { key: '68d3aa4a8afcec4042a8930678cea7046f3e31d7', class: "input-container", onClick: this.handleInputContainerClick }, index.h("slot", { key: 'ed7ada6913a6735af622369236b5f521f2e96aad', name: "leading-input" }), index.h("input", { key: '49607b25253233665544e8e85db3814734280fe0', id: this.inputId, ref: this.setInputRef, placeholder: this.currentPlaceholder, name: this.name, disabled: this.disabled, readOnly: this.readonly, required: this.required, autofocus: this.autofocus, value: this.singleValue, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur, "data-scope": "date" }), this.error && (index.h("nv-icon", { key: '35d06926d78f7c653fbf0424b59802fb4489004a', name: "alert-circle", class: "validation", size: "md" })), this.success && (index.h("nv-icon", { key: '17ca631dca201fb412c921619223c1abc8777d2b', name: "circle-check", class: "validation", size: "md" })), index.h("nv-iconbutton", { key: 'e08d735115cde3d22a657b986f4a7a5a0347d1af', class: "toggle-calendar-icon", name: "calendar" //{this.open ? 'chevron-top' : 'chevron-down'}
|
|
291
377
|
,
|
|
292
|
-
size: "md", emphasis: "lower", "aria-label": this.open ? 'Hide calendar' : 'Show calendar', "aria-pressed": this.open.toString(), onClick: this.toggleCalendar, tabIndex: this.disabled ? -1 : 0 })), index.h("slot", { key: '
|
|
293
|
-
this.el.querySelector('[slot="description"]')) && (index.h("div", { key: '
|
|
294
|
-
this.el.querySelector('[slot="error-description"]')) && (index.h("div", { key: '
|
|
378
|
+
size: "md", emphasis: "lower", "aria-label": this.open ? 'Hide calendar' : 'Show calendar', "aria-pressed": this.open.toString(), onClick: this.toggleCalendar, tabIndex: this.disabled ? -1 : 0 })), index.h("slot", { key: '75cf593c7b9f2078f055522d6e43440dbe0cc522', name: "after-input" })), index.h("div", { key: '0df8cd2360a17f5cc786e6b29c67ded308c18104', slot: "content" }, index.h("nv-calendar", { key: '045a02370ef9dfe31ae3d0b2f702fafb25c7da8f', dateFormat: this.dateFormat, singleValue: this.singleValue, firstDayOfWeek: this.firstDayOfWeek, numberOfCalendars: this.numberOfCalendars, min: this.min, max: this.max, locale: this.locale, shortcutsPlacement: this.shortcutsPlacement, showActions: this.showActions, shortcuts: this.shortcuts, showWeekNumbers: this.showWeekNumbers, disabledDates: this.disabledDates, onValueChanged: this.handleCalendarValueChanged }))), ((this.description && this.description.length > 0) ||
|
|
379
|
+
this.el.querySelector('[slot="description"]')) && (index.h("div", { key: 'ecedbfe16857d9976349f3f3875be13f9ffc4b53', class: "description" }, index.h("slot", { key: 'e848d9e03e169c9ac57ce2fb7cdb00466f658c61', name: "description" }, this.description))), (this.errorDescription ||
|
|
380
|
+
this.el.querySelector('[slot="error-description"]')) && (index.h("div", { key: '028b4d496ba3ee5eefa0107da8a62c771709a3ed', hidden: !this.error, class: "error-description" }, this.el.querySelector('[slot="error-description"]') ? (index.h("slot", { name: "error-description" })) : (this.errorDescription))), index.h("slot", { key: 'd3b79a0ae56ec7eb444c28985b1ffcfd8a4e36a1' })));
|
|
295
381
|
}
|
|
296
382
|
get el() { return index.getElement(this); }
|
|
297
383
|
static get watchers() { return {
|
package/dist/cjs/{nv-fielddaterange.entry-BNcF2N2M.js → nv-fielddaterange.entry-C82h1WUR.js}
RENAMED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-Cv7U-U85.js');
|
|
4
4
|
var inputmaskEdcad3c1 = require('./inputmask-edcad3c1-B9Omti4z.js');
|
|
5
5
|
var v4A79185f4 = require('./v4-a79185f4-2n0dOd_Y.js');
|
|
6
6
|
require('react');
|
|
@@ -258,6 +258,34 @@ const NvFielddaterange = class {
|
|
|
258
258
|
*/
|
|
259
259
|
updateCalendarValue() {
|
|
260
260
|
}
|
|
261
|
+
/**
|
|
262
|
+
* Clears the current selection and resets the date range field to its initial state.
|
|
263
|
+
* This method can be called programmatically to reset the field.
|
|
264
|
+
*/
|
|
265
|
+
async clear() {
|
|
266
|
+
// Reset internal state
|
|
267
|
+
this.startValue = '';
|
|
268
|
+
this.endValue = '';
|
|
269
|
+
this.value = '';
|
|
270
|
+
// Reset both input elements
|
|
271
|
+
const inputs = this.el.querySelectorAll('.input-wrapper input');
|
|
272
|
+
inputs.forEach((input) => {
|
|
273
|
+
input.value = '';
|
|
274
|
+
// Remove input mask if exists
|
|
275
|
+
if (input.inputmask) {
|
|
276
|
+
input.inputmask.remove();
|
|
277
|
+
}
|
|
278
|
+
});
|
|
279
|
+
// Emit events to notify about the change
|
|
280
|
+
this.valueChanged.emit('');
|
|
281
|
+
this.dateRangeChange.emit({ start: '', end: '' });
|
|
282
|
+
// Close the popover if open
|
|
283
|
+
this.open = false;
|
|
284
|
+
// Clear the calendar if it exists
|
|
285
|
+
if (this.calendarElement) {
|
|
286
|
+
this.calendarElement.clear();
|
|
287
|
+
}
|
|
288
|
+
}
|
|
261
289
|
//#endregion METHODS
|
|
262
290
|
/****************************************************************************/
|
|
263
291
|
//#region LIFECYCLE
|
|
@@ -446,10 +474,10 @@ const NvFielddaterange = class {
|
|
|
446
474
|
/****************************************************************************/
|
|
447
475
|
//#region RENDER
|
|
448
476
|
render() {
|
|
449
|
-
return (index.h(index.Host, { key: '
|
|
450
|
-
this.el.querySelector('[slot="label"]')) && (index.h("label", { key: '
|
|
451
|
-
this.el.querySelector('[slot="description"]')) && (index.h("div", { key: '
|
|
452
|
-
this.el.querySelector('[slot="error-description"]')) && (index.h("div", { key: '
|
|
477
|
+
return (index.h(index.Host, { key: 'e2d5ce2c864dbc8ba478a1ce1353aa8e51e13ec1' }, ((this.label && this.label.length > 0) ||
|
|
478
|
+
this.el.querySelector('[slot="label"]')) && (index.h("label", { key: '6e171200b763f8e7a907d305475bb7d4faa27979', htmlFor: this.startInputId }, index.h("slot", { key: '9f8b94e7491d4cd73e17f41ba290acda1fe73f3b', name: "label" }, this.label))), index.h("nv-popover", { key: '9bf5539eeceadb960c3438ddc05fe986f800d33b', ref: el => (this.popoverElement = el), id: this.popoverId, triggerMode: "controlled", placement: "bottom-start", open: this.open }, index.h("div", { key: '58f7625d27c2266429ddc4f653d61efefed5bc66', slot: "trigger", class: "input-wrapper" }, index.h("slot", { key: '206064a5c1be74082202849b96e46a8207377098', name: "before-input" }), index.h("div", { key: 'bd66fb676a5a749e17ede3f75c8a4404586c0c63', class: "input-container" }, index.h("slot", { key: '7c78a037f5189143ea32ca843e1c27b52d8f2d4b', name: "leading-input" }), index.h("div", { key: 'fbe89bc4502eca56e05029d65a45684484921433', class: "range-inputs" }, index.h("input", { key: '397e572e87dd7f01977008b44847469cabd06494', id: this.startInputId, type: "text", placeholder: this.startPlaceholder, name: this.startName, disabled: this.disabled, readOnly: this.readonly, required: this.required, autofocus: this.autofocus, value: this.startValue, onInput: this.handleStartInput, onFocus: this.handleFocus, "data-scope": "date-range" }), index.h("div", { key: '378d2755919eafc9f4edd8ee451c01e49dc70cfe', class: "range-separator" }), index.h("input", { key: '2de8dcda3161667a543c04ae529a0f617f6598c6', id: this.endInputId, type: "text", placeholder: this.endPlaceholder, name: this.endName, disabled: this.disabled, readOnly: this.readonly, required: this.required, value: this.endValue, onInput: this.handleEndInput, onFocus: this.handleFocus, "data-scope": "date-range" })), this.error && (index.h("nv-icon", { key: '5880e135764a7f9f87d92a4f7a84eba9f56b7d46', name: "alert-circle", class: "validation", size: "md" })), this.success && (index.h("nv-icon", { key: '5d764360d3dbfc306962cb9e4b67d7d3c4bc09ed', name: "circle-check", class: "validation", size: "md" })), index.h("nv-iconbutton", { key: '1b09d57633f8e115cc3d92a82d35399c53be265b', class: "toggle-calendar-icon", name: "calendar", size: "md", emphasis: "lower", "aria-label": this.open ? 'Hide calendar' : 'Show calendar', "aria-pressed": this.open.toString(), onClick: this.toggleCalendar, tabIndex: this.disabled ? -1 : 0 })), index.h("slot", { key: '7ec41f782b0343eeb427bee4d7f2ab1b549978b3', name: "after-input" })), index.h("div", { key: 'ea714333fe596af8a10c6f8a1e6c72935f8e5c91', slot: "content" }, index.h("nv-calendar", { key: 'ffaa70c5bc76c422396b233d3dc46fdeb2d06b10', ref: el => (this.calendarElement = el), dateFormat: this.dateFormat, value: this.value, firstDayOfWeek: this.firstDayOfWeek, numberOfCalendars: this.numberOfCalendars, min: this.min, max: this.max, locale: this.locale, shortcutsPlacement: this.shortcutsPlacement, showActions: this.showActions, shortcuts: this.shortcuts, showWeekNumbers: this.showWeekNumbers, disabledDates: this.disabledDates, selectionType: "range", "data-prevent-navigation": "true" }))), ((this.description && this.description.length > 0) ||
|
|
479
|
+
this.el.querySelector('[slot="description"]')) && (index.h("div", { key: '7f4aa271c896234907d95cfe7660e1c41ab8ddf7', class: "description" }, index.h("slot", { key: 'fce93594f7af4d054f886ce3caf48cfffb6809aa', name: "description" }, this.description))), (this.errorDescription ||
|
|
480
|
+
this.el.querySelector('[slot="error-description"]')) && (index.h("div", { key: 'f5a19b5d4c90c4319dc4eb09d1067f202ab229c9', hidden: !this.error, class: "error-description" }, this.el.querySelector('[slot="error-description"]') ? (index.h("slot", { name: "error-description" })) : (this.errorDescription))), index.h("slot", { key: '1d494e4c192b38c26e8cfe5482516382cacc13c6' })));
|
|
453
481
|
}
|
|
454
482
|
get el() { return index.getElement(this); }
|
|
455
483
|
static get watchers() { return {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-Cv7U-U85.js');
|
|
4
4
|
var v4A79185f4 = require('./v4-a79185f4-2n0dOd_Y.js');
|
|
5
5
|
require('react');
|
|
6
6
|
|
|
@@ -356,9 +356,9 @@ const NvFielddropdown = class {
|
|
|
356
356
|
//#region RENDER
|
|
357
357
|
render() {
|
|
358
358
|
var _a;
|
|
359
|
-
return (index.h(index.Host, { key: '
|
|
360
|
-
this.el.querySelector('[slot="description"]')) && (index.h("div", { key: '
|
|
361
|
-
this.el.querySelector('[slot="error-description"]')) && (index.h("div", { key: '
|
|
359
|
+
return (index.h(index.Host, { key: '39025d9624475fa633e36c3ba44feed7f34f42e1', role: "combobox", "aria-expanded": this.open.toString(), "aria-haspopup": "listbox", "aria-label": this.label }, (this.label || this.el.querySelector('[slot="label"]')) && (index.h("label", { key: '961a78a526a81e7fb0a219f1e46d6126880993db', htmlFor: this.inputId }, index.h("slot", { key: '9d6b7d6fa1cc80393f0e85819a437e8193bdf672', name: "label" }, this.label))), index.h("nv-popover", { key: '564fcf5fa2f263874b737fdf1bcc5a9aa9bc21d3', ref: el => (this.popoverElement = el), triggerMode: "controlled", placement: "bottom-start", open: this.open }, index.h("div", { key: '415ed0ee145ce9253380baed4a026afa018c59b7', class: "input-wrapper", slot: "trigger" }, index.h("slot", { key: 'ddbece3ddfa0bcd16a8587c4ee693f8c44b69356', name: "before-input" }), index.h("div", { key: '546fbc02d2051f47aea2a369ae479658c3c1d8dc', class: "input-container", onClick: this.handleInputContainerClick }, index.h("slot", { key: '95bb574eeb43285f73fd731581d1426095f7538a', name: "leading-input" }), this.filterable || this.disabled || this.readonly ? (index.h("input", { "data-scope": "focusable", id: this.inputId, type: "search", ref: e => (this.inputElement = e), autofocus: this.autofocus, autocomplete: this.autocomplete, placeholder: this.placeholder, name: this.name, value: this.getSelectedLabel(), required: this.required, disabled: this.disabled, readOnly: this.readonly, onInput: this.handleInput, onFocus: this.handleInputFocus, onClick: this.handleInputFocus, onKeyDown: this.handleKeyDown })) : (index.h("p", { "data-scope": "focusable", id: this.inputId, class: "non-filterable-text", onClick: this.handleInputContainerClick, tabIndex: this.disabled ? -1 : 0, onKeyDown: this.handleKeyDown, onFocus: this.handleInputFocus }, this.getSelectedLabel() || this.value || this.placeholder)), this.filterable && this.filterText && this.open && (index.h("nv-iconbutton", { key: '669c6b2e93a85789e747e3f384dfd7b940cda9a7', name: "x", size: "md", emphasis: "lower", class: "clear-button", onClick: this.clearFilter, "aria-label": "Clear input" })), this.error && (index.h("nv-icon", { key: '65f91d73115249ded5344e78f18ed7c37f8265b9', name: "alert-circle", class: "validation", size: "md" })), index.h("nv-iconbutton", { key: '05644dcc1dfdbb0aa625b49484fab299b5b58894', "data-scope": "toggle-dropdown", name: this.open ? 'chevron-top' : 'chevron-down', size: "md", emphasis: "lower", "aria-label": this.open ? 'Hide dropdown' : 'Show dropdown', "aria-pressed": this.open.toString(), onClick: this.togglePopover, tabIndex: this.disabled ? -1 : 0 })), index.h("slot", { key: 'd84d1936300877825adc9c61cc7d9ba773b92194', name: "after-input" })), index.h("div", { key: 'de5e6bb6f3b40fed39cf90d046e8361dcb2a4d8f', slot: "content", style: this.maxHeight ? { maxHeight: this.maxHeight } : {} }, ((_a = this.options) === null || _a === void 0 ? void 0 : _a.length) > 0 ? (index.h("ul", null, this.options.map(option => (index.h("nv-fielddropdownitem", { label: option.label, value: option.value, disabled: option.disabled, selected: option.value === this.value }))))) : (index.h("slot", { name: "content" })))), (this.description ||
|
|
360
|
+
this.el.querySelector('[slot="description"]')) && (index.h("div", { key: '648b7fb9b7dade22d763f9afc468a4b48115a1a0', class: "description" }, index.h("slot", { key: 'b560fb630a56c3d42363c1b8f0fa494faefd00d6', name: "description" }, this.description))), (this.errorDescription ||
|
|
361
|
+
this.el.querySelector('[slot="error-description"]')) && (index.h("div", { key: 'bcb614617bb1183f33d20d51304d8ff17d9c7381', hidden: !this.error, class: "error-description" }, index.h("slot", { key: '5345cb01032f24b0527bf22d77116a77bb439969', name: "error-description" }, this.errorDescription)))));
|
|
362
362
|
}
|
|
363
363
|
static get formAssociated() { return true; }
|
|
364
364
|
get el() { return index.getElement(this); }
|
package/dist/cjs/{nv-fielddropdownitem.entry-BIy_GUKA.js → nv-fielddropdownitem.entry-KuL1iVS4.js}
RENAMED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-Cv7U-U85.js');
|
|
4
4
|
require('react');
|
|
5
5
|
|
|
6
6
|
const nvFielddropdownitemCss = "nv-fielddropdownitem{display:flex;gap:var(--spacing-2);flex-wrap:wrap;align-items:center;width:100%;padding:var(--list-dropdown-item-padding-y) var(--list-dropdown-item-padding-x);font-weight:var(--menu-contextual-item-font-weight);font-size:var(--list-dropdown-font-size);line-height:var(--list-dropdown-line-height);color:var(--components-list-dropdown-item-label-default);border-radius:var(--list-dropdown-item-radius);transition:background-color 150ms ease-out, color 150ms ease-out;cursor:pointer}nv-fielddropdownitem:hover,nv-fielddropdownitem:focus,nv-fielddropdownitem:focus-within{background-color:var(--components-list-dropdown-item-background-hover);color:var(--components-menu-contextual-item-content-hover)}nv-fielddropdownitem[disabled]:not([disabled=false]){cursor:not-allowed;background-color:unset;color:var(--components-menu-contextual-item-content-disabled)}nv-fielddropdownitem .text-wrapper{display:flex;flex-grow:1;align-items:center;justify-content:space-between}nv-fielddropdownitem [data-scope=text]{flex-grow:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}nv-fielddropdownitem nv-icon[data-scope=selected]{color:var(--components-list-dropdown-item-label-default);align-self:center;margin-left:auto}";
|
|
@@ -59,7 +59,7 @@ const NvFielddropdownitem = class {
|
|
|
59
59
|
/****************************************************************************/
|
|
60
60
|
//#region RENDER
|
|
61
61
|
render() {
|
|
62
|
-
return (index.h(index.Host, { key: '
|
|
62
|
+
return (index.h(index.Host, { key: '486800fafd79ee133a459521e84b06c538f5585e', role: "menuitem", tabindex: '-1', onClick: this.handleSelected }, index.h("slot", { key: 'fd9c5c5aad8c585735ddbcaf0cb98ab26d89ec69' }), !this.composed && (index.h("div", { key: '145a6e02b2338f47235c3616a1af63bf5b0ea465', class: "text-wrapper" }, index.h("span", { key: 'bc013eaf7fe0d56c1d609c3fce846f25ef2cfbb3', "data-scope": "text" }, this.label))), this.selected && (index.h("nv-icon", { key: 'f7f6a4b2b27753d54eb92a77364329a29a3d6f08', name: "check", "aria-hidden": "true", "data-scope": "selected" }))));
|
|
63
63
|
}
|
|
64
64
|
get el() { return index.getElement(this); }
|
|
65
65
|
};
|