@progress/kendo-themes-html 6.2.1-dev.154 → 6.2.1-dev.170

package/dist/gantt/tests/gantt-editing-popup-general.js

@@ -0,0 +1,2300 @@
+(() => {
+  var __create = Object.create;
+  var __defProp = Object.defineProperty;
+  var __defProps = Object.defineProperties;
+  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+  var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+  var __getOwnPropNames = Object.getOwnPropertyNames;
+  var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+  var __getProtoOf = Object.getPrototypeOf;
+  var __hasOwnProp = Object.prototype.hasOwnProperty;
+  var __propIsEnum = Object.prototype.propertyIsEnumerable;
+  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+  var __spreadValues = (a, b) => {
+    for (var prop in b ||= {})
+      if (__hasOwnProp.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    if (__getOwnPropSymbols)
+      for (var prop of __getOwnPropSymbols(b)) {
+        if (__propIsEnum.call(b, prop))
+          __defNormalProp(a, prop, b[prop]);
+      }
+    return a;
+  };
+  var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+  var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
+    get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
+  }) : x)(function(x) {
+    if (typeof require !== "undefined")
+      return require.apply(this, arguments);
+    throw new Error('Dynamic require of "' + x + '" is not supported');
+  });
+  var __objRest = (source, exclude) => {
+    var target = {};
+    for (var prop in source)
+      if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+        target[prop] = source[prop];
+    if (source != null && __getOwnPropSymbols)
+      for (var prop of __getOwnPropSymbols(source)) {
+        if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+          target[prop] = source[prop];
+      }
+    return target;
+  };
+  var __copyProps = (to, from, except, desc) => {
+    if (from && typeof from === "object" || typeof from === "function") {
+      for (let key of __getOwnPropNames(from))
+        if (!__hasOwnProp.call(to, key) && key !== except)
+          __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+    }
+    return to;
+  };
+  var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+    // If the importer is in node compatibility mode or this is not an ESM
+    // file that has been converted to a CommonJS file using a Babel-
+    // compatible transform (i.e. "__esModule" has not been set), then set
+    // "default" to the CommonJS "module.exports" for node compatibility.
+    isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+    mod
+  ));
+
+  // src/gantt/tests/gantt-editing-popup-general.tsx
+  var import_client = __toESM(__require("react-dom/client"));
+
+  // src/utils/class-names.ts
+  var classNames = (...args) => {
+    return args.filter((arg) => arg !== true && Boolean(arg)).map((arg) => {
+      return Array.isArray(arg) ? classNames(...arg) : typeof arg === "object" ? Object.keys(arg).map((key, idx) => arg[idx] || arg[key] && key || null).filter((el) => el !== null).join(" ") : arg;
+    }).filter((arg) => Boolean(arg)).join(" ");
+  };
+
+  // src/utils/component-class-names.ts
+  var optionClassNames = (componentClassName, props) => {
+    return classNames(
+      {
+        [`${componentClassName}-xs`]: props.size === "xsmall",
+        [`${componentClassName}-sm`]: props.size === "small",
+        [`${componentClassName}-md`]: props.size === "medium",
+        [`${componentClassName}-lg`]: props.size === "large",
+        [`${componentClassName}-xl`]: props.size === "xlarge",
+        [`${componentClassName}-xxl`]: props.size === "xxlarge",
+        [`${componentClassName}-xxxl`]: props.size === "xxxlarge"
+      },
+      {
+        [`${componentClassName}-${props.fillMode}`]: props.fillMode
+      },
+      {
+        [`${componentClassName}-${props.fillMode}-${props.themeColor}`]: props.fillMode && props.themeColor
+      },
+      {
+        [`${componentClassName}-${props.themeColor}`]: props.themeColor && props.fillMode === void 0
+      },
+      {
+        "k-rounded-sm": props.rounded === "small",
+        "k-rounded-md": props.rounded === "medium",
+        "k-rounded-lg": props.rounded === "large",
+        "k-rounded-full": props.rounded === "full"
+      }
+    );
+  };
+  var stateClassNames = (_componentClassName, props) => {
+    return classNames({
+      "k-valid": props.valid,
+      "k-invalid": props.invalid,
+      "k-hover": props.hover,
+      "k-focus": props.focus,
+      "k-checked": props.checked,
+      "k-active": props.active,
+      "k-selected": props.selected,
+      "k-disabled": props.disabled,
+      "k-indeterminate": props.indeterminate && !props.checked,
+      "k-loading": props.loading,
+      "k-empty": props.empty,
+      "k-readonly": props.readonly
+    });
+  };
+
+  // src/utils/theme.ts
+  var Size = {
+    "xsmall": "xsmall",
+    "small": "small",
+    "medium": "medium",
+    "large": "large",
+    "xlarge": "xlarge",
+    "xxlarge": "xxlarge",
+    "xxxlarge": "xxxlarge"
+  };
+  var Roundness = {
+    "small": "small",
+    "medium": "medium",
+    "large": "large",
+    "full": "full"
+  };
+  var FillMode = {
+    "solid": "solid",
+    "flat": "flat",
+    "outline": "outline",
+    "clear": "clear",
+    "link": "link"
+  };
+  var ThemeColor = {
+    "inherit": "inherit",
+    "base": "base",
+    "primary": "primary",
+    "secondary": "secondary",
+    "tertiary": "tertiary",
+    "info": "info",
+    "success": "success",
+    "warning": "warning",
+    "error": "error",
+    "dark": "dark",
+    "light": "light",
+    "inverse": "inverse"
+  };
+  var States = {
+    "open": "open",
+    "hover": "hover",
+    "focus": "focus",
+    "active": "active",
+    "selected": "selected",
+    "disabled": "disabled",
+    "valid": "valid",
+    "invalid": "invalid",
+    "loading": "loading",
+    "required": "required",
+    "empty": "empty",
+    "indeterminate": "indeterminate",
+    "checked": "checked",
+    "readonly": "readonly"
+  };
+
+  // src/icon/icon.spec.tsx
+  var import_jsx_runtime = __require("react/jsx-runtime");
+  var ICON_CLASSNAME = `k-icon`;
+  var states = [];
+  var options = {
+    size: [Size.xsmall, Size.small, Size.medium, Size.large, Size.xlarge, Size.xxlarge, Size.xxxlarge],
+    themeColor: [
+      ThemeColor.base,
+      ThemeColor.primary,
+      ThemeColor.secondary,
+      ThemeColor.tertiary,
+      ThemeColor.success,
+      ThemeColor.warning,
+      ThemeColor.error,
+      ThemeColor.info,
+      ThemeColor.light,
+      ThemeColor.dark
+    ]
+  };
+  var defaultProps = {};
+  var Icon = (props) => {
+    const _a = props, {
+      size,
+      themeColor,
+      name,
+      rotate,
+      flip
+    } = _a, other = __objRest(_a, [
+      "size",
+      "themeColor",
+      "name",
+      "rotate",
+      "flip"
+    ]);
+    if (!name) {
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {});
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "span",
+      __spreadProps(__spreadValues({}, other), {
+        className: classNames(
+          props.className,
+          ICON_CLASSNAME,
+          optionClassNames(ICON_CLASSNAME, {
+            size,
+            themeColor
+          }),
+          {
+            [`k-i-${name}`]: name,
+            [`k-rotate-${rotate}`]: rotate,
+            [`k-flip-${flip}`]: flip
+          }
+        )
+      })
+    );
+  };
+  Icon.states = states;
+  Icon.options = options;
+  Icon.className = ICON_CLASSNAME;
+  Icon.defaultProps = defaultProps;
+
+  // src/button/button.spec.tsx
+  var import_jsx_runtime2 = __require("react/jsx-runtime");
+  var BUTTON_CLASSNAME = `k-button`;
+  var states2 = [
+    States.hover,
+    States.focus,
+    States.active,
+    States.selected,
+    States.disabled
+  ];
+  var options2 = {
+    size: [Size.small, Size.medium, Size.large],
+    rounded: [Roundness.small, Roundness.medium, Roundness.large, Roundness.full],
+    fillMode: [FillMode.solid, FillMode.flat, FillMode.outline, FillMode.clear, FillMode.link],
+    themeColor: [
+      ThemeColor.base,
+      ThemeColor.primary,
+      ThemeColor.secondary,
+      ThemeColor.tertiary,
+      ThemeColor.success,
+      ThemeColor.warning,
+      ThemeColor.error,
+      ThemeColor.info,
+      ThemeColor.light,
+      ThemeColor.dark,
+      ThemeColor.inverse
+    ]
+  };
+  var defaultProps2 = {
+    size: Size.medium,
+    rounded: Roundness.medium,
+    fillMode: FillMode.solid,
+    themeColor: ThemeColor.base,
+    showArrow: false,
+    arrowIconName: "arrow-s"
+  };
+  var Button = (props) => {
+    const _a = props, {
+      size = defaultProps2.size,
+      rounded = defaultProps2.rounded,
+      fillMode = defaultProps2.fillMode,
+      themeColor = defaultProps2.themeColor,
+      hover,
+      focus,
+      active,
+      selected,
+      disabled,
+      icon,
+      text,
+      iconClassName,
+      showArrow = defaultProps2.showArrow,
+      arrowIconName = defaultProps2.arrowIconName
+    } = _a, other = __objRest(_a, [
+      "size",
+      "rounded",
+      "fillMode",
+      "themeColor",
+      "hover",
+      "focus",
+      "active",
+      "selected",
+      "disabled",
+      "icon",
+      "text",
+      "iconClassName",
+      "showArrow",
+      "arrowIconName"
+    ]);
+    const hasIcon = icon !== void 0;
+    const hasChildren = props.children !== void 0;
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+      "button",
+      __spreadProps(__spreadValues({}, other), {
+        className: classNames(
+          props.className,
+          BUTTON_CLASSNAME,
+          optionClassNames(BUTTON_CLASSNAME, {
+            size,
+            rounded,
+            fillMode,
+            themeColor
+          }),
+          stateClassNames(BUTTON_CLASSNAME, {
+            hover,
+            focus,
+            active,
+            disabled,
+            selected
+          }),
+          {
+            ["k-icon-button"]: !text && !hasChildren && hasIcon
+          }
+        ),
+        children: [
+          icon && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+            Icon,
+            {
+              className: classNames(iconClassName, "k-button-icon"),
+              name: icon
+            }
+          ),
+          text ? /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
+            text && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "k-button-text", children: text }),
+            props.children
+          ] }) : props.children && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "k-button-text", children: props.children }),
+          showArrow && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "k-menu-button-arrow k-button-arrow", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Icon, { name: arrowIconName }) })
+        ]
+      })
+    );
+  };
+  Button.states = states2;
+  Button.options = options2;
+  Button.className = BUTTON_CLASSNAME;
+  Button.defaultProps = defaultProps2;
+
+  // src/action-buttons/action-buttons.spec.tsx
+  var import_jsx_runtime3 = __require("react/jsx-runtime");
+  var ACTIONBUTTONS_CLASSNAME = `k-actions`;
+  var states3 = [];
+  var options3 = {};
+  var defaultProps3 = {
+    alignment: "start",
+    orientation: "horizontal"
+  };
+  var ActionButtons = (props) => {
+    const _a = props, {
+      alignment = defaultProps3.alignment,
+      orientation = defaultProps3.orientation
+    } = _a, other = __objRest(_a, [
+      "alignment",
+      "orientation"
+    ]);
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      "div",
+      __spreadProps(__spreadValues({}, other), {
+        className: classNames(
+          ACTIONBUTTONS_CLASSNAME,
+          {
+            [`${ACTIONBUTTONS_CLASSNAME}-${alignment}`]: alignment,
+            [`${ACTIONBUTTONS_CLASSNAME}-${orientation}`]: orientation
+          },
+          props.className
+        ),
+        children: props.children
+      })
+    );
+  };
+  ActionButtons.states = states3;
+  ActionButtons.options = options3;
+  ActionButtons.className = ACTIONBUTTONS_CLASSNAME;
+  ActionButtons.defaultProps = defaultProps3;
+
+  // src/window/window.spec.tsx
+  var import_jsx_runtime4 = __require("react/jsx-runtime");
+  var WINDOW_CLASSNAME = `k-window`;
+  var states4 = [];
+  var options4 = {
+    themeColor: [
+      ThemeColor.primary,
+      ThemeColor.light,
+      ThemeColor.dark
+    ]
+  };
+  var defaultProps4 = {};
+  var Window = (props) => {
+    const _a = props, {
+      title,
+      actions,
+      minimized,
+      themeColor,
+      actionButtons,
+      actionButtonsAlign
+    } = _a, other = __objRest(_a, [
+      "title",
+      "actions",
+      "minimized",
+      "themeColor",
+      "actionButtons",
+      "actionButtonsAlign"
+    ]);
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+      "div",
+      __spreadProps(__spreadValues({}, other), {
+        className: classNames(
+          props.className,
+          WINDOW_CLASSNAME,
+          optionClassNames(WINDOW_CLASSNAME, { themeColor }),
+          {
+            [`${WINDOW_CLASSNAME}-minimized`]: minimized
+          }
+        ),
+        children: [
+          (title !== void 0 || actions) && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "k-window-titlebar", children: [
+            title !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "k-window-title", children: title }),
+            actions && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_jsx_runtime4.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "k-window-titlebar-actions", children: actions.map(
+              (actionName) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Button, { icon: actionName, fillMode: "flat", className: "k-window-titlebar-action" }, actionName)
+            ) }) })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: classNames(
+            "k-window-content",
+            {
+              "k-hidden": minimized
+            }
+          ), children: props.children }),
+          actionButtons && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ActionButtons, { alignment: actionButtonsAlign, className: "k-window-actions", children: actionButtons })
+        ]
+      })
+    );
+  };
+  Window.states = states4;
+  Window.options = options4;
+  Window.className = WINDOW_CLASSNAME;
+  Window.defaultProps = defaultProps4;
+
+  // src/input/input.spec.tsx
+  var import_jsx_runtime5 = __require("react/jsx-runtime");
+  var INPUT_CLASSNAME = `k-input`;
+  var states5 = [
+    States.hover,
+    States.focus,
+    States.valid,
+    States.invalid,
+    States.required,
+    States.disabled,
+    States.loading,
+    States.readonly
+  ];
+  var options5 = {
+    size: [Size.small, Size.medium, Size.large],
+    rounded: [Roundness.small, Roundness.medium, Roundness.large, Roundness.full],
+    fillMode: [FillMode.solid, FillMode.flat, FillMode.outline]
+  };
+  var defaultProps5 = {
+    size: Size.medium,
+    rounded: Size.medium,
+    fillMode: FillMode.solid
+  };
+  var Input = (props) => {
+    const _a = props, {
+      hover,
+      focus,
+      disabled,
+      invalid,
+      valid,
+      loading,
+      readonly,
+      size = defaultProps5.size,
+      rounded = defaultProps5.rounded,
+      fillMode = defaultProps5.fillMode
+    } = _a, other = __objRest(_a, [
+      "hover",
+      "focus",
+      "disabled",
+      "invalid",
+      "valid",
+      "loading",
+      "readonly",
+      "size",
+      "rounded",
+      "fillMode"
+    ]);
+    return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+      "span",
+      __spreadProps(__spreadValues({}, other), {
+        className: classNames(
+          props.className,
+          INPUT_CLASSNAME,
+          optionClassNames(INPUT_CLASSNAME, { size, rounded, fillMode }),
+          stateClassNames(INPUT_CLASSNAME, { hover, focus, disabled, invalid, valid, loading, readonly })
+        )
+      })
+    );
+  };
+  Input.states = states5;
+  Input.options = options5;
+  Input.className = INPUT_CLASSNAME;
+  Input.defaultProps = defaultProps5;
+
+  // src/input/picker.spec.tsx
+  var import_jsx_runtime6 = __require("react/jsx-runtime");
+  var PICKER_CLASSNAME = `k-picker`;
+  var pickerStates = [
+    States.hover,
+    States.focus,
+    States.valid,
+    States.invalid,
+    States.required,
+    States.disabled,
+    States.loading,
+    States.readonly
+  ];
+  var pickerOptions = {
+    size: [Size.small, Size.medium, Size.large],
+    rounded: [Roundness.small, Roundness.medium, Roundness.large, Roundness.full],
+    fillMode: [FillMode.solid, FillMode.flat, FillMode.outline]
+  };
+  var defaultProps6 = {
+    size: Size.medium,
+    rounded: Roundness.medium,
+    fillMode: FillMode.solid
+  };
+  var Picker = (props) => {
+    const _a = props, {
+      hover,
+      focus,
+      disabled,
+      invalid,
+      valid,
+      loading,
+      readonly,
+      size = defaultProps6.size,
+      rounded = defaultProps6.rounded,
+      fillMode = defaultProps6.fillMode
+    } = _a, other = __objRest(_a, [
+      "hover",
+      "focus",
+      "disabled",
+      "invalid",
+      "valid",
+      "loading",
+      "readonly",
+      "size",
+      "rounded",
+      "fillMode"
+    ]);
+    return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+      "span",
+      __spreadProps(__spreadValues({}, other), {
+        className: classNames(
+          props.className,
+          PICKER_CLASSNAME,
+          optionClassNames(PICKER_CLASSNAME, { size, rounded, fillMode }),
+          stateClassNames(PICKER_CLASSNAME, { hover, focus, disabled, invalid, valid, loading, readonly })
+        ),
+        children: props.children
+      })
+    );
+  };
+  Picker.states = pickerStates;
+  Picker.options = pickerOptions;
+  Picker.className = PICKER_CLASSNAME;
+  Picker.defaultProps = defaultProps6;
+
+  // src/input/input-clear-value.tsx
+  var import_jsx_runtime7 = __require("react/jsx-runtime");
+  var className = `k-clear-value`;
+  var states6 = [
+    States.disabled,
+    States.loading,
+    States.readonly
+  ];
+  var options6 = {};
+  var InputClearValue = (props) => {
+    const {
+      disabled,
+      loading,
+      readonly,
+      value
+    } = props;
+    if (disabled || readonly || loading || !value) {
+      return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_jsx_runtime7.Fragment, {});
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: classNames(props.className, className), children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Icon, { name: "x" }) });
+  };
+  InputClearValue.states = states6;
+  InputClearValue.options = options6;
+  InputClearValue.className = className;
+
+  // src/input/input-inner-input.tsx
+  var import_jsx_runtime8 = __require("react/jsx-runtime");
+  var className2 = `k-input-inner`;
+  var states7 = [];
+  var options7 = {};
+  var defaultProps7 = {
+    type: "text",
+    autocomplete: "off",
+    value: "",
+    placeholder: ""
+  };
+  var InputInnerInput = (props) => {
+    const _a = props, {
+      value = defaultProps7.value,
+      type = defaultProps7.type,
+      placeholder = defaultProps7.placeholder,
+      autocomplete = defaultProps7.autocomplete
+    } = _a, other = __objRest(_a, [
+      "value",
+      "type",
+      "placeholder",
+      "autocomplete"
+    ]);
+    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+      "input",
+      __spreadProps(__spreadValues({}, other), {
+        type,
+        className: classNames(props.className, className2, optionClassNames(className2, props)),
+        placeholder,
+        autoComplete: autocomplete,
+        defaultValue: value
+      })
+    );
+  };
+  InputInnerInput.states = states7;
+  InputInnerInput.options = options7;
+  InputInnerInput.className = className2;
+
+  // src/input/input-inner-span.tsx
+  var import_jsx_runtime9 = __require("react/jsx-runtime");
+  var className3 = `k-input-inner`;
+  var states8 = [];
+  var options8 = {};
+  var InputInnerSpan = (props) => {
+    const _a = props, {
+      value,
+      placeholder,
+      showValue,
+      valueIcon,
+      valueIconName
+    } = _a, other = __objRest(_a, [
+      "value",
+      "placeholder",
+      "showValue",
+      "valueIcon",
+      "valueIconName"
+    ]);
+    return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+      "span",
+      __spreadProps(__spreadValues({}, other), {
+        className: classNames(props.className, className3, optionClassNames(className3, props)),
+        children: [
+          valueIcon,
+          !valueIcon && valueIconName && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Icon, { className: "k-input-value-icon", name: valueIconName }),
+          showValue && !value && placeholder,
+          showValue && value && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "k-input-value-text", children: value })
+        ]
+      })
+    );
+  };
+  InputInnerSpan.states = states8;
+  InputInnerSpan.options = options8;
+  InputInnerSpan.className = className3;
+
+  // src/input/input-inner-textarea.tsx
+  var import_jsx_runtime10 = __require("react/jsx-runtime");
+  var defaultProps8 = {
+    value: "",
+    placeholder: ""
+  };
+  var className4 = `k-input-inner`;
+  var states9 = [];
+  var options9 = {};
+  var InputInnerTextarea = (props) => {
+    const _a = props, {
+      value = defaultProps8.value,
+      placeholder = defaultProps8.placeholder,
+      rows
+    } = _a, other = __objRest(_a, [
+      "value",
+      "placeholder",
+      "rows"
+    ]);
+    return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+      "textarea",
+      __spreadProps(__spreadValues({}, other), {
+        className: classNames(props.className, className4, optionClassNames(className4, props)),
+        placeholder,
+        rows,
+        children: value
+      })
+    );
+  };
+  InputInnerTextarea.states = states9;
+  InputInnerTextarea.options = options9;
+  InputInnerTextarea.className = className4;
+
+  // src/input/input-loading-icon.tsx
+  var import_jsx_runtime11 = __require("react/jsx-runtime");
+  var className5 = `k-input-loading-icon`;
+  var states10 = [
+    States.disabled,
+    States.loading
+  ];
+  var InputLoadingIcon = (props) => {
+    const {
+      disabled,
+      loading
+    } = props;
+    if (disabled || !loading) {
+      return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_jsx_runtime11.Fragment, {});
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Icon, { className: classNames(props.className, className5), name: "loading" });
+  };
+
+  // src/input/input-validation-icon.tsx
+  var import_jsx_runtime12 = __require("react/jsx-runtime");
+  var className6 = `k-input-validation-icon`;
+  var states11 = [
+    States.valid,
+    States.invalid,
+    States.disabled,
+    States.loading
+  ];
+  var options10 = {};
+  var InputValidationIcon = (props) => {
+    const {
+      valid,
+      invalid,
+      disabled,
+      loading
+    } = props;
+    const iconName = invalid ? "warning" : "check";
+    const renderValidationIcon = Boolean(valid || invalid);
+    if (disabled || loading || !renderValidationIcon) {
+      return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_jsx_runtime12.Fragment, {});
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Icon, { className: classNames(className6), name: iconName });
+  };
+  InputValidationIcon.states = states11;
+  InputValidationIcon.options = options10;
+  InputValidationIcon.className = className6;
+
+  // src/input/input-prefix.tsx
+  var import_jsx_runtime13 = __require("react/jsx-runtime");
+  var className7 = `k-input-prefix`;
+  var InputPrefix = (props) => {
+    if (!props.children) {
+      return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_jsx_runtime13.Fragment, {});
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: classNames(className7, props.className), children: props.children });
+  };
+
+  // src/input/input-suffix.tsx
+  var import_jsx_runtime14 = __require("react/jsx-runtime");
+  var className8 = `k-input-suffix`;
+  var InputSuffix = (props) => {
+    if (!props.children) {
+      return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_jsx_runtime14.Fragment, {});
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: classNames(className8, props.className), children: props.children });
+  };
+
+  // src/textbox/textbox.spec.tsx
+  var import_jsx_runtime15 = __require("react/jsx-runtime");
+  var TEXTBOX_CLASSNAME = `k-textbox`;
+  var states12 = [
+    States.hover,
+    States.focus,
+    States.valid,
+    States.invalid,
+    States.required,
+    States.disabled,
+    States.loading,
+    States.readonly
+  ];
+  var options11 = {
+    size: [Size.small, Size.medium, Size.large],
+    rounded: [Roundness.small, Roundness.medium, Roundness.large, Roundness.full],
+    fillMode: [FillMode.solid, FillMode.flat, FillMode.outline]
+  };
+  var defaultProps9 = {
+    showClearButton: true,
+    size: Input.defaultProps.size,
+    rounded: Input.defaultProps.rounded,
+    fillMode: Input.defaultProps.fillMode
+  };
+  var Textbox = (props) => {
+    const _a = props, {
+      prefix,
+      suffix,
+      value,
+      placeholder,
+      size,
+      rounded,
+      fillMode,
+      hover,
+      focus,
+      valid,
+      invalid,
+      required,
+      loading,
+      disabled,
+      readonly,
+      showClearButton = defaultProps9.showClearButton
+    } = _a, other = __objRest(_a, [
+      "prefix",
+      "suffix",
+      "value",
+      "placeholder",
+      "size",
+      "rounded",
+      "fillMode",
+      "hover",
+      "focus",
+      "valid",
+      "invalid",
+      "required",
+      "loading",
+      "disabled",
+      "readonly",
+      "showClearButton"
+    ]);
+    return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+      Input,
+      __spreadProps(__spreadValues({}, other), {
+        size,
+        rounded,
+        fillMode,
+        hover,
+        focus,
+        valid,
+        invalid,
+        required,
+        loading,
+        disabled,
+        readonly,
+        className: classNames(props.className, TEXTBOX_CLASSNAME),
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(InputPrefix, { children: prefix }),
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(InputInnerInput, { placeholder, value }),
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+            InputValidationIcon,
+            {
+              valid,
+              invalid,
+              loading,
+              disabled
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+            InputLoadingIcon,
+            {
+              loading,
+              disabled
+            }
+          ),
+          showClearButton && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+            InputClearValue,
+            {
+              loading,
+              disabled,
+              readonly,
+              value
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(InputSuffix, { children: suffix })
+        ]
+      })
+    );
+  };
+  Textbox.states = states12;
+  Textbox.options = options11;
+  Textbox.className = TEXTBOX_CLASSNAME;
+  Textbox.defaultProps = defaultProps9;
+
+  // src/popup/popup.spec.tsx
+  var import_jsx_runtime16 = __require("react/jsx-runtime");
+  var POPUP_CLASSNAME = `k-popup`;
+  var states13 = [];
+  var options12 = {};
+  var defaultProps10 = {};
+  var Popup = (props) => {
+    const other = __objRest(props, []);
+    return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", __spreadProps(__spreadValues({}, other), { className: classNames(props.className, POPUP_CLASSNAME), children: props.children }));
+  };
+  Popup.states = states13;
+  Popup.options = options12;
+  Popup.className = POPUP_CLASSNAME;
+  Popup.defaultProps = defaultProps10;
+
+  // src/button-group/button-group.spec.tsx
+  var import_jsx_runtime17 = __require("react/jsx-runtime");
+  var BUTTONGROUP_CLASSNAME = `k-button-group`;
+  var states14 = [
+    States.disabled
+  ];
+  var options13 = {
+    fillMode: [FillMode.solid, FillMode.flat, FillMode.outline, FillMode.clear, FillMode.link]
+  };
+  var defaultProps11 = {
+    fillMode: FillMode.solid
+  };
+  var ButtonGroup = (props) => {
+    const _a = props, {
+      fillMode = defaultProps11.fillMode,
+      disabled,
+      stretched
+    } = _a, other = __objRest(_a, [
+      "fillMode",
+      "disabled",
+      "stretched"
+    ]);
+    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+      "div",
+      __spreadProps(__spreadValues({}, other), {
+        className: classNames(
+          props.className,
+          BUTTONGROUP_CLASSNAME,
+          optionClassNames(BUTTONGROUP_CLASSNAME, {
+            fillMode
+          }),
+          stateClassNames(BUTTONGROUP_CLASSNAME, {
+            disabled
+          }),
+          {
+            [`${BUTTONGROUP_CLASSNAME}-stretched`]: stretched
+          }
+        ),
+        children: props.children
+      })
+    );
+  };
+  ButtonGroup.states = states14;
+  ButtonGroup.options = options13;
+  ButtonGroup.className = BUTTONGROUP_CLASSNAME;
+  ButtonGroup.defaultProps = defaultProps11;
+
+  // src/calendar/calendar.spec.tsx
+  var import_jsx_runtime18 = __require("react/jsx-runtime");
+  var CALENDAR_CLASSNAME = `k-calendar`;
+  var states15 = [];
+  var options14 = {
+    size: [Size.small, Size.medium, Size.large]
+  };
+  var defaultProps12 = {
+    size: Size.medium,
+    viewsCount: 1,
+    orientation: "horizontal",
+    calendarView: "month",
+    calendarHeaderText: "October 2021"
+  };
+  var Calendar = (props) => {
+    const _a = props, {
+      size = defaultProps12.size,
+      orientation = defaultProps12.orientation,
+      calendarView = defaultProps12.calendarView,
+      calendarHeaderText = defaultProps12.calendarHeaderText,
+      viewsCount = defaultProps12.viewsCount,
+      showWeek,
+      showOtherMonth,
+      showCalendarCaption,
+      showCalendarFooter,
+      selectedRange
+    } = _a, other = __objRest(_a, [
+      "size",
+      "orientation",
+      "calendarView",
+      "calendarHeaderText",
+      "viewsCount",
+      "showWeek",
+      "showOtherMonth",
+      "showCalendarCaption",
+      "showCalendarFooter",
+      "selectedRange"
+    ]);
+    return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+      "div",
+      __spreadProps(__spreadValues({}, other), {
+        className: classNames(
+          props.className,
+          CALENDAR_CLASSNAME,
+          optionClassNames(CALENDAR_CLASSNAME, {
+            size
+          }),
+          {
+            "k-week-number": showWeek
+          }
+        ),
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+            CalendarHeader,
+            {
+              showToday: showCalendarFooter ? false : true,
+              calendarHeaderText,
+              orientation,
+              size
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+            CalendarView,
+            {
+              calendarView,
+              viewsCount,
+              orientation,
+              showWeek,
+              showOtherMonth,
+              showCalendarCaption,
+              selectedRange
+            }
+          ),
+          showCalendarFooter && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(CalendarFooter, {})
+        ]
+      })
+    );
+  };
+  Calendar.states = states15;
+  Calendar.options = options14;
+  Calendar.className = CALENDAR_CLASSNAME;
+  Calendar.defaultProps = defaultProps12;
+
+  // src/calendar/calendar-cell.tsx
+  var import_jsx_runtime19 = __require("react/jsx-runtime");
+  var states16 = [
+    States.hover,
+    States.focus,
+    States.active,
+    States.selected,
+    States.disabled
+  ];
+  var CalendarCell = (props) => {
+    const _a = props, {
+      text,
+      headerCell,
+      today,
+      weekend,
+      otherMonth,
+      showOtherMonth,
+      weekCell,
+      rangeStart,
+      rangeMid,
+      rangeEnd,
+      hover,
+      focus,
+      active,
+      selected,
+      disabled
+    } = _a, other = __objRest(_a, [
+      "text",
+      "headerCell",
+      "today",
+      "weekend",
+      "otherMonth",
+      "showOtherMonth",
+      "weekCell",
+      "rangeStart",
+      "rangeMid",
+      "rangeEnd",
+      "hover",
+      "focus",
+      "active",
+      "selected",
+      "disabled"
+    ]);
+    const cellType = headerCell ? "th" : "td";
+    const CALENDARCELL_CLASSNAME = `k-calendar-${cellType}`;
+    const calendarCellClasses = [
+      props.className,
+      CALENDARCELL_CLASSNAME,
+      stateClassNames(CALENDARCELL_CLASSNAME, {
+        hover,
+        focus,
+        active,
+        selected,
+        disabled
+      }),
+      {
+        "k-today": today,
+        "k-weekend": weekend,
+        "k-other-month": otherMonth,
+        "k-alt": weekCell,
+        "k-range-start": rangeStart,
+        "k-range-mid": rangeMid,
+        "k-range-end": rangeEnd
+      }
+    ];
+    if (headerCell) {
+      return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("th", __spreadProps(__spreadValues({}, other), { className: classNames(calendarCellClasses), children: text }));
+    }
+    if (weekCell) {
+      return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("td", __spreadProps(__spreadValues({}, other), { className: classNames(calendarCellClasses), children: text }));
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("td", __spreadProps(__spreadValues({}, other), { className: classNames(calendarCellClasses), children: otherMonth && !showOtherMonth ? "" : /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "k-link", children: text }) }));
+  };
+
+  // src/calendar/calendar-header.tsx
+  var import_jsx_runtime20 = __require("react/jsx-runtime");
+  var className9 = `k-calendar-header`;
+  var options15 = {
+    size: [Size.small, Size.medium, Size.large]
+  };
+  var defaultProps13 = {
+    calendarHeaderText: "October 2021",
+    showToday: true,
+    orientation: "horizontal",
+    size: Size.medium
+  };
+  var CalendarHeader = (props) => {
+    const _a = props, {
+      calendarHeaderText = defaultProps13.calendarHeaderText,
+      showToday = defaultProps13.showToday,
+      orientation = defaultProps13.orientation,
+      size = defaultProps13.size
+    } = _a, other = __objRest(_a, [
+      "calendarHeaderText",
+      "showToday",
+      "orientation",
+      "size"
+    ]);
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+      "div",
+      __spreadProps(__spreadValues({}, other), {
+        className: classNames(
+          props.className,
+          className9,
+          {
+            "k-vstack": orientation === "vertical"
+          }
+        ),
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Button, { className: "k-calendar-title", text: calendarHeaderText, size, fillMode: "flat" }),
+          /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "k-spacer" }),
+          /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("span", { className: "k-calendar-nav", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Button, { className: "k-calendar-nav-prev", icon: "arrow-chevron-left", size, fillMode: "flat" }),
+            showToday && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Button, { size, fillMode: "flat", themeColor: "primary", className: "k-calendar-nav-today", children: "Today" }),
+            /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Button, { className: "k-calendar-nav-next", icon: "arrow-chevron-right", size, fillMode: "flat" })
+          ] })
+        ]
+      })
+    );
+  };
+
+  // src/calendar/calendar-footer.tsx
+  var import_jsx_runtime21 = __require("react/jsx-runtime");
+  var className10 = `k-calendar-footer`;
+  var CalendarFooter = (props) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", __spreadProps(__spreadValues({}, props), { className: classNames(props.className, className10), children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Button, { fillMode: "flat", themeColor: "primary", className: "k-calendar-nav-today", children: "Monday, October 29, 2021" }) }));
+
+  // src/calendar/calendar-table.tsx
+  var import_jsx_runtime22 = __require("react/jsx-runtime");
+  var CALENDARTABLE_CLASSNAME = `k-calendar-table`;
+  var CalendarTable = (props) => {
+    const _a = props, {
+      calendarView,
+      showOtherMonth,
+      showWeek,
+      showCalendarCaption,
+      selectedRange
+    } = _a, other = __objRest(_a, [
+      "calendarView",
+      "showOtherMonth",
+      "showWeek",
+      "showCalendarCaption",
+      "selectedRange"
+    ]);
+    if (calendarView === "year") {
+      return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+        "table",
+        __spreadProps(__spreadValues({}, other), {
+          className: classNames(
+            props.className,
+            CALENDARTABLE_CLASSNAME
+          ),
+          children: [
+            showCalendarCaption && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("caption", { className: "k-calendar-caption", children: "2022" }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("tbody", { className: "k-calendar-tbody", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("tr", { className: "k-calendar-tr", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "Jan" }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "Feb" }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "Mar" }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "Apr" })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("tr", { className: "k-calendar-tr", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "May" }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "Jun", hover: true }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "Jul", focus: true }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "Au", selected: true })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("tr", { className: "k-calendar-tr", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "Sep" }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "Oct", today: true }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "Nov" }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "Dec" })
+              ] })
+            ] })
+          ]
+        })
+      );
+    }
+    if (calendarView === "decade") {
+      return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+        "table",
+        __spreadProps(__spreadValues({}, other), {
+          className: classNames(
+            props.className,
+            CALENDARTABLE_CLASSNAME
+          ),
+          children: [
+            showCalendarCaption && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("caption", { className: "k-calendar-caption", children: "2020 - 2029" }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("tbody", { className: "k-calendar-tbody", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("tr", { className: "k-calendar-tr", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { className: "k-out-of-range" }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "2020" }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "2021", today: true }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "2022" })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("tr", { className: "k-calendar-tr", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "2023" }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "2024", hover: true }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "2025", focus: true }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "2026", selected: true })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("tr", { className: "k-calendar-tr", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "2027" }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "2028" }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "2029" }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { className: "k-out-of-range" })
+              ] })
+            ] })
+          ]
+        })
+      );
+    }
+    if (calendarView === "century") {
+      return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+        "table",
+        __spreadProps(__spreadValues({}, other), {
+          className: classNames(
+            props.className,
+            CALENDARTABLE_CLASSNAME
+          ),
+          children: [
+            showCalendarCaption && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("caption", { className: "k-calendar-caption", children: "2000 - 2099" }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("tbody", { className: "k-calendar-tbody", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("tr", { className: "k-calendar-tr", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "1990 - 1999" }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "2000 - 2009" }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "2010 - 2019", today: true }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "2020 - 2029" })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("tr", { className: "k-calendar-tr", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "2030 - 2039" }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "2040 - 2049", hover: true }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "2050 - 2059", focus: true }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "2060 - 2069", selected: true })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("tr", { className: "k-calendar-tr", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "2070 - 2079" }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "2080 - 2089" }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "2090 - 2099" }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { className: "k-out-of-range" })
+              ] })
+            ] })
+          ]
+        })
+      );
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+      "table",
+      __spreadProps(__spreadValues({}, other), {
+        className: classNames(
+          props.className,
+          CALENDARTABLE_CLASSNAME
+        ),
+        children: [
+          showCalendarCaption && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("caption", { className: "k-calendar-caption", children: "October 2021" }),
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarTableHead, { showWeek }),
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("tbody", { className: "k-calendar-tbody", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("tr", { className: "k-calendar-tr", children: [
+              showWeek && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "39", weekCell: true }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "30", otherMonth: true, showOtherMonth }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "1" }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "2" }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "3" }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "4" }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "5" }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "6", weekend: true })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("tr", { className: "k-calendar-tr", children: [
+              showWeek && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "40", weekCell: true }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "7", weekend: true }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "8", hover: true }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "9", focus: true }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "10", selected: true }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "11", hover: true, focus: true }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "12", hover: true, selected: true }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "13", weekend: true })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("tr", { className: "k-calendar-tr", children: [
+              showWeek && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "41", weekCell: true }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "14", weekend: true }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "15" }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "16", today: true }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "17" }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "18" }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "19" }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "20", weekend: true })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("tr", { className: "k-calendar-tr", children: [
+              showWeek && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "42", weekCell: true }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "21", weekend: true }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "22" }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "23" }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "24" }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "25", rangeStart: selectedRange, selected: selectedRange }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "26", rangeMid: selectedRange }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "27", weekend: true, rangeMid: selectedRange })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("tr", { className: "k-calendar-tr", children: [
+              showWeek && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "43", weekCell: true }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "28", weekend: true, rangeMid: selectedRange }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "29", rangeEnd: selectedRange, focus: selectedRange, selected: selectedRange }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "30" }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "31" }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "1", otherMonth: true, showOtherMonth }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "2", otherMonth: true, showOtherMonth }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "3", otherMonth: true, weekend: true, showOtherMonth })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("tr", { className: "k-calendar-tr", children: [
+              showWeek && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "44", weekCell: true }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "4", otherMonth: true, weekend: true, showOtherMonth }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "5", otherMonth: true, showOtherMonth }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "6", otherMonth: true, showOtherMonth }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "7", otherMonth: true, showOtherMonth }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "8", otherMonth: true, showOtherMonth }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "9", otherMonth: true, showOtherMonth }),
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CalendarCell, { text: "10", otherMonth: true, weekend: true, showOtherMonth })
+            ] })
+          ] })
+        ]
+      })
+    );
+  };
+
+  // src/calendar/calendar-table-head.tsx
+  var import_jsx_runtime23 = __require("react/jsx-runtime");
+  var className11 = `k-calendar-thead`;
+  var CalendarTableHead = (props) => {
+    const _a = props, {
+      showWeek
+    } = _a, other = __objRest(_a, [
+      "showWeek"
+    ]);
+    return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+      "thead",
+      __spreadProps(__spreadValues({}, other), {
+        className: classNames(props.className, className11),
+        children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("tr", { className: "k-calendar-tr", children: [
+          showWeek && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(CalendarCell, { weekCell: true, headerCell: true }),
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(CalendarCell, { text: "Su", headerCell: true }),
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(CalendarCell, { text: "Mo", headerCell: true }),
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(CalendarCell, { text: "Tu", headerCell: true }),
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(CalendarCell, { text: "We", headerCell: true }),
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(CalendarCell, { text: "Th", headerCell: true }),
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(CalendarCell, { text: "Fr", headerCell: true }),
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(CalendarCell, { text: "Sa", headerCell: true })
+        ] })
+      })
+    );
+  };
+
+  // src/calendar/calendar-view.tsx
+  var import_jsx_runtime24 = __require("react/jsx-runtime");
+  var className12 = `k-calendar-view`;
+  var defaultProps14 = {
+    viewsCount: 1,
+    orientation: "horizontal",
+    calendarView: "month"
+  };
+  var CalendarView = (props) => {
+    const _a = props, {
+      orientation = defaultProps14.orientation,
+      calendarView = defaultProps14.calendarView,
+      viewsCount = defaultProps14.viewsCount,
+      showWeek,
+      showOtherMonth,
+      showCalendarCaption,
+      selectedRange
+    } = _a, other = __objRest(_a, [
+      "orientation",
+      "calendarView",
+      "viewsCount",
+      "showWeek",
+      "showOtherMonth",
+      "showCalendarCaption",
+      "selectedRange"
+    ]);
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+      "div",
+      __spreadProps(__spreadValues({}, other), {
+        className: classNames(
+          props.className,
+          className12,
+          `k-calendar-${calendarView}view`,
+          "k-align-items-start",
+          "k-justify-content-center",
+          {
+            "k-hstack": orientation === "horizontal",
+            "k-vstack": orientation === "vertical"
+          }
+        ),
+        children: [...Array(viewsCount)].map(
+          (_e, i) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+            CalendarTable,
+            {
+              calendarView,
+              showWeek,
+              showOtherMonth,
+              showCalendarCaption,
+              selectedRange
+            },
+            i
+          )
+        )
+      })
+    );
+  };
+
+  // src/time-selector/time-selector.spec.tsx
+  var import_jsx_runtime25 = __require("react/jsx-runtime");
+  var TIMESELECTOR_CLASSNAME = `k-timeselector`;
+  var states17 = [];
+  var options16 = {
+    size: [Size.small, Size.medium, Size.large]
+  };
+  var defaultProps15 = {
+    size: Size.medium
+  };
+  var TimeSelector = (props) => {
+    const _a = props, {
+      size = defaultProps15.size,
+      header,
+      fastSelection,
+      columns,
+      focusedColumn
+    } = _a, other = __objRest(_a, [
+      "size",
+      "header",
+      "fastSelection",
+      "columns",
+      "focusedColumn"
+    ]);
+    const columnsDom = columns.map(function(columnType, index) {
+      let focus = false;
+      let separator = true;
+      if (columnType === focusedColumn) {
+        focus = true;
+      }
+      if (index === 0 || columnType === "tt") {
+        separator = false;
+      }
+      return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_jsx_runtime25.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(TimeSelectorColumn, { type: columnType, focus, separator }) });
+    });
+    return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
+      "div",
+      __spreadProps(__spreadValues({}, other), {
+        className: classNames(
+          props.className,
+          TIMESELECTOR_CLASSNAME,
+          optionClassNames(TIMESELECTOR_CLASSNAME, {
+            size
+          })
+        ),
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_jsx_runtime25.Fragment, { children: header }),
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_jsx_runtime25.Fragment, { children: fastSelection }),
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "k-time-list-container", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "k-time-highlight" }),
+            columnsDom
+          ] })
+        ]
+      })
+    );
+  };
+  TimeSelector.states = states17;
+  TimeSelector.options = options16;
+  TimeSelector.className = TIMESELECTOR_CLASSNAME;
+  TimeSelector.defaultProps = defaultProps15;
+
+  // src/time-selector/time-selector-column.tsx
+  var import_jsx_runtime26 = __require("react/jsx-runtime");
+  var states18 = [
+    States.focus
+  ];
+  var TimeSelectorColumn = (props) => {
+    const _a = props, {
+      type,
+      focus,
+      separator
+    } = _a, other = __objRest(_a, [
+      "type",
+      "focus",
+      "separator"
+    ]);
+    let text;
+    let columnData = ["00", "01", "02", "03", "04", "05", "06", "07", "08", "09"];
+    switch (type) {
+      case "dd":
+        text = "Day";
+        break;
+      case "HH":
+        text = "Hour";
+        break;
+      case "mm":
+        text = "Minute";
+        break;
+      case "ss":
+        text = "Second";
+        break;
+      case "SSS":
+        text = "Millisecond";
+        columnData = ["000", "001", "002", "003", "004", "005", "006", "007", "008", "009"];
+        break;
+      case "tt":
+        text = "AM/PM";
+        columnData = ["AM", "PM"];
+        break;
+      default:
+        text = "Column Name";
+        break;
+    }
+    const items = columnData.map(
+      (data) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_jsx_runtime26.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("li", { className: "k-item", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { children: data }) }) })
+    );
+    return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_jsx_runtime26.Fragment, { children: [
+      separator && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "k-time-separator", children: ":" }),
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
+        "div",
+        __spreadProps(__spreadValues({}, other), {
+          className: classNames(
+            props.className,
+            "k-time-list-wrapper",
+            stateClassNames("k-time-list-wrapper", {
+              focus
+            })
+          ),
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: "k-title", children: text }),
+            /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "k-time-list", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "k-content k-scrollable k-time-container", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("ul", { className: "k-reset", style: { transform: "translateY(97px)" }, children: items }),
+              /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "k-scrollable-placeholder" })
+            ] }) })
+          ]
+        })
+      )
+    ] });
+  };
+
+  // src/time-selector/time-selector-header.tsx
+  var import_jsx_runtime27 = __require("react/jsx-runtime");
+  var className13 = `k-time-header`;
+  var TimeSelectorHeader = (props) => {
+    const _a = props, {
+      title
+    } = _a, other = __objRest(_a, [
+      "title"
+    ]);
+    return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
+      "div",
+      __spreadProps(__spreadValues({}, other), {
+        className: classNames(
+          props.className,
+          className13
+        ),
+        children: [
+          title != null && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "k-title", children: title }),
+          props.children
+        ]
+      })
+    );
+  };
+
+  // src/time-selector/time-selector-fast-selection.tsx
+  var import_jsx_runtime28 = __require("react/jsx-runtime");
+
+  // src/datetime-selector/datetime-selector.spec.tsx
+  var import_jsx_runtime29 = __require("react/jsx-runtime");
+  var DATETIMESELECTOR_CLASSNAME = `k-datetime-wrap`;
+  var states19 = [];
+  var options17 = {};
+  var defaultProps16 = {
+    tab: "date"
+  };
+  var DateTimeSelector = (props) => {
+    const _a = props, {
+      tab = defaultProps16.tab
+    } = _a, other = __objRest(_a, [
+      "tab"
+    ]);
+    return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
+      "div",
+      __spreadProps(__spreadValues({}, other), {
+        className: classNames(
+          props.className,
+          DATETIMESELECTOR_CLASSNAME,
+          {
+            "k-date-tab": tab === "date",
+            "k-time-tab": tab === "time"
+          }
+        ),
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "k-datetime-buttongroup", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(ButtonGroup, { stretched: true, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Button, { className: "k-group-start", selected: tab === "date", children: "Date" }),
+            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Button, { className: "k-group-end", selected: tab === "time", children: "Time" })
+          ] }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "k-datetime-selector", children: tab === "time" ? /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_jsx_runtime29.Fragment, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "k-datetime-calendar-wrap" }),
+            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "k-datetime-time-wrap", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(TimeSelector, { columns: ["HH", "mm", "ss", "tt"], focusedColumn: "mm", header: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(TimeSelectorHeader, { title: "10:00:00 AM", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Button, { fillMode: "flat", className: "k-time-now", children: "Now" }) }) }) })
+          ] }) : /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_jsx_runtime29.Fragment, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "k-datetime-calendar-wrap", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Calendar, { showOtherMonth: true }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "k-datetime-time-wrap" })
+          ] }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(ActionButtons, { className: "k-datetime-footer", alignment: "stretched", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Button, { themeColor: "primary", className: "k-time-accept", children: "Set" }),
+            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Button, { className: "k-time-cancel", children: "Cancel" })
+          ] })
+        ]
+      })
+    );
+  };
+  DateTimeSelector.states = states19;
+  DateTimeSelector.options = options17;
+  DateTimeSelector.className = DATETIMESELECTOR_CLASSNAME;
+  DateTimeSelector.defaultProps = defaultProps16;
+
+  // src/datetimepicker/datetimepicker.spec.tsx
+  var import_jsx_runtime30 = __require("react/jsx-runtime");
+  var DATETIMEPICKER_CLASSNAME = `k-datetimepicker`;
+  var states20 = [
+    States.hover,
+    States.focus,
+    States.valid,
+    States.invalid,
+    States.required,
+    States.disabled,
+    States.loading,
+    States.readonly
+  ];
+  var options18 = {
+    size: [Size.small, Size.medium, Size.large],
+    rounded: [Roundness.small, Roundness.medium, Roundness.large, Roundness.full],
+    fillMode: [FillMode.solid, FillMode.flat, FillMode.outline]
+  };
+  var defaultProps17 = {
+    tab: "date",
+    size: Input.defaultProps.size,
+    rounded: Input.defaultProps.rounded,
+    fillMode: Input.defaultProps.fillMode
+  };
+  var DateTimePicker = (props) => {
+    const _a = props, {
+      prefix,
+      suffix,
+      value,
+      placeholder,
+      size,
+      rounded,
+      fillMode,
+      hover,
+      focus,
+      valid,
+      invalid,
+      required,
+      loading,
+      disabled,
+      readonly,
+      opened,
+      tab = defaultProps17.tab
+    } = _a, other = __objRest(_a, [
+      "prefix",
+      "suffix",
+      "value",
+      "placeholder",
+      "size",
+      "rounded",
+      "fillMode",
+      "hover",
+      "focus",
+      "valid",
+      "invalid",
+      "required",
+      "loading",
+      "disabled",
+      "readonly",
+      "opened",
+      "tab"
+    ]);
+    return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_jsx_runtime30.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
+        Input,
+        __spreadProps(__spreadValues({}, other), {
+          size,
+          rounded,
+          fillMode,
+          hover,
+          focus,
+          valid,
+          invalid,
+          required,
+          loading,
+          disabled,
+          readonly,
+          className: classNames(props.className, DATETIMEPICKER_CLASSNAME),
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(InputPrefix, { children: prefix }),
+            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(InputInnerInput, { placeholder, value }),
+            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+              InputValidationIcon,
+              {
+                valid,
+                invalid,
+                loading,
+                disabled
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+              InputLoadingIcon,
+              {
+                loading,
+                disabled
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+              InputClearValue,
+              {
+                loading,
+                disabled,
+                readonly,
+                value
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(InputSuffix, { children: suffix }),
+            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+              Button,
+              {
+                className: "k-input-button",
+                icon: tab === "time" ? "clock" : "calendar",
+                rounded: null,
+                size,
+                fillMode
+              }
+            )
+          ]
+        })
+      ),
+      opened && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Popup, { className: "k-datetimepicker-popup", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(DateTimeSelector, { tab }) })
+    ] });
+  };
+  DateTimePicker.states = states20;
+  DateTimePicker.options = options18;
+  DateTimePicker.className = DATETIMEPICKER_CLASSNAME;
+  DateTimePicker.defaultProps = defaultProps17;
+
+  // src/spinbutton/spinbutton.spec.tsx
+  var import_jsx_runtime31 = __require("react/jsx-runtime");
+  var SPINBUTTON_CLASSNAME = `k-spin-button`;
+  var states21 = [];
+  var options19 = {
+    size: [Size.small, Size.medium, Size.large],
+    fillMode: [FillMode.solid, FillMode.flat, FillMode.outline, FillMode.clear, FillMode.link]
+  };
+  var defaultProps18 = {
+    size: Size.medium,
+    fillMode: FillMode.solid
+  };
+  var SpinButton = (props) => {
+    const _a = props, {
+      size = defaultProps18.size,
+      fillMode = defaultProps18.fillMode
+    } = _a, other = __objRest(_a, [
+      "size",
+      "fillMode"
+    ]);
+    return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
+      "span",
+      __spreadProps(__spreadValues({}, other), {
+        className: classNames(
+          SPINBUTTON_CLASSNAME,
+          props.className
+        ),
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+            Button,
+            {
+              className: "k-spinner-increase",
+              icon: "arrow-n",
+              rounded: null,
+              size,
+              fillMode
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+            Button,
+            {
+              className: "k-spinner-decrease",
+              icon: "arrow-s",
+              rounded: null,
+              size,
+              fillMode
+            }
+          )
+        ]
+      })
+    );
+  };
+  SpinButton.states = states21;
+  SpinButton.options = options19;
+  SpinButton.className = SPINBUTTON_CLASSNAME;
+  SpinButton.defaultProps = defaultProps18;
+
+  // src/numerictextbox/numerictextbox.spec.tsx
+  var import_jsx_runtime32 = __require("react/jsx-runtime");
+  var NUMERICTEXTBOX_CLASSNAME = `k-numerictextbox`;
+  var states22 = [
+    States.hover,
+    States.focus,
+    States.valid,
+    States.invalid,
+    States.loading,
+    States.required,
+    States.disabled,
+    States.readonly
+  ];
+  var options20 = {
+    size: [Size.small, Size.medium, Size.large],
+    rounded: [Roundness.small, Roundness.medium, Roundness.large, Roundness.full],
+    fillMode: [FillMode.solid, FillMode.flat, FillMode.outline]
+  };
+  var defaultProps19 = {
+    showSpinButton: true,
+    showClearButton: true,
+    size: Input.defaultProps.size,
+    rounded: Input.defaultProps.rounded,
+    fillMode: Input.defaultProps.fillMode
+  };
+  var NumericTextbox = (props) => {
+    const _a = props, {
+      value,
+      placeholder,
+      size,
+      rounded,
+      fillMode,
+      hover,
+      focus,
+      valid,
+      invalid,
+      required,
+      loading,
+      disabled,
+      readonly,
+      showClearButton = defaultProps19.showClearButton,
+      showSpinButton = defaultProps19.showSpinButton
+    } = _a, other = __objRest(_a, [
+      "value",
+      "placeholder",
+      "size",
+      "rounded",
+      "fillMode",
+      "hover",
+      "focus",
+      "valid",
+      "invalid",
+      "required",
+      "loading",
+      "disabled",
+      "readonly",
+      "showClearButton",
+      "showSpinButton"
+    ]);
+    return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
+      Input,
+      __spreadProps(__spreadValues({}, other), {
+        size,
+        rounded,
+        fillMode,
+        hover,
+        focus,
+        valid,
+        invalid,
+        required,
+        loading,
+        disabled,
+        readonly,
+        className: classNames(props.className, NUMERICTEXTBOX_CLASSNAME),
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(InputInnerInput, { placeholder, value }),
+          /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+            InputValidationIcon,
+            {
+              valid,
+              invalid,
+              loading,
+              disabled
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+            InputLoadingIcon,
+            {
+              loading,
+              disabled
+            }
+          ),
+          showClearButton && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+            InputClearValue,
+            {
+              loading,
+              disabled,
+              readonly,
+              value
+            }
+          ),
+          showSpinButton && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+            SpinButton,
+            {
+              className: "k-input-spinner",
+              size,
+              fillMode
+            }
+          )
+        ]
+      })
+    );
+  };
+  NumericTextbox.states = states22;
+  NumericTextbox.options = options20;
+  NumericTextbox.className = NUMERICTEXTBOX_CLASSNAME;
+  NumericTextbox.defaultProps = defaultProps19;
+
+  // src/dropdownlist/dropdownlist.spec.tsx
+  var import_jsx_runtime33 = __require("react/jsx-runtime");
+  var DROPDOWNLIST_CLASSNAME = `k-dropdownlist`;
+  var states23 = [
+    States.hover,
+    States.focus,
+    States.valid,
+    States.invalid,
+    States.required,
+    States.disabled,
+    States.loading,
+    States.readonly
+  ];
+  var options21 = {
+    size: [Size.small, Size.medium, Size.large],
+    rounded: [Roundness.small, Roundness.medium, Roundness.large, Roundness.full],
+    fillMode: [FillMode.solid, FillMode.flat, FillMode.outline]
+  };
+  var defaultProps20 = {
+    showValue: true,
+    arrowIconName: "arrow-s",
+    size: Size.medium,
+    rounded: Roundness.medium,
+    fillMode: FillMode.solid
+  };
+  var DropdownList = (props) => {
+    const _a = props, {
+      valueIconName,
+      arrowIconName = defaultProps20.arrowIconName,
+      prefix,
+      suffix,
+      value,
+      placeholder,
+      size,
+      rounded,
+      fillMode,
+      hover,
+      focus,
+      valid,
+      invalid,
+      required,
+      loading,
+      disabled,
+      readonly,
+      showValue = defaultProps20.showValue,
+      popup,
+      opened
+    } = _a, other = __objRest(_a, [
+      "valueIconName",
+      "arrowIconName",
+      "prefix",
+      "suffix",
+      "value",
+      "placeholder",
+      "size",
+      "rounded",
+      "fillMode",
+      "hover",
+      "focus",
+      "valid",
+      "invalid",
+      "required",
+      "loading",
+      "disabled",
+      "readonly",
+      "showValue",
+      "popup",
+      "opened"
+    ]);
+    return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_jsx_runtime33.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
+        Picker,
+        __spreadProps(__spreadValues({}, other), {
+          size,
+          rounded,
+          fillMode,
+          hover,
+          focus,
+          valid,
+          invalid,
+          required,
+          loading,
+          disabled,
+          readonly,
+          className: classNames(
+            props.className,
+            DROPDOWNLIST_CLASSNAME,
+            {
+              "k-icon-picker": !showValue && valueIconName
+            }
+          ),
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(InputPrefix, { children: prefix }),
+            /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+              InputInnerSpan,
+              {
+                placeholder,
+                value,
+                showValue,
+                valueIconName
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+              InputValidationIcon,
+              {
+                valid,
+                invalid,
+                loading,
+                disabled
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+              InputLoadingIcon,
+              {
+                loading,
+                disabled
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(InputSuffix, { children: suffix }),
+            /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+              Button,
+              {
+                className: "k-input-button",
+                icon: arrowIconName,
+                rounded: null,
+                size: props.size,
+                fillMode: props.fillMode
+              }
+            )
+          ]
+        })
+      ),
+      opened && popup && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Popup, { className: "k-dropdownlist-popup", children: popup })
+    ] });
+  };
+  DropdownList.states = states23;
+  DropdownList.options = options21;
+  DropdownList.className = DROPDOWNLIST_CLASSNAME;
+  DropdownList.defaultProps = defaultProps20;
+
+  // src/form/fieldset.tsx
+  var import_jsx_runtime34 = __require("react/jsx-runtime");
+  var FIELDSET_CLASSNAME = "k-form-fieldset";
+  var Fieldset = (props) => {
+    const {
+      legend
+    } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("fieldset", { className: classNames(FIELDSET_CLASSNAME), children: [
+      legend && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("legend", { className: "k-form-legend", children: legend }),
+      props.children
+    ] });
+  };
+  Fieldset.className = FIELDSET_CLASSNAME;
+
+  // src/form/form.spec.tsx
+  var import_jsx_runtime35 = __require("react/jsx-runtime");
+  var FORM_CLASSNAME = "k-form";
+  var states24 = [];
+  var options22 = {
+    size: [Size.small, Size.medium, Size.large]
+  };
+  var defaultProps21 = {
+    size: Size.medium,
+    layout: "basic",
+    tag: "form"
+  };
+  var Form = (props) => {
+    const {
+      size = defaultProps21.size,
+      orientation,
+      layout = defaultProps21.layout,
+      formButtons,
+      legend,
+      cols,
+      gapX,
+      gapY,
+      tag = defaultProps21.tag
+    } = props;
+    const ConditionalWrapper = ({ condition, wrapper, children }) => condition ? wrapper(children) : children;
+    const Parent = ({ tag: tag2, className: className14, children }) => tag2 === "form" ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("form", { className: className14, children }) : /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: className14, children });
+    return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(Parent, { tag, className: classNames(
+      props.className,
+      FORM_CLASSNAME,
+      optionClassNames(FORM_CLASSNAME, {
+        size
+      }),
+      {
+        [`${FORM_CLASSNAME}-${orientation}`]: orientation
+      }
+    ), children: [
+      /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+        ConditionalWrapper,
+        {
+          condition: layout === "grid",
+          wrapper: (children) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(Fieldset, { legend, children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: classNames(
+            "k-form-layout",
+            "k-d-grid",
+            {
+              [`k-grid-cols-${cols}`]: cols,
+              [`k-gap-x-${gapX}`]: gapX,
+              [`k-gap-y-${gapY}`]: gapY
+            }
+          ), children }) }),
+          children: props.children
+        }
+      ),
+      formButtons && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "k-form-buttons", children: formButtons })
+    ] });
+  };
+  Form.states = states24;
+  Form.options = options22;
+  Form.className = FORM_CLASSNAME;
+  Form.defaultProps = defaultProps21;
+
+  // src/form/form-field.tsx
+  var import_jsx_runtime36 = __require("react/jsx-runtime");
+  var FORMFIELD_CLASSNAME = "k-form-field";
+  var states25 = [
+    States.disabled
+  ];
+  var FormField = (props) => {
+    const {
+      label,
+      optional,
+      editor,
+      hint,
+      error,
+      info,
+      disabled,
+      dir
+    } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
+      "div",
+      {
+        className: classNames(
+          FORMFIELD_CLASSNAME,
+          props.className,
+          stateClassNames(FORMFIELD_CLASSNAME, { disabled })
+        ),
+        dir,
+        children: [
+          label && /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("label", { className: classNames(
+            "k-label",
+            "k-form-label",
+            {
+              "k-label-empty": label === " "
+            }
+          ), children: [
+            label,
+            optional && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "k-label-optional", children: "(Optional)" }),
+            info && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "k-field-info", children: "(field info)" })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "k-form-field-wrap", children: [
+            editor,
+            hint && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "k-form-hint", children: hint }),
+            error && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "k-form-error", children: error })
+          ] })
+        ]
+      }
+    );
+  };
+  FormField.className = FORMFIELD_CLASSNAME;
+
+  // src/gantt/tests/gantt-editing-popup-general.tsx
+  var import_jsx_runtime37 = __require("react/jsx-runtime");
+  var root = import_client.default.createRoot(
+    document.getElementById("app")
+  );
+  var styles = `
+    .k-window {
+        min-width: 580px;
+        position: relative;
+    }
+`;
+  root.render(
+    /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_jsx_runtime37.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("style", { children: styles }),
+      /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { id: "test-area", className: "k-d-grid k-grid-cols-2", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("section", { children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Window, { title: "Edit task", actions: ["window-minimize", "window-maximize", "close"], actionButtons: /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_jsx_runtime37.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Button, { icon: "save", themeColor: "primary", children: "Save" }),
+        /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Button, { icon: "cancel", children: "Cancel" }),
+        /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "k-spacer" }),
+        /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Button, { icon: "delete", fillMode: "flat", themeColor: "primary", children: "Delete" })
+      ] }), children: /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "k-tabstrip k-tabstrip-top", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "k-tabstrip-items-wrapper k-hstack", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("ul", { className: "k-reset k-tabstrip-items", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("li", { className: "k-item k-first k-active", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "k-link", children: "General" }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("li", { className: "k-item", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "k-link", children: "Resources" }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("li", { className: "k-item", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "k-link", children: "Predecessors" }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("li", { className: "k-item k-last", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "k-link", children: "Successors" }) })
+        ] }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "k-tabstrip-content k-active", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(Form, { layout: "grid", cols: 4, gapX: 2, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+            FormField,
+            {
+              className: "k-form-field-error k-col-span-full",
+              label: "Title",
+              error: "Error",
+              editor: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Textbox, { invalid: true, value: "Invalid" })
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+            FormField,
+            {
+              className: "k-col-span-2",
+              label: "Planned Start Date",
+              editor: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(DateTimePicker, { placeholder: "dd/MM/yyyy hh:mm AM" })
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+            FormField,
+            {
+              className: "k-col-span-2",
+              label: "Planned End Date",
+              editor: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(DateTimePicker, { placeholder: "dd/MM/yyyy hh:mm AM" })
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+            FormField,
+            {
+              className: "k-col-span-2",
+              label: "Actual Start Date",
+              editor: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(DateTimePicker, { placeholder: "dd/MM/yyyy hh:mm AM" })
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+            FormField,
+            {
+              className: "k-col-span-2",
+              label: "Actual End Date",
+              editor: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(DateTimePicker, { placeholder: "dd/MM/yyyy hh:mm AM" })
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+            FormField,
+            {
+              className: "k-col-span-1",
+              label: "Complete",
+              editor: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(NumericTextbox, {}),
+              hint: "value from 0 to 1"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+            FormField,
+            {
+              className: "k-col-span-full",
+              label: "Parent",
+              editor: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(DropdownList, { placeholder: "-None-" })
+            }
+          )
+        ] }) })
+      ] }) }) }) })
+    ] })
+  );
+})();
+//# sourceMappingURL=gantt-editing-popup-general.js.map