@carbon/web-components 2.0.0-beta.0 → 2.0.0-beta.2

package/es/components/date-picker/date-picker.rtl.css.js

@@ -8,5 +8,5 @@
  */
 import { css } from 'lit';
 export default css([
-  "@keyframes hide-feedback{0%{opacity:1;visibility:inherit}100%{opacity:0;visibility:hidden}}@keyframes show-feedback{0%{opacity:0;visibility:hidden}100%{opacity:1;visibility:inherit}}@keyframes skeleton{0%{opacity:.3;transform:scaleX(0);transform-origin:right}20%{opacity:1;transform:scaleX(1);transform-origin:right}28%{transform:scaleX(1);transform-origin:left}51%{transform:scaleX(0);transform-origin:left}58%{transform:scaleX(0);transform-origin:left}82%{transform:scaleX(1);transform-origin:left}83%{transform:scaleX(1);transform-origin:right}96%{transform:scaleX(0);transform-origin:right}100%{opacity:.3;transform:scaleX(0);transform-origin:right}}.cds--assistive-text,.cds--visually-hidden{position:absolute;overflow:hidden;width:1px;height:1px;padding:0;border:0;margin:-1px;clip:rect(0,0,0,0);visibility:inherit;white-space:nowrap}input:-webkit-autofill,input:-webkit-autofill:focus,input:-webkit-autofill:hover,textarea:-webkit-autofill,textarea:-webkit-autofill:focus,textarea:-webkit-autofill:hover{box-shadow:0 0 0 1000px var(--cds-field) inset;-webkit-text-fill-color:var(--cds-text-primary,#161616)}.cds--fieldset html{font-size:100%}.cds--fieldset body{font-weight:400;font-family:'IBM Plex Sans',system-ui,-apple-system,BlinkMacSystemFont,'.SFNSText-Regular',sans-serif;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}.cds--fieldset code{font-family:'IBM Plex Mono',system-ui,-apple-system,BlinkMacSystemFont,'.SFNSText-Regular',monospace}.cds--fieldset strong{font-weight:600}.cds--form-item{font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);line-height:var(--cds-body-compact-01-line-height,1.28572);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);display:flex;flex:1 1 auto;flex-direction:column;align-items:flex-start}.cds--label{font-size:var(--cds-label-01-font-size,.75rem);font-weight:var(--cds-label-01-font-weight,400);line-height:var(--cds-label-01-line-height,1.33333);letter-spacing:var(--cds-label-01-letter-spacing,.32px);display:inline-block;margin-bottom:.5rem;color:var(--cds-text-secondary,#525252);font-weight:400;line-height:1rem;vertical-align:baseline}.cds--label html{font-size:100%}.cds--label body{font-weight:400;font-family:'IBM Plex Sans',system-ui,-apple-system,BlinkMacSystemFont,'.SFNSText-Regular',sans-serif;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}.cds--label code{font-family:'IBM Plex Mono',system-ui,-apple-system,BlinkMacSystemFont,'.SFNSText-Regular',monospace}.cds--label strong{font-weight:600}.cds--label .cds--toggletip-label{font-size:var(--cds-label-01-font-size,.75rem);font-weight:var(--cds-label-01-font-weight,400);line-height:var(--cds-label-01-line-height,1.33333);letter-spacing:var(--cds-label-01-letter-spacing,.32px)}.cds--label--no-margin{margin-bottom:0}.cds--label+.cds--tooltip{position:relative;top:.2rem;right:.5rem}.cds--label+.cds--tooltip .cds--tooltip__trigger{box-sizing:border-box;padding:0;border:0;margin:0;font-family:inherit;font-size:100%;vertical-align:baseline;display:inline-block;padding:0;border:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;cursor:pointer;text-align:start;width:100%;display:flex;align-items:center;justify-content:center;font-size:var(--cds-label-01-font-size,.75rem);font-weight:var(--cds-label-01-font-weight,400);line-height:var(--cds-label-01-line-height,1.33333);letter-spacing:var(--cds-label-01-letter-spacing,.32px)}.cds--label+.cds--tooltip .cds--tooltip__trigger *,.cds--label+.cds--tooltip .cds--tooltip__trigger ::after,.cds--label+.cds--tooltip .cds--tooltip__trigger ::before{box-sizing:inherit}.cds--label+.cds--tooltip .cds--tooltip__trigger::-moz-focus-inner{border:0}.cds--label+.cds--tooltip .cds--tooltip__trigger:focus{outline:1px solid var(--cds-focus,#0f62fe)}.cds--label+.cds--tooltip .cds--tooltip__trigger svg{fill:var(--cds-icon-secondary,#525252)}.cds--label+.cds--tooltip .cds--tooltip__trigger svg :hover{fill:var(--cds-icon-primary,#161616)}.cds--label+.cds--toggletip{top:.2rem;right:.5rem}.cds--label.cds--skeleton{position:relative;padding:0;border:none;background:var(--cds-skeleton-background,#e8e8e8);box-shadow:none;pointer-events:none;width:4.6875rem;height:.875rem}.cds--label.cds--skeleton:active,.cds--label.cds--skeleton:focus,.cds--label.cds--skeleton:hover{border:none;cursor:default;outline:0}.cds--label.cds--skeleton::before{position:absolute;width:100%;height:100%;animation:3s ease-in-out skeleton infinite;background:var(--cds-skeleton-element,#c6c6c6);content:\"\";will-change:transform-origin,transform,opacity}@media (prefers-reduced-motion:reduce){.cds--label.cds--skeleton::before{animation:none}}input[type=number]{font-family:'IBM Plex Sans',system-ui,-apple-system,BlinkMacSystemFont,'.SFNSText-Regular',sans-serif}.cds--combo-box[data-invalid]:not(.cds--multi-select--selected) .cds--text-input:not(:focus),.cds--list-box[data-invalid]:not(.cds--multi-select--invalid--focused),.cds--number[data-invalid] input[type=number]:not(:focus),.cds--select-input__wrapper[data-invalid] .cds--select-input:not(:focus),.cds--text-area__wrapper[data-invalid]>.cds--text-area--invalid:not(:focus),.cds--text-input__field-wrapper[data-invalid]>.cds--text-input--invalid:not(:focus),input[data-invalid]:not(:focus){outline:2px solid var(--cds-support-error,#da1e28);outline-offset:-2px}@media screen and (prefers-contrast){.cds--combo-box[data-invalid]:not(.cds--multi-select--selected) .cds--text-input:not(:focus),.cds--list-box[data-invalid]:not(.cds--multi-select--invalid--focused),.cds--number[data-invalid] input[type=number]:not(:focus),.cds--select-input__wrapper[data-invalid] .cds--select-input:not(:focus),.cds--text-area__wrapper[data-invalid]>.cds--text-area--invalid:not(:focus),.cds--text-input__field-wrapper[data-invalid]>.cds--text-input--invalid:not(:focus),input[data-invalid]:not(:focus){outline-style:dotted}}.cds--date-picker-input__wrapper--invalid~.cds--form-requirement,.cds--date-picker-input__wrapper--warn~.cds--form-requirement,.cds--date-picker-input__wrapper~.cds--form-requirement,.cds--list-box--warning~.cds--form-requirement,.cds--list-box[data-invalid]~.cds--form-requirement,.cds--number[data-invalid] .cds--number__input-wrapper~.cds--form-requirement,.cds--number__input-wrapper--warning~.cds--form-requirement,.cds--select--warning .cds--select-input__wrapper~.cds--form-requirement,.cds--select-input__wrapper[data-invalid]~.cds--form-requirement,.cds--text-area__wrapper--warn~.cds--form-requirement,.cds--text-area__wrapper[data-invalid]~.cds--form-requirement,.cds--text-input__field-wrapper--warning>.cds--text-input~.cds--form-requirement,.cds--text-input__field-wrapper--warning~.cds--form-requirement,.cds--text-input__field-wrapper[data-invalid]~.cds--form-requirement,.cds--time-picker--invalid~.cds--form-requirement,.cds--time-picker[data-invalid]~.cds--form-requirement,input[data-invalid]~.cds--form-requirement{display:block;overflow:visible;max-height:12.5rem;font-weight:400}.cds--date-picker-input__wrapper--invalid~.cds--form-requirement,.cds--date-picker-input__wrapper~.cds--form-requirement,.cds--list-box[data-invalid]~.cds--form-requirement,.cds--number[data-invalid] .cds--number__input-wrapper~.cds--form-requirement,.cds--select-input__wrapper[data-invalid]~.cds--form-requirement,.cds--text-area__wrapper[data-invalid]~.cds--form-requirement,.cds--text-input__field-wrapper[data-invalid]~.cds--form-requirement,.cds--time-picker--invalid~.cds--form-requirement,.cds--time-picker[data-invalid]~.cds--form-requirement,input[data-invalid]~.cds--form-requirement{color:var(--cds-text-error,#da1e28)}.cds--form--fluid .cds--text-input__field-wrapper--warning,.cds--form--fluid .cds--text-input__field-wrapper[data-invalid]{display:block}.cds--form--fluid input[data-invalid]{outline:0}.cds--form--fluid .cds--form-requirement{padding:.5rem 1rem .5rem 2.5rem;margin:0}input:not(output):not([data-invalid]):-moz-ui-invalid{box-shadow:none}.cds--form-requirement{font-size:var(--cds-label-01-font-size,.75rem);font-weight:var(--cds-label-01-font-weight,400);line-height:var(--cds-label-01-line-height,1.33333);letter-spacing:var(--cds-label-01-letter-spacing,.32px);display:none;overflow:hidden;max-height:0;margin:.25rem 0 0}.cds--form-requirement html{font-size:100%}.cds--form-requirement body{font-weight:400;font-family:'IBM Plex Sans',system-ui,-apple-system,BlinkMacSystemFont,'.SFNSText-Regular',sans-serif;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}.cds--form-requirement code{font-family:'IBM Plex Mono',system-ui,-apple-system,BlinkMacSystemFont,'.SFNSText-Regular',monospace}.cds--form-requirement strong{font-weight:600}.cds--select--inline .cds--form__helper-text{margin-top:0}.cds--form__helper-text{font-size:var(--cds-helper-text-01-font-size,.75rem);line-height:var(--cds-helper-text-01-line-height,1.33333);letter-spacing:var(--cds-helper-text-01-letter-spacing,.32px);z-index:0;width:100%;margin-top:.25rem;color:var(--cds-text-secondary,#525252);opacity:1}.cds--form__helper-text--disabled,.cds--label--disabled{color:var(--cds-text-disabled,rgba(22,22,22,.25))}fieldset[disabled] .cds--form__helper-text,fieldset[disabled] .cds--label{color:var(--cds-text-disabled,rgba(22,22,22,.25))}@keyframes fp-fade-in-down{from{opacity:0;transform:translate3d(0,-20px,0)}to{opacity:1;transform:translate3d(0,0,0)}}@keyframes fp-slide-left{from{transform:translate3d(0,0,0)}to{transform:translate3d(100%,0,0)}}@keyframes fp-slide-left-new{from{transform:translate3d(-100%,0,0)}to{transform:translate3d(0,0,0)}}@keyframes fp-slide-right{from{transform:translate3d(0,0,0)}to{transform:translate3d(-100%,0,0)}}@keyframes fp-slide-right-new{from{transform:translate3d(100%,0,0)}to{transform:translate3d(0,0,0)}}@keyframes fp-fade-out{from{opacity:1}to{opacity:0}}@keyframes fp-fade-in{from{opacity:0}to{opacity:1}}.flatpickr-calendar{position:absolute;overflow:hidden;width:19.6875rem;max-height:0;box-sizing:border-box;padding:0;border:0;animation:none;border-radius:0;direction:rtl;opacity:0;text-align:center;touch-action:manipulation;visibility:hidden}@media screen and (-ms-high-contrast:active),(forced-colors:active){.flatpickr-calendar{outline:1px solid transparent}}.flatpickr-calendar.inline,.flatpickr-calendar.open{overflow:visible;max-height:40rem;opacity:1;visibility:inherit}.flatpickr-calendar.open{box-shadow:0 2px 6px var(--cds-shadow,rgba(0,0,0,.3));z-index:99999;display:flex;overflow:hidden;width:18rem;height:21rem;flex-direction:column;align-items:center;justify-content:center;padding:.25rem .25rem .5rem .25rem;border:none;margin-top:-.125rem;background-color:var(--cds-layer-01,#f4f4f4)}.flatpickr-calendar.open:focus{outline:1px solid var(--cds-focus,#0f62fe)}@media screen and (prefers-contrast){.flatpickr-calendar.open:focus{outline-style:dotted}}.flatpickr-calendar.animate.open{animation:fp-fade-in-down 110ms cubic-bezier(0,0,.38,.9)}@media screen and (prefers-reduced-motion:reduce){.flatpickr-calendar.animate.open{animation:none}}.flatpickr-calendar.inline{position:relative;top:.125rem;display:block}.flatpickr-calendar.static{position:absolute;top:calc(100% + 2px)}.flatpickr-calendar.static.open{z-index:999;display:block}.flatpickr-calendar.hasWeeks{width:auto}.dayContainer{display:flex;height:15.375rem;flex-wrap:wrap;justify-content:space-around;padding:0;outline:0}.flatpickr-calendar .hasTime .dayContainer,.flatpickr-calendar .hasWeeks .dayContainer{border-bottom:0;border-bottom-right-radius:0;border-bottom-left-radius:0}.flatpickr-calendar .hasWeeks .dayContainer{border-right:0}.flatpickr-calendar.showTimeInput.hasTime .flatpickr-time{height:2.5rem;border-top:1px solid #e6e6e6}.flatpickr-calendar.noCalendar.hasTime .flatpickr-time{height:auto}.flatpickr-calendar:focus{outline:0}.flatpickr-months{display:flex;width:100%;justify-content:space-between}.flatpickr-month{font-size:var(--cds-heading-compact-01-font-size,.875rem);font-weight:var(--cds-heading-compact-01-font-weight,600);line-height:var(--cds-heading-compact-01-line-height,1.28572);letter-spacing:var(--cds-heading-compact-01-letter-spacing,.16px);display:flex;height:2.5rem;align-items:center;background-color:transparent;color:var(--cds-text-primary,#161616);line-height:1;text-align:center}.flatpickr-next-month,.flatpickr-prev-month{z-index:3;display:flex;width:2.5rem;height:2.5rem;align-items:center;justify-content:center;padding:0;cursor:pointer;fill:var(--cds-icon-primary,#161616);line-height:16px;text-decoration:none;transform:scale(-1,1);transition:background-color 70ms cubic-bezier(.2,0,.38,.9);-webkit-user-select:none;-moz-user-select:none;user-select:none}@media screen and (-ms-high-contrast:active),(forced-colors:active){.flatpickr-next-month,.flatpickr-prev-month{fill:ButtonText}}@media screen and (prefers-reduced-motion:reduce){.flatpickr-next-month,.flatpickr-prev-month{transition:none}}.flatpickr-next-month:hover,.flatpickr-prev-month:hover{background-color:var(--cds-layer-hover)}.flatpickr-next-month.disabled svg,.flatpickr-prev-month.disabled svg{cursor:not-allowed;fill:var(--cds-icon-disabled,rgba(22,22,22,.25))}.flatpickr-next-month.disabled:hover svg,.flatpickr-prev-month.disabled:hover svg{fill:var(--cds-icon-disabled,rgba(22,22,22,.25))}.flatpickr-current-month{font-size:var(--cds-heading-compact-01-font-size,.875rem);font-weight:var(--cds-heading-compact-01-font-weight,600);line-height:var(--cds-heading-compact-01-line-height,1.28572);letter-spacing:var(--cds-heading-compact-01-letter-spacing,.16px);display:flex;height:1.75rem;align-items:center;justify-content:center;text-align:center}.flatpickr-current-month .cur-month{margin-left:.25rem;margin-right:.25rem}.flatpickr-current-month .cur-month:hover{background-color:var(--cds-layer-hover)}.numInputWrapper{position:relative;width:3.75rem}.numInputWrapper:hover{background-color:var(--cds-background-hover,rgba(141,141,141,.12))}.numInputWrapper .numInput{display:inline-block;width:100%;padding:.25rem;border:none;margin:0;-moz-appearance:textfield;background-color:var(--cds-field-01,#f4f4f4);color:var(--cds-text-primary,#161616);cursor:default;font-family:inherit;font-size:inherit;font-weight:600}.numInputWrapper .numInput::-webkit-inner-spin-button,.numInputWrapper .numInput::-webkit-outer-spin-button{margin:0;-webkit-appearance:none}.numInputWrapper .numInput:focus{outline:1px solid var(--cds-focus,#0f62fe)}@media screen and (prefers-contrast){.numInputWrapper .numInput:focus{outline-style:dotted}}.numInputWrapper .numInput[disabled],.numInputWrapper .numInput[disabled]:hover{background-color:var(--cds-layer-01,#f4f4f4);color:var(--cds-text-disabled,rgba(22,22,22,.25));pointer-events:none}.numInputWrapper .arrowUp{top:.25rem;border-bottom:0}.numInputWrapper .arrowUp::after{border-bottom:.25rem solid var(--cds-icon-primary,#161616)}.numInputWrapper .arrowDown{top:.6875rem}.numInputWrapper .arrowDown::after{border-top:.25rem solid var(--cds-icon-primary,#161616)}.numInputWrapper .arrowDown,.numInputWrapper .arrowUp{position:absolute;right:2.6rem;width:.75rem;height:50%;padding:0 .125rem 0 .25rem;border:none;cursor:pointer;line-height:50%;opacity:0}.numInputWrapper .arrowDown::after,.numInputWrapper .arrowUp::after{position:absolute;top:33%;display:block;border-left:.25rem solid transparent;border-right:.25rem solid transparent;content:\"\"}.numInputWrapper .arrowDown:hover::after,.numInputWrapper .arrowUp:hover::after{border-top-color:var(--cds-button-primary,#0f62fe);border-bottom-color:var(--cds-button-primary,#0f62fe)}.numInputWrapper .arrowDown:active::after,.numInputWrapper .arrowUp:active::after{border-top-color:var(--cds-border-interactive,#0f62fe);border-bottom-color:var(--cds-border-interactive,#0f62fe)}.numInput[disabled]~.arrowUp::after{border-bottom-color:var(--cds-text-disabled,rgba(22,22,22,.25))}.numInput[disabled]~.arrowDown::after{border-top-color:var(--cds-text-disabled,rgba(22,22,22,.25))}.numInputWrapper:hover .arrowDown,.numInputWrapper:hover .arrowUp{opacity:1}.numInputWrapper:hover .numInput[disabled]~.arrowDown,.numInputWrapper:hover .numInput[disabled]~.arrowUp{opacity:0}.flatpickr-weekdays{display:flex;height:2.5rem;align-items:center}.flatpickr-weekdaycontainer{display:flex;width:100%}.flatpickr-weekday{font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);line-height:var(--cds-body-compact-01-line-height,1.28572);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);flex:1;color:var(--cds-text-primary,#161616);cursor:default}.flatpickr-days:focus{outline:0}.flatpickr-calendar.animate .dayContainer.slideLeft{animation:fp-fade-out .4s cubic-bezier(.23,1,.32,1),fp-slide-left .4s cubic-bezier(.23,1,.32,1)}.flatpickr-calendar.animate .dayContainer.slideLeft,.flatpickr-calendar.animate .dayContainer.slideLeftNew{transform:translate3d(100%,0,0)}.flatpickr-calendar.animate .dayContainer.slideLeftNew{animation:fp-fade-in .4s cubic-bezier(.23,1,.32,1),fp-slide-left .4s cubic-bezier(.23,1,.32,1)}.flatpickr-calendar.animate .dayContainer.slideRight{animation:fp-fade-out .4s cubic-bezier(.23,1,.32,1),fp-slide-right .4s cubic-bezier(.23,1,.32,1);transform:translate3d(-100%,0,0)}.flatpickr-calendar.animate .dayContainer.slideRightNew{animation:fp-fade-in .4s cubic-bezier(.23,1,.32,1),fp-slide-right-new .4s cubic-bezier(.23,1,.32,1)}.flatpickr-day{font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);line-height:var(--cds-body-compact-01-line-height,1.28572);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);display:flex;width:2.5rem;height:2.5rem;align-items:center;justify-content:center;color:var(--cds-text-primary,#161616);cursor:pointer;transition:all 70ms cubic-bezier(.2,0,.38,.9)}.flatpickr-day:hover{background:var(--cds-layer-hover)}.flatpickr-day:focus{outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px;outline-color:var(--cds-button-primary,#0f62fe)}@media screen and (prefers-contrast){.flatpickr-day:focus{outline-style:dotted}}.nextMonthDay,.prevMonthDay{color:var(--cds-text-helper,#6f6f6f)}.flatpickr-day.today{position:relative;color:var(--cds-link-primary,#0f62fe);font-weight:600}.flatpickr-day.today::after{position:absolute;bottom:.4375rem;right:50%;display:block;width:.25rem;height:.25rem;background-color:var(--cds-link-primary,#0f62fe);content:\"\";transform:translateX(50%)}.flatpickr-day.today.no-border{border:none}.flatpickr-day.today.selected{outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px}@media screen and (prefers-contrast){.flatpickr-day.today.selected{outline-style:dotted}}.flatpickr-day.today.selected::after{display:none}.flatpickr-day.inRange{background-color:var(--cds-highlight,#d0e2ff);color:var(--cds-text-primary,#161616)}.flatpickr-day.selected{background-color:var(--cds-button-primary,#0f62fe);color:var(--cds-text-on-color,#fff)}@media screen and (-ms-high-contrast:active),(forced-colors:active){.flatpickr-day.selected{color:Highlight;outline:1px solid Highlight;outline-style:dotted}}.flatpickr-day.selected:focus{outline:.0625rem solid var(--cds-layer-02,#fff);outline-offset:-.1875rem}.flatpickr-day.startRange.selected{z-index:2;box-shadow:none}.flatpickr-day.endRange.inRange,.flatpickr-day.startRange.inRange:not(.selected){outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px;z-index:3;background:var(--cds-layer-01,#f4f4f4)}@media screen and (prefers-contrast){.flatpickr-day.endRange.inRange,.flatpickr-day.startRange.inRange:not(.selected){outline-style:dotted}}.flatpickr-day.endRange:hover{outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px;background:var(--cds-layer-01,#f4f4f4);color:var(--cds-text-primary,#161616)}@media screen and (prefers-contrast){.flatpickr-day.endRange:hover{outline-style:dotted}}.flatpickr-day.endRange.inRange.selected{background:var(--cds-button-primary,#0f62fe);color:var(--cds-text-on-color,#fff)}.flatpickr-day.flatpickr-disabled{color:var(--cds-text-disabled,rgba(22,22,22,.25));cursor:not-allowed}.flatpickr-day.flatpickr-disabled:hover{background-color:transparent}.flatpickr-input[readonly]{cursor:pointer}@media screen and (-ms-high-contrast:active),(forced-colors:active){.flatpickr-day.inRange,.flatpickr-day.today{color:Highlight}}.cds--date-picker,:host(cds-date-picker){display:flex}.cds--date-picker--light .cds--date-picker__input{background:var(--cds-field-02,#fff)}.cds--date-picker~.cds--label,:host(cds-date-picker)~.cds--label{order:1}.cds--date-picker-container,:host(cds-date-picker-input),:host(cds-date-picker-input-skeleton){position:relative;display:flex;flex-direction:column;justify-content:space-between}.cds--date-picker-container .cds--label,:host(cds-date-picker-input) .cds--label,:host(cds-date-picker-input-skeleton) .cds--label{display:flex}.cds--date-picker-input__wrapper{position:relative;display:flex;align-items:center}.cds--date-picker.cds--date-picker--simple .cds--date-picker__input,.cds--date-picker.cds--date-picker--simple .cds--label,:host(cds-date-picker.cds--date-picker--simple) .cds--date-picker__input,:host(cds-date-picker.cds--date-picker--simple) .cds--label{width:7.5rem}.cds--date-picker.cds--date-picker--simple .cds--date-picker-input__wrapper--invalid .cds--date-picker__input,.cds--date-picker.cds--date-picker--simple .cds--date-picker-input__wrapper--invalid~.cds--form-requirement,.cds--date-picker.cds--date-picker--simple .cds--date-picker-input__wrapper--warn .cds--date-picker__input,.cds--date-picker.cds--date-picker--simple .cds--date-picker-input__wrapper--warn~.cds--form-requirement,:host(cds-date-picker.cds--date-picker--simple) .cds--date-picker-input__wrapper--invalid .cds--date-picker__input,:host(cds-date-picker.cds--date-picker--simple) .cds--date-picker-input__wrapper--invalid~.cds--form-requirement,:host(cds-date-picker.cds--date-picker--simple) .cds--date-picker-input__wrapper--warn .cds--date-picker__input,:host(cds-date-picker.cds--date-picker--simple) .cds--date-picker-input__wrapper--warn~.cds--form-requirement{width:9.5rem}.cds--date-picker.cds--date-picker--simple.cds--date-picker--short .cds--date-picker__input,:host(cds-date-picker.cds--date-picker--simple.cds--date-picker--short) .cds--date-picker__input{width:5.7rem}.cds--date-picker.cds--date-picker--single .cds--date-picker__input,:host(cds-date-picker.cds--date-picker--single) .cds--date-picker__input{width:18rem}.cds--date-picker .cds--date-picker-input__wrapper--warn~.cds--form-requirement,:host(cds-date-picker) .cds--date-picker-input__wrapper--warn~.cds--form-requirement{color:var(--cds-text-primary,#161616)}.cds--date-picker__input{box-sizing:border-box;padding:0;border:0;margin:0;font-family:inherit;font-size:100%;vertical-align:baseline;font-family:var(--cds-code-02-font-family, 'IBM Plex Mono', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', monospace);font-size:var(--cds-code-02-font-size,.875rem);font-weight:var(--cds-code-02-font-weight,400);line-height:var(--cds-code-02-line-height,1.42857);letter-spacing:var(--cds-code-02-letter-spacing,.32px);outline:2px solid transparent;outline-offset:-2px;position:relative;display:block;height:2.5rem;padding:0 1rem;border:none;border-bottom:1px solid var(--cds-border-strong);background-color:var(--cds-field);color:var(--cds-text-primary,#161616);transition:70ms cubic-bezier(.2,0,.38,.9) all}.cds--date-picker__input *,.cds--date-picker__input ::after,.cds--date-picker__input ::before{box-sizing:inherit}.cds--date-picker__input.cds--focused,.cds--date-picker__input:focus{outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px}@media screen and (prefers-contrast){.cds--date-picker__input.cds--focused,.cds--date-picker__input:focus{outline-style:dotted}}.cds--date-picker__input:disabled{border-bottom:1px solid transparent;background-color:var(--cds-field);color:var(--cds-text-disabled,rgba(22,22,22,.25));cursor:not-allowed}.cds--date-picker__input:disabled::-moz-placeholder{color:var(--cds-text-disabled,rgba(22,22,22,.25))}.cds--date-picker__input:disabled::placeholder{color:var(--cds-text-disabled,rgba(22,22,22,.25))}.cds--date-picker__input:disabled:hover{border-bottom:1px solid transparent}.cds--date-picker__input::-moz-placeholder{color:var(--cds-text-placeholder,rgba(22,22,22,.4));opacity:1}.cds--date-picker__input::placeholder{color:var(--cds-text-placeholder,rgba(22,22,22,.4));opacity:1}.cds--date-picker__input--lg{height:3rem}.cds--date-picker__input--sm{height:2rem}.cds--date-picker__icon{position:absolute;z-index:1;top:50%;left:1rem;fill:var(--cds-icon-primary,#161616);pointer-events:none;transform:translateY(-50%)}.cds--date-picker__icon--invalid,.cds--date-picker__icon--warn{cursor:auto}.cds--date-picker__icon--warn{fill:var(--cds-support-warning,#f1c21b)}.cds--date-picker__icon--warn path:first-of-type{fill:#000;opacity:1}.cds--date-picker__icon--invalid{fill:var(--cds-support-error,#da1e28)}.cds--date-picker__icon~.cds--date-picker__input{padding-left:3rem}.cds--date-picker__input:disabled~.cds--date-picker__icon{cursor:not-allowed;fill:var(--cds-icon-disabled,rgba(22,22,22,.25))}.cds--date-picker--range>.cds--date-picker-container:first-child,.cds--date-picker--range>:host(cds-date-picker-input-skeleton:first-child),.cds--date-picker--range>:host(cds-date-picker-input:first-child){margin-left:.0625rem}.cds--date-picker--range .cds--date-picker-container,.cds--date-picker--range .cds--date-picker__input,.cds--date-picker--range :host(cds-date-picker-input),.cds--date-picker--range :host(cds-date-picker-input-skeleton){width:8.96875rem}.cds--date-picker.cds--skeleton input,.cds--date-picker__input.cds--skeleton,:host(cds-date-picker.cds--skeleton) input{position:relative;padding:0;border:none;background:var(--cds-skeleton-background,#e8e8e8);box-shadow:none;pointer-events:none;width:100%}.cds--date-picker.cds--skeleton input:active,.cds--date-picker.cds--skeleton input:focus,.cds--date-picker.cds--skeleton input:hover,.cds--date-picker__input.cds--skeleton:active,.cds--date-picker__input.cds--skeleton:focus,.cds--date-picker__input.cds--skeleton:hover,:host(cds-date-picker.cds--skeleton) input:active,:host(cds-date-picker.cds--skeleton) input:focus,:host(cds-date-picker.cds--skeleton) input:hover{border:none;cursor:default;outline:0}.cds--date-picker.cds--skeleton input::before,.cds--date-picker__input.cds--skeleton::before,:host(cds-date-picker.cds--skeleton) input::before{position:absolute;width:100%;height:100%;animation:3s ease-in-out skeleton infinite;background:var(--cds-skeleton-element,#c6c6c6);content:\"\";will-change:transform-origin,transform,opacity}@media (prefers-reduced-motion:reduce){.cds--date-picker.cds--skeleton input::before,.cds--date-picker__input.cds--skeleton::before,:host(cds-date-picker.cds--skeleton) input::before{animation:none}}.cds--date-picker.cds--skeleton input::-moz-placeholder,.cds--date-picker__input.cds--skeleton::-moz-placeholder,.cds--skeleton:host(cds-date-picker) input::-moz-placeholder{color:transparent}.cds--date-picker.cds--skeleton input::placeholder,.cds--date-picker__input.cds--skeleton::placeholder,:host(cds-date-picker.cds--skeleton) input::placeholder{color:transparent}.cds--date-picker.cds--skeleton .cds--label,:host(cds-date-picker.cds--skeleton) .cds--label{position:relative;padding:0;border:none;background:var(--cds-skeleton-background,#e8e8e8);box-shadow:none;pointer-events:none;width:4.6875rem;height:.875rem}.cds--date-picker.cds--skeleton .cds--label:active,.cds--date-picker.cds--skeleton .cds--label:focus,.cds--date-picker.cds--skeleton .cds--label:hover,:host(cds-date-picker.cds--skeleton) .cds--label:active,:host(cds-date-picker.cds--skeleton) .cds--label:focus,:host(cds-date-picker.cds--skeleton) .cds--label:hover{border:none;cursor:default;outline:0}.cds--date-picker.cds--skeleton .cds--label::before,:host(cds-date-picker.cds--skeleton) .cds--label::before{position:absolute;width:100%;height:100%;animation:3s ease-in-out skeleton infinite;background:var(--cds-skeleton-element,#c6c6c6);content:\"\";will-change:transform-origin,transform,opacity}@media (prefers-reduced-motion:reduce){.cds--date-picker.cds--skeleton .cds--label::before,:host(cds-date-picker.cds--skeleton) .cds--label::before{animation:none}}@media screen and (-ms-high-contrast:active),(forced-colors:active){.cds--date-picker__icon{fill:ButtonText}}.cds--date-picker__input[readonly]{background:0 0;cursor:text}.cds--date-picker__input[readonly]+.cds--date-picker__icon{fill:var(--cds-icon-disabled,rgba(22,22,22,.25))}:host(cds-date-picker) #floating-menu-container{position:absolute;width:100%}:host(cds-date-picker) .cds--date-picker__calendar.open{margin-top:0}:host(cds-date-picker) .flatpickr-next-month svg,:host(cds-date-picker) .flatpickr-prev-month svg{transform:rotate(180deg)}:host(cds-date-picker) .cds--date-picker__day.flatpickr-disabled,:host(cds-date-picker) .flatpickr-day.flatpickr-disabled{cursor:not-allowed;opacity:.5;color:var(--cds-layer-selected-inverse,#161616)}:host(cds-date-picker) .cds--date-picker__day.flatpickr-disabled:hover,:host(cds-date-picker) .flatpickr-day.flatpickr-disabled:hover{background:0 0}:host(cds-date-picker) .flatpickr-next-month.flatpickr-disabled svg,:host(cds-date-picker) .flatpickr-prev-month.flatpickr-disabled svg{fill:var(--cds-layer-selected-inverse,#161616);opacity:.5;cursor:not-allowed}:host(cds-date-picker) .flatpickr-next-month.flatpickr-disabled:hover svg,:host(cds-date-picker) .flatpickr-prev-month.flatpickr-disabled:hover svg{fill:var(--cds-layer-selected-inverse,#161616)}:host(cds-date-picker-input),:host(cds-date-picker-input-skeleton){outline:0}:host(cds-date-picker-input[color-scheme=light]) .cds--date-picker__input{background:var(--cds-field-02,#fff)}:host(cds-date-picker-input-skeleton[kind=simple]) .cds--date-picker__input,:host(cds-date-picker-input[kind=simple]) .cds--date-picker__input{width:7.5rem}:host(cds-date-picker-input-skeleton[kind=simple][size-horizontal=short]) .cds--date-picker__input,:host(cds-date-picker-input[kind=simple][size-horizontal=short]) .cds--date-picker__input{width:5.625rem}:host(cds-date-picker-input-skeleton[kind=single]),:host(cds-date-picker-input[kind=single]){max-width:18rem}:host(cds-date-picker-input-skeleton[kind=single]) .cds--date-picker__input,:host(cds-date-picker-input[kind=single]) .cds--date-picker__input{width:18rem}:host(cds-date-picker-input-skeleton[kind=from]),:host(cds-date-picker-input[kind=from]){margin-left:.0625rem}:host(cds-date-picker-input-skeleton[kind=from]),:host(cds-date-picker-input-skeleton[kind=to]),:host(cds-date-picker-input[kind=from]),:host(cds-date-picker-input[kind=to]){width:8.96875rem}:host(cds-date-picker-input-skeleton[kind=from]) .cds--date-picker__input,:host(cds-date-picker-input-skeleton[kind=to]) .cds--date-picker__input,:host(cds-date-picker-input[kind=from]) .cds--date-picker__input,:host(cds-date-picker-input[kind=to]) .cds--date-picker__input{width:8.96875rem}:host(cds-date-picker-input) ::slotted(.cds--date-picker__icon){position:absolute;left:1rem;fill:var(--cds-icon-primary,#161616);cursor:pointer;z-index:1}:host(cds-date-picker-input-skeleton){display:inline-block}:host(cds-date-picker-input-skeleton) .cds--label{position:relative;padding:0;border:none;background:var(--cds-skeleton-background,#e8e8e8);box-shadow:none;pointer-events:none;width:4.6875rem;height:.875rem}:host(cds-date-picker-input-skeleton) .cds--label:active,:host(cds-date-picker-input-skeleton) .cds--label:focus,:host(cds-date-picker-input-skeleton) .cds--label:hover{border:none;cursor:default;outline:0}:host(cds-date-picker-input-skeleton) .cds--label::before{position:absolute;width:100%;height:100%;animation:3s ease-in-out skeleton infinite;background:var(--cds-skeleton-element,#c6c6c6);content:\"\";will-change:transform-origin,transform,opacity}@media (prefers-reduced-motion:reduce){:host(cds-date-picker-input-skeleton) .cds--label::before{animation:none}}",
+  "@keyframes hide-feedback{0%{opacity:1;visibility:inherit}100%{opacity:0;visibility:hidden}}@keyframes show-feedback{0%{opacity:0;visibility:hidden}100%{opacity:1;visibility:inherit}}@keyframes skeleton{0%{opacity:.3;transform:scaleX(0);transform-origin:right}20%{opacity:1;transform:scaleX(1);transform-origin:right}28%{transform:scaleX(1);transform-origin:left}51%{transform:scaleX(0);transform-origin:left}58%{transform:scaleX(0);transform-origin:left}82%{transform:scaleX(1);transform-origin:left}83%{transform:scaleX(1);transform-origin:right}96%{transform:scaleX(0);transform-origin:right}100%{opacity:.3;transform:scaleX(0);transform-origin:right}}.cds--assistive-text,.cds--visually-hidden{position:absolute;overflow:hidden;width:1px;height:1px;padding:0;border:0;margin:-1px;clip:rect(0,0,0,0);visibility:inherit;white-space:nowrap}input:-webkit-autofill,input:-webkit-autofill:focus,input:-webkit-autofill:hover,textarea:-webkit-autofill,textarea:-webkit-autofill:focus,textarea:-webkit-autofill:hover{box-shadow:0 0 0 1000px var(--cds-field) inset;-webkit-text-fill-color:var(--cds-text-primary,#161616)}.cds--fieldset html{font-size:100%}.cds--fieldset body{font-weight:400;font-family:'IBM Plex Sans',system-ui,-apple-system,BlinkMacSystemFont,'.SFNSText-Regular',sans-serif;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}.cds--fieldset code{font-family:'IBM Plex Mono',system-ui,-apple-system,BlinkMacSystemFont,'.SFNSText-Regular',monospace}.cds--fieldset strong{font-weight:600}.cds--form-item{font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);line-height:var(--cds-body-compact-01-line-height,1.28572);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);display:flex;flex:1 1 auto;flex-direction:column;align-items:flex-start}.cds--label{font-size:var(--cds-label-01-font-size,.75rem);font-weight:var(--cds-label-01-font-weight,400);line-height:var(--cds-label-01-line-height,1.33333);letter-spacing:var(--cds-label-01-letter-spacing,.32px);display:inline-block;margin-bottom:.5rem;color:var(--cds-text-secondary,#525252);font-weight:400;line-height:1rem;vertical-align:baseline}.cds--label html{font-size:100%}.cds--label body{font-weight:400;font-family:'IBM Plex Sans',system-ui,-apple-system,BlinkMacSystemFont,'.SFNSText-Regular',sans-serif;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}.cds--label code{font-family:'IBM Plex Mono',system-ui,-apple-system,BlinkMacSystemFont,'.SFNSText-Regular',monospace}.cds--label strong{font-weight:600}.cds--label .cds--toggletip-label{font-size:var(--cds-label-01-font-size,.75rem);font-weight:var(--cds-label-01-font-weight,400);line-height:var(--cds-label-01-line-height,1.33333);letter-spacing:var(--cds-label-01-letter-spacing,.32px)}.cds--label--no-margin{margin-bottom:0}.cds--label+.cds--tooltip{position:relative;top:.2rem;right:.5rem}.cds--label+.cds--tooltip .cds--tooltip__trigger{box-sizing:border-box;padding:0;border:0;margin:0;font-family:inherit;font-size:100%;vertical-align:baseline;display:inline-block;padding:0;border:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;cursor:pointer;text-align:start;width:100%;display:flex;align-items:center;justify-content:center;font-size:var(--cds-label-01-font-size,.75rem);font-weight:var(--cds-label-01-font-weight,400);line-height:var(--cds-label-01-line-height,1.33333);letter-spacing:var(--cds-label-01-letter-spacing,.32px)}.cds--label+.cds--tooltip .cds--tooltip__trigger *,.cds--label+.cds--tooltip .cds--tooltip__trigger ::after,.cds--label+.cds--tooltip .cds--tooltip__trigger ::before{box-sizing:inherit}.cds--label+.cds--tooltip .cds--tooltip__trigger::-moz-focus-inner{border:0}.cds--label+.cds--tooltip .cds--tooltip__trigger:focus{outline:1px solid var(--cds-focus,#0f62fe)}.cds--label+.cds--tooltip .cds--tooltip__trigger svg{fill:var(--cds-icon-secondary,#525252)}.cds--label+.cds--tooltip .cds--tooltip__trigger svg :hover{fill:var(--cds-icon-primary,#161616)}.cds--label+.cds--toggletip{top:.2rem;right:.5rem}.cds--label.cds--skeleton{position:relative;padding:0;border:none;background:var(--cds-skeleton-background,#e8e8e8);box-shadow:none;pointer-events:none;width:4.6875rem;height:.875rem}.cds--label.cds--skeleton:active,.cds--label.cds--skeleton:focus,.cds--label.cds--skeleton:hover{border:none;cursor:default;outline:0}.cds--label.cds--skeleton::before{position:absolute;width:100%;height:100%;animation:3s ease-in-out skeleton infinite;background:var(--cds-skeleton-element,#c6c6c6);content:\"\";will-change:transform-origin,transform,opacity}@media (prefers-reduced-motion:reduce){.cds--label.cds--skeleton::before{animation:none}}input[type=number]{font-family:'IBM Plex Sans',system-ui,-apple-system,BlinkMacSystemFont,'.SFNSText-Regular',sans-serif}.cds--combo-box[data-invalid]:not(.cds--multi-select--selected) .cds--text-input:not(:focus),.cds--list-box[data-invalid]:not(.cds--multi-select--invalid--focused),.cds--number[data-invalid] input[type=number]:not(:focus),.cds--select-input__wrapper[data-invalid] .cds--select-input:not(:focus),.cds--text-area__wrapper[data-invalid]>.cds--text-area--invalid:not(:focus),.cds--text-input__field-wrapper[data-invalid]>.cds--text-input--invalid:not(:focus),input[data-invalid]:not(:focus){outline:2px solid var(--cds-support-error,#da1e28);outline-offset:-2px}@media screen and (prefers-contrast){.cds--combo-box[data-invalid]:not(.cds--multi-select--selected) .cds--text-input:not(:focus),.cds--list-box[data-invalid]:not(.cds--multi-select--invalid--focused),.cds--number[data-invalid] input[type=number]:not(:focus),.cds--select-input__wrapper[data-invalid] .cds--select-input:not(:focus),.cds--text-area__wrapper[data-invalid]>.cds--text-area--invalid:not(:focus),.cds--text-input__field-wrapper[data-invalid]>.cds--text-input--invalid:not(:focus),input[data-invalid]:not(:focus){outline-style:dotted}}.cds--date-picker-input__wrapper--invalid~.cds--form-requirement,.cds--date-picker-input__wrapper--warn~.cds--form-requirement,.cds--date-picker-input__wrapper~.cds--form-requirement,.cds--list-box--warning~.cds--form-requirement,.cds--list-box[data-invalid]~.cds--form-requirement,.cds--number[data-invalid] .cds--number__input-wrapper~.cds--form-requirement,.cds--number__input-wrapper--warning~.cds--form-requirement,.cds--select--warning .cds--select-input__wrapper~.cds--form-requirement,.cds--select-input__wrapper[data-invalid]~.cds--form-requirement,.cds--text-area__wrapper--warn~.cds--form-requirement,.cds--text-area__wrapper[data-invalid]~.cds--form-requirement,.cds--text-input__field-wrapper--warning>.cds--text-input~.cds--form-requirement,.cds--text-input__field-wrapper--warning~.cds--form-requirement,.cds--text-input__field-wrapper[data-invalid]~.cds--form-requirement,.cds--time-picker--invalid~.cds--form-requirement,.cds--time-picker[data-invalid]~.cds--form-requirement,input[data-invalid]~.cds--form-requirement{display:block;overflow:visible;max-height:12.5rem;font-weight:400}.cds--date-picker-input__wrapper--invalid~.cds--form-requirement,.cds--date-picker-input__wrapper~.cds--form-requirement,.cds--list-box[data-invalid]~.cds--form-requirement,.cds--number[data-invalid] .cds--number__input-wrapper~.cds--form-requirement,.cds--select-input__wrapper[data-invalid]~.cds--form-requirement,.cds--text-area__wrapper[data-invalid]~.cds--form-requirement,.cds--text-input__field-wrapper[data-invalid]~.cds--form-requirement,.cds--time-picker--invalid~.cds--form-requirement,.cds--time-picker[data-invalid]~.cds--form-requirement,input[data-invalid]~.cds--form-requirement{color:var(--cds-text-error,#da1e28)}.cds--form--fluid .cds--text-input__field-wrapper--warning,.cds--form--fluid .cds--text-input__field-wrapper[data-invalid]{display:block}.cds--form--fluid input[data-invalid]{outline:0}.cds--form--fluid .cds--form-requirement{padding:.5rem 1rem .5rem 2.5rem;margin:0}input:not(output):not([data-invalid]):-moz-ui-invalid{box-shadow:none}.cds--form-requirement{font-size:var(--cds-label-01-font-size,.75rem);font-weight:var(--cds-label-01-font-weight,400);line-height:var(--cds-label-01-line-height,1.33333);letter-spacing:var(--cds-label-01-letter-spacing,.32px);display:none;overflow:hidden;max-height:0;margin:.25rem 0 0}.cds--form-requirement html{font-size:100%}.cds--form-requirement body{font-weight:400;font-family:'IBM Plex Sans',system-ui,-apple-system,BlinkMacSystemFont,'.SFNSText-Regular',sans-serif;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}.cds--form-requirement code{font-family:'IBM Plex Mono',system-ui,-apple-system,BlinkMacSystemFont,'.SFNSText-Regular',monospace}.cds--form-requirement strong{font-weight:600}.cds--select--inline .cds--form__helper-text{margin-top:0}.cds--form__helper-text{font-size:var(--cds-helper-text-01-font-size,.75rem);line-height:var(--cds-helper-text-01-line-height,1.33333);letter-spacing:var(--cds-helper-text-01-letter-spacing,.32px);z-index:0;width:100%;margin-top:.25rem;color:var(--cds-text-secondary,#525252);opacity:1}.cds--form__helper-text--disabled,.cds--label--disabled{color:var(--cds-text-disabled,rgba(22,22,22,.25))}fieldset[disabled] .cds--form__helper-text,fieldset[disabled] .cds--label{color:var(--cds-text-disabled,rgba(22,22,22,.25))}@keyframes fp-fade-in-down{from{opacity:0;transform:translate3d(0,-20px,0)}to{opacity:1;transform:translate3d(0,0,0)}}@keyframes fp-slide-left{from{transform:translate3d(0,0,0)}to{transform:translate3d(100%,0,0)}}@keyframes fp-slide-left-new{from{transform:translate3d(-100%,0,0)}to{transform:translate3d(0,0,0)}}@keyframes fp-slide-right{from{transform:translate3d(0,0,0)}to{transform:translate3d(-100%,0,0)}}@keyframes fp-slide-right-new{from{transform:translate3d(100%,0,0)}to{transform:translate3d(0,0,0)}}@keyframes fp-fade-out{from{opacity:1}to{opacity:0}}@keyframes fp-fade-in{from{opacity:0}to{opacity:1}}.flatpickr-calendar{position:absolute;overflow:hidden;width:19.6875rem;max-height:0;box-sizing:border-box;padding:0;border:0;animation:none;border-radius:0;direction:rtl;opacity:0;text-align:center;touch-action:manipulation;visibility:hidden}@media screen and (-ms-high-contrast:active),(forced-colors:active){.flatpickr-calendar{outline:1px solid transparent}}.flatpickr-calendar.inline,.flatpickr-calendar.open{overflow:visible;max-height:40rem;opacity:1;visibility:inherit}.flatpickr-calendar.open{box-shadow:0 2px 6px var(--cds-shadow,rgba(0,0,0,.3));z-index:99999;display:flex;overflow:hidden;width:18rem;height:21rem;flex-direction:column;align-items:center;justify-content:center;padding:.25rem .25rem .5rem .25rem;border:none;margin-top:-.125rem;background-color:var(--cds-layer-01,#f4f4f4)}.flatpickr-calendar.open:focus{outline:1px solid var(--cds-focus,#0f62fe)}@media screen and (prefers-contrast){.flatpickr-calendar.open:focus{outline-style:dotted}}.flatpickr-calendar.animate.open{animation:fp-fade-in-down 110ms cubic-bezier(0,0,.38,.9)}@media screen and (prefers-reduced-motion:reduce){.flatpickr-calendar.animate.open{animation:none}}.flatpickr-calendar.inline{position:relative;top:.125rem;display:block}.flatpickr-calendar.static{position:absolute;top:calc(100% + 2px)}.flatpickr-calendar.static.open{z-index:999;display:block}.flatpickr-calendar.hasWeeks{width:auto}.dayContainer{display:flex;height:15.375rem;flex-wrap:wrap;justify-content:space-around;padding:0;outline:0}.flatpickr-calendar .hasTime .dayContainer,.flatpickr-calendar .hasWeeks .dayContainer{border-bottom:0;border-bottom-right-radius:0;border-bottom-left-radius:0}.flatpickr-calendar .hasWeeks .dayContainer{border-right:0}.flatpickr-calendar.showTimeInput.hasTime .flatpickr-time{height:2.5rem;border-top:1px solid #e6e6e6}.flatpickr-calendar.noCalendar.hasTime .flatpickr-time{height:auto}.flatpickr-calendar:focus{outline:0}.flatpickr-months{display:flex;width:100%;justify-content:space-between}.flatpickr-month{font-size:var(--cds-heading-compact-01-font-size,.875rem);font-weight:var(--cds-heading-compact-01-font-weight,600);line-height:var(--cds-heading-compact-01-line-height,1.28572);letter-spacing:var(--cds-heading-compact-01-letter-spacing,.16px);display:flex;height:2.5rem;align-items:center;background-color:transparent;color:var(--cds-text-primary,#161616);line-height:1;text-align:center}.flatpickr-next-month,.flatpickr-prev-month{z-index:3;display:flex;width:2.5rem;height:2.5rem;align-items:center;justify-content:center;padding:0;cursor:pointer;fill:var(--cds-icon-primary,#161616);line-height:16px;text-decoration:none;transform:scale(-1,1);transition:background-color 70ms cubic-bezier(.2,0,.38,.9);-webkit-user-select:none;-moz-user-select:none;user-select:none}@media screen and (-ms-high-contrast:active),(forced-colors:active){.flatpickr-next-month,.flatpickr-prev-month{fill:ButtonText}}@media screen and (prefers-reduced-motion:reduce){.flatpickr-next-month,.flatpickr-prev-month{transition:none}}.flatpickr-next-month:hover,.flatpickr-prev-month:hover{background-color:var(--cds-layer-hover)}.flatpickr-next-month.disabled svg,.flatpickr-prev-month.disabled svg{cursor:not-allowed;fill:var(--cds-icon-disabled,rgba(22,22,22,.25))}.flatpickr-next-month.disabled:hover svg,.flatpickr-prev-month.disabled:hover svg{fill:var(--cds-icon-disabled,rgba(22,22,22,.25))}.flatpickr-current-month{font-size:var(--cds-heading-compact-01-font-size,.875rem);font-weight:var(--cds-heading-compact-01-font-weight,600);line-height:var(--cds-heading-compact-01-line-height,1.28572);letter-spacing:var(--cds-heading-compact-01-letter-spacing,.16px);display:flex;height:1.75rem;align-items:center;justify-content:center;text-align:center}.flatpickr-current-month .cur-month{margin-left:.25rem;margin-right:.25rem}.flatpickr-current-month .cur-month:hover{background-color:var(--cds-layer-hover)}.numInputWrapper{position:relative;width:3.75rem}.numInputWrapper:hover{background-color:var(--cds-background-hover,rgba(141,141,141,.12))}.numInputWrapper .numInput{display:inline-block;width:100%;padding:.25rem;border:none;margin:0;-moz-appearance:textfield;background-color:var(--cds-field-01,#f4f4f4);color:var(--cds-text-primary,#161616);cursor:default;font-family:inherit;font-size:inherit;font-weight:600}.numInputWrapper .numInput::-webkit-inner-spin-button,.numInputWrapper .numInput::-webkit-outer-spin-button{margin:0;-webkit-appearance:none}.numInputWrapper .numInput:focus{outline:1px solid var(--cds-focus,#0f62fe)}@media screen and (prefers-contrast){.numInputWrapper .numInput:focus{outline-style:dotted}}.numInputWrapper .numInput[disabled],.numInputWrapper .numInput[disabled]:hover{background-color:var(--cds-layer-01,#f4f4f4);color:var(--cds-text-disabled,rgba(22,22,22,.25));pointer-events:none}.numInputWrapper .arrowUp{top:.25rem;border-bottom:0}.numInputWrapper .arrowUp::after{border-bottom:.25rem solid var(--cds-icon-primary,#161616)}.numInputWrapper .arrowDown{top:.6875rem}.numInputWrapper .arrowDown::after{border-top:.25rem solid var(--cds-icon-primary,#161616)}.numInputWrapper .arrowDown,.numInputWrapper .arrowUp{position:absolute;right:2.6rem;width:.75rem;height:50%;padding:0 .125rem 0 .25rem;border:none;cursor:pointer;line-height:50%;opacity:0}.numInputWrapper .arrowDown::after,.numInputWrapper .arrowUp::after{position:absolute;top:33%;display:block;border-left:.25rem solid transparent;border-right:.25rem solid transparent;content:\"\"}.numInputWrapper .arrowDown:hover::after,.numInputWrapper .arrowUp:hover::after{border-top-color:var(--cds-button-primary,#0f62fe);border-bottom-color:var(--cds-button-primary,#0f62fe)}.numInputWrapper .arrowDown:active::after,.numInputWrapper .arrowUp:active::after{border-top-color:var(--cds-border-interactive,#0f62fe);border-bottom-color:var(--cds-border-interactive,#0f62fe)}.numInput[disabled]~.arrowUp::after{border-bottom-color:var(--cds-text-disabled,rgba(22,22,22,.25))}.numInput[disabled]~.arrowDown::after{border-top-color:var(--cds-text-disabled,rgba(22,22,22,.25))}.numInputWrapper:hover .arrowDown,.numInputWrapper:hover .arrowUp{opacity:1}.numInputWrapper:hover .numInput[disabled]~.arrowDown,.numInputWrapper:hover .numInput[disabled]~.arrowUp{opacity:0}.flatpickr-weekdays{display:flex;height:2.5rem;align-items:center}.flatpickr-weekdaycontainer{display:flex;width:100%}.flatpickr-weekday{font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);line-height:var(--cds-body-compact-01-line-height,1.28572);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);flex:1;color:var(--cds-text-primary,#161616);cursor:default}.flatpickr-days:focus{outline:0}.flatpickr-calendar.animate .dayContainer.slideLeft{animation:fp-fade-out .4s cubic-bezier(.23,1,.32,1),fp-slide-left .4s cubic-bezier(.23,1,.32,1)}.flatpickr-calendar.animate .dayContainer.slideLeft,.flatpickr-calendar.animate .dayContainer.slideLeftNew{transform:translate3d(100%,0,0)}.flatpickr-calendar.animate .dayContainer.slideLeftNew{animation:fp-fade-in .4s cubic-bezier(.23,1,.32,1),fp-slide-left .4s cubic-bezier(.23,1,.32,1)}.flatpickr-calendar.animate .dayContainer.slideRight{animation:fp-fade-out .4s cubic-bezier(.23,1,.32,1),fp-slide-right .4s cubic-bezier(.23,1,.32,1);transform:translate3d(-100%,0,0)}.flatpickr-calendar.animate .dayContainer.slideRightNew{animation:fp-fade-in .4s cubic-bezier(.23,1,.32,1),fp-slide-right-new .4s cubic-bezier(.23,1,.32,1)}.flatpickr-day{font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);line-height:var(--cds-body-compact-01-line-height,1.28572);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);display:flex;width:2.5rem;height:2.5rem;align-items:center;justify-content:center;color:var(--cds-text-primary,#161616);cursor:pointer;transition:all 70ms cubic-bezier(.2,0,.38,.9)}.flatpickr-day:hover{background:var(--cds-layer-hover)}.flatpickr-day:focus{outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px;outline-color:var(--cds-button-primary,#0f62fe)}@media screen and (prefers-contrast){.flatpickr-day:focus{outline-style:dotted}}.nextMonthDay,.prevMonthDay{color:var(--cds-text-helper,#6f6f6f)}.flatpickr-day.today{position:relative;color:var(--cds-link-primary,#0f62fe);font-weight:600}.flatpickr-day.today::after{position:absolute;bottom:.4375rem;right:50%;display:block;width:.25rem;height:.25rem;background-color:var(--cds-link-primary,#0f62fe);content:\"\";transform:translateX(50%)}.flatpickr-day.today.no-border{border:none}.flatpickr-day.today.selected{outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px}@media screen and (prefers-contrast){.flatpickr-day.today.selected{outline-style:dotted}}.flatpickr-day.today.selected::after{display:none}.flatpickr-day.inRange{background-color:var(--cds-highlight,#d0e2ff);color:var(--cds-text-primary,#161616)}.flatpickr-day.selected{background-color:var(--cds-button-primary,#0f62fe);color:var(--cds-text-on-color,#fff)}@media screen and (-ms-high-contrast:active),(forced-colors:active){.flatpickr-day.selected{color:Highlight;outline:1px solid Highlight;outline-style:dotted}}.flatpickr-day.selected:focus{outline:.0625rem solid var(--cds-layer-02,#fff);outline-offset:-.1875rem}.flatpickr-day.startRange.selected{z-index:2;box-shadow:none}.flatpickr-day.endRange.inRange,.flatpickr-day.startRange.inRange:not(.selected){outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px;z-index:3;background:var(--cds-layer-01,#f4f4f4)}@media screen and (prefers-contrast){.flatpickr-day.endRange.inRange,.flatpickr-day.startRange.inRange:not(.selected){outline-style:dotted}}.flatpickr-day.endRange:hover{outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px;background:var(--cds-layer-01,#f4f4f4);color:var(--cds-text-primary,#161616)}@media screen and (prefers-contrast){.flatpickr-day.endRange:hover{outline-style:dotted}}.flatpickr-day.endRange.inRange.selected{background:var(--cds-button-primary,#0f62fe);color:var(--cds-text-on-color,#fff)}.flatpickr-day.flatpickr-disabled{color:var(--cds-text-disabled,rgba(22,22,22,.25));cursor:not-allowed}.flatpickr-day.flatpickr-disabled:hover{background-color:transparent}.flatpickr-input[readonly]{cursor:pointer}@media screen and (-ms-high-contrast:active),(forced-colors:active){.flatpickr-day.inRange,.flatpickr-day.today{color:Highlight}}.cds--date-picker,:host(cds-date-picker){display:flex}.cds--date-picker--light .cds--date-picker__input{background:var(--cds-field-02,#fff)}.cds--date-picker~.cds--label,:host(cds-date-picker)~.cds--label{order:1}.cds--date-picker-container,:host(cds-date-picker-input),:host(cds-date-picker-input-skeleton){position:relative;display:flex;flex-direction:column;justify-content:space-between}.cds--date-picker-container .cds--label,:host(cds-date-picker-input) .cds--label,:host(cds-date-picker-input-skeleton) .cds--label{display:flex}.cds--date-picker-input__wrapper{position:relative;display:flex;align-items:center}.cds--date-picker.cds--date-picker--simple .cds--date-picker__input,.cds--date-picker.cds--date-picker--simple .cds--label,:host(cds-date-picker.cds--date-picker--simple) .cds--date-picker__input,:host(cds-date-picker.cds--date-picker--simple) .cds--label{width:7.5rem}.cds--date-picker.cds--date-picker--simple .cds--date-picker-input__wrapper--invalid .cds--date-picker__input,.cds--date-picker.cds--date-picker--simple .cds--date-picker-input__wrapper--invalid~.cds--form-requirement,.cds--date-picker.cds--date-picker--simple .cds--date-picker-input__wrapper--warn .cds--date-picker__input,.cds--date-picker.cds--date-picker--simple .cds--date-picker-input__wrapper--warn~.cds--form-requirement,:host(cds-date-picker.cds--date-picker--simple) .cds--date-picker-input__wrapper--invalid .cds--date-picker__input,:host(cds-date-picker.cds--date-picker--simple) .cds--date-picker-input__wrapper--invalid~.cds--form-requirement,:host(cds-date-picker.cds--date-picker--simple) .cds--date-picker-input__wrapper--warn .cds--date-picker__input,:host(cds-date-picker.cds--date-picker--simple) .cds--date-picker-input__wrapper--warn~.cds--form-requirement{width:9.5rem}.cds--date-picker.cds--date-picker--simple.cds--date-picker--short .cds--date-picker__input,:host(cds-date-picker.cds--date-picker--simple.cds--date-picker--short) .cds--date-picker__input{width:5.7rem}.cds--date-picker.cds--date-picker--single .cds--date-picker__input,:host(cds-date-picker.cds--date-picker--single) .cds--date-picker__input{width:18rem}.cds--date-picker .cds--date-picker-input__wrapper--warn~.cds--form-requirement,:host(cds-date-picker) .cds--date-picker-input__wrapper--warn~.cds--form-requirement{color:var(--cds-text-primary,#161616)}.cds--date-picker__input{box-sizing:border-box;padding:0;border:0;margin:0;font-family:inherit;font-size:100%;vertical-align:baseline;font-family:var(--cds-code-02-font-family, 'IBM Plex Mono', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', monospace);font-size:var(--cds-code-02-font-size,.875rem);font-weight:var(--cds-code-02-font-weight,400);line-height:var(--cds-code-02-line-height,1.42857);letter-spacing:var(--cds-code-02-letter-spacing,.32px);outline:2px solid transparent;outline-offset:-2px;position:relative;display:block;height:2.5rem;padding:0 1rem;border:none;border-bottom:1px solid var(--cds-border-strong);background-color:var(--cds-field);color:var(--cds-text-primary,#161616);transition:70ms cubic-bezier(.2,0,.38,.9) all}.cds--date-picker__input *,.cds--date-picker__input ::after,.cds--date-picker__input ::before{box-sizing:inherit}.cds--date-picker__input.cds--focused,.cds--date-picker__input:focus{outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px}@media screen and (prefers-contrast){.cds--date-picker__input.cds--focused,.cds--date-picker__input:focus{outline-style:dotted}}.cds--date-picker__input:disabled{border-bottom:1px solid transparent;background-color:var(--cds-field);color:var(--cds-text-disabled,rgba(22,22,22,.25));cursor:not-allowed}.cds--date-picker__input:disabled::-moz-placeholder{color:var(--cds-text-disabled,rgba(22,22,22,.25))}.cds--date-picker__input:disabled::placeholder{color:var(--cds-text-disabled,rgba(22,22,22,.25))}.cds--date-picker__input:disabled:hover{border-bottom:1px solid transparent}.cds--date-picker__input::-moz-placeholder{color:var(--cds-text-placeholder,rgba(22,22,22,.4));opacity:1}.cds--date-picker__input::placeholder{color:var(--cds-text-placeholder,rgba(22,22,22,.4));opacity:1}.cds--date-picker__input--lg{height:3rem}.cds--date-picker__input--sm{height:2rem}.cds--date-picker__icon,:host(cds-date-picker-input) .cds--date-picker__icon{position:absolute;z-index:1;top:50%;left:1rem;fill:var(--cds-icon-primary,#161616);pointer-events:none;transform:translateY(-50%)}.cds--date-picker__icon--invalid,.cds--date-picker__icon--warn,:host(cds-date-picker-input) .cds--date-picker__icon--invalid,:host(cds-date-picker-input) .cds--date-picker__icon--warn{cursor:auto}.cds--date-picker__icon--warn,:host(cds-date-picker-input) .cds--date-picker__icon--warn{fill:var(--cds-support-warning,#f1c21b)}.cds--date-picker__icon--warn path:first-of-type{fill:#000;opacity:1}.cds--date-picker__icon--invalid,:host(cds-date-picker-input) .cds--date-picker__icon--invalid{fill:var(--cds-support-error,#da1e28)}.cds--date-picker__icon~.cds--date-picker__input,:host(cds-date-picker-input) .cds--date-picker__icon~.cds--date-picker__input{padding-left:3rem}.cds--date-picker__input:disabled~.cds--date-picker__icon,:host(cds-date-picker-input) .cds--date-picker__input:disabled~.cds--date-picker__icon{cursor:not-allowed;fill:var(--cds-icon-disabled,rgba(22,22,22,.25))}.cds--date-picker--range>.cds--date-picker-container:first-child,.cds--date-picker--range>:host(cds-date-picker-input-skeleton:first-child),.cds--date-picker--range>:host(cds-date-picker-input:first-child){margin-left:.0625rem}.cds--date-picker--range .cds--date-picker-container,.cds--date-picker--range .cds--date-picker__input,.cds--date-picker--range :host(cds-date-picker-input),.cds--date-picker--range :host(cds-date-picker-input-skeleton){width:8.96875rem}.cds--date-picker.cds--skeleton input,.cds--date-picker__input.cds--skeleton,:host(cds-date-picker.cds--skeleton) input{position:relative;padding:0;border:none;background:var(--cds-skeleton-background,#e8e8e8);box-shadow:none;pointer-events:none;width:100%}.cds--date-picker.cds--skeleton input:active,.cds--date-picker.cds--skeleton input:focus,.cds--date-picker.cds--skeleton input:hover,.cds--date-picker__input.cds--skeleton:active,.cds--date-picker__input.cds--skeleton:focus,.cds--date-picker__input.cds--skeleton:hover,:host(cds-date-picker.cds--skeleton) input:active,:host(cds-date-picker.cds--skeleton) input:focus,:host(cds-date-picker.cds--skeleton) input:hover{border:none;cursor:default;outline:0}.cds--date-picker.cds--skeleton input::before,.cds--date-picker__input.cds--skeleton::before,:host(cds-date-picker.cds--skeleton) input::before{position:absolute;width:100%;height:100%;animation:3s ease-in-out skeleton infinite;background:var(--cds-skeleton-element,#c6c6c6);content:\"\";will-change:transform-origin,transform,opacity}@media (prefers-reduced-motion:reduce){.cds--date-picker.cds--skeleton input::before,.cds--date-picker__input.cds--skeleton::before,:host(cds-date-picker.cds--skeleton) input::before{animation:none}}.cds--date-picker.cds--skeleton input::-moz-placeholder,.cds--date-picker__input.cds--skeleton::-moz-placeholder,.cds--skeleton:host(cds-date-picker) input::-moz-placeholder{color:transparent}.cds--date-picker.cds--skeleton input::placeholder,.cds--date-picker__input.cds--skeleton::placeholder,:host(cds-date-picker.cds--skeleton) input::placeholder{color:transparent}.cds--date-picker.cds--skeleton .cds--label,:host(cds-date-picker.cds--skeleton) .cds--label{position:relative;padding:0;border:none;background:var(--cds-skeleton-background,#e8e8e8);box-shadow:none;pointer-events:none;width:4.6875rem;height:.875rem}.cds--date-picker.cds--skeleton .cds--label:active,.cds--date-picker.cds--skeleton .cds--label:focus,.cds--date-picker.cds--skeleton .cds--label:hover,:host(cds-date-picker.cds--skeleton) .cds--label:active,:host(cds-date-picker.cds--skeleton) .cds--label:focus,:host(cds-date-picker.cds--skeleton) .cds--label:hover{border:none;cursor:default;outline:0}.cds--date-picker.cds--skeleton .cds--label::before,:host(cds-date-picker.cds--skeleton) .cds--label::before{position:absolute;width:100%;height:100%;animation:3s ease-in-out skeleton infinite;background:var(--cds-skeleton-element,#c6c6c6);content:\"\";will-change:transform-origin,transform,opacity}@media (prefers-reduced-motion:reduce){.cds--date-picker.cds--skeleton .cds--label::before,:host(cds-date-picker.cds--skeleton) .cds--label::before{animation:none}}@media screen and (-ms-high-contrast:active),(forced-colors:active){.cds--date-picker__icon,:host(cds-date-picker-input) .cds--date-picker__icon{fill:ButtonText}}.cds--date-picker__input[readonly]{border-bottom-color:var(--cds-border-subtle);background:0 0;cursor:text}.cds--date-picker__input[readonly]+.cds--date-picker__icon,:host(cds-date-picker-input) .cds--date-picker__input[readonly]+.cds--date-picker__icon{fill:var(--cds-icon-disabled,rgba(22,22,22,.25))}:host(cds-date-picker) #floating-menu-container{position:absolute;width:100%}:host(cds-date-picker) .cds--date-picker__calendar.open{margin-top:0}:host(cds-date-picker) .flatpickr-next-month svg,:host(cds-date-picker) .flatpickr-prev-month svg{transform:rotate(180deg)}:host(cds-date-picker) .cds--date-picker__day.flatpickr-disabled,:host(cds-date-picker) .flatpickr-day.flatpickr-disabled{cursor:not-allowed;opacity:.5;color:var(--cds-layer-selected-inverse,#161616)}:host(cds-date-picker) .cds--date-picker__day.flatpickr-disabled:hover,:host(cds-date-picker) .flatpickr-day.flatpickr-disabled:hover{background:0 0}:host(cds-date-picker) .flatpickr-next-month.flatpickr-disabled svg,:host(cds-date-picker) .flatpickr-prev-month.flatpickr-disabled svg{fill:var(--cds-layer-selected-inverse,#161616);opacity:.5;cursor:not-allowed}:host(cds-date-picker) .flatpickr-next-month.flatpickr-disabled:hover svg,:host(cds-date-picker) .flatpickr-prev-month.flatpickr-disabled:hover svg{fill:var(--cds-layer-selected-inverse,#161616)}:host(cds-date-picker-input),:host(cds-date-picker-input-skeleton){outline:0}:host(cds-date-picker-input) .cds--form-requirement[hidden],:host(cds-date-picker-input-skeleton) .cds--form-requirement[hidden]{display:none}:host(cds-date-picker-input[warn]) .cds--form-requirement{color:var(--cds-text-primary,#161616)}:host(cds-date-picker-input-skeleton[kind=simple]) .cds--date-picker__input,:host(cds-date-picker-input[kind=simple]) .cds--date-picker__input{width:7.5rem}:host(cds-date-picker-input-skeleton[kind=simple]) .cds--date-picker__input--invalid,:host(cds-date-picker-input-skeleton[kind=simple]) .cds--date-picker__input--warn,:host(cds-date-picker-input[kind=simple]) .cds--date-picker__input--invalid,:host(cds-date-picker-input[kind=simple]) .cds--date-picker__input--warn{width:9.5rem}:host(cds-date-picker-input-skeleton[kind=simple][short]) .cds--date-picker__input,:host(cds-date-picker-input[kind=simple][short]) .cds--date-picker__input{width:5.625rem}:host(cds-date-picker-input-skeleton[kind=single]),:host(cds-date-picker-input[kind=single]){max-width:18rem}:host(cds-date-picker-input-skeleton[kind=single]) .cds--date-picker__input,:host(cds-date-picker-input[kind=single]) .cds--date-picker__input{width:18rem}:host(cds-date-picker-input-skeleton[kind=from]),:host(cds-date-picker-input[kind=from]){margin-left:.0625rem}:host(cds-date-picker-input-skeleton[kind=from]),:host(cds-date-picker-input-skeleton[kind=to]),:host(cds-date-picker-input[kind=from]),:host(cds-date-picker-input[kind=to]){width:8.96875rem}:host(cds-date-picker-input-skeleton[kind=from]) .cds--date-picker__input,:host(cds-date-picker-input-skeleton[kind=to]) .cds--date-picker__input,:host(cds-date-picker-input[kind=from]) .cds--date-picker__input,:host(cds-date-picker-input[kind=to]) .cds--date-picker__input{width:8.96875rem}:host(cds-date-picker-input-skeleton){display:inline-block}:host(cds-date-picker-input-skeleton) .cds--label{position:relative;padding:0;border:none;background:var(--cds-skeleton-background,#e8e8e8);box-shadow:none;pointer-events:none;width:4.6875rem;height:.875rem}:host(cds-date-picker-input-skeleton) .cds--label:active,:host(cds-date-picker-input-skeleton) .cds--label:focus,:host(cds-date-picker-input-skeleton) .cds--label:hover{border:none;cursor:default;outline:0}:host(cds-date-picker-input-skeleton) .cds--label::before{position:absolute;width:100%;height:100%;animation:3s ease-in-out skeleton infinite;background:var(--cds-skeleton-element,#c6c6c6);content:\"\";will-change:transform-origin,transform,opacity}@media (prefers-reduced-motion:reduce){:host(cds-date-picker-input-skeleton) .cds--label::before{animation:none}}",
 ]);

package/es/components/date-picker/defs.d.ts

@@ -1,7 +1,7 @@
 /**
  * @license
  *
- * Copyright IBM Corp. 2020
+ * Copyright IBM Corp. 2020, 2023
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
@@ -28,18 +28,5 @@ export declare enum DATE_PICKER_INPUT_KIND {
      */
     TO = "to"
 }
-/**
- * Horizontal size, applicable only to the simple variant.
- */
-export declare enum DATE_PICKER_INPUT_SIZE_HORIZONTAL {
-    /**
-     * Regular size.
-     */
-    REGULAR = "",
-    /**
-     * Short size.
-     */
-    SHORT = "short"
-}
 
 //# sourceMappingURL=defs.d.ts.map

package/es/components/date-picker/defs.d.ts.map

@@ -1 +1 @@
-{"version":3,"sources":["components/date-picker/defs.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,yBAAyB,IAAI,8BAA8B,EAAE,MAAM,4BAA4B,CAAC;AAEzG;;GAEG;AACH,oBAAY,sBAAsB;IAChC;;OAEG;IACH,MAAM,WAAW;IAEjB;;OAEG;IACH,MAAM,WAAW;IAEjB;;OAEG;IACH,IAAI,SAAS;IAEb;;OAEG;IACH,EAAE,OAAO;CACV;AAED;;GAEG;AACH,oBAAY,iCAAiC;IAC3C;;OAEG;IACH,OAAO,KAAK;IAEZ;;OAEG;IACH,KAAK,UAAU;CAChB","file":"defs.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nexport { FORM_ELEMENT_COLOR_SCHEME as DATE_PICKER_INPUT_COLOR_SCHEME } from '../../globals/shared-enums';\n\n/**\n * Date picker input kinds.\n */\nexport enum DATE_PICKER_INPUT_KIND {\n  /**\n   * One for simple variant of date picker, comes without the calendar dropdown.\n   */\n  SIMPLE = 'simple',\n\n  /**\n   * One for single variant of date picker.\n   */\n  SINGLE = 'single',\n\n  /**\n   * One for the start date for the range variant.\n   */\n  FROM = 'from',\n\n  /**\n   * One for the end date for the range variant.\n   */\n  TO = 'to',\n}\n\n/**\n * Horizontal size, applicable only to the simple variant.\n */\nexport enum DATE_PICKER_INPUT_SIZE_HORIZONTAL {\n  /**\n   * Regular size.\n   */\n  REGULAR = '',\n\n  /**\n   * Short size.\n   */\n  SHORT = 'short',\n}\n"]}
+{"version":3,"sources":["components/date-picker/defs.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,yBAAyB,IAAI,8BAA8B,EAAE,MAAM,4BAA4B,CAAC;AAEzG;;GAEG;AACH,oBAAY,sBAAsB;IAChC;;OAEG;IACH,MAAM,WAAW;IAEjB;;OAEG;IACH,MAAM,WAAW;IAEjB;;OAEG;IACH,IAAI,SAAS;IAEb;;OAEG;IACH,EAAE,OAAO;CACV","file":"defs.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nexport { FORM_ELEMENT_COLOR_SCHEME as DATE_PICKER_INPUT_COLOR_SCHEME } from '../../globals/shared-enums';\n\n/**\n * Date picker input kinds.\n */\nexport enum DATE_PICKER_INPUT_KIND {\n  /**\n   * One for simple variant of date picker, comes without the calendar dropdown.\n   */\n  SIMPLE = 'simple',\n\n  /**\n   * One for single variant of date picker.\n   */\n  SINGLE = 'single',\n\n  /**\n   * One for the start date for the range variant.\n   */\n  FROM = 'from',\n\n  /**\n   * One for the end date for the range variant.\n   */\n  TO = 'to',\n}\n"]}

package/es/components/date-picker/defs.js

@@ -1,7 +1,7 @@
 /**
  * @license
  *
- * Copyright IBM Corp. 2020
+ * Copyright IBM Corp. 2020, 2023
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
@@ -13,19 +13,10 @@ export { FORM_ELEMENT_COLOR_SCHEME as DATE_PICKER_INPUT_COLOR_SCHEME } from '../
  * Date picker input kinds.
  */
 export let DATE_PICKER_INPUT_KIND;
-
-/**
- * Horizontal size, applicable only to the simple variant.
- */
 (function (DATE_PICKER_INPUT_KIND) {
   DATE_PICKER_INPUT_KIND["SIMPLE"] = "simple";
   DATE_PICKER_INPUT_KIND["SINGLE"] = "single";
   DATE_PICKER_INPUT_KIND["FROM"] = "from";
   DATE_PICKER_INPUT_KIND["TO"] = "to";
 })(DATE_PICKER_INPUT_KIND || (DATE_PICKER_INPUT_KIND = {}));
-export let DATE_PICKER_INPUT_SIZE_HORIZONTAL;
-(function (DATE_PICKER_INPUT_SIZE_HORIZONTAL) {
-  DATE_PICKER_INPUT_SIZE_HORIZONTAL["REGULAR"] = "";
-  DATE_PICKER_INPUT_SIZE_HORIZONTAL["SHORT"] = "short";
-})(DATE_PICKER_INPUT_SIZE_HORIZONTAL || (DATE_PICKER_INPUT_SIZE_HORIZONTAL = {}));
 //# sourceMappingURL=defs.js.map

package/es/components/date-picker/defs.js.map

@@ -1 +1 @@
-{"version":3,"file":"defs.js","names":["FORM_ELEMENT_COLOR_SCHEME","DATE_PICKER_INPUT_COLOR_SCHEME","DATE_PICKER_INPUT_KIND","DATE_PICKER_INPUT_SIZE_HORIZONTAL"],"sources":["components/date-picker/defs.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nexport { FORM_ELEMENT_COLOR_SCHEME as DATE_PICKER_INPUT_COLOR_SCHEME } from '../../globals/shared-enums';\n\n/**\n * Date picker input kinds.\n */\nexport enum DATE_PICKER_INPUT_KIND {\n  /**\n   * One for simple variant of date picker, comes without the calendar dropdown.\n   */\n  SIMPLE = 'simple',\n\n  /**\n   * One for single variant of date picker.\n   */\n  SINGLE = 'single',\n\n  /**\n   * One for the start date for the range variant.\n   */\n  FROM = 'from',\n\n  /**\n   * One for the end date for the range variant.\n   */\n  TO = 'to',\n}\n\n/**\n * Horizontal size, applicable only to the simple variant.\n */\nexport enum DATE_PICKER_INPUT_SIZE_HORIZONTAL {\n  /**\n   * Regular size.\n   */\n  REGULAR = '',\n\n  /**\n   * Short size.\n   */\n  SHORT = 'short',\n}\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,yBAAyB,IAAIC,8BAA8B,QAAQ,4BAA4B;;AAExG;AACA;AACA;AACA,WAAYC,sBAAsB;;AAsBlC;AACA;AACA;AAFA,WAtBYA,sBAAsB;EAAtBA,sBAAsB;EAAtBA,sBAAsB;EAAtBA,sBAAsB;EAAtBA,sBAAsB;AAAA,GAAtBA,sBAAsB,KAAtBA,sBAAsB;AAyBlC,WAAYC,iCAAiC;AAU5C,WAVWA,iCAAiC;EAAjCA,iCAAiC;EAAjCA,iCAAiC;AAAA,GAAjCA,iCAAiC,KAAjCA,iCAAiC"}
+{"version":3,"file":"defs.js","names":["FORM_ELEMENT_COLOR_SCHEME","DATE_PICKER_INPUT_COLOR_SCHEME","DATE_PICKER_INPUT_KIND"],"sources":["components/date-picker/defs.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nexport { FORM_ELEMENT_COLOR_SCHEME as DATE_PICKER_INPUT_COLOR_SCHEME } from '../../globals/shared-enums';\n\n/**\n * Date picker input kinds.\n */\nexport enum DATE_PICKER_INPUT_KIND {\n  /**\n   * One for simple variant of date picker, comes without the calendar dropdown.\n   */\n  SIMPLE = 'simple',\n\n  /**\n   * One for single variant of date picker.\n   */\n  SINGLE = 'single',\n\n  /**\n   * One for the start date for the range variant.\n   */\n  FROM = 'from',\n\n  /**\n   * One for the end date for the range variant.\n   */\n  TO = 'to',\n}\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,yBAAyB,IAAIC,8BAA8B,QAAQ,4BAA4B;;AAExG;AACA;AACA;AACA,WAAYC,sBAAsB;AAoBjC,WApBWA,sBAAsB;EAAtBA,sBAAsB;EAAtBA,sBAAsB;EAAtBA,sBAAsB;EAAtBA,sBAAsB;AAAA,GAAtBA,sBAAsB,KAAtBA,sBAAsB"}

package/es/components/date-picker/fix-events-plugin.d.ts

@@ -1,7 +1,7 @@
 /**
  * @license
  *
- * Copyright IBM Corp. 2019, 2022
+ * Copyright IBM Corp. 2019, 2023
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
@@ -9,7 +9,7 @@
 import { Instance as FlatpickrInstance } from 'flatpickr/dist/types/instance';
 import { Plugin } from 'flatpickr/dist/types/options';
 import Handle from '../../globals/internal/handle';
-import BXDatePickerInput from './date-picker-input';
+import CDSDatePickerInput from './date-picker-input';
 /**
  * The configuration for the Flatpickr plugin to fix Flatpickr's behavior of certain events.
  */
@@ -17,11 +17,11 @@ export interface DatePickerFixEventsPluginConfig {
     /**
      * The input box to enter starting date.
      */
-    inputFrom: BXDatePickerInput;
+    inputFrom: CDSDatePickerInput;
     /**
      * The input box to enter end date.
      */
-    inputTo?: BXDatePickerInput;
+    inputTo?: CDSDatePickerInput;
 }
 /**
  * `FlatpickrInstance` with additional properties used for `carbonFlatpickrFixEventsPlugin`.
@@ -30,11 +30,11 @@ export interface ExtendedFlatpickrInstanceFixEventsPlugin extends FlatpickrInsta
     /**
      * The handle for `keydown` event handler in the `<input>` for the starting date.
      */
-    _hBXCEDatePickerFixEventsPluginKeydownFrom?: Handle | null;
+    _hCDSCEDatePickerFixEventsPluginKeydownFrom?: Handle | null;
     /**
      * The handle for `keydown` event handler in the `<input>` for the end date.
      */
-    _hBXCEDatePickerFixEventsPluginKeydownTo?: Handle | null;
+    _hCDSCEDatePickerFixEventsPluginKeydownTo?: Handle | null;
 }
 /**
  * @param config Plugin configuration.

package/es/components/date-picker/fix-events-plugin.d.ts.map

@@ -1 +1 @@
-{"version":3,"sources":["components/date-picker/fix-events-plugin.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,QAAQ,IAAI,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAC9E,OAAO,EAAE,MAAM,EAAE,MAAM,8BAA8B,CAAC;AAEtD,OAAO,MAAM,MAAM,+BAA+B,CAAC;AACnD,OAAO,iBAAiB,MAAM,qBAAqB,CAAC;AAEpD;;GAEG;AACH,MAAM,WAAW,+BAA+B;IAC9C;;OAEG;IACH,SAAS,EAAE,iBAAiB,CAAC;IAE7B;;OAEG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC;CAC7B;AAED;;GAEG;AACH,MAAM,WAAW,wCACf,SAAQ,iBAAiB;IACzB;;OAEG;IACH,0CAA0C,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAE3D;;OAEG;IACH,wCAAwC,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC1D;AAED;;;GAGG;iCACqB,+BAA+B,KAAG,MAAM;AAAhE,wBAkFI","file":"fix-events-plugin.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2022\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Instance as FlatpickrInstance } from 'flatpickr/dist/types/instance';\nimport { Plugin } from 'flatpickr/dist/types/options';\nimport on from 'carbon-components/es/globals/js/misc/on';\nimport Handle from '../../globals/internal/handle';\nimport BXDatePickerInput from './date-picker-input';\n\n/**\n * The configuration for the Flatpickr plugin to fix Flatpickr's behavior of certain events.\n */\nexport interface DatePickerFixEventsPluginConfig {\n  /**\n   * The input box to enter starting date.\n   */\n  inputFrom: BXDatePickerInput;\n\n  /**\n   * The input box to enter end date.\n   */\n  inputTo?: BXDatePickerInput;\n}\n\n/**\n * `FlatpickrInstance` with additional properties used for `carbonFlatpickrFixEventsPlugin`.\n */\nexport interface ExtendedFlatpickrInstanceFixEventsPlugin\n  extends FlatpickrInstance {\n  /**\n   * The handle for `keydown` event handler in the `<input>` for the starting date.\n   */\n  _hBXCEDatePickerFixEventsPluginKeydownFrom?: Handle | null;\n\n  /**\n   * The handle for `keydown` event handler in the `<input>` for the end date.\n   */\n  _hBXCEDatePickerFixEventsPluginKeydownTo?: Handle | null;\n}\n\n/**\n * @param config Plugin configuration.\n * @returns A Flatpickr plugin to fix Flatpickr's behavior of certain events.\n */\nexport default (config: DatePickerFixEventsPluginConfig): Plugin =>\n  (fp: ExtendedFlatpickrInstanceFixEventsPlugin) => {\n    /**\n     * Handles `keydown` event.\n     */\n    const handleKeydown = (event: KeyboardEvent) => {\n      const { inputFrom, inputTo } = config;\n      const { key, target } = event;\n      if (inputFrom === target || inputTo === target) {\n        switch (key) {\n          case 'Enter':\n            // Makes sure the hitting enter key picks up pending values of both `<input>`\n            // Workaround for: https://github.com/flatpickr/flatpickr/issues/1942\n            fp.setDate(\n              [inputFrom.value!, (inputTo && inputTo.value)!],\n              true,\n              fp.config.dateFormat\n            );\n            event.stopPropagation();\n            break;\n          case 'ArrowLeft':\n          case 'Left':\n          case 'ArrowRight':\n          case 'Right':\n            // Prevents Flatpickr code from canceling the event if left/right arrow keys are hit on `<input>`,\n            // so user can move the keyboard cursor for editing dates\n            // Workaround for: https://github.com/flatpickr/flatpickr/issues/1943\n            event.stopPropagation();\n            break;\n          default:\n            break;\n        }\n      }\n    };\n\n    /**\n     * Releases event listeners used in this Flatpickr plugin.\n     */\n    const release = () => {\n      if (fp._hBXCEDatePickerFixEventsPluginKeydownTo) {\n        fp._hBXCEDatePickerFixEventsPluginKeydownTo =\n          fp._hBXCEDatePickerFixEventsPluginKeydownTo.release();\n      }\n      if (fp._hBXCEDatePickerFixEventsPluginKeydownFrom) {\n        fp._hBXCEDatePickerFixEventsPluginKeydownFrom =\n          fp._hBXCEDatePickerFixEventsPluginKeydownFrom.release();\n      }\n    };\n\n    /**\n     * Sets up event listeners used for this Flatpickr plugin.\n     */\n    const init = () => {\n      release();\n      const { inputFrom, inputTo } = config;\n      fp._hBXCEDatePickerFixEventsPluginKeydownFrom = on(\n        inputFrom,\n        'keydown',\n        handleKeydown,\n        true\n      );\n      if (inputTo) {\n        fp._hBXCEDatePickerFixEventsPluginKeydownTo = on(\n          inputTo,\n          'keydown',\n          handleKeydown,\n          true\n        );\n      }\n    };\n\n    /**\n     * Registers this Flatpickr plugin.\n     */\n    const register = () => {\n      fp.loadedPlugins.push('carbonFlatpickrFixEventsPlugin');\n    };\n\n    return {\n      onReady: [register, init],\n      onDestroy: [release],\n    };\n  };\n"]}
+{"version":3,"sources":["components/date-picker/fix-events-plugin.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,QAAQ,IAAI,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAC9E,OAAO,EAAE,MAAM,EAAE,MAAM,8BAA8B,CAAC;AAEtD,OAAO,MAAM,MAAM,+BAA+B,CAAC;AACnD,OAAO,kBAAkB,MAAM,qBAAqB,CAAC;AAErD;;GAEG;AACH,MAAM,WAAW,+BAA+B;IAC9C;;OAEG;IACH,SAAS,EAAE,kBAAkB,CAAC;IAE9B;;OAEG;IACH,OAAO,CAAC,EAAE,kBAAkB,CAAC;CAC9B;AAED;;GAEG;AACH,MAAM,WAAW,wCACf,SAAQ,iBAAiB;IACzB;;OAEG;IACH,2CAA2C,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAE5D;;OAEG;IACH,yCAAyC,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC3D;AAED;;;GAGG;iCACqB,+BAA+B,KAAG,MAAM;AAAhE,wBAkFI","file":"fix-events-plugin.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Instance as FlatpickrInstance } from 'flatpickr/dist/types/instance';\nimport { Plugin } from 'flatpickr/dist/types/options';\nimport on from '../../globals/mixins/on';\nimport Handle from '../../globals/internal/handle';\nimport CDSDatePickerInput from './date-picker-input';\n\n/**\n * The configuration for the Flatpickr plugin to fix Flatpickr's behavior of certain events.\n */\nexport interface DatePickerFixEventsPluginConfig {\n  /**\n   * The input box to enter starting date.\n   */\n  inputFrom: CDSDatePickerInput;\n\n  /**\n   * The input box to enter end date.\n   */\n  inputTo?: CDSDatePickerInput;\n}\n\n/**\n * `FlatpickrInstance` with additional properties used for `carbonFlatpickrFixEventsPlugin`.\n */\nexport interface ExtendedFlatpickrInstanceFixEventsPlugin\n  extends FlatpickrInstance {\n  /**\n   * The handle for `keydown` event handler in the `<input>` for the starting date.\n   */\n  _hCDSCEDatePickerFixEventsPluginKeydownFrom?: Handle | null;\n\n  /**\n   * The handle for `keydown` event handler in the `<input>` for the end date.\n   */\n  _hCDSCEDatePickerFixEventsPluginKeydownTo?: Handle | null;\n}\n\n/**\n * @param config Plugin configuration.\n * @returns A Flatpickr plugin to fix Flatpickr's behavior of certain events.\n */\nexport default (config: DatePickerFixEventsPluginConfig): Plugin =>\n  (fp: ExtendedFlatpickrInstanceFixEventsPlugin) => {\n    /**\n     * Handles `keydown` event.\n     */\n    const handleKeydown = (event: KeyboardEvent) => {\n      const { inputFrom, inputTo } = config;\n      const { key, target } = event;\n      if (inputFrom === target || inputTo === target) {\n        switch (key) {\n          case 'Enter':\n            // Makes sure the hitting enter key picks up pending values of both `<input>`\n            // Workaround for: https://github.com/flatpickr/flatpickr/issues/1942\n            fp.setDate(\n              [inputFrom.value!, (inputTo && inputTo.value)!],\n              true,\n              fp.config.dateFormat\n            );\n            event.stopPropagation();\n            break;\n          case 'ArrowLeft':\n          case 'Left':\n          case 'ArrowRight':\n          case 'Right':\n            // Prevents Flatpickr code from canceling the event if left/right arrow keys are hit on `<input>`,\n            // so user can move the keyboard cursor for editing dates\n            // Workaround for: https://github.com/flatpickr/flatpickr/issues/1943\n            event.stopPropagation();\n            break;\n          default:\n            break;\n        }\n      }\n    };\n\n    /**\n     * Releases event listeners used in this Flatpickr plugin.\n     */\n    const release = () => {\n      if (fp._hCDSCEDatePickerFixEventsPluginKeydownTo) {\n        fp._hCDSCEDatePickerFixEventsPluginKeydownTo =\n          fp._hCDSCEDatePickerFixEventsPluginKeydownTo.release();\n      }\n      if (fp._hCDSCEDatePickerFixEventsPluginKeydownFrom) {\n        fp._hCDSCEDatePickerFixEventsPluginKeydownFrom =\n          fp._hCDSCEDatePickerFixEventsPluginKeydownFrom.release();\n      }\n    };\n\n    /**\n     * Sets up event listeners used for this Flatpickr plugin.\n     */\n    const init = () => {\n      release();\n      const { inputFrom, inputTo } = config;\n      fp._hCDSCEDatePickerFixEventsPluginKeydownFrom = on(\n        inputFrom,\n        'keydown',\n        handleKeydown,\n        true\n      );\n      if (inputTo) {\n        fp._hCDSCEDatePickerFixEventsPluginKeydownTo = on(\n          inputTo,\n          'keydown',\n          handleKeydown,\n          true\n        );\n      }\n    };\n\n    /**\n     * Registers this Flatpickr plugin.\n     */\n    const register = () => {\n      fp.loadedPlugins.push('carbonFlatpickrFixEventsPlugin');\n    };\n\n    return {\n      onReady: [register, init],\n      onDestroy: [release],\n    };\n  };\n"]}

package/es/components/date-picker/fix-events-plugin.js

@@ -1,13 +1,13 @@
 /**
  * @license
  *
- * Copyright IBM Corp. 2019, 2022
+ * Copyright IBM Corp. 2019, 2023
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
 
-import on from 'carbon-components/es/globals/js/misc/on';
+import on from '../../globals/mixins/on';
 /**
  * @param config Plugin configuration.
  * @returns A Flatpickr plugin to fix Flatpickr's behavior of certain events.
@@ -52,11 +52,11 @@ export default (config => fp => {
    * Releases event listeners used in this Flatpickr plugin.
    */
   const release = () => {
-    if (fp._hBXCEDatePickerFixEventsPluginKeydownTo) {
-      fp._hBXCEDatePickerFixEventsPluginKeydownTo = fp._hBXCEDatePickerFixEventsPluginKeydownTo.release();
+    if (fp._hCDSCEDatePickerFixEventsPluginKeydownTo) {
+      fp._hCDSCEDatePickerFixEventsPluginKeydownTo = fp._hCDSCEDatePickerFixEventsPluginKeydownTo.release();
     }
-    if (fp._hBXCEDatePickerFixEventsPluginKeydownFrom) {
-      fp._hBXCEDatePickerFixEventsPluginKeydownFrom = fp._hBXCEDatePickerFixEventsPluginKeydownFrom.release();
+    if (fp._hCDSCEDatePickerFixEventsPluginKeydownFrom) {
+      fp._hCDSCEDatePickerFixEventsPluginKeydownFrom = fp._hCDSCEDatePickerFixEventsPluginKeydownFrom.release();
     }
   };
 
@@ -69,9 +69,9 @@ export default (config => fp => {
       inputFrom,
       inputTo
     } = config;
-    fp._hBXCEDatePickerFixEventsPluginKeydownFrom = on(inputFrom, 'keydown', handleKeydown, true);
+    fp._hCDSCEDatePickerFixEventsPluginKeydownFrom = on(inputFrom, 'keydown', handleKeydown, true);
     if (inputTo) {
-      fp._hBXCEDatePickerFixEventsPluginKeydownTo = on(inputTo, 'keydown', handleKeydown, true);
+      fp._hCDSCEDatePickerFixEventsPluginKeydownTo = on(inputTo, 'keydown', handleKeydown, true);
     }
   };
 

package/es/components/date-picker/fix-events-plugin.js.map

@@ -1 +1 @@
-{"version":3,"file":"fix-events-plugin.js","names":["on","config","fp","handleKeydown","event","inputFrom","inputTo","key","target","setDate","value","dateFormat","stopPropagation","release","_hBXCEDatePickerFixEventsPluginKeydownTo","_hBXCEDatePickerFixEventsPluginKeydownFrom","init","register","loadedPlugins","push","onReady","onDestroy"],"sources":["components/date-picker/fix-events-plugin.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2022\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Instance as FlatpickrInstance } from 'flatpickr/dist/types/instance';\nimport { Plugin } from 'flatpickr/dist/types/options';\nimport on from 'carbon-components/es/globals/js/misc/on';\nimport Handle from '../../globals/internal/handle';\nimport BXDatePickerInput from './date-picker-input';\n\n/**\n * The configuration for the Flatpickr plugin to fix Flatpickr's behavior of certain events.\n */\nexport interface DatePickerFixEventsPluginConfig {\n  /**\n   * The input box to enter starting date.\n   */\n  inputFrom: BXDatePickerInput;\n\n  /**\n   * The input box to enter end date.\n   */\n  inputTo?: BXDatePickerInput;\n}\n\n/**\n * `FlatpickrInstance` with additional properties used for `carbonFlatpickrFixEventsPlugin`.\n */\nexport interface ExtendedFlatpickrInstanceFixEventsPlugin\n  extends FlatpickrInstance {\n  /**\n   * The handle for `keydown` event handler in the `<input>` for the starting date.\n   */\n  _hBXCEDatePickerFixEventsPluginKeydownFrom?: Handle | null;\n\n  /**\n   * The handle for `keydown` event handler in the `<input>` for the end date.\n   */\n  _hBXCEDatePickerFixEventsPluginKeydownTo?: Handle | null;\n}\n\n/**\n * @param config Plugin configuration.\n * @returns A Flatpickr plugin to fix Flatpickr's behavior of certain events.\n */\nexport default (config: DatePickerFixEventsPluginConfig): Plugin =>\n  (fp: ExtendedFlatpickrInstanceFixEventsPlugin) => {\n    /**\n     * Handles `keydown` event.\n     */\n    const handleKeydown = (event: KeyboardEvent) => {\n      const { inputFrom, inputTo } = config;\n      const { key, target } = event;\n      if (inputFrom === target || inputTo === target) {\n        switch (key) {\n          case 'Enter':\n            // Makes sure the hitting enter key picks up pending values of both `<input>`\n            // Workaround for: https://github.com/flatpickr/flatpickr/issues/1942\n            fp.setDate(\n              [inputFrom.value!, (inputTo && inputTo.value)!],\n              true,\n              fp.config.dateFormat\n            );\n            event.stopPropagation();\n            break;\n          case 'ArrowLeft':\n          case 'Left':\n          case 'ArrowRight':\n          case 'Right':\n            // Prevents Flatpickr code from canceling the event if left/right arrow keys are hit on `<input>`,\n            // so user can move the keyboard cursor for editing dates\n            // Workaround for: https://github.com/flatpickr/flatpickr/issues/1943\n            event.stopPropagation();\n            break;\n          default:\n            break;\n        }\n      }\n    };\n\n    /**\n     * Releases event listeners used in this Flatpickr plugin.\n     */\n    const release = () => {\n      if (fp._hBXCEDatePickerFixEventsPluginKeydownTo) {\n        fp._hBXCEDatePickerFixEventsPluginKeydownTo =\n          fp._hBXCEDatePickerFixEventsPluginKeydownTo.release();\n      }\n      if (fp._hBXCEDatePickerFixEventsPluginKeydownFrom) {\n        fp._hBXCEDatePickerFixEventsPluginKeydownFrom =\n          fp._hBXCEDatePickerFixEventsPluginKeydownFrom.release();\n      }\n    };\n\n    /**\n     * Sets up event listeners used for this Flatpickr plugin.\n     */\n    const init = () => {\n      release();\n      const { inputFrom, inputTo } = config;\n      fp._hBXCEDatePickerFixEventsPluginKeydownFrom = on(\n        inputFrom,\n        'keydown',\n        handleKeydown,\n        true\n      );\n      if (inputTo) {\n        fp._hBXCEDatePickerFixEventsPluginKeydownTo = on(\n          inputTo,\n          'keydown',\n          handleKeydown,\n          true\n        );\n      }\n    };\n\n    /**\n     * Registers this Flatpickr plugin.\n     */\n    const register = () => {\n      fp.loadedPlugins.push('carbonFlatpickrFixEventsPlugin');\n    };\n\n    return {\n      onReady: [register, init],\n      onDestroy: [release],\n    };\n  };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAIA,OAAOA,EAAE,MAAM,yCAAyC;AAmCxD;AACA;AACA;AACA;AACA,gBAAgBC,MAAuC,IACpDC,EAA4C,IAAK;EAChD;AACJ;AACA;EACI,MAAMC,aAAa,GAAIC,KAAoB,IAAK;IAC9C,MAAM;MAAEC,SAAS;MAAEC;IAAQ,CAAC,GAAGL,MAAM;IACrC,MAAM;MAAEM,GAAG;MAAEC;IAAO,CAAC,GAAGJ,KAAK;IAC7B,IAAIC,SAAS,KAAKG,MAAM,IAAIF,OAAO,KAAKE,MAAM,EAAE;MAC9C,QAAQD,GAAG;QACT,KAAK,OAAO;UACV;UACA;UACAL,EAAE,CAACO,OAAO,CACR,CAACJ,SAAS,CAACK,KAAK,EAAIJ,OAAO,IAAIA,OAAO,CAACI,KAAK,CAAG,EAC/C,IAAI,EACJR,EAAE,CAACD,MAAM,CAACU,UAAU,CACrB;UACDP,KAAK,CAACQ,eAAe,EAAE;UACvB;QACF,KAAK,WAAW;QAChB,KAAK,MAAM;QACX,KAAK,YAAY;QACjB,KAAK,OAAO;UACV;UACA;UACA;UACAR,KAAK,CAACQ,eAAe,EAAE;UACvB;QACF;UACE;MAAM;IAEZ;EACF,CAAC;;EAED;AACJ;AACA;EACI,MAAMC,OAAO,GAAGA,CAAA,KAAM;IACpB,IAAIX,EAAE,CAACY,wCAAwC,EAAE;MAC/CZ,EAAE,CAACY,wCAAwC,GACzCZ,EAAE,CAACY,wCAAwC,CAACD,OAAO,EAAE;IACzD;IACA,IAAIX,EAAE,CAACa,0CAA0C,EAAE;MACjDb,EAAE,CAACa,0CAA0C,GAC3Cb,EAAE,CAACa,0CAA0C,CAACF,OAAO,EAAE;IAC3D;EACF,CAAC;;EAED;AACJ;AACA;EACI,MAAMG,IAAI,GAAGA,CAAA,KAAM;IACjBH,OAAO,EAAE;IACT,MAAM;MAAER,SAAS;MAAEC;IAAQ,CAAC,GAAGL,MAAM;IACrCC,EAAE,CAACa,0CAA0C,GAAGf,EAAE,CAChDK,SAAS,EACT,SAAS,EACTF,aAAa,EACb,IAAI,CACL;IACD,IAAIG,OAAO,EAAE;MACXJ,EAAE,CAACY,wCAAwC,GAAGd,EAAE,CAC9CM,OAAO,EACP,SAAS,EACTH,aAAa,EACb,IAAI,CACL;IACH;EACF,CAAC;;EAED;AACJ;AACA;EACI,MAAMc,QAAQ,GAAGA,CAAA,KAAM;IACrBf,EAAE,CAACgB,aAAa,CAACC,IAAI,CAAC,gCAAgC,CAAC;EACzD,CAAC;EAED,OAAO;IACLC,OAAO,EAAE,CAACH,QAAQ,EAAED,IAAI,CAAC;IACzBK,SAAS,EAAE,CAACR,OAAO;EACrB,CAAC;AACH,CAAC"}
+{"version":3,"file":"fix-events-plugin.js","names":["on","config","fp","handleKeydown","event","inputFrom","inputTo","key","target","setDate","value","dateFormat","stopPropagation","release","_hCDSCEDatePickerFixEventsPluginKeydownTo","_hCDSCEDatePickerFixEventsPluginKeydownFrom","init","register","loadedPlugins","push","onReady","onDestroy"],"sources":["components/date-picker/fix-events-plugin.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Instance as FlatpickrInstance } from 'flatpickr/dist/types/instance';\nimport { Plugin } from 'flatpickr/dist/types/options';\nimport on from '../../globals/mixins/on';\nimport Handle from '../../globals/internal/handle';\nimport CDSDatePickerInput from './date-picker-input';\n\n/**\n * The configuration for the Flatpickr plugin to fix Flatpickr's behavior of certain events.\n */\nexport interface DatePickerFixEventsPluginConfig {\n  /**\n   * The input box to enter starting date.\n   */\n  inputFrom: CDSDatePickerInput;\n\n  /**\n   * The input box to enter end date.\n   */\n  inputTo?: CDSDatePickerInput;\n}\n\n/**\n * `FlatpickrInstance` with additional properties used for `carbonFlatpickrFixEventsPlugin`.\n */\nexport interface ExtendedFlatpickrInstanceFixEventsPlugin\n  extends FlatpickrInstance {\n  /**\n   * The handle for `keydown` event handler in the `<input>` for the starting date.\n   */\n  _hCDSCEDatePickerFixEventsPluginKeydownFrom?: Handle | null;\n\n  /**\n   * The handle for `keydown` event handler in the `<input>` for the end date.\n   */\n  _hCDSCEDatePickerFixEventsPluginKeydownTo?: Handle | null;\n}\n\n/**\n * @param config Plugin configuration.\n * @returns A Flatpickr plugin to fix Flatpickr's behavior of certain events.\n */\nexport default (config: DatePickerFixEventsPluginConfig): Plugin =>\n  (fp: ExtendedFlatpickrInstanceFixEventsPlugin) => {\n    /**\n     * Handles `keydown` event.\n     */\n    const handleKeydown = (event: KeyboardEvent) => {\n      const { inputFrom, inputTo } = config;\n      const { key, target } = event;\n      if (inputFrom === target || inputTo === target) {\n        switch (key) {\n          case 'Enter':\n            // Makes sure the hitting enter key picks up pending values of both `<input>`\n            // Workaround for: https://github.com/flatpickr/flatpickr/issues/1942\n            fp.setDate(\n              [inputFrom.value!, (inputTo && inputTo.value)!],\n              true,\n              fp.config.dateFormat\n            );\n            event.stopPropagation();\n            break;\n          case 'ArrowLeft':\n          case 'Left':\n          case 'ArrowRight':\n          case 'Right':\n            // Prevents Flatpickr code from canceling the event if left/right arrow keys are hit on `<input>`,\n            // so user can move the keyboard cursor for editing dates\n            // Workaround for: https://github.com/flatpickr/flatpickr/issues/1943\n            event.stopPropagation();\n            break;\n          default:\n            break;\n        }\n      }\n    };\n\n    /**\n     * Releases event listeners used in this Flatpickr plugin.\n     */\n    const release = () => {\n      if (fp._hCDSCEDatePickerFixEventsPluginKeydownTo) {\n        fp._hCDSCEDatePickerFixEventsPluginKeydownTo =\n          fp._hCDSCEDatePickerFixEventsPluginKeydownTo.release();\n      }\n      if (fp._hCDSCEDatePickerFixEventsPluginKeydownFrom) {\n        fp._hCDSCEDatePickerFixEventsPluginKeydownFrom =\n          fp._hCDSCEDatePickerFixEventsPluginKeydownFrom.release();\n      }\n    };\n\n    /**\n     * Sets up event listeners used for this Flatpickr plugin.\n     */\n    const init = () => {\n      release();\n      const { inputFrom, inputTo } = config;\n      fp._hCDSCEDatePickerFixEventsPluginKeydownFrom = on(\n        inputFrom,\n        'keydown',\n        handleKeydown,\n        true\n      );\n      if (inputTo) {\n        fp._hCDSCEDatePickerFixEventsPluginKeydownTo = on(\n          inputTo,\n          'keydown',\n          handleKeydown,\n          true\n        );\n      }\n    };\n\n    /**\n     * Registers this Flatpickr plugin.\n     */\n    const register = () => {\n      fp.loadedPlugins.push('carbonFlatpickrFixEventsPlugin');\n    };\n\n    return {\n      onReady: [register, init],\n      onDestroy: [release],\n    };\n  };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAIA,OAAOA,EAAE,MAAM,yBAAyB;AAmCxC;AACA;AACA;AACA;AACA,gBAAgBC,MAAuC,IACpDC,EAA4C,IAAK;EAChD;AACJ;AACA;EACI,MAAMC,aAAa,GAAIC,KAAoB,IAAK;IAC9C,MAAM;MAAEC,SAAS;MAAEC;IAAQ,CAAC,GAAGL,MAAM;IACrC,MAAM;MAAEM,GAAG;MAAEC;IAAO,CAAC,GAAGJ,KAAK;IAC7B,IAAIC,SAAS,KAAKG,MAAM,IAAIF,OAAO,KAAKE,MAAM,EAAE;MAC9C,QAAQD,GAAG;QACT,KAAK,OAAO;UACV;UACA;UACAL,EAAE,CAACO,OAAO,CACR,CAACJ,SAAS,CAACK,KAAK,EAAIJ,OAAO,IAAIA,OAAO,CAACI,KAAK,CAAG,EAC/C,IAAI,EACJR,EAAE,CAACD,MAAM,CAACU,UAAU,CACrB;UACDP,KAAK,CAACQ,eAAe,EAAE;UACvB;QACF,KAAK,WAAW;QAChB,KAAK,MAAM;QACX,KAAK,YAAY;QACjB,KAAK,OAAO;UACV;UACA;UACA;UACAR,KAAK,CAACQ,eAAe,EAAE;UACvB;QACF;UACE;MAAM;IAEZ;EACF,CAAC;;EAED;AACJ;AACA;EACI,MAAMC,OAAO,GAAGA,CAAA,KAAM;IACpB,IAAIX,EAAE,CAACY,yCAAyC,EAAE;MAChDZ,EAAE,CAACY,yCAAyC,GAC1CZ,EAAE,CAACY,yCAAyC,CAACD,OAAO,EAAE;IAC1D;IACA,IAAIX,EAAE,CAACa,2CAA2C,EAAE;MAClDb,EAAE,CAACa,2CAA2C,GAC5Cb,EAAE,CAACa,2CAA2C,CAACF,OAAO,EAAE;IAC5D;EACF,CAAC;;EAED;AACJ;AACA;EACI,MAAMG,IAAI,GAAGA,CAAA,KAAM;IACjBH,OAAO,EAAE;IACT,MAAM;MAAER,SAAS;MAAEC;IAAQ,CAAC,GAAGL,MAAM;IACrCC,EAAE,CAACa,2CAA2C,GAAGf,EAAE,CACjDK,SAAS,EACT,SAAS,EACTF,aAAa,EACb,IAAI,CACL;IACD,IAAIG,OAAO,EAAE;MACXJ,EAAE,CAACY,yCAAyC,GAAGd,EAAE,CAC/CM,OAAO,EACP,SAAS,EACTH,aAAa,EACb,IAAI,CACL;IACH;EACF,CAAC;;EAED;AACJ;AACA;EACI,MAAMc,QAAQ,GAAGA,CAAA,KAAM;IACrBf,EAAE,CAACgB,aAAa,CAACC,IAAI,CAAC,gCAAgC,CAAC;EACzD,CAAC;EAED,OAAO;IACLC,OAAO,EAAE,CAACH,QAAQ,EAAED,IAAI,CAAC;IACzBK,SAAS,EAAE,CAACR,OAAO;EACrB,CAAC;AACH,CAAC"}

package/es/components/date-picker/focus-plugin.d.ts

@@ -1,7 +1,7 @@
 /**
  * @license
  *
- * Copyright IBM Corp. 2019, 2022
+ * Copyright IBM Corp. 2019, 2023
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
@@ -9,7 +9,7 @@
 import { Instance as FlatpickrInstance } from 'flatpickr/dist/types/instance';
 import { Plugin } from 'flatpickr/dist/types/options';
 import Handle from '../../globals/internal/handle';
-import BXDatePickerInput from './date-picker-input';
+import CDSDatePickerInput from './date-picker-input';
 /**
  * The configuration for the Flatpickr plugin to set CSS classes specific to this design system.
  */
@@ -17,11 +17,11 @@ export interface DatePickerFocusPluginConfig {
     /**
      * The input box to enter starting date.
      */
-    inputFrom: BXDatePickerInput;
+    inputFrom: CDSDatePickerInput;
     /**
      * The input box to enter end date.
      */
-    inputTo?: BXDatePickerInput;
+    inputTo?: CDSDatePickerInput;
 }
 /**
  * `FlatpickrInstance` with additional properties used for `carbonFlatpickrFocusPlugin`.
@@ -30,23 +30,23 @@ export interface ExtendedFlatpickrInstanceFocusPlugin extends FlatpickrInstance
     /**
      * The handle for `blur` event handler in calendar dropdown.
      */
-    _hBXCEDatePickerFocusPluginBlur?: Handle | null;
+    _hCDSCEDatePickerFocusPluginBlur?: Handle | null;
     /**
      * The handle for `keydown` event handler in the `<input>` for the starting date.
      */
-    _hBXCEDatePickerFocusPluginKeydownFrom?: Handle | null;
+    _hCDSCEDatePickerFocusPluginKeydownFrom?: Handle | null;
     /**
      * The handle for `keydown` event handler in the `<input>` for the end date.
      */
-    _hBXCEDatePickerFocusPluginKeydownTo?: Handle | null;
+    _hCDSCEDatePickerFocusPluginKeydownTo?: Handle | null;
     /**
      * The handle for `focus` event handler in the `<input>` for the starting date.
      */
-    _hBXCEDatePickerFocusPluginFocusFrom?: Handle | null;
+    _hCDSCEDatePickerFocusPluginFocusFrom?: Handle | null;
     /**
      * The handle for `focus` event handler in the `<input>` for the end date.
      */
-    _hBXCEDatePickerFocusPluginFocusTo?: Handle | null;
+    _hCDSCEDatePickerFocusPluginFocusTo?: Handle | null;
     /**
      * Lastly focused `<input>` for starting/end date.
      */

package/es/components/date-picker/focus-plugin.d.ts.map

@@ -1 +1 @@
-{"version":3,"sources":["components/date-picker/focus-plugin.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,QAAQ,IAAI,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAC9E,OAAO,EAAE,MAAM,EAAE,MAAM,8BAA8B,CAAC;AAEtD,OAAO,MAAM,MAAM,+BAA+B,CAAC;AACnD,OAAO,iBAAiB,MAAM,qBAAqB,CAAC;AAEpD;;GAEG;AACH,MAAM,WAAW,2BAA2B;IAC1C;;OAEG;IACH,SAAS,EAAE,iBAAiB,CAAC;IAE7B;;OAEG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC;CAC7B;AAED;;GAEG;AACH,MAAM,WAAW,oCACf,SAAQ,iBAAiB;IACzB;;OAEG;IACH,+BAA+B,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEhD;;OAEG;IACH,sCAAsC,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEvD;;OAEG;IACH,oCAAoC,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAErD;;OAEG;IACH,oCAAoC,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAErD;;OAEG;IACH,kCAAkC,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEnD;;OAEG;IACH,eAAe,CAAC,EAAE,gBAAgB,CAAC;CACpC;AAED;;;GAGG;iCACqB,2BAA2B,KAAG,MAAM;AAA5D,wBA+II","file":"focus-plugin.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2022\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Instance as FlatpickrInstance } from 'flatpickr/dist/types/instance';\nimport { Plugin } from 'flatpickr/dist/types/options';\nimport on from 'carbon-components/es/globals/js/misc/on';\nimport Handle from '../../globals/internal/handle';\nimport BXDatePickerInput from './date-picker-input';\n\n/**\n * The configuration for the Flatpickr plugin to set CSS classes specific to this design system.\n */\nexport interface DatePickerFocusPluginConfig {\n  /**\n   * The input box to enter starting date.\n   */\n  inputFrom: BXDatePickerInput;\n\n  /**\n   * The input box to enter end date.\n   */\n  inputTo?: BXDatePickerInput;\n}\n\n/**\n * `FlatpickrInstance` with additional properties used for `carbonFlatpickrFocusPlugin`.\n */\nexport interface ExtendedFlatpickrInstanceFocusPlugin\n  extends FlatpickrInstance {\n  /**\n   * The handle for `blur` event handler in calendar dropdown.\n   */\n  _hBXCEDatePickerFocusPluginBlur?: Handle | null;\n\n  /**\n   * The handle for `keydown` event handler in the `<input>` for the starting date.\n   */\n  _hBXCEDatePickerFocusPluginKeydownFrom?: Handle | null;\n\n  /**\n   * The handle for `keydown` event handler in the `<input>` for the end date.\n   */\n  _hBXCEDatePickerFocusPluginKeydownTo?: Handle | null;\n\n  /**\n   * The handle for `focus` event handler in the `<input>` for the starting date.\n   */\n  _hBXCEDatePickerFocusPluginFocusFrom?: Handle | null;\n\n  /**\n   * The handle for `focus` event handler in the `<input>` for the end date.\n   */\n  _hBXCEDatePickerFocusPluginFocusTo?: Handle | null;\n\n  /**\n   * Lastly focused `<input>` for starting/end date.\n   */\n  _lastFocusInput?: HTMLInputElement;\n}\n\n/**\n * @param config Plugin configuration.\n * @returns A Flatpickr plugin to manage focus to align with the UX pattern in our design system.\n */\nexport default (config: DatePickerFocusPluginConfig): Plugin =>\n  (fp: ExtendedFlatpickrInstanceFocusPlugin) => {\n    /**\n     * Focuses on calendar dropdown.\n     */\n    const focusCalendar = () => {\n      const { calendarContainer, selectedDateElem, todayDateElem } = fp;\n      (selectedDateElem || todayDateElem || calendarContainer).focus();\n    };\n\n    /**\n     * Handles `blur` event to move the focus back to the `<input>`.\n     */\n    const handleBlur = ({ target, relatedTarget }: FocusEvent) => {\n      // Obtains `beingUpdated` up-front because it'll be flushed out shortly\n      const { calendarContainer, isOpen } = fp;\n      if (\n        isOpen &&\n        calendarContainer.contains(target as Node) &&\n        !calendarContainer.contains(relatedTarget as Node)\n      ) {\n        Promise.resolve().then(() => {\n          const rootNode = (target as Node).getRootNode();\n          // This `blur` event handler can be called from Flatpickr's code cleaning up calenar dropdown's DOM,\n          // and changing focus in such condition causes removing an orphaned DOM node,\n          // because Flatpickr redraws the calendar dropdown when the `<input>` gets focus.\n          if (\n            rootNode.nodeType === Node.DOCUMENT_NODE ||\n            rootNode.nodeType === Node.DOCUMENT_FRAGMENT_NODE\n          ) {\n            if (fp._lastFocusInput === config.inputTo) {\n              config.inputTo!.focus();\n            } else {\n              config.inputFrom.focus();\n            }\n            // Closing after moving focus. Reversing the order will cause re-opening calendar dropdown upon focusing\n            fp.close();\n          }\n        });\n      }\n    };\n\n    /**\n     * Handles `keydown` event to move focus on calendar dropdown.\n     */\n    const handleInputKeydown = (event: KeyboardEvent) => {\n      const { key } = event;\n      if (key === 'ArrowDown' || key === 'Down' || key === 'Enter') {\n        event.preventDefault();\n        fp.open();\n        if (key !== 'Enter') {\n          focusCalendar();\n        } else {\n          // Hitting Enter key blurs the `<input>`, causing any element to lose focus\n          setTimeout(focusCalendar, 0);\n        }\n      }\n    };\n\n    /**\n     * Handles `focus` event on `<input>` for starting/end date to track the lastly focused one.\n     */\n    const handleInputFocus = ({ target }: FocusEvent) => {\n      fp._lastFocusInput = target as HTMLInputElement;\n    };\n\n    /**\n     * Releases event listeners used in this Flatpickr plugin.\n     */\n    const release = () => {\n      if (fp._hBXCEDatePickerFocusPluginBlur) {\n        fp._hBXCEDatePickerFocusPluginBlur =\n          fp._hBXCEDatePickerFocusPluginBlur.release();\n      }\n      if (fp._hBXCEDatePickerFocusPluginFocusTo) {\n        fp._hBXCEDatePickerFocusPluginFocusTo =\n          fp._hBXCEDatePickerFocusPluginFocusTo.release();\n      }\n      if (fp._hBXCEDatePickerFocusPluginFocusFrom) {\n        fp._hBXCEDatePickerFocusPluginFocusFrom =\n          fp._hBXCEDatePickerFocusPluginFocusFrom.release();\n      }\n      if (fp._hBXCEDatePickerFocusPluginKeydownTo) {\n        fp._hBXCEDatePickerFocusPluginKeydownTo =\n          fp._hBXCEDatePickerFocusPluginKeydownTo.release();\n      }\n      if (fp._hBXCEDatePickerFocusPluginKeydownFrom) {\n        fp._hBXCEDatePickerFocusPluginKeydownFrom =\n          fp._hBXCEDatePickerFocusPluginKeydownFrom.release();\n      }\n    };\n\n    /**\n     * Sets up event listeners used for this Flatpickr plugin.\n     */\n    const init = () => {\n      release();\n      const { inputFrom, inputTo } = config;\n      fp._hBXCEDatePickerFocusPluginBlur = on(\n        fp.calendarContainer,\n        'blur',\n        handleBlur,\n        true\n      );\n      fp._hBXCEDatePickerFocusPluginKeydownFrom = on(\n        inputFrom,\n        'keydown',\n        handleInputKeydown\n      );\n      if (inputTo) {\n        fp._hBXCEDatePickerFocusPluginKeydownTo = on(\n          inputTo,\n          'keydown',\n          handleInputKeydown\n        );\n      }\n      fp._hBXCEDatePickerFocusPluginFocusFrom = on(\n        inputFrom,\n        'focus',\n        handleInputFocus\n      );\n      if (inputTo) {\n        fp._hBXCEDatePickerFocusPluginFocusTo = on(\n          inputTo,\n          'focus',\n          handleInputFocus\n        );\n      }\n    };\n\n    /**\n     * Registers this Flatpickr plugin.\n     *\n     * @param calendar The Flatpickr instance.\n     */\n    const register = () => {\n      fp.loadedPlugins.push('carbonFlatpickrFocusPlugin');\n    };\n\n    return {\n      onReady: [register, init],\n      onDestroy: release,\n    };\n  };\n"]}
+{"version":3,"sources":["components/date-picker/focus-plugin.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,QAAQ,IAAI,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAC9E,OAAO,EAAE,MAAM,EAAE,MAAM,8BAA8B,CAAC;AAEtD,OAAO,MAAM,MAAM,+BAA+B,CAAC;AACnD,OAAO,kBAAkB,MAAM,qBAAqB,CAAC;AAErD;;GAEG;AACH,MAAM,WAAW,2BAA2B;IAC1C;;OAEG;IACH,SAAS,EAAE,kBAAkB,CAAC;IAE9B;;OAEG;IACH,OAAO,CAAC,EAAE,kBAAkB,CAAC;CAC9B;AAED;;GAEG;AACH,MAAM,WAAW,oCACf,SAAQ,iBAAiB;IACzB;;OAEG;IACH,gCAAgC,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEjD;;OAEG;IACH,uCAAuC,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAExD;;OAEG;IACH,qCAAqC,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEtD;;OAEG;IACH,qCAAqC,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEtD;;OAEG;IACH,mCAAmC,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEpD;;OAEG;IACH,eAAe,CAAC,EAAE,gBAAgB,CAAC;CACpC;AAED;;;GAGG;iCACqB,2BAA2B,KAAG,MAAM;AAA5D,wBA+II","file":"focus-plugin.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Instance as FlatpickrInstance } from 'flatpickr/dist/types/instance';\nimport { Plugin } from 'flatpickr/dist/types/options';\nimport on from '../../globals/mixins/on';\nimport Handle from '../../globals/internal/handle';\nimport CDSDatePickerInput from './date-picker-input';\n\n/**\n * The configuration for the Flatpickr plugin to set CSS classes specific to this design system.\n */\nexport interface DatePickerFocusPluginConfig {\n  /**\n   * The input box to enter starting date.\n   */\n  inputFrom: CDSDatePickerInput;\n\n  /**\n   * The input box to enter end date.\n   */\n  inputTo?: CDSDatePickerInput;\n}\n\n/**\n * `FlatpickrInstance` with additional properties used for `carbonFlatpickrFocusPlugin`.\n */\nexport interface ExtendedFlatpickrInstanceFocusPlugin\n  extends FlatpickrInstance {\n  /**\n   * The handle for `blur` event handler in calendar dropdown.\n   */\n  _hCDSCEDatePickerFocusPluginBlur?: Handle | null;\n\n  /**\n   * The handle for `keydown` event handler in the `<input>` for the starting date.\n   */\n  _hCDSCEDatePickerFocusPluginKeydownFrom?: Handle | null;\n\n  /**\n   * The handle for `keydown` event handler in the `<input>` for the end date.\n   */\n  _hCDSCEDatePickerFocusPluginKeydownTo?: Handle | null;\n\n  /**\n   * The handle for `focus` event handler in the `<input>` for the starting date.\n   */\n  _hCDSCEDatePickerFocusPluginFocusFrom?: Handle | null;\n\n  /**\n   * The handle for `focus` event handler in the `<input>` for the end date.\n   */\n  _hCDSCEDatePickerFocusPluginFocusTo?: Handle | null;\n\n  /**\n   * Lastly focused `<input>` for starting/end date.\n   */\n  _lastFocusInput?: HTMLInputElement;\n}\n\n/**\n * @param config Plugin configuration.\n * @returns A Flatpickr plugin to manage focus to align with the UX pattern in our design system.\n */\nexport default (config: DatePickerFocusPluginConfig): Plugin =>\n  (fp: ExtendedFlatpickrInstanceFocusPlugin) => {\n    /**\n     * Focuses on calendar dropdown.\n     */\n    const focusCalendar = () => {\n      const { calendarContainer, selectedDateElem, todayDateElem } = fp;\n      (selectedDateElem || todayDateElem || calendarContainer).focus();\n    };\n\n    /**\n     * Handles `blur` event to move the focus back to the `<input>`.\n     */\n    const handleBlur = ({ target, relatedTarget }: FocusEvent) => {\n      // Obtains `beingUpdated` up-front because it'll be flushed out shortly\n      const { calendarContainer, isOpen } = fp;\n      if (\n        isOpen &&\n        calendarContainer.contains(target as Node) &&\n        !calendarContainer.contains(relatedTarget as Node)\n      ) {\n        Promise.resolve().then(() => {\n          const rootNode = (target as Node).getRootNode();\n          // This `blur` event handler can be called from Flatpickr's code cleaning up calenar dropdown's DOM,\n          // and changing focus in such condition causes removing an orphaned DOM node,\n          // because Flatpickr redraws the calendar dropdown when the `<input>` gets focus.\n          if (\n            rootNode.nodeType === Node.DOCUMENT_NODE ||\n            rootNode.nodeType === Node.DOCUMENT_FRAGMENT_NODE\n          ) {\n            if (fp._lastFocusInput === config.inputTo) {\n              config.inputTo!.focus();\n            } else {\n              config.inputFrom.focus();\n            }\n            // Closing after moving focus. Reversing the order will cause re-opening calendar dropdown upon focusing\n            fp.close();\n          }\n        });\n      }\n    };\n\n    /**\n     * Handles `keydown` event to move focus on calendar dropdown.\n     */\n    const handleInputKeydown = (event: KeyboardEvent) => {\n      const { key } = event;\n      if (key === 'ArrowDown' || key === 'Down' || key === 'Enter') {\n        event.preventDefault();\n        fp.open();\n        if (key !== 'Enter') {\n          focusCalendar();\n        } else {\n          // Hitting Enter key blurs the `<input>`, causing any element to lose focus\n          setTimeout(focusCalendar, 0);\n        }\n      }\n    };\n\n    /**\n     * Handles `focus` event on `<input>` for starting/end date to track the lastly focused one.\n     */\n    const handleInputFocus = ({ target }: FocusEvent) => {\n      fp._lastFocusInput = target as HTMLInputElement;\n    };\n\n    /**\n     * Releases event listeners used in this Flatpickr plugin.\n     */\n    const release = () => {\n      if (fp._hCDSCEDatePickerFocusPluginBlur) {\n        fp._hCDSCEDatePickerFocusPluginBlur =\n          fp._hCDSCEDatePickerFocusPluginBlur.release();\n      }\n      if (fp._hCDSCEDatePickerFocusPluginFocusTo) {\n        fp._hCDSCEDatePickerFocusPluginFocusTo =\n          fp._hCDSCEDatePickerFocusPluginFocusTo.release();\n      }\n      if (fp._hCDSCEDatePickerFocusPluginFocusFrom) {\n        fp._hCDSCEDatePickerFocusPluginFocusFrom =\n          fp._hCDSCEDatePickerFocusPluginFocusFrom.release();\n      }\n      if (fp._hCDSCEDatePickerFocusPluginKeydownTo) {\n        fp._hCDSCEDatePickerFocusPluginKeydownTo =\n          fp._hCDSCEDatePickerFocusPluginKeydownTo.release();\n      }\n      if (fp._hCDSCEDatePickerFocusPluginKeydownFrom) {\n        fp._hCDSCEDatePickerFocusPluginKeydownFrom =\n          fp._hCDSCEDatePickerFocusPluginKeydownFrom.release();\n      }\n    };\n\n    /**\n     * Sets up event listeners used for this Flatpickr plugin.\n     */\n    const init = () => {\n      release();\n      const { inputFrom, inputTo } = config;\n      fp._hCDSCEDatePickerFocusPluginBlur = on(\n        fp.calendarContainer,\n        'blur',\n        handleBlur,\n        true\n      );\n      fp._hCDSCEDatePickerFocusPluginKeydownFrom = on(\n        inputFrom,\n        'keydown',\n        handleInputKeydown\n      );\n      if (inputTo) {\n        fp._hCDSCEDatePickerFocusPluginKeydownTo = on(\n          inputTo,\n          'keydown',\n          handleInputKeydown\n        );\n      }\n      fp._hCDSCEDatePickerFocusPluginFocusFrom = on(\n        inputFrom,\n        'focus',\n        handleInputFocus\n      );\n      if (inputTo) {\n        fp._hCDSCEDatePickerFocusPluginFocusTo = on(\n          inputTo,\n          'focus',\n          handleInputFocus\n        );\n      }\n    };\n\n    /**\n     * Registers this Flatpickr plugin.\n     *\n     * @param calendar The Flatpickr instance.\n     */\n    const register = () => {\n      fp.loadedPlugins.push('carbonFlatpickrFocusPlugin');\n    };\n\n    return {\n      onReady: [register, init],\n      onDestroy: release,\n    };\n  };\n"]}

package/es/components/date-picker/focus-plugin.js

@@ -1,13 +1,13 @@
 /**
  * @license
  *
- * Copyright IBM Corp. 2019, 2022
+ * Copyright IBM Corp. 2019, 2023
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
 
-import on from 'carbon-components/es/globals/js/misc/on';
+import on from '../../globals/mixins/on';
 /**
  * @param config Plugin configuration.
  * @returns A Flatpickr plugin to manage focus to align with the UX pattern in our design system.
@@ -88,20 +88,20 @@ export default (config => fp => {
    * Releases event listeners used in this Flatpickr plugin.
    */
   const release = () => {
-    if (fp._hBXCEDatePickerFocusPluginBlur) {
-      fp._hBXCEDatePickerFocusPluginBlur = fp._hBXCEDatePickerFocusPluginBlur.release();
+    if (fp._hCDSCEDatePickerFocusPluginBlur) {
+      fp._hCDSCEDatePickerFocusPluginBlur = fp._hCDSCEDatePickerFocusPluginBlur.release();
     }
-    if (fp._hBXCEDatePickerFocusPluginFocusTo) {
-      fp._hBXCEDatePickerFocusPluginFocusTo = fp._hBXCEDatePickerFocusPluginFocusTo.release();
+    if (fp._hCDSCEDatePickerFocusPluginFocusTo) {
+      fp._hCDSCEDatePickerFocusPluginFocusTo = fp._hCDSCEDatePickerFocusPluginFocusTo.release();
     }
-    if (fp._hBXCEDatePickerFocusPluginFocusFrom) {
-      fp._hBXCEDatePickerFocusPluginFocusFrom = fp._hBXCEDatePickerFocusPluginFocusFrom.release();
+    if (fp._hCDSCEDatePickerFocusPluginFocusFrom) {
+      fp._hCDSCEDatePickerFocusPluginFocusFrom = fp._hCDSCEDatePickerFocusPluginFocusFrom.release();
     }
-    if (fp._hBXCEDatePickerFocusPluginKeydownTo) {
-      fp._hBXCEDatePickerFocusPluginKeydownTo = fp._hBXCEDatePickerFocusPluginKeydownTo.release();
+    if (fp._hCDSCEDatePickerFocusPluginKeydownTo) {
+      fp._hCDSCEDatePickerFocusPluginKeydownTo = fp._hCDSCEDatePickerFocusPluginKeydownTo.release();
     }
-    if (fp._hBXCEDatePickerFocusPluginKeydownFrom) {
-      fp._hBXCEDatePickerFocusPluginKeydownFrom = fp._hBXCEDatePickerFocusPluginKeydownFrom.release();
+    if (fp._hCDSCEDatePickerFocusPluginKeydownFrom) {
+      fp._hCDSCEDatePickerFocusPluginKeydownFrom = fp._hCDSCEDatePickerFocusPluginKeydownFrom.release();
     }
   };
 
@@ -114,14 +114,14 @@ export default (config => fp => {
       inputFrom,
       inputTo
     } = config;
-    fp._hBXCEDatePickerFocusPluginBlur = on(fp.calendarContainer, 'blur', handleBlur, true);
-    fp._hBXCEDatePickerFocusPluginKeydownFrom = on(inputFrom, 'keydown', handleInputKeydown);
+    fp._hCDSCEDatePickerFocusPluginBlur = on(fp.calendarContainer, 'blur', handleBlur, true);
+    fp._hCDSCEDatePickerFocusPluginKeydownFrom = on(inputFrom, 'keydown', handleInputKeydown);
     if (inputTo) {
-      fp._hBXCEDatePickerFocusPluginKeydownTo = on(inputTo, 'keydown', handleInputKeydown);
+      fp._hCDSCEDatePickerFocusPluginKeydownTo = on(inputTo, 'keydown', handleInputKeydown);
     }
-    fp._hBXCEDatePickerFocusPluginFocusFrom = on(inputFrom, 'focus', handleInputFocus);
+    fp._hCDSCEDatePickerFocusPluginFocusFrom = on(inputFrom, 'focus', handleInputFocus);
     if (inputTo) {
-      fp._hBXCEDatePickerFocusPluginFocusTo = on(inputTo, 'focus', handleInputFocus);
+      fp._hCDSCEDatePickerFocusPluginFocusTo = on(inputTo, 'focus', handleInputFocus);
     }
   };
 

package/es/components/date-picker/focus-plugin.js.map

@@ -1 +1 @@
-{"version":3,"file":"focus-plugin.js","names":["on","config","fp","focusCalendar","calendarContainer","selectedDateElem","todayDateElem","focus","handleBlur","target","relatedTarget","isOpen","contains","Promise","resolve","then","rootNode","getRootNode","nodeType","Node","DOCUMENT_NODE","DOCUMENT_FRAGMENT_NODE","_lastFocusInput","inputTo","inputFrom","close","handleInputKeydown","event","key","preventDefault","open","setTimeout","handleInputFocus","release","_hBXCEDatePickerFocusPluginBlur","_hBXCEDatePickerFocusPluginFocusTo","_hBXCEDatePickerFocusPluginFocusFrom","_hBXCEDatePickerFocusPluginKeydownTo","_hBXCEDatePickerFocusPluginKeydownFrom","init","register","loadedPlugins","push","onReady","onDestroy"],"sources":["components/date-picker/focus-plugin.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2022\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Instance as FlatpickrInstance } from 'flatpickr/dist/types/instance';\nimport { Plugin } from 'flatpickr/dist/types/options';\nimport on from 'carbon-components/es/globals/js/misc/on';\nimport Handle from '../../globals/internal/handle';\nimport BXDatePickerInput from './date-picker-input';\n\n/**\n * The configuration for the Flatpickr plugin to set CSS classes specific to this design system.\n */\nexport interface DatePickerFocusPluginConfig {\n  /**\n   * The input box to enter starting date.\n   */\n  inputFrom: BXDatePickerInput;\n\n  /**\n   * The input box to enter end date.\n   */\n  inputTo?: BXDatePickerInput;\n}\n\n/**\n * `FlatpickrInstance` with additional properties used for `carbonFlatpickrFocusPlugin`.\n */\nexport interface ExtendedFlatpickrInstanceFocusPlugin\n  extends FlatpickrInstance {\n  /**\n   * The handle for `blur` event handler in calendar dropdown.\n   */\n  _hBXCEDatePickerFocusPluginBlur?: Handle | null;\n\n  /**\n   * The handle for `keydown` event handler in the `<input>` for the starting date.\n   */\n  _hBXCEDatePickerFocusPluginKeydownFrom?: Handle | null;\n\n  /**\n   * The handle for `keydown` event handler in the `<input>` for the end date.\n   */\n  _hBXCEDatePickerFocusPluginKeydownTo?: Handle | null;\n\n  /**\n   * The handle for `focus` event handler in the `<input>` for the starting date.\n   */\n  _hBXCEDatePickerFocusPluginFocusFrom?: Handle | null;\n\n  /**\n   * The handle for `focus` event handler in the `<input>` for the end date.\n   */\n  _hBXCEDatePickerFocusPluginFocusTo?: Handle | null;\n\n  /**\n   * Lastly focused `<input>` for starting/end date.\n   */\n  _lastFocusInput?: HTMLInputElement;\n}\n\n/**\n * @param config Plugin configuration.\n * @returns A Flatpickr plugin to manage focus to align with the UX pattern in our design system.\n */\nexport default (config: DatePickerFocusPluginConfig): Plugin =>\n  (fp: ExtendedFlatpickrInstanceFocusPlugin) => {\n    /**\n     * Focuses on calendar dropdown.\n     */\n    const focusCalendar = () => {\n      const { calendarContainer, selectedDateElem, todayDateElem } = fp;\n      (selectedDateElem || todayDateElem || calendarContainer).focus();\n    };\n\n    /**\n     * Handles `blur` event to move the focus back to the `<input>`.\n     */\n    const handleBlur = ({ target, relatedTarget }: FocusEvent) => {\n      // Obtains `beingUpdated` up-front because it'll be flushed out shortly\n      const { calendarContainer, isOpen } = fp;\n      if (\n        isOpen &&\n        calendarContainer.contains(target as Node) &&\n        !calendarContainer.contains(relatedTarget as Node)\n      ) {\n        Promise.resolve().then(() => {\n          const rootNode = (target as Node).getRootNode();\n          // This `blur` event handler can be called from Flatpickr's code cleaning up calenar dropdown's DOM,\n          // and changing focus in such condition causes removing an orphaned DOM node,\n          // because Flatpickr redraws the calendar dropdown when the `<input>` gets focus.\n          if (\n            rootNode.nodeType === Node.DOCUMENT_NODE ||\n            rootNode.nodeType === Node.DOCUMENT_FRAGMENT_NODE\n          ) {\n            if (fp._lastFocusInput === config.inputTo) {\n              config.inputTo!.focus();\n            } else {\n              config.inputFrom.focus();\n            }\n            // Closing after moving focus. Reversing the order will cause re-opening calendar dropdown upon focusing\n            fp.close();\n          }\n        });\n      }\n    };\n\n    /**\n     * Handles `keydown` event to move focus on calendar dropdown.\n     */\n    const handleInputKeydown = (event: KeyboardEvent) => {\n      const { key } = event;\n      if (key === 'ArrowDown' || key === 'Down' || key === 'Enter') {\n        event.preventDefault();\n        fp.open();\n        if (key !== 'Enter') {\n          focusCalendar();\n        } else {\n          // Hitting Enter key blurs the `<input>`, causing any element to lose focus\n          setTimeout(focusCalendar, 0);\n        }\n      }\n    };\n\n    /**\n     * Handles `focus` event on `<input>` for starting/end date to track the lastly focused one.\n     */\n    const handleInputFocus = ({ target }: FocusEvent) => {\n      fp._lastFocusInput = target as HTMLInputElement;\n    };\n\n    /**\n     * Releases event listeners used in this Flatpickr plugin.\n     */\n    const release = () => {\n      if (fp._hBXCEDatePickerFocusPluginBlur) {\n        fp._hBXCEDatePickerFocusPluginBlur =\n          fp._hBXCEDatePickerFocusPluginBlur.release();\n      }\n      if (fp._hBXCEDatePickerFocusPluginFocusTo) {\n        fp._hBXCEDatePickerFocusPluginFocusTo =\n          fp._hBXCEDatePickerFocusPluginFocusTo.release();\n      }\n      if (fp._hBXCEDatePickerFocusPluginFocusFrom) {\n        fp._hBXCEDatePickerFocusPluginFocusFrom =\n          fp._hBXCEDatePickerFocusPluginFocusFrom.release();\n      }\n      if (fp._hBXCEDatePickerFocusPluginKeydownTo) {\n        fp._hBXCEDatePickerFocusPluginKeydownTo =\n          fp._hBXCEDatePickerFocusPluginKeydownTo.release();\n      }\n      if (fp._hBXCEDatePickerFocusPluginKeydownFrom) {\n        fp._hBXCEDatePickerFocusPluginKeydownFrom =\n          fp._hBXCEDatePickerFocusPluginKeydownFrom.release();\n      }\n    };\n\n    /**\n     * Sets up event listeners used for this Flatpickr plugin.\n     */\n    const init = () => {\n      release();\n      const { inputFrom, inputTo } = config;\n      fp._hBXCEDatePickerFocusPluginBlur = on(\n        fp.calendarContainer,\n        'blur',\n        handleBlur,\n        true\n      );\n      fp._hBXCEDatePickerFocusPluginKeydownFrom = on(\n        inputFrom,\n        'keydown',\n        handleInputKeydown\n      );\n      if (inputTo) {\n        fp._hBXCEDatePickerFocusPluginKeydownTo = on(\n          inputTo,\n          'keydown',\n          handleInputKeydown\n        );\n      }\n      fp._hBXCEDatePickerFocusPluginFocusFrom = on(\n        inputFrom,\n        'focus',\n        handleInputFocus\n      );\n      if (inputTo) {\n        fp._hBXCEDatePickerFocusPluginFocusTo = on(\n          inputTo,\n          'focus',\n          handleInputFocus\n        );\n      }\n    };\n\n    /**\n     * Registers this Flatpickr plugin.\n     *\n     * @param calendar The Flatpickr instance.\n     */\n    const register = () => {\n      fp.loadedPlugins.push('carbonFlatpickrFocusPlugin');\n    };\n\n    return {\n      onReady: [register, init],\n      onDestroy: release,\n    };\n  };\n"],"mappings":"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"}
+{"version":3,"file":"focus-plugin.js","names":["on","config","fp","focusCalendar","calendarContainer","selectedDateElem","todayDateElem","focus","handleBlur","target","relatedTarget","isOpen","contains","Promise","resolve","then","rootNode","getRootNode","nodeType","Node","DOCUMENT_NODE","DOCUMENT_FRAGMENT_NODE","_lastFocusInput","inputTo","inputFrom","close","handleInputKeydown","event","key","preventDefault","open","setTimeout","handleInputFocus","release","_hCDSCEDatePickerFocusPluginBlur","_hCDSCEDatePickerFocusPluginFocusTo","_hCDSCEDatePickerFocusPluginFocusFrom","_hCDSCEDatePickerFocusPluginKeydownTo","_hCDSCEDatePickerFocusPluginKeydownFrom","init","register","loadedPlugins","push","onReady","onDestroy"],"sources":["components/date-picker/focus-plugin.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Instance as FlatpickrInstance } from 'flatpickr/dist/types/instance';\nimport { Plugin } from 'flatpickr/dist/types/options';\nimport on from '../../globals/mixins/on';\nimport Handle from '../../globals/internal/handle';\nimport CDSDatePickerInput from './date-picker-input';\n\n/**\n * The configuration for the Flatpickr plugin to set CSS classes specific to this design system.\n */\nexport interface DatePickerFocusPluginConfig {\n  /**\n   * The input box to enter starting date.\n   */\n  inputFrom: CDSDatePickerInput;\n\n  /**\n   * The input box to enter end date.\n   */\n  inputTo?: CDSDatePickerInput;\n}\n\n/**\n * `FlatpickrInstance` with additional properties used for `carbonFlatpickrFocusPlugin`.\n */\nexport interface ExtendedFlatpickrInstanceFocusPlugin\n  extends FlatpickrInstance {\n  /**\n   * The handle for `blur` event handler in calendar dropdown.\n   */\n  _hCDSCEDatePickerFocusPluginBlur?: Handle | null;\n\n  /**\n   * The handle for `keydown` event handler in the `<input>` for the starting date.\n   */\n  _hCDSCEDatePickerFocusPluginKeydownFrom?: Handle | null;\n\n  /**\n   * The handle for `keydown` event handler in the `<input>` for the end date.\n   */\n  _hCDSCEDatePickerFocusPluginKeydownTo?: Handle | null;\n\n  /**\n   * The handle for `focus` event handler in the `<input>` for the starting date.\n   */\n  _hCDSCEDatePickerFocusPluginFocusFrom?: Handle | null;\n\n  /**\n   * The handle for `focus` event handler in the `<input>` for the end date.\n   */\n  _hCDSCEDatePickerFocusPluginFocusTo?: Handle | null;\n\n  /**\n   * Lastly focused `<input>` for starting/end date.\n   */\n  _lastFocusInput?: HTMLInputElement;\n}\n\n/**\n * @param config Plugin configuration.\n * @returns A Flatpickr plugin to manage focus to align with the UX pattern in our design system.\n */\nexport default (config: DatePickerFocusPluginConfig): Plugin =>\n  (fp: ExtendedFlatpickrInstanceFocusPlugin) => {\n    /**\n     * Focuses on calendar dropdown.\n     */\n    const focusCalendar = () => {\n      const { calendarContainer, selectedDateElem, todayDateElem } = fp;\n      (selectedDateElem || todayDateElem || calendarContainer).focus();\n    };\n\n    /**\n     * Handles `blur` event to move the focus back to the `<input>`.\n     */\n    const handleBlur = ({ target, relatedTarget }: FocusEvent) => {\n      // Obtains `beingUpdated` up-front because it'll be flushed out shortly\n      const { calendarContainer, isOpen } = fp;\n      if (\n        isOpen &&\n        calendarContainer.contains(target as Node) &&\n        !calendarContainer.contains(relatedTarget as Node)\n      ) {\n        Promise.resolve().then(() => {\n          const rootNode = (target as Node).getRootNode();\n          // This `blur` event handler can be called from Flatpickr's code cleaning up calenar dropdown's DOM,\n          // and changing focus in such condition causes removing an orphaned DOM node,\n          // because Flatpickr redraws the calendar dropdown when the `<input>` gets focus.\n          if (\n            rootNode.nodeType === Node.DOCUMENT_NODE ||\n            rootNode.nodeType === Node.DOCUMENT_FRAGMENT_NODE\n          ) {\n            if (fp._lastFocusInput === config.inputTo) {\n              config.inputTo!.focus();\n            } else {\n              config.inputFrom.focus();\n            }\n            // Closing after moving focus. Reversing the order will cause re-opening calendar dropdown upon focusing\n            fp.close();\n          }\n        });\n      }\n    };\n\n    /**\n     * Handles `keydown` event to move focus on calendar dropdown.\n     */\n    const handleInputKeydown = (event: KeyboardEvent) => {\n      const { key } = event;\n      if (key === 'ArrowDown' || key === 'Down' || key === 'Enter') {\n        event.preventDefault();\n        fp.open();\n        if (key !== 'Enter') {\n          focusCalendar();\n        } else {\n          // Hitting Enter key blurs the `<input>`, causing any element to lose focus\n          setTimeout(focusCalendar, 0);\n        }\n      }\n    };\n\n    /**\n     * Handles `focus` event on `<input>` for starting/end date to track the lastly focused one.\n     */\n    const handleInputFocus = ({ target }: FocusEvent) => {\n      fp._lastFocusInput = target as HTMLInputElement;\n    };\n\n    /**\n     * Releases event listeners used in this Flatpickr plugin.\n     */\n    const release = () => {\n      if (fp._hCDSCEDatePickerFocusPluginBlur) {\n        fp._hCDSCEDatePickerFocusPluginBlur =\n          fp._hCDSCEDatePickerFocusPluginBlur.release();\n      }\n      if (fp._hCDSCEDatePickerFocusPluginFocusTo) {\n        fp._hCDSCEDatePickerFocusPluginFocusTo =\n          fp._hCDSCEDatePickerFocusPluginFocusTo.release();\n      }\n      if (fp._hCDSCEDatePickerFocusPluginFocusFrom) {\n        fp._hCDSCEDatePickerFocusPluginFocusFrom =\n          fp._hCDSCEDatePickerFocusPluginFocusFrom.release();\n      }\n      if (fp._hCDSCEDatePickerFocusPluginKeydownTo) {\n        fp._hCDSCEDatePickerFocusPluginKeydownTo =\n          fp._hCDSCEDatePickerFocusPluginKeydownTo.release();\n      }\n      if (fp._hCDSCEDatePickerFocusPluginKeydownFrom) {\n        fp._hCDSCEDatePickerFocusPluginKeydownFrom =\n          fp._hCDSCEDatePickerFocusPluginKeydownFrom.release();\n      }\n    };\n\n    /**\n     * Sets up event listeners used for this Flatpickr plugin.\n     */\n    const init = () => {\n      release();\n      const { inputFrom, inputTo } = config;\n      fp._hCDSCEDatePickerFocusPluginBlur = on(\n        fp.calendarContainer,\n        'blur',\n        handleBlur,\n        true\n      );\n      fp._hCDSCEDatePickerFocusPluginKeydownFrom = on(\n        inputFrom,\n        'keydown',\n        handleInputKeydown\n      );\n      if (inputTo) {\n        fp._hCDSCEDatePickerFocusPluginKeydownTo = on(\n          inputTo,\n          'keydown',\n          handleInputKeydown\n        );\n      }\n      fp._hCDSCEDatePickerFocusPluginFocusFrom = on(\n        inputFrom,\n        'focus',\n        handleInputFocus\n      );\n      if (inputTo) {\n        fp._hCDSCEDatePickerFocusPluginFocusTo = on(\n          inputTo,\n          'focus',\n          handleInputFocus\n        );\n      }\n    };\n\n    /**\n     * Registers this Flatpickr plugin.\n     *\n     * @param calendar The Flatpickr instance.\n     */\n    const register = () => {\n      fp.loadedPlugins.push('carbonFlatpickrFocusPlugin');\n    };\n\n    return {\n      onReady: [register, init],\n      onDestroy: release,\n    };\n  };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAIA,OAAOA,EAAE,MAAM,yBAAyB;AAuDxC;AACA;AACA;AACA;AACA,gBAAgBC,MAAmC,IAChDC,EAAwC,IAAK;EAC5C;AACJ;AACA;EACI,MAAMC,aAAa,GAAGA,CAAA,KAAM;IAC1B,MAAM;MAAEC,iBAAiB;MAAEC,gBAAgB;MAAEC;IAAc,CAAC,GAAGJ,EAAE;IACjE,CAACG,gBAAgB,IAAIC,aAAa,IAAIF,iBAAiB,EAAEG,KAAK,EAAE;EAClE,CAAC;;EAED;AACJ;AACA;EACI,MAAMC,UAAU,GAAGA,CAAC;IAAEC,MAAM;IAAEC;EAA0B,CAAC,KAAK;IAC5D;IACA,MAAM;MAAEN,iBAAiB;MAAEO;IAAO,CAAC,GAAGT,EAAE;IACxC,IACES,MAAM,IACNP,iBAAiB,CAACQ,QAAQ,CAACH,MAAM,CAAS,IAC1C,CAACL,iBAAiB,CAACQ,QAAQ,CAACF,aAAa,CAAS,EAClD;MACAG,OAAO,CAACC,OAAO,EAAE,CAACC,IAAI,CAAC,MAAM;QAC3B,MAAMC,QAAQ,GAAIP,MAAM,CAAUQ,WAAW,EAAE;QAC/C;QACA;QACA;QACA,IACED,QAAQ,CAACE,QAAQ,KAAKC,IAAI,CAACC,aAAa,IACxCJ,QAAQ,CAACE,QAAQ,KAAKC,IAAI,CAACE,sBAAsB,EACjD;UACA,IAAInB,EAAE,CAACoB,eAAe,KAAKrB,MAAM,CAACsB,OAAO,EAAE;YACzCtB,MAAM,CAACsB,OAAO,CAAEhB,KAAK,EAAE;UACzB,CAAC,MAAM;YACLN,MAAM,CAACuB,SAAS,CAACjB,KAAK,EAAE;UAC1B;UACA;UACAL,EAAE,CAACuB,KAAK,EAAE;QACZ;MACF,CAAC,CAAC;IACJ;EACF,CAAC;;EAED;AACJ;AACA;EACI,MAAMC,kBAAkB,GAAIC,KAAoB,IAAK;IACnD,MAAM;MAAEC;IAAI,CAAC,GAAGD,KAAK;IACrB,IAAIC,GAAG,KAAK,WAAW,IAAIA,GAAG,KAAK,MAAM,IAAIA,GAAG,KAAK,OAAO,EAAE;MAC5DD,KAAK,CAACE,cAAc,EAAE;MACtB3B,EAAE,CAAC4B,IAAI,EAAE;MACT,IAAIF,GAAG,KAAK,OAAO,EAAE;QACnBzB,aAAa,EAAE;MACjB,CAAC,MAAM;QACL;QACA4B,UAAU,CAAC5B,aAAa,EAAE,CAAC,CAAC;MAC9B;IACF;EACF,CAAC;;EAED;AACJ;AACA;EACI,MAAM6B,gBAAgB,GAAGA,CAAC;IAAEvB;EAAmB,CAAC,KAAK;IACnDP,EAAE,CAACoB,eAAe,GAAGb,MAA0B;EACjD,CAAC;;EAED;AACJ;AACA;EACI,MAAMwB,OAAO,GAAGA,CAAA,KAAM;IACpB,IAAI/B,EAAE,CAACgC,gCAAgC,EAAE;MACvChC,EAAE,CAACgC,gCAAgC,GACjChC,EAAE,CAACgC,gCAAgC,CAACD,OAAO,EAAE;IACjD;IACA,IAAI/B,EAAE,CAACiC,mCAAmC,EAAE;MAC1CjC,EAAE,CAACiC,mCAAmC,GACpCjC,EAAE,CAACiC,mCAAmC,CAACF,OAAO,EAAE;IACpD;IACA,IAAI/B,EAAE,CAACkC,qCAAqC,EAAE;MAC5ClC,EAAE,CAACkC,qCAAqC,GACtClC,EAAE,CAACkC,qCAAqC,CAACH,OAAO,EAAE;IACtD;IACA,IAAI/B,EAAE,CAACmC,qCAAqC,EAAE;MAC5CnC,EAAE,CAACmC,qCAAqC,GACtCnC,EAAE,CAACmC,qCAAqC,CAACJ,OAAO,EAAE;IACtD;IACA,IAAI/B,EAAE,CAACoC,uCAAuC,EAAE;MAC9CpC,EAAE,CAACoC,uCAAuC,GACxCpC,EAAE,CAACoC,uCAAuC,CAACL,OAAO,EAAE;IACxD;EACF,CAAC;;EAED;AACJ;AACA;EACI,MAAMM,IAAI,GAAGA,CAAA,KAAM;IACjBN,OAAO,EAAE;IACT,MAAM;MAAET,SAAS;MAAED;IAAQ,CAAC,GAAGtB,MAAM;IACrCC,EAAE,CAACgC,gCAAgC,GAAGlC,EAAE,CACtCE,EAAE,CAACE,iBAAiB,EACpB,MAAM,EACNI,UAAU,EACV,IAAI,CACL;IACDN,EAAE,CAACoC,uCAAuC,GAAGtC,EAAE,CAC7CwB,SAAS,EACT,SAAS,EACTE,kBAAkB,CACnB;IACD,IAAIH,OAAO,EAAE;MACXrB,EAAE,CAACmC,qCAAqC,GAAGrC,EAAE,CAC3CuB,OAAO,EACP,SAAS,EACTG,kBAAkB,CACnB;IACH;IACAxB,EAAE,CAACkC,qCAAqC,GAAGpC,EAAE,CAC3CwB,SAAS,EACT,OAAO,EACPQ,gBAAgB,CACjB;IACD,IAAIT,OAAO,EAAE;MACXrB,EAAE,CAACiC,mCAAmC,GAAGnC,EAAE,CACzCuB,OAAO,EACP,OAAO,EACPS,gBAAgB,CACjB;IACH;EACF,CAAC;;EAED;AACJ;AACA;AACA;AACA;EACI,MAAMQ,QAAQ,GAAGA,CAAA,KAAM;IACrBtC,EAAE,CAACuC,aAAa,CAACC,IAAI,CAAC,4BAA4B,CAAC;EACrD,CAAC;EAED,OAAO;IACLC,OAAO,EAAE,CAACH,QAAQ,EAAED,IAAI,CAAC;IACzBK,SAAS,EAAEX;EACb,CAAC;AACH,CAAC"}