@kelvininc/ui-components
Version:
Kelvin UI Components
563 lines (558 loc) • 30.8 kB
JavaScript
import { p as proxyCustomElement, H, d as createEvent, h, e as Host } from './p-D6GMjtmE.js';
import { o as EAbsoluteTimePickerMode, E as EActionButtonType } from './p-DBphUUgi.js';
import { D as DEFAULT_TIME_RANGE_DROPDOWN_POSITION_OPTIONS, T as TIME_PICKER_PORTAL_Z_INDEX, E as ETimePickerView, g as getLast24HoursRange, e as DEFAULT_SELECTED_TIME_KEY, f as getTimestampFromDateRange, i as getTimePickerEventPayload, c as createTimestampInTimezoneFromFormattedDate, h as hasRangeChanged, F as FULL_RANGE_SIZE, A as APPLY_BUTTON_ERROR_TOOLTIP_TEXT, a as buildCustomIntervalTimeRange, j as getRelativeTimeLabel, b as buildTooltipText, d as DEFAULT_TIME_RANGE_PICKER_INPUT_CONFIG, k as getAbsoluteTimePickerRangeDates, l as getRelativeTimeInputText, v as validateNewRange } from './p-8PUG6JT6.js';
import { b as ETooltipPosition, a as EComponentSize } from './p-BRgmvbuh.js';
import './p-BcMhjKoS.js';
import './p-BQDwJ0uF.js';
import { D as DEFAULT_RELATIVE_TIME_OPTIONS_GROUPS, C as CUSTOMIZE_INTERVAL_KEY } from './p-zjJfMcH8.js';
import { b as buildTimezoneByOffset, g as getTimezonesNames, c as getDefaultTimezone, e as getTimezoneOffset, a as dayjs } from './p-Ba4zaTTd.js';
import { C as CALENDAR_DATE_TIME_MASK, D as DATETIME_INPUT_MASK, c as DEFAULT_HEADER_TITLE } from './p-B-qotxf9.js';
import { d as defineCustomElement$y } from './p-DOmAqAr6.js';
import { d as defineCustomElement$x } from './p-CsQJZTqg.js';
import { d as defineCustomElement$w } from './p-C7UGguL_.js';
import { d as defineCustomElement$v } from './p-yJnlG5V9.js';
import { d as defineCustomElement$u } from './p-BOySlV0g.js';
import { d as defineCustomElement$t } from './p-CMo0NrV5.js';
import { d as defineCustomElement$s } from './p-BjCPFCkN.js';
import { d as defineCustomElement$r } from './p-BAnY2f0R.js';
import { d as defineCustomElement$q } from './p-B3cB-2yy.js';
import { d as defineCustomElement$p } from './p-BJSKhyhi.js';
import { d as defineCustomElement$o } from './p-DVrmG2A8.js';
import { d as defineCustomElement$n } from './p-z6Xl-2s2.js';
import { d as defineCustomElement$m } from './p-BYJ5hjZN.js';
import { d as defineCustomElement$l } from './p-Bu3_3dFw.js';
import { d as defineCustomElement$k } from './p-B41PGLQm.js';
import { d as defineCustomElement$j } from './p-BMp30lyC.js';
import { d as defineCustomElement$i } from './p-Bi2u2KUW.js';
import { d as defineCustomElement$h } from './p-DESwXpke.js';
import { d as defineCustomElement$g } from './p-BIWUEm1f.js';
import { d as defineCustomElement$f } from './p-DI7noh3Z.js';
import { d as defineCustomElement$e } from './p-DrAjMjwv.js';
import { d as defineCustomElement$d } from './p-6evrDshf.js';
import { d as defineCustomElement$c } from './p-pSs-P0wB.js';
import { d as defineCustomElement$b } from './p-CKO4h8cf.js';
import { d as defineCustomElement$a } from './p-BGPTa9b0.js';
import { d as defineCustomElement$9 } from './p-C97qgeMO.js';
import { d as defineCustomElement$8 } from './p-CVqlIG8a.js';
import { d as defineCustomElement$7 } from './p-oRYOf3If.js';
import { d as defineCustomElement$6 } from './p-DMity2tp.js';
import { d as defineCustomElement$5 } from './p-DYYdbkc7.js';
import { d as defineCustomElement$4 } from './p-GHnCHOez.js';
import { d as defineCustomElement$3 } from './p-BuaFqlfN.js';
import { d as defineCustomElement$2 } from './p-C8hKWhkk.js';
import { i as isEmpty } from './p-BZNGlO8m.js';
import { i as isNumber } from './p-C9bG1i86.js';
import { m as merge } from './p-DZUGWoQz.js';
const timePickerCss = "@property --rotation{syntax:\"<angle>\";initial-value:0deg;inherits:false}@keyframes rotate-border{to{--rotation:360deg}}.time-range-content{background-color:var(--kv-neutral-7, #2a2a2a);border:1px solid var(--kv-neutral-6, #3f3f3f);border-radius:4px;width:max-content}.time-range-content .content-wrapper{position:relative;display:flex;overflow:hidden;transition:all 0.3s ease-in-out}.time-range-content .content-wrapper--relative{height:347px;width:328px}.time-range-content .content-wrapper--absolute{height:377px;width:448px}.time-range-content .content-wrapper--full-view{height:347px;width:779px}.time-range-content .relative-range{position:absolute}.time-range-content .relative-range kv-relative-time-picker{--background-color:transparent}.time-range-content .relative-range--full-view{border-right:1px solid var(--kv-neutral-6, #3f3f3f)}.time-range-content .calendar-range{position:absolute;right:-448px;z-index:1;transition:all 0.3s ease-in-out;background-color:var(--kv-neutral-7, #2a2a2a);border-top-right-radius:4px;border-top-left-radius:4px}.time-range-content .calendar-range--visible{right:0}.time-range-content .calendar-range--full-view{right:0}.time-range-content kv-absolute-time-picker .absolute-time-picker-container{background-color:transparent}.footer{display:flex;justify-content:space-between;padding:var(--kv-spacing-4x, 16px);border-top:1px solid var(--kv-neutral-6, #3f3f3f)}.footer .toggle-wrapper{display:flex}.footer .show-calendar-toggle{display:flex;gap:var(--kv-spacing-2x, 8px);align-items:center}.footer .show-calendar-toggle .toggle-text{font-family:var(--kv-primary-font, \"proxima-nova\", sans-serif, \"Arial\");font-size:14px;font-weight:400;font-stretch:normal;font-style:normal;line-height:21px;letter-spacing:normal;text-transform:none;color:var(--kv-neutral-2, #e5e5e5)}.footer .actions{display:flex;gap:var(--kv-spacing-2x, 8px)}";
const KvTimePicker$1 = /*@__PURE__*/ proxyCustomElement(class KvTimePicker extends H {
constructor() {
super();
this.__registerHost();
this.timeRangeChange = createEvent(this, "timeRangeChange", 7);
this.dropdownStateChange = createEvent(this, "dropdownStateChange", 7);
this.cancelClicked = createEvent(this, "cancelClicked", 7);
this.showCalendarStateChange = createEvent(this, "showCalendarStateChange", 7);
/** @inheritdoc */
this.inputConfig = {};
/** @inheritdoc */
this.dropdownPositionOptions = DEFAULT_TIME_RANGE_DROPDOWN_POSITION_OPTIONS;
/** @inheritdoc */
this.disabled = false;
/** @inheritdoc */
this.showCalendar = false;
/** @inheritdoc */
this.relativeTimePickerOptions = DEFAULT_RELATIVE_TIME_OPTIONS_GROUPS;
/** @inheritdoc */
this.timezones = buildTimezoneByOffset(getTimezonesNames());
/** @inheritdoc */
this.disableTimezoneSelection = false;
/** @inheritdoc */
this.displayCustomizeInterval = true;
/** @inheritdoc */
this.displayTimezoneDropdown = true;
/** @inheritdoc */
this.zIndex = TIME_PICKER_PORTAL_Z_INDEX;
/** @inheritdoc */
this.tooltipPosition = ETooltipPosition.TopStart;
// Defines what content is being displayed
this.timePickerView = ETimePickerView.RelativeTimePicker;
// Dropdown open state
this.dropdownOpen = false;
// Apply button tooltip text
this.applyButtontooltipText = '';
// Defines if calendar is locked when the user is in full view and clicked customize interval
this.calendarViewLocked = false;
// Defines if the timezone dropdown is visible in the input wrapper
this.timezoneSelectionContentVisible = false;
this.internalDropdownsOpen = false;
this.resetDefaultSelectedTimeState = () => {
this.selectedTimeState = {
key: DEFAULT_SELECTED_TIME_KEY,
range: getLast24HoursRange(),
timezone: this.getSelectedTimezone()
};
};
this.getSelectedTimezone = () => {
var _a;
if (((_a = this.selectedTimeState) === null || _a === void 0 ? void 0 : _a.timezone) !== undefined) {
return this.selectedTimeState.timezone;
}
const defaultTimezone = getDefaultTimezone();
return {
name: defaultTimezone,
offset: getTimezoneOffset(defaultTimezone)
};
};
this.onDropdownChange = ({ detail: isDropdownOpen }) => {
this.dropdownOpen = isDropdownOpen;
this.dropdownStateChange.emit(isDropdownOpen);
if (!this.isApplyButtonDisabled() && !isDropdownOpen) {
if (isEmpty(this.selectedTimeOption)) {
this.resetDefaultSelectedTimeState();
}
if (this.timePickerView !== ETimePickerView.FullView) {
this.timePickerView = ETimePickerView.RelativeTimePicker;
}
}
this.timezoneSelectionContentVisible = false;
};
this.onSelectedRelativeTimeChange = ({ detail: timeOption }) => {
this.selectedTimeState = {
key: timeOption.key,
range: timeOption.range,
timezone: this.getSelectedTimezone()
};
this.calendarViewLocked = false;
};
this.onClickSeeCustomInterval = ({ detail: key }) => {
if (this.selectedTimeState && this.selectedTimeState.key !== CUSTOMIZE_INTERVAL_KEY) {
this.selectedTimeState = {
key,
range: [],
timezone: this.getSelectedTimezone()
};
}
if (!this.showCalendar) {
this.timePickerView = ETimePickerView.AbsoluteTimePicker;
}
else {
this.calendarViewLocked = true;
}
};
this.onSelectedTimezoneChange = ({ detail: timezone }) => {
var _a, _b;
const previousTimezone = this.getSelectedTimezone().name;
const range = this.selectedTimeState.key === CUSTOMIZE_INTERVAL_KEY && ((_b = (_a = this.selectedTimeState) === null || _a === void 0 ? void 0 : _a.range) === null || _b === void 0 ? void 0 : _b.length) > 0
? getTimestampFromDateRange(this.selectedTimeState.range, previousTimezone, timezone.name)
: this.selectedTimeState.range;
this.selectedTimeState = Object.assign(Object.assign({}, this.selectedTimeState), { range,
timezone });
};
this.onClickApply = () => {
const eventPayload = getTimePickerEventPayload(this.selectedTimeState, this.getSelectedTimezone());
this.timeRangeChange.emit(eventPayload);
this.dropdownStateChange.emit(false);
this.dropdownOpen = false;
this.timezoneSelectionContentVisible = false;
if (this.timePickerView !== ETimePickerView.FullView) {
this.timePickerView = ETimePickerView.RelativeTimePicker;
this.calendarViewLocked = false;
}
};
this.onClickBack = () => {
this.undoLastChanges();
this.calendarViewLocked = false;
};
this.onClickCancel = (event) => {
this.undoLastChanges();
this.cancelClicked.emit(event);
this.dropdownOpen = false;
this.timezoneSelectionContentVisible = false;
};
this.undoLastChanges = () => {
if (!isEmpty(this.selectedTimeOption)) {
this.selectedTimeState = this.selectedTimeOption;
}
else {
this.resetDefaultSelectedTimeState();
}
this.applyButtontooltipText = '';
if (this.timePickerView !== ETimePickerView.FullView) {
this.calendarViewLocked = false;
this.timePickerView = ETimePickerView.RelativeTimePicker;
}
};
this.onShowCalendarClick = () => {
if (!this.calendarViewLocked) {
this.showCalendarStateChange.emit(!this.showCalendar);
}
};
this.handleRelativeTimeConfigReset = () => {
this.calendarViewLocked = true;
this.selectedTimeState = {
key: CUSTOMIZE_INTERVAL_KEY,
range: [],
timezone: this.getSelectedTimezone()
};
};
this.handleAbsoluteDatesChange = ({ detail }) => {
const range = detail.range;
if (!this.calendarViewLocked) {
this.calendarViewLocked = true;
}
const [from, to] = range;
const timezone = this.getSelectedTimezone();
const fromDate = createTimestampInTimezoneFromFormattedDate(from, timezone.name, CALENDAR_DATE_TIME_MASK);
const toDate = createTimestampInTimezoneFromFormattedDate(to, timezone.name, CALENDAR_DATE_TIME_MASK);
if (hasRangeChanged([fromDate, toDate], this.selectedTimeState.range)) {
this.selectedTimeState = {
key: CUSTOMIZE_INTERVAL_KEY,
range: range.length === FULL_RANGE_SIZE ? [fromDate, toDate] : [fromDate],
timezone
};
this.updateApplyButtonConfig(range);
}
};
this.displayInputWrapperContent = () => {
this.timezoneSelectionContentVisible = true;
};
this.getCalendarLimitDatesFormatted = (date) => {
if (!isNumber(date))
return;
const selectedTimezone = this.getSelectedTimezone();
return dayjs(date).tz(selectedTimezone.name).format(DATETIME_INPUT_MASK);
};
this.updateApplyButtonConfig = (range) => {
if (range && range.length === FULL_RANGE_SIZE) {
this.applyButtontooltipText = '';
}
else {
this.applyButtontooltipText = APPLY_BUTTON_ERROR_TOOLTIP_TEXT;
}
};
this.getDropdownInputValue = () => {
var _a, _b;
if (((_a = this.selectedTimeOption) === null || _a === void 0 ? void 0 : _a.key) === CUSTOMIZE_INTERVAL_KEY) {
return buildCustomIntervalTimeRange(this.selectedTimeOption.range, this.selectedTimeOption.timezone.name);
}
if (!isEmpty(this.selectedTimeOption)) {
return getRelativeTimeLabel((_b = this.selectedTimeOption) === null || _b === void 0 ? void 0 : _b.key, this.relativeTimePickerOptions);
}
return '';
};
this.getTextFieldTooltip = () => {
var _a;
if (((_a = this.selectedTimeState) === null || _a === void 0 ? void 0 : _a.key) === CUSTOMIZE_INTERVAL_KEY) {
return buildTooltipText(this.selectedTimeState.range, this.getSelectedTimezone(), this.timezones);
}
};
this.getFormattedSelectedTime = () => {
var _a, _b;
if (((_a = this.selectedTimeState) === null || _a === void 0 ? void 0 : _a.key) === CUSTOMIZE_INTERVAL_KEY) {
return DEFAULT_HEADER_TITLE;
}
return getRelativeTimeLabel((_b = this.selectedTimeState) === null || _b === void 0 ? void 0 : _b.key, this.relativeTimePickerOptions);
};
this.getInputConfig = () => {
return merge({}, DEFAULT_TIME_RANGE_PICKER_INPUT_CONFIG, this.inputConfig, {
value: this.getDropdownInputValue(),
tooltipConfig: { text: this.getTextFieldTooltip(), position: this.tooltipPosition },
inputDisabled: this.disabled
});
};
/**
* Returns the apply button tooltip helptext
* @returns apply button help text
*/
this.getApplyButtonTooltipText = () => {
return this.isApplyButtonDisabled() ? this.applyButtontooltipText : '';
};
/**
* Transforms the timestamp into absolute-time-picker dates in the format: YYYY/MM/DD HH:mm:ss
* @returns formatted dates to the absolute time picker component
*/
this.getAbsoluteRange = () => {
const defaultTimezone = this.getSelectedTimezone();
return getAbsoluteTimePickerRangeDates(this.selectedTimeState, defaultTimezone);
};
this.onInternalDropdownsStateChange = ({ detail: openState }) => {
this.internalDropdownsOpen = openState;
};
}
handleSelectTimeStateChange(timeState) {
var _a;
this.selectedTimeState = Object.assign(Object.assign({}, timeState), { timezone: (_a = timeState === null || timeState === void 0 ? void 0 : timeState.timezone) !== null && _a !== void 0 ? _a : this.getSelectedTimezone() });
}
handleShowCalendarChange(value) {
this.syncShowCalendarViewState(value);
}
componentWillLoad() {
if (isEmpty(this.selectedTimeOption)) {
this.resetDefaultSelectedTimeState();
}
else {
this.syncTimeStateWithTimeOption();
}
this.syncShowCalendarViewState(this.showCalendar);
}
syncShowCalendarViewState(value) {
this.timePickerView = value ? ETimePickerView.FullView : ETimePickerView.RelativeTimePicker;
}
syncTimeStateWithTimeOption() {
var _a;
this.selectedTimeState = Object.assign(Object.assign({}, this.selectedTimeOption), { timezone: (_a = this.selectedTimeOption.timezone) !== null && _a !== void 0 ? _a : this.getSelectedTimezone() });
}
getRelativeTimeInputConfig() {
var _a;
if (((_a = this.selectedTimeState) === null || _a === void 0 ? void 0 : _a.key) !== CUSTOMIZE_INTERVAL_KEY) {
return getRelativeTimeInputText(this.relativeTimePickerOptions, this.selectedTimeState, this.getSelectedTimezone().name);
}
}
// Components config methods
isApplyButtonDisabled() {
var _a, _b, _c, _d;
const { range: stateRange, timezone: selectedTimezone } = this.selectedTimeState;
if (stateRange.length > 0 && validateNewRange(stateRange)) {
if (((_b = (_a = this.selectedTimeOption) === null || _a === void 0 ? void 0 : _a.range) === null || _b === void 0 ? void 0 : _b.length) > 0) {
const { range: propRange } = this.selectedTimeOption;
if (stateRange.length === FULL_RANGE_SIZE && hasRangeChanged(stateRange, propRange)) {
return false;
}
}
if (((_d = (_c = this.selectedTimeOption) === null || _c === void 0 ? void 0 : _c.timezone) === null || _d === void 0 ? void 0 : _d.name) !== (selectedTimezone === null || selectedTimezone === void 0 ? void 0 : selectedTimezone.name)) {
return false;
}
}
return true;
}
render() {
var _a;
const dropdownPositionConfig = this.dropdownPositionOptions;
const inputConfig = this.getInputConfig();
return (h(Host, { key: '3a42810f7eb2671de0695eb639d97f7dbb130b71' }, h("kv-dropdown", { key: '124305e83b06de2b8bb34ccae05fa7a09054d416', isOpen: this.dropdownOpen, onOpenStateChange: this.onDropdownChange, inputConfig: inputConfig, options: dropdownPositionConfig, disabled: this.disabled, zIndex: this.zIndex, clickOutsideClose: !this.internalDropdownsOpen }, h("div", { key: '1fc9f6962abb08c363cf67078fe13211d232cf62', class: "time-range-content" }, h("div", { key: '09918ee6025f2b1e10c005c1b5736c653286f0ac', class: {
'content-wrapper': true,
'content-wrapper--relative': this.timePickerView === ETimePickerView.RelativeTimePicker,
'content-wrapper--absolute': this.timePickerView === ETimePickerView.AbsoluteTimePicker,
'content-wrapper--full-view': this.timePickerView === ETimePickerView.FullView
} }, h("div", { key: '28f1d7d3bb7f6787f8a96a594af76a004817df02', class: {
'relative-range': true,
'relative-range--full-view': this.timePickerView === ETimePickerView.FullView
} }, h("kv-relative-time-picker", { key: 'e7894bd6492a443ad9783c92af3abea3246455b8', options: this.relativeTimePickerOptions, timezones: this.timezones, selectedTimezone: this.getSelectedTimezone().name, selectedTimeKey: (_a = this.selectedTimeState) === null || _a === void 0 ? void 0 : _a.key, customIntervalOptionEnabled: this.displayCustomizeInterval, timezoneSelectionEnabled: this.displayTimezoneDropdown, timezoneContentVisible: this.timezoneSelectionContentVisible, disableTimezoneSelection: this.disableTimezoneSelection, onCustomizeIntervalClicked: this.onClickSeeCustomInterval, onSelectedRelativeTimeChange: this.onSelectedRelativeTimeChange, onTimezoneChange: this.onSelectedTimezoneChange, onTimezoneInputClicked: this.displayInputWrapperContent, onTimezoneDropdownStateChange: this.onInternalDropdownsStateChange })), h("div", { key: '019c7c7973539a47b9769fa815229a74eb124717', class: {
'calendar-range': true,
'calendar-range--visible': this.timePickerView === ETimePickerView.AbsoluteTimePicker,
'calendar-range--full-view': this.timePickerView === ETimePickerView.FullView
} }, h("kv-absolute-time-picker", { key: '95bebabd624f82e073ed74a054e750bac15ec098', mode: EAbsoluteTimePickerMode.Range, headerTitle: this.getFormattedSelectedTime(), selectedDates: this.getAbsoluteRange(), relativeTimeConfig: this.getRelativeTimeInputConfig(), displayBackButton: this.timePickerView === ETimePickerView.AbsoluteTimePicker, onBackButtonClicked: this.onClickBack, onSelectedDatesChange: this.handleAbsoluteDatesChange, onRelativeTimeConfigReset: this.handleRelativeTimeConfigReset, onRelativeTimeConfigChange: this.handleAbsoluteDatesChange, calendarInputMinDate: this.getCalendarLimitDatesFormatted(this.calendarInputMinDate), calendarInputMaxDate: this.getCalendarLimitDatesFormatted(this.calendarInputMaxDate) }))), h("div", { key: '1eb15f82cf5327b64b1426bf172fea9e8c010e39', class: "footer" }, h("div", { key: '305f9f7118ebde2f083af623d777f03cf519b91b', class: "toggle-wrapper" }, this.timePickerView !== ETimePickerView.AbsoluteTimePicker && (h("div", { key: '777afc7719bbc1b99ab7b407c951b35bb4bb1f4e', class: "show-calendar-toggle" }, h("kv-switch-button", { key: 'd1723117d7b975ac04b0283d6dbfb7d54ec688c1', checked: this.showCalendar, size: EComponentSize.Small, onClick: this.onShowCalendarClick, disabled: this.calendarViewLocked }), h("div", { key: '661caba234db94a90a5a5ebdff93807f859d3861', class: "toggle-text" }, "Show Calendar")))), h("div", { key: '34adfedcfea37f1cccfd2f448345585f42edb3c4', class: "actions" }, h("kv-action-button-text", { key: '81e40074f16c56b20c769bc68ae9713edcb27893', type: EActionButtonType.Tertiary, size: EComponentSize.Small, text: "Cancel", onClickButton: this.onClickCancel }), h("kv-tooltip", { key: 'ccb038714dc949eb0153e05051c6d1c7b9834a80', text: this.getApplyButtonTooltipText(), position: ETooltipPosition.TopStart }, h("kv-action-button-text", { key: '46d559a76cf190ac8968b0f613b190de52bdfc64', type: EActionButtonType.Primary, size: EComponentSize.Small, text: "Apply", disabled: this.isApplyButtonDisabled(), onClickButton: this.onClickApply }))))))));
}
static get watchers() { return {
"selectedTimeOption": ["handleSelectTimeStateChange"],
"showCalendar": ["handleShowCalendarChange"]
}; }
static get style() { return timePickerCss; }
}, [0, "kv-time-picker", {
"inputConfig": [16, "input-config"],
"dropdownPositionOptions": [16, "dropdown-position-options"],
"disabled": [516],
"showCalendar": [516, "show-calendar"],
"selectedTimeOption": [16, "selected-time-option"],
"relativeTimePickerOptions": [16, "relative-time-picker-options"],
"timezones": [16],
"disableTimezoneSelection": [516, "disable-timezone-selection"],
"displayCustomizeInterval": [516, "display-customize-interval"],
"displayTimezoneDropdown": [516, "display-timezone-dropdown"],
"calendarInputMinDate": [2, "calendar-input-min-date"],
"calendarInputMaxDate": [2, "calendar-input-max-date"],
"zIndex": [2, "z-index"],
"tooltipPosition": [1, "tooltip-position"],
"timePickerView": [32],
"selectedTimeState": [32],
"dropdownOpen": [32],
"applyButtontooltipText": [32],
"calendarViewLocked": [32],
"timezoneSelectionContentVisible": [32],
"internalDropdownsOpen": [32]
}, undefined, {
"selectedTimeOption": ["handleSelectTimeStateChange"],
"showCalendar": ["handleShowCalendarChange"]
}]);
function defineCustomElement$1() {
if (typeof customElements === "undefined") {
return;
}
const components = ["kv-time-picker", "kv-absolute-time-picker", "kv-action-button", "kv-action-button-icon", "kv-action-button-text", "kv-badge", "kv-calendar", "kv-calendar-day", "kv-checkbox", "kv-date-time-input", "kv-dirty-dot", "kv-dropdown", "kv-dropdown-base", "kv-form-help-text", "kv-form-label", "kv-icon", "kv-illustration", "kv-illustration-message", "kv-input-wrapper", "kv-portal", "kv-relative-time-picker", "kv-search", "kv-select", "kv-select-create-option", "kv-select-multi-options", "kv-select-option", "kv-select-shortcuts-label", "kv-single-select-dropdown", "kv-switch-button", "kv-text-field", "kv-time-picker-select-option", "kv-tooltip", "kv-tooltip-text", "kv-virtualized-list"];
components.forEach(tagName => { switch (tagName) {
case "kv-time-picker":
if (!customElements.get(tagName)) {
customElements.define(tagName, KvTimePicker$1);
}
break;
case "kv-absolute-time-picker":
if (!customElements.get(tagName)) {
defineCustomElement$y();
}
break;
case "kv-action-button":
if (!customElements.get(tagName)) {
defineCustomElement$x();
}
break;
case "kv-action-button-icon":
if (!customElements.get(tagName)) {
defineCustomElement$w();
}
break;
case "kv-action-button-text":
if (!customElements.get(tagName)) {
defineCustomElement$v();
}
break;
case "kv-badge":
if (!customElements.get(tagName)) {
defineCustomElement$u();
}
break;
case "kv-calendar":
if (!customElements.get(tagName)) {
defineCustomElement$t();
}
break;
case "kv-calendar-day":
if (!customElements.get(tagName)) {
defineCustomElement$s();
}
break;
case "kv-checkbox":
if (!customElements.get(tagName)) {
defineCustomElement$r();
}
break;
case "kv-date-time-input":
if (!customElements.get(tagName)) {
defineCustomElement$q();
}
break;
case "kv-dirty-dot":
if (!customElements.get(tagName)) {
defineCustomElement$p();
}
break;
case "kv-dropdown":
if (!customElements.get(tagName)) {
defineCustomElement$o();
}
break;
case "kv-dropdown-base":
if (!customElements.get(tagName)) {
defineCustomElement$n();
}
break;
case "kv-form-help-text":
if (!customElements.get(tagName)) {
defineCustomElement$m();
}
break;
case "kv-form-label":
if (!customElements.get(tagName)) {
defineCustomElement$l();
}
break;
case "kv-icon":
if (!customElements.get(tagName)) {
defineCustomElement$k();
}
break;
case "kv-illustration":
if (!customElements.get(tagName)) {
defineCustomElement$j();
}
break;
case "kv-illustration-message":
if (!customElements.get(tagName)) {
defineCustomElement$i();
}
break;
case "kv-input-wrapper":
if (!customElements.get(tagName)) {
defineCustomElement$h();
}
break;
case "kv-portal":
if (!customElements.get(tagName)) {
defineCustomElement$g();
}
break;
case "kv-relative-time-picker":
if (!customElements.get(tagName)) {
defineCustomElement$f();
}
break;
case "kv-search":
if (!customElements.get(tagName)) {
defineCustomElement$e();
}
break;
case "kv-select":
if (!customElements.get(tagName)) {
defineCustomElement$d();
}
break;
case "kv-select-create-option":
if (!customElements.get(tagName)) {
defineCustomElement$c();
}
break;
case "kv-select-multi-options":
if (!customElements.get(tagName)) {
defineCustomElement$b();
}
break;
case "kv-select-option":
if (!customElements.get(tagName)) {
defineCustomElement$a();
}
break;
case "kv-select-shortcuts-label":
if (!customElements.get(tagName)) {
defineCustomElement$9();
}
break;
case "kv-single-select-dropdown":
if (!customElements.get(tagName)) {
defineCustomElement$8();
}
break;
case "kv-switch-button":
if (!customElements.get(tagName)) {
defineCustomElement$7();
}
break;
case "kv-text-field":
if (!customElements.get(tagName)) {
defineCustomElement$6();
}
break;
case "kv-time-picker-select-option":
if (!customElements.get(tagName)) {
defineCustomElement$5();
}
break;
case "kv-tooltip":
if (!customElements.get(tagName)) {
defineCustomElement$4();
}
break;
case "kv-tooltip-text":
if (!customElements.get(tagName)) {
defineCustomElement$3();
}
break;
case "kv-virtualized-list":
if (!customElements.get(tagName)) {
defineCustomElement$2();
}
break;
} });
}
defineCustomElement$1();
const KvTimePicker = KvTimePicker$1;
const defineCustomElement = defineCustomElement$1;
export { KvTimePicker, defineCustomElement };