@progress/kendo-vue-scheduler 9.3.0-develop.4 → 9.3.0-develop.6

package/editors/SchedulerRecurrenceDialog.mjs

@@ -0,0 +1,575 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { defineComponent as q, createVNode as a, inject as E, isVNode as I } from "vue";
+import { Dialog as F, DialogActionsBar as L } from "@progress/kendo-vue-dialogs";
+import { Button as g } from "@progress/kendo-vue-buttons";
+import { provideLocalizationService as D, provideIntlService as c } from "@progress/kendo-vue-intl";
+import { NumericTextBox as v, RadioGroup as w } from "@progress/kendo-vue-inputs";
+import { DropDownList as i } from "@progress/kendo-vue-dropdowns";
+import { DatePicker as T } from "@progress/kendo-vue-dateinputs";
+import { Label as f } from "@progress/kendo-vue-labels";
+import { FieldWrapper as o } from "@progress/kendo-vue-form";
+import { toLocalDate as b, ZonedDate as R } from "@progress/kendo-date-math";
+import { serializeRule as C, parseRule as K } from "@progress/kendo-recurrence";
+import { editorSave as S, messages as m, editorCancel as O, editorRecurrenceDialogTitle as M, editorRecurrenceRemove as x, recurrenceEditorRepeat as j, recurrenceEditorWeeklyRepeatOn as U, recurrenceEditorWeeklyRepeatOnDays as _, recurrenceEditorMonthlyRepeatOn as B, recurrenceEditorYearlyRepeatOn as N, recurrenceEditorYearlyOf as P, recurrenceEditorEndLabel as V, recurrenceEditorEndOccurrence as $, recurrenceEditorEndNever as Y, recurrenceEditorEndAfter as A, recurrenceEditorEndOn as G, recurrenceEditorFrequenciesDaily as Z, recurrenceEditorFrequenciesWeekly as H, recurrenceEditorFrequenciesMonthly as J, recurrenceEditorFrequenciesYearly as Q } from "../messages/main.mjs";
+import { getRecurrenceSummary as X } from "../hooks/useRecurrenceSummary.mjs";
+import { weekDayRuleFromString as W, getRepeatOnRule as ee, getMonthDay as te, getEndRule as ae, getOffset as re, getOffsets as ne, getMonth as le, getMonths as se, getWeekDay as ie, getExtendedWeekDays as ue, getWeekDays as oe, getFrequency as he, getRule as de } from "../recurrence/common.mjs";
+function u(e) {
+  return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !I(e);
+}
+const Oe = /* @__PURE__ */ q({
+  name: "KendoSchedulerRecurrenceDialog",
+  props: {
+    value: {
+      type: [String, null],
+      default: null
+    },
+    start: {
+      type: Date,
+      required: !0
+    },
+    timezone: {
+      type: String,
+      default: ""
+    },
+    onSave: Function,
+    onCancel: Function,
+    onRemoveRecurrence: Function,
+    recurrenceSummaryTemplate: [Object, Function],
+    recurrenceEditor: [Object, Function]
+  },
+  inject: {
+    kendoLocalizationService: {
+      default: null
+    }
+  },
+  setup() {
+    return {
+      kendoLocalizationService: E("kendoLocalizationService", {})
+    };
+  },
+  data() {
+    var r;
+    const e = de((r = this.value) != null ? r : "");
+    return {
+      rrule: e.freq ? e : {
+        freq: "daily",
+        interval: 1
+      },
+      defaultCount: 1,
+      defaultUntil: R.fromUTCDate(this.start),
+      startsOn: new Date(this.start)
+    };
+  },
+  computed: {
+    frequency() {
+      return he(this.rrule);
+    },
+    weekDays() {
+      const e = c(this);
+      return oe(e);
+    },
+    extendedWeekDays() {
+      const e = c(this);
+      return ue(e, this.localizeMessage);
+    },
+    weekDay() {
+      return ie(this.extendedWeekDays, this.rrule, this.startsOn);
+    },
+    months() {
+      const e = c(this);
+      return se(e);
+    },
+    month() {
+      return le(this.months, this.rrule);
+    },
+    offsets() {
+      return ne(this.localizeMessage);
+    },
+    offset() {
+      return re(this.offsets, this.rrule);
+    },
+    endRule() {
+      return ae(this.rrule);
+    },
+    monthDay() {
+      return te(this.rrule, this.startsOn);
+    },
+    until() {
+      return this.rrule.until ? b(this.rrule.until) : null;
+    },
+    repeatOnRule() {
+      return ee(this.rrule);
+    },
+    isExistingRecurrence() {
+      return !!this.value;
+    },
+    frequencyData() {
+      return [{
+        text: this.localizeMessage(Z, !0),
+        value: "daily"
+      }, {
+        text: this.localizeMessage(H, !0),
+        value: "weekly"
+      }, {
+        text: this.localizeMessage(J, !0),
+        value: "monthly"
+      }, {
+        text: this.localizeMessage(Q, !0),
+        value: "yearly"
+      }];
+    },
+    endRuleData() {
+      return [{
+        text: this.localizeMessage(Y, !0),
+        value: "never"
+      }, {
+        text: this.localizeMessage(A, !0),
+        value: "count"
+      }, {
+        text: this.localizeMessage(G, !0),
+        value: "until"
+      }];
+    },
+    frequencyDropDownValue() {
+      return this.frequencyData.find((e) => e.value === this.frequency) || this.frequencyData[0];
+    },
+    endRuleDropDownValue() {
+      return this.endRuleData.find((e) => e.value === this.endRule) || this.endRuleData[0];
+    },
+    narrowWeekDays() {
+      const e = c(this), t = e.firstDay(), r = e.dateFormatNames({
+        type: "days",
+        nameType: "narrow"
+      }), l = e.dateFormatNames({
+        type: "days",
+        nameType: "wide"
+      }), s = r.map((h, d) => ({
+        narrow: h,
+        wide: l[d],
+        value: d
+      }));
+      return s.slice(t).concat(s.slice(0, t));
+    },
+    selectedWeekDays() {
+      return (this.rrule.byWeekDay || []).map(({
+        day: e
+      }) => e);
+    },
+    summary() {
+      if (!this.rrule.freq || this.rrule.freq === "never")
+        return "";
+      const e = c(this), t = D(this), r = C(this.rrule, this.timezone);
+      return X(r, this.startsOn, e, (l, s) => t.toLanguageString(l, s));
+    },
+    currentRuleString() {
+      return !this.rrule.freq || this.rrule.freq === "never" ? null : C(this.rrule, this.timezone);
+    },
+    parsedCurrentRule() {
+      return this.currentRuleString ? K({
+        recurrenceRule: this.currentRuleString
+      }) : null;
+    }
+  },
+  methods: {
+    localizeMessage(e, t) {
+      const r = D(this), l = t ? e : "scheduler.recurrenceEditor" + e;
+      return r.toLanguageString(l, m[l]);
+    },
+    renderRecurrenceSummaryTemplate() {
+      const e = this.recurrenceSummaryTemplate;
+      return !e || !this.currentRuleString ? null : a(e, {
+        recurrenceRule: this.currentRuleString,
+        text: this.summary || "",
+        parsedRule: this.parsedCurrentRule
+      }, null);
+    },
+    updateRrule(e) {
+      this.rrule = {
+        ...e
+      };
+    },
+    handleFrequencyChange(e) {
+      const t = {};
+      t.freq = e, t.interval = 1, e === "weekly" && (t.byWeekDay = [{
+        day: R.fromLocalDate(this.startsOn, this.timezone).getDay(),
+        offset: 0
+      }]), (e === "monthly" || e === "yearly") && (t.byMonthDay = [this.startsOn.getDate()]), e === "yearly" && (t.byMonth = [this.startsOn.getMonth() + 1]), this.updateRrule(t);
+    },
+    handleIntervalChange(e) {
+      var t;
+      this.updateRrule({
+        ...this.rrule,
+        interval: (t = e.value) != null ? t : 1
+      });
+    },
+    handleCountChange(e) {
+      const t = e.value, r = t != null ? t : this.defaultCount;
+      this.updateRrule({
+        ...this.rrule,
+        count: r
+      }), t !== null && (this.defaultCount = r);
+    },
+    handleUntilChange(e) {
+      if (!e.value)
+        return;
+      const t = R.fromLocalDate(e.value, this.timezone);
+      this.updateRrule({
+        ...this.rrule,
+        until: t
+      }), this.defaultUntil = t;
+    },
+    handleWeekDaysChange(e) {
+      this.updateRrule({
+        ...this.rrule,
+        byWeekDay: this.weekDays.filter((t) => e.some((r) => r === t.value)).map((t) => ({
+          offset: 0,
+          day: t.value
+        }))
+      });
+    },
+    handleWeekDayChange(e) {
+      const t = {
+        ...this.rrule
+      }, r = e.value;
+      typeof r.value == "string" ? (t.byWeekDay = W(r.value), t.bySetPosition = [this.offset.value]) : (t.bySetPosition = void 0, t.byWeekDay = [{
+        day: r.value,
+        offset: this.offset.value
+      }]), this.updateRrule(t);
+    },
+    handleMonthDayChange(e) {
+      var t;
+      this.updateRrule({
+        ...this.rrule,
+        byMonthDay: [(t = e.value) != null ? t : 1]
+      });
+    },
+    handleMonthChange(e) {
+      this.updateRrule({
+        ...this.rrule,
+        byMonth: [e.value.value]
+      });
+    },
+    handleEndRuleDropDownChange(e) {
+      const t = e.value.value, r = {
+        ...this.rrule
+      };
+      switch (t) {
+        case "never":
+          r.until = void 0, r.count = void 0;
+          break;
+        case "count":
+          r.until = void 0, r.count = this.defaultCount;
+          break;
+        case "until":
+          r.until = this.defaultUntil, r.count = void 0;
+          break;
+      }
+      this.updateRrule(r);
+    },
+    handleRepeatOnRuleChange(e) {
+      const t = {
+        ...this.rrule
+      };
+      e.value === "monthday" ? (t.byWeekDay = void 0, t.bySetPosition = void 0, t.byMonthDay = [this.monthDay]) : e.value === "weekday" && (t.byMonthDay = void 0, typeof this.weekDay.value == "string" ? (t.bySetPosition = [this.offset.value], t.byWeekDay = W(this.weekDay.value)) : t.byWeekDay = [{
+        day: this.weekDay.value,
+        offset: this.offset.value
+      }]), this.updateRrule(t);
+    },
+    handleOffsetChange(e) {
+      const t = {
+        ...this.rrule
+      }, r = e.value;
+      if (t.byWeekDay)
+        switch (t.byWeekDay.length) {
+          case 7:
+          case 5:
+          case 2:
+            t.bySetPosition = [r.value];
+            break;
+          case 1:
+            t.byWeekDay[0].offset = r.value;
+            break;
+        }
+      this.updateRrule(t);
+    },
+    handleFrequencyDropDownChange(e) {
+      const t = e.value.value;
+      this.handleFrequencyChange(t);
+    },
+    handleWeekDayButtonClick(e) {
+      const t = this.selectedWeekDays.includes(e) ? this.selectedWeekDays.filter((r) => r !== e) : [...this.selectedWeekDays, e];
+      this.handleWeekDaysChange(t);
+    },
+    handleStartsOnChange(e) {
+      e.value && (this.startsOn = e.value);
+    },
+    handleSave() {
+      const e = c(this);
+      this.rrule.freq === "never" || !this.rrule.freq ? this.$emit("save", null) : (this.rrule.weekStart === void 0 && (this.rrule.weekStart = e.firstDay()), this.$emit("save", C(this.rrule, this.timezone)));
+    },
+    handleClose(e) {
+      this.$emit("cancel");
+    }
+  },
+  render() {
+    let e, t, r, l, s;
+    const h = D(this), d = h.toLanguageString(S, m[S]), p = h.toLanguageString(O, m[O]), z = h.toLanguageString(M, m[M]), k = h.toLanguageString(x, m[x]);
+    return a(F, {
+      title: z,
+      appendTo: "body",
+      width: 540,
+      onClose: this.handleClose
+    }, {
+      default: () => [a("div", {
+        class: "k-form k-form-horizontal"
+      }, [a(o, null, {
+        default: () => [a(f, {
+          editorId: "recurrence-interval",
+          class: "k-form-label"
+        }, u(e = this.localizeMessage(j, !0)) ? e : {
+          default: () => [e]
+        }), a("div", {
+          class: "k-form-field-wrap"
+        }, [a("div", {
+          class: "k-scheduler-recurrence-fields"
+        }, [this.frequency !== "never" && a(v, {
+          id: "recurrence-interval",
+          min: 1,
+          step: 1,
+          defaultValue: 1,
+          value: this.rrule.interval,
+          onChange: this.handleIntervalChange
+        }, null), a(i, {
+          dataItems: this.frequencyData,
+          textField: "text",
+          dataItemKey: "value",
+          value: this.frequencyDropDownValue,
+          onChange: this.handleFrequencyDropDownChange
+        }, null)])])]
+      }), this.frequency === "weekly" && a(o, null, {
+        default: () => [a(f, {
+          class: "k-form-label"
+        }, u(t = this.localizeMessage(U, !0)) ? t : {
+          default: () => [t]
+        }), a("div", {
+          class: "k-form-field-wrap"
+        }, [a("div", {
+          class: "k-scheduler-weekday-picker",
+          role: "group",
+          "aria-label": this.localizeMessage(_, !0)
+        }, [this.narrowWeekDays.map((n) => a(g, {
+          key: n.value,
+          type: "button",
+          themeColor: "primary",
+          fillMode: "flat",
+          rounded: "full",
+          togglable: !0,
+          selected: this.selectedWeekDays.includes(n.value),
+          "aria-label": n.wide,
+          "aria-pressed": this.selectedWeekDays.includes(n.value),
+          onClick: () => this.handleWeekDayButtonClick(n.value)
+        }, {
+          default: () => [n.narrow]
+        }))])])]
+      }), this.frequency === "monthly" && a(o, null, {
+        default: () => {
+          var n, y;
+          return [a(f, {
+            class: "k-form-label"
+          }, u(r = this.localizeMessage(B, !0)) ? r : {
+            default: () => [r]
+          }), a("div", {
+            class: "k-form-field-wrap"
+          }, [a(w, {
+            value: this.repeatOnRule,
+            onChange: this.handleRepeatOnRuleChange,
+            class: "k-reset",
+            dataItems: [{
+              value: "weekday",
+              tabIndex: 0,
+              name: "scheduler-recurrence-monthly-weekday",
+              label: " ",
+              content: a("div", {
+                class: "k-scheduler-recurrence-fields"
+              }, [a(i, {
+                textField: "text",
+                dataItemKey: "value",
+                disabled: this.repeatOnRule !== "weekday",
+                dataItems: this.offsets,
+                value: this.offset,
+                onChange: this.handleOffsetChange
+              }, null), a(i, {
+                disabled: this.repeatOnRule !== "weekday",
+                value: this.weekDay,
+                dataItems: this.extendedWeekDays,
+                onChange: this.handleWeekDayChange,
+                textField: "text",
+                dataItemKey: "value"
+              }, null)])
+            }, {
+              value: "monthday",
+              tabIndex: 0,
+              name: "scheduler-recurrence-monthly-monthday",
+              label: " ",
+              content: a("div", {
+                class: "k-scheduler-recurrence-fields"
+              }, [a(v, {
+                min: 1,
+                max: 31,
+                disabled: this.repeatOnRule !== "monthday",
+                value: (y = (n = this.rrule) == null ? void 0 : n.byMonthDay) == null ? void 0 : y[0],
+                onChange: this.handleMonthDayChange,
+                style: {
+                  width: "auto"
+                }
+              }, null)])
+            }]
+          }, null)])];
+        }
+      }), this.frequency === "yearly" && a(o, null, {
+        default: () => [a(f, {
+          class: "k-form-label"
+        }, u(l = this.localizeMessage(N, !0)) ? l : {
+          default: () => [l]
+        }), a("div", {
+          class: "k-form-field-wrap"
+        }, [a(w, {
+          value: this.repeatOnRule,
+          onChange: this.handleRepeatOnRuleChange,
+          class: "k-reset",
+          dataItems: [{
+            value: "monthday",
+            tabIndex: 0,
+            name: "scheduler-recurrence-yearly-monthday",
+            label: " ",
+            content: a("div", {
+              class: "k-scheduler-recurrence-fields"
+            }, [a(i, {
+              disabled: this.repeatOnRule !== "monthday",
+              value: this.month,
+              dataItems: this.months,
+              textField: "text",
+              dataItemKey: "value",
+              onChange: this.handleMonthChange
+            }, null), a(v, {
+              min: 1,
+              max: 31,
+              disabled: this.repeatOnRule !== "monthday",
+              value: this.monthDay,
+              onChange: this.handleMonthDayChange,
+              style: {
+                width: "auto"
+              }
+            }, null)])
+          }, {
+            value: "weekday",
+            tabIndex: 0,
+            name: "scheduler-recurrence-yearly-weekday",
+            label: " ",
+            content: a("div", {
+              class: "k-scheduler-recurrence-fields"
+            }, [a(i, {
+              textField: "text",
+              dataItemKey: "value",
+              disabled: this.repeatOnRule !== "weekday",
+              dataItems: this.offsets,
+              value: this.offset,
+              onChange: this.handleOffsetChange
+            }, null), a(i, {
+              textField: "text",
+              dataItemKey: "value",
+              disabled: this.repeatOnRule !== "weekday",
+              value: this.weekDay,
+              dataItems: this.extendedWeekDays,
+              onChange: this.handleWeekDayChange
+            }, null), a("span", {
+              key: "of-row",
+              class: "k-scheduler-edit-form-row"
+            }, [a("span", null, [this.localizeMessage(P, !0)]), a(i, {
+              textField: "text",
+              dataItemKey: "value",
+              disabled: this.repeatOnRule !== "weekday",
+              value: this.month,
+              dataItems: this.months,
+              onChange: this.handleMonthChange
+            }, null)])])
+          }]
+        }, null)])]
+      }), this.frequency !== "never" && a(o, null, {
+        default: () => {
+          var n, y;
+          return [a(f, {
+            class: "k-form-label"
+          }, u(s = this.localizeMessage(V, !0)) ? s : {
+            default: () => [s]
+          }), a("div", {
+            class: "k-form-field-wrap"
+          }, [a("div", {
+            class: "k-scheduler-recurrence-fields"
+          }, [a(i, {
+            dataItems: this.endRuleData,
+            textField: "text",
+            dataItemKey: "value",
+            value: this.endRuleDropDownValue,
+            onChange: this.handleEndRuleDropDownChange
+          }, null), this.endRule === "count" && a(v, {
+            min: 1,
+            style: {
+              width: "auto"
+            },
+            value: (n = this.rrule.count) != null ? n : this.defaultCount,
+            onChange: this.handleCountChange,
+            format: `0 '${this.localizeMessage($, !0)}'`
+          }, null), this.endRule === "until" && a(T, {
+            min: this.startsOn,
+            value: (y = this.until) != null ? y : b(this.defaultUntil),
+            onChange: this.handleUntilChange,
+            style: {
+              width: "auto"
+            }
+          }, null)])])];
+        }
+      }), this.frequency !== "never" && (this.recurrenceSummaryTemplate && this.currentRuleString ? a(o, null, {
+        default: () => [a("div", {
+          class: "k-form-field-wrap"
+        }, [a("div", {
+          class: "k-form-hint"
+        }, [this.renderRecurrenceSummaryTemplate()])])]
+      }) : this.summary ? a(o, null, {
+        default: () => [a("div", {
+          class: "k-form-field-wrap"
+        }, [a("div", {
+          class: "k-form-hint"
+        }, [this.summary])])]
+      }) : null)]), a(L, {
+        layout: "end"
+      }, {
+        default: () => [this.isExistingRecurrence && this.onRemoveRecurrence && a(g, {
+          fillMode: "flat",
+          themeColor: "primary",
+          onClick: this.onRemoveRecurrence
+        }, u(k) ? k : {
+          default: () => [k]
+        }), a(g, {
+          onClick: () => this.$emit("cancel")
+        }, u(p) ? p : {
+          default: () => [p]
+        }), a(g, {
+          themeColor: "primary",
+          onClick: this.handleSave
+        }, u(d) ? d : {
+          default: () => [d]
+        })]
+      })]
+    });
+  }
+});
+export {
+  Oe as SchedulerRecurrenceDialog
+};

package/editors/TimezoneDropDownList.d.ts

@@ -0,0 +1,46 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { DropDownListChangeEvent, DropDownListFilterChangeEvent } from '@progress/kendo-vue-dropdowns';
+import { PropType } from 'vue';
+/**
+ * @hidden
+ */
+declare const TimezoneDropDownList: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    value: PropType<any>;
+    dataItems: PropType<string[]>;
+    validationMessage: StringConstructor;
+    touched: BooleanConstructor;
+    modified: BooleanConstructor;
+    visited: BooleanConstructor;
+    valid: BooleanConstructor;
+    name: StringConstructor;
+    ariaLabel: StringConstructor;
+}>, {}, {
+    filteredData: string[];
+}, {}, {
+    handleChange(e: DropDownListChangeEvent): void;
+    handleFilterChange(e: DropDownListFilterChangeEvent): void;
+}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, "change"[], "change", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    value: PropType<any>;
+    dataItems: PropType<string[]>;
+    validationMessage: StringConstructor;
+    touched: BooleanConstructor;
+    modified: BooleanConstructor;
+    visited: BooleanConstructor;
+    valid: BooleanConstructor;
+    name: StringConstructor;
+    ariaLabel: StringConstructor;
+}>> & Readonly<{
+    onChange?: (...args: any[]) => any;
+}>, {
+    touched: boolean;
+    modified: boolean;
+    visited: boolean;
+    valid: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export { TimezoneDropDownList };

package/editors/TimezoneDropDownList.js

@@ -0,0 +1,8 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("vue"),r=require("@progress/kendo-vue-dropdowns"),l=t.defineComponent({name:"KendoTimezoneDropDownList",props:{value:[String,Number,Object],dataItems:Array,validationMessage:String,touched:Boolean,modified:Boolean,visited:Boolean,valid:Boolean,name:String,ariaLabel:String},emits:["change"],data(){return{filteredData:this.$props.dataItems}},watch:{dataItems(e){this.filteredData=e}},render(){return t.createVNode(r.DropDownList,t.mergeProps({popupSettings:{width:"360px"},dataItems:this.filteredData,value:this.value,onChange:this.handleChange,filterable:!0,ariaLabel:this.ariaLabel},{onFilterchange:this.handleFilterChange}),null)},methods:{handleChange(e){this.$emit("change",{value:e.value})},handleFilterChange(e){var a,i;const o=((i=(a=e.filter)==null?void 0:a.value)==null?void 0:i.toLocaleLowerCase())||"";this.filteredData=(this.$props.dataItems||[]).filter(n=>n.toLocaleLowerCase().includes(o))}}});exports.TimezoneDropDownList=l;

package/editors/TimezoneDropDownList.mjs

@@ -0,0 +1,63 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { defineComponent as r, createVNode as n, mergeProps as l } from "vue";
+import { DropDownList as s } from "@progress/kendo-vue-dropdowns";
+const m = /* @__PURE__ */ r({
+  name: "KendoTimezoneDropDownList",
+  props: {
+    value: [String, Number, Object],
+    dataItems: Array,
+    validationMessage: String,
+    touched: Boolean,
+    modified: Boolean,
+    visited: Boolean,
+    valid: Boolean,
+    name: String,
+    ariaLabel: String
+  },
+  emits: ["change"],
+  data() {
+    return {
+      filteredData: this.$props.dataItems
+    };
+  },
+  watch: {
+    dataItems(e) {
+      this.filteredData = e;
+    }
+  },
+  render() {
+    return n(s, l({
+      popupSettings: {
+        width: "360px"
+      },
+      dataItems: this.filteredData,
+      value: this.value,
+      onChange: this.handleChange,
+      filterable: !0,
+      ariaLabel: this.ariaLabel
+    }, {
+      onFilterchange: this.handleFilterChange
+    }), null);
+  },
+  methods: {
+    handleChange(e) {
+      this.$emit("change", {
+        value: e.value
+      });
+    },
+    handleFilterChange(e) {
+      var a, t;
+      const i = ((t = (a = e.filter) == null ? void 0 : a.value) == null ? void 0 : t.toLocaleLowerCase()) || "";
+      this.filteredData = (this.$props.dataItems || []).filter((o) => o.toLocaleLowerCase().includes(i));
+    }
+  }
+});
+export {
+  m as TimezoneDropDownList
+};