@progress/kendo-themes-html 5.5.1-dev.2 → 5.6.1-dev.1

package/dist/index.js

@@ -20,7 +20,10 @@
     }
     return to;
   };
-  var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+  var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+    isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+    mod
+  ));
 
   // src/typography/typography.tsx
   var React = __toESM(__require("react"));
@@ -33,7 +36,9 @@
         result[key] = arg[key];
       }) : result[arg] = true;
     };
-    const addKeys = (list) => list.filter((arg) => arg !== true && Boolean(arg)).map((arg) => Array.isArray(arg) ? addKeys(arg) : addLeafKeys(arg));
+    const addKeys = (list) => list.filter((arg) => arg !== true && Boolean(arg)).map(
+      (arg) => Array.isArray(arg) ? addKeys(arg) : addLeafKeys(arg)
+    );
     addKeys(args);
     return Object.keys(result).map((key) => result[key] && key || null).filter((el) => el !== null).join(" ");
   };
@@ -75,9 +80,12 @@
       const Component74 = type.includes("display") ? "div" : type;
       return /* @__PURE__ */ React.createElement(Component74, {
         ...htmlAttributes,
-        className: classNames({
-          [`k-${typeClass}`]: type
-        }, className)
+        className: classNames(
+          {
+            [`k-${typeClass}`]: type
+          },
+          className
+        )
       }, children);
     }
   };
@@ -92,9 +100,13 @@
         name
       } = this.props;
       return /* @__PURE__ */ React2.createElement(React2.Fragment, null, name && /* @__PURE__ */ React2.createElement("span", {
-        className: classNames(className, "k-icon", {
-          [`k-i-${name}`]: name
-        }),
+        className: classNames(
+          className,
+          "k-icon",
+          {
+            [`k-i-${name}`]: name
+          }
+        ),
         style
       }));
     }
@@ -119,18 +131,22 @@
         disabled
       } = this.props;
       return /* @__PURE__ */ React3.createElement("span", {
-        className: classNames(className, "k-input", {
-          [`k-input-${kendoThemeMaps.sizeMap[size] || size}`]: size,
-          [`k-input-${fillMode}`]: fillMode,
-          [`k-rounded-${kendoThemeMaps.roundedMap[rounded] || rounded}`]: rounded,
-          "k-hover": hover,
-          "k-focus": focus,
-          "k-valid": valid,
-          "k-invalid": invalid,
-          "k-required": required,
-          "k-disabled": disabled,
-          "k-loading": loading
-        })
+        className: classNames(
+          className,
+          "k-input",
+          {
+            [`k-input-${kendoThemeMaps.sizeMap[size] || size}`]: size,
+            [`k-input-${fillMode}`]: fillMode,
+            [`k-rounded-${kendoThemeMaps.roundedMap[rounded] || rounded}`]: rounded,
+            "k-hover": hover,
+            "k-focus": focus,
+            "k-valid": valid,
+            "k-invalid": invalid,
+            "k-required": required,
+            "k-disabled": disabled,
+            "k-loading": loading
+          }
+        )
       }, children);
     }
   };
@@ -160,18 +176,22 @@
         disabled
       } = this.props;
       return /* @__PURE__ */ React4.createElement("span", {
-        className: classNames(className, "k-picker", {
-          [`k-picker-${kendoThemeMaps.sizeMap[size] || size}`]: size,
-          [`k-picker-${fillMode}`]: fillMode,
-          [`k-rounded-${kendoThemeMaps.roundedMap[rounded] || rounded}`]: rounded,
-          "k-hover": hover,
-          "k-focus": focus,
-          "k-valid": valid,
-          "k-invalid": invalid,
-          "k-required": required,
-          "k-disabled": disabled,
-          "k-loading": loading
-        }),
+        className: classNames(
+          className,
+          "k-picker",
+          {
+            [`k-picker-${kendoThemeMaps.sizeMap[size] || size}`]: size,
+            [`k-picker-${fillMode}`]: fillMode,
+            [`k-rounded-${kendoThemeMaps.roundedMap[rounded] || rounded}`]: rounded,
+            "k-hover": hover,
+            "k-focus": focus,
+            "k-valid": valid,
+            "k-invalid": invalid,
+            "k-required": required,
+            "k-disabled": disabled,
+            "k-loading": loading
+          }
+        ),
         style
       }, children);
     }
@@ -325,7 +345,10 @@
         return /* @__PURE__ */ React11.createElement(React11.Fragment, null);
       }
       return /* @__PURE__ */ React11.createElement("span", {
-        className: classNames(className, "k-input-prefix")
+        className: classNames(
+          className,
+          "k-input-prefix"
+        )
       }, children);
     }
   };
@@ -342,7 +365,10 @@
         return /* @__PURE__ */ React12.createElement(React12.Fragment, null);
       }
       return /* @__PURE__ */ React12.createElement("span", {
-        className: classNames(className, "k-input-suffix")
+        className: classNames(
+          className,
+          "k-input-suffix"
+        )
       }, children);
     }
   };
@@ -373,7 +399,10 @@
         className
       } = this.props;
       return /* @__PURE__ */ React14.createElement("div", {
-        className: classNames(className, "k-nodata")
+        className: classNames(
+          className,
+          "k-nodata"
+        )
       }, children);
     }
   };
@@ -398,22 +427,28 @@
             if (child.props.root === true) {
               listHeader = child.props.label;
               child.props.children.map((optChild, index2) => {
-                listChildren.push(/* @__PURE__ */ React15.createElement(ListItem, {
-                  key: `optChild-${index2}-${new Date().getTime()}`,
-                  ...optChild.props
-                }));
+                listChildren.push(
+                  /* @__PURE__ */ React15.createElement(ListItem, {
+                    key: `optChild-${index2}-${new Date().getTime()}`,
+                    ...optChild.props
+                  })
+                );
               });
             } else {
               if (framework === "angular" || framework === "blazor") {
-                listChildren.push(/* @__PURE__ */ React15.createElement(ListGroupItem, {
-                  key: `listChild-${index}`,
-                  ...child.props
-                }, child.props.label));
+                listChildren.push(
+                  /* @__PURE__ */ React15.createElement(ListGroupItem, {
+                    key: `listChild-${index}`,
+                    ...child.props
+                  }, child.props.label)
+                );
                 child.props.children.map((optChild, index2) => {
-                  listChildren.push(/* @__PURE__ */ React15.createElement(ListItem, {
-                    key: `fwOptChild-${index2}-${new Date().getTime()}`,
-                    ...optChild.props
-                  }));
+                  listChildren.push(
+                    /* @__PURE__ */ React15.createElement(ListItem, {
+                      key: `fwOptChild-${index2}-${new Date().getTime()}`,
+                      ...optChild.props
+                    })
+                  );
                 });
               } else {
                 child.props.children.forEach((optChild, index2) => {
@@ -421,12 +456,14 @@
                   if (index2 === 0) {
                     groupLabel = child.props.label;
                   }
-                  listChildren.push(/* @__PURE__ */ React15.createElement(ListItem, {
-                    className: index2 === 0 ? "k-first" : "",
-                    key: `groupLabel-${index2}-${new Date().getTime()}`,
-                    ...optChild.props,
-                    groupLabel
-                  }));
+                  listChildren.push(
+                    /* @__PURE__ */ React15.createElement(ListItem, {
+                      className: index2 === 0 ? "k-first" : "",
+                      key: `groupLabel-${index2}-${new Date().getTime()}`,
+                      ...optChild.props,
+                      groupLabel
+                    })
+                  );
                 });
               }
             }
@@ -448,10 +485,14 @@
         listContent = /* @__PURE__ */ React15.createElement(NoData, null, "No data found.");
       }
       return /* @__PURE__ */ React15.createElement("div", {
-        className: classNames(className, "k-list", {
-          [`k-list-${kendoThemeMaps.sizeMap[size] || size}`]: size,
-          "k-virtual-list": virtualization
-        })
+        className: classNames(
+          className,
+          "k-list",
+          {
+            [`k-list-${kendoThemeMaps.sizeMap[size] || size}`]: size,
+            "k-virtual-list": virtualization
+          }
+        )
       }, listGroup, listContent);
     }
   };
@@ -486,16 +527,20 @@
         type: "checkbox",
         checked,
         required,
-        className: classNames(className, "k-checkbox", {
-          [`k-checkbox-${kendoThemeMaps.sizeMap[size] || size}`]: size,
-          [`k-rounded-${kendoThemeMaps.roundedMap[rounded] || rounded}`]: rounded,
-          "k-hover": hover,
-          "k-focus": focus,
-          "k-disabled": disabled,
-          "k-checked": checked,
-          "k-invalid": invalid,
-          "k-indeterminate": !checked && indeterminate
-        })
+        className: classNames(
+          className,
+          "k-checkbox",
+          {
+            [`k-checkbox-${kendoThemeMaps.sizeMap[size] || size}`]: size,
+            [`k-rounded-${kendoThemeMaps.roundedMap[rounded] || rounded}`]: rounded,
+            "k-hover": hover,
+            "k-focus": focus,
+            "k-disabled": disabled,
+            "k-checked": checked,
+            "k-invalid": invalid,
+            "k-indeterminate": !checked && indeterminate
+          }
+        )
       }));
     }
   };
@@ -521,12 +566,16 @@
         disabled
       } = this.props;
       return /* @__PURE__ */ React17.createElement("li", {
-        className: classNames(className, "k-list-item", {
-          "k-hover": hover,
-          "k-focus": focus,
-          "k-selected": selected,
-          "k-disabled": disabled
-        })
+        className: classNames(
+          className,
+          "k-list-item",
+          {
+            "k-hover": hover,
+            "k-focus": focus,
+            "k-selected": selected,
+            "k-disabled": disabled
+          }
+        )
       }, showCheckbox && /* @__PURE__ */ React17.createElement(Checkbox, {
         checked
       }), showIcon && /* @__PURE__ */ React17.createElement(Icon, {
@@ -549,7 +598,10 @@
         virtualization
       } = this.props;
       return /* @__PURE__ */ React18.createElement("div", {
-        className: classNames(className, "k-list-content")
+        className: classNames(
+          className,
+          "k-list-content"
+        )
       }, /* @__PURE__ */ React18.createElement("ul", {
         className: classNames("k-list-ul")
       }, children), virtualization && /* @__PURE__ */ React18.createElement("div", {
@@ -567,7 +619,10 @@
         className
       } = this.props;
       return /* @__PURE__ */ React19.createElement("div", {
-        className: classNames(className, "k-list-group-sticky-header")
+        className: classNames(
+          className,
+          "k-list-group-sticky-header"
+        )
       }, /* @__PURE__ */ React19.createElement("div", {
         className: "k-list-header-text"
       }, children));
@@ -597,7 +652,10 @@
         className
       } = this.props;
       return /* @__PURE__ */ React21.createElement("li", {
-        className: classNames(className, "k-list-group-item")
+        className: classNames(
+          className,
+          "k-list-group-item"
+        )
       }, /* @__PURE__ */ React21.createElement("span", {
         className: "k-list-item-text"
       }, children));
@@ -628,13 +686,17 @@
       return /* @__PURE__ */ React22.createElement("div", {
         style: this.props.style,
         ...htmlAttributes,
-        className: classNames("k-avatar", {
-          [`k-rounded-${kendoThemeMaps.roundedMap[rounded] || rounded}`]: rounded,
-          [`k-avatar-${kendoThemeMaps.sizeMap[size] || size}`]: size,
-          [`k-avatar-${fillMode}`]: fillMode,
-          [`k-avatar-${fillMode}-${themeColor}`]: Boolean(fillMode && themeColor),
-          ["k-avatar-bordered"]: border
-        }, className)
+        className: classNames(
+          "k-avatar",
+          {
+            [`k-rounded-${kendoThemeMaps.roundedMap[rounded] || rounded}`]: rounded,
+            [`k-avatar-${kendoThemeMaps.sizeMap[size] || size}`]: size,
+            [`k-avatar-${fillMode}`]: fillMode,
+            [`k-avatar-${fillMode}-${themeColor}`]: Boolean(fillMode && themeColor),
+            ["k-avatar-bordered"]: border
+          },
+          className
+        )
       }, /* @__PURE__ */ React22.createElement("span", {
         className: `k-avatar-${type}`
       }, children));
@@ -680,7 +742,11 @@
           });
       }
       return /* @__PURE__ */ React23.createElement("span", {
-        className: classNames(className, "k-chip-action", `k-chip-${type}-action`)
+        className: classNames(
+          className,
+          "k-chip-action",
+          `k-chip-${type}-action`
+        )
       }, icon);
     }
   };
@@ -707,17 +773,21 @@
         disabled
       } = this.props;
       return /* @__PURE__ */ React24.createElement("div", {
-        className: classNames(className, "k-chip", {
-          [`k-chip-${kendoThemeMaps.sizeMap[size] || size}`]: size,
-          [`k-chip-${fillMode}`]: fillMode,
-          [`k-chip-${fillMode}-${themeColor}`]: Boolean(fillMode && themeColor),
-          [`k-rounded-${kendoThemeMaps.roundedMap[rounded] || rounded}`]: rounded,
-          "k-hover": hover,
-          "k-focus": focus,
-          "k-active": active,
-          "k-selected": selected,
-          "k-disabled": disabled
-        })
+        className: classNames(
+          className,
+          "k-chip",
+          {
+            [`k-chip-${kendoThemeMaps.sizeMap[size] || size}`]: size,
+            [`k-chip-${fillMode}`]: fillMode,
+            [`k-chip-${fillMode}-${themeColor}`]: Boolean(fillMode && themeColor),
+            [`k-rounded-${kendoThemeMaps.roundedMap[rounded] || rounded}`]: rounded,
+            "k-hover": hover,
+            "k-focus": focus,
+            "k-active": active,
+            "k-selected": selected,
+            "k-disabled": disabled
+          }
+        )
       }, icon && /* @__PURE__ */ React24.createElement(Icon, {
         className: "k-chip-icon",
         name: icon
@@ -752,9 +822,13 @@
         size
       } = this.props;
       return /* @__PURE__ */ React25.createElement("div", {
-        className: classNames(className, "k-chip-list", {
-          [`k-chip-list-${kendoThemeMaps.sizeMap[size] || size}`]: size
-        })
+        className: classNames(
+          className,
+          "k-chip-list",
+          {
+            [`k-chip-list-${kendoThemeMaps.sizeMap[size] || size}`]: size
+          }
+        )
       }, children);
     }
   };
@@ -773,10 +847,14 @@
         iconName
       } = this.props;
       return /* @__PURE__ */ React26.createElement("span", {
-        className: classNames("k-color-preview", {
-          "k-icon-color-preview": iconName,
-          "k-no-color": !color
-        }, className)
+        className: classNames(
+          "k-color-preview",
+          {
+            "k-icon-color-preview": iconName,
+            "k-no-color": !color
+          },
+          className
+        )
       }, iconName && /* @__PURE__ */ React26.createElement(Icon, {
         name: iconName,
         className: "k-color-preview-icon"
@@ -800,10 +878,14 @@
       } = this.props;
       return /* @__PURE__ */ React27.createElement("div", {
         ...htmlAttributes,
-        className: classNames("k-actions", {
-          [`k-actions-${alignment}`]: alignment,
-          [`k-actions-${orientation}`]: orientation
-        }, className)
+        className: classNames(
+          "k-actions",
+          {
+            [`k-actions-${alignment}`]: alignment,
+            [`k-actions-${orientation}`]: orientation
+          },
+          className
+        )
       }, children);
     }
   };
@@ -839,18 +921,22 @@
         style: this.props.style,
         ...htmlAttributes,
         dir: this.props.dir,
-        className: classNames(className, "k-button", {
-          [`k-button-${kendoThemeMaps.sizeMap[size] || size}`]: size,
-          [`k-button-${fillMode}`]: fillMode,
-          [`k-button-${fillMode}-${themeColor}`]: Boolean(fillMode && themeColor),
-          [`k-rounded-${kendoThemeMaps.roundedMap[rounded] || rounded}`]: rounded,
-          "k-icon-button": !hasChildren && hasIcon,
-          "k-hover": hover,
-          "k-focus": focus,
-          "k-active": active,
-          "k-selected": selected,
-          "k-disabled": disabled
-        })
+        className: classNames(
+          className,
+          "k-button",
+          {
+            [`k-button-${kendoThemeMaps.sizeMap[size] || size}`]: size,
+            [`k-button-${fillMode}`]: fillMode,
+            [`k-button-${fillMode}-${themeColor}`]: Boolean(fillMode && themeColor),
+            [`k-rounded-${kendoThemeMaps.roundedMap[rounded] || rounded}`]: rounded,
+            "k-icon-button": !hasChildren && hasIcon,
+            "k-hover": hover,
+            "k-focus": focus,
+            "k-active": active,
+            "k-selected": selected,
+            "k-disabled": disabled
+          }
+        )
       }, icon && /* @__PURE__ */ React28.createElement(Icon, {
         className: classNames(iconClassName, "k-button-icon"),
         name: icon
@@ -880,9 +966,13 @@
       } = this.props;
       return /* @__PURE__ */ React29.createElement("div", {
         ...htmlAttributes,
-        className: classNames(className, "k-button-group", {
-          [`k-button-group-${fillMode}`]: fillMode
-        })
+        className: classNames(
+          className,
+          "k-button-group",
+          {
+            [`k-button-group-${fillMode}`]: fillMode
+          }
+        )
       }, children);
     }
   };
@@ -913,9 +1003,13 @@
       } = this.props;
       return /* @__PURE__ */ React30.createElement(Button, {
         dir: this.props.dir,
-        className: classNames(className, "k-menu-button", {
-          "k-icon-button": icon !== void 0
-        }),
+        className: classNames(
+          className,
+          "k-menu-button",
+          {
+            "k-icon-button": icon !== void 0
+          }
+        ),
         text,
         size,
         rounded,
@@ -964,9 +1058,14 @@
         disabled
       } = this.props;
       return /* @__PURE__ */ React31.createElement("div", {
-        className: classNames(className, "k-split-button", "k-button-group", {
-          [`k-rounded-${kendoThemeMaps.roundedMap[rounded] || rounded}`]: rounded
-        })
+        className: classNames(
+          className,
+          "k-split-button",
+          "k-button-group",
+          {
+            [`k-rounded-${kendoThemeMaps.roundedMap[rounded] || rounded}`]: rounded
+          }
+        )
       }, /* @__PURE__ */ React31.createElement(Button, {
         text,
         icon,
@@ -1110,14 +1209,18 @@
         id,
         checked,
         required,
-        className: classNames(className, "k-radio", {
-          [`k-radio-${kendoThemeMaps.sizeMap[size] || size}`]: size,
-          "k-hover": hover,
-          "k-focus": focus,
-          "k-disabled": disabled,
-          "k-checked": checked,
-          "k-invalid": invalid
-        })
+        className: classNames(
+          className,
+          "k-radio",
+          {
+            [`k-radio-${kendoThemeMaps.sizeMap[size] || size}`]: size,
+            "k-hover": hover,
+            "k-focus": focus,
+            "k-disabled": disabled,
+            "k-checked": checked,
+            "k-invalid": invalid
+          }
+        )
       }));
     }
   };
@@ -1141,13 +1244,17 @@
         style
       } = this.props;
       return /* @__PURE__ */ React35.createElement("span", {
-        className: classNames(className, "k-floating-label-container", {
-          "k-focus": focus,
-          "k-valid": valid,
-          "k-invalid": invalid,
-          "k-empty": empty,
-          "k-disabled": disabled
-        }),
+        className: classNames(
+          className,
+          "k-floating-label-container",
+          {
+            "k-focus": focus,
+            "k-valid": valid,
+            "k-invalid": invalid,
+            "k-empty": empty,
+            "k-disabled": disabled
+          }
+        ),
         style
       }, children, label && /* @__PURE__ */ React35.createElement("label", {
         className: "k-label"
@@ -1286,9 +1393,13 @@
         }
       }
       return /* @__PURE__ */ React37.createElement("div", {
-        className: classNames(className, "k-colorpalette", {
-          "k-disabled": disabled
-        })
+        className: classNames(
+          className,
+          "k-colorpalette",
+          {
+            "k-disabled": disabled
+          }
+        )
       }, /* @__PURE__ */ React37.createElement("div", {
         className: "k-colorpalette-table-wrap"
       }, /* @__PURE__ */ React37.createElement("table", {
@@ -1329,11 +1440,15 @@
         "height": tileSize ? tileSize + "px" : ""
       };
       return /* @__PURE__ */ React39.createElement("td", {
-        className: classNames(className, "k-colorpalette-tile", {
-          "k-hover": hover,
-          "k-focus": focus,
-          "k-selected": selected
-        }),
+        className: classNames(
+          className,
+          "k-colorpalette-tile",
+          {
+            "k-hover": hover,
+            "k-focus": focus,
+            "k-selected": selected
+          }
+        ),
         style: styles
       });
     }
@@ -1352,10 +1467,14 @@
         disabled
       } = this.props;
       return /* @__PURE__ */ React40.createElement("div", {
-        className: classNames(className, "k-captcha", {
-          "k-captcha-loading": loading,
-          "k-disabled": disabled
-        })
+        className: classNames(
+          className,
+          "k-captcha",
+          {
+            "k-captcha-loading": loading,
+            "k-disabled": disabled
+          }
+        )
       }, /* @__PURE__ */ React40.createElement("div", {
         className: "k-captcha-image-wrap k-hstack"
       }, /* @__PURE__ */ React40.createElement("div", {
@@ -1422,7 +1541,11 @@
         invalid,
         required,
         disabled,
-        className: classNames(className, "k-colorpicker", "k-icon-picker")
+        className: classNames(
+          className,
+          "k-colorpicker",
+          "k-icon-picker"
+        )
       }, /* @__PURE__ */ React41.createElement(InputPrefix, null, prefix), /* @__PURE__ */ React41.createElement(InputInnerSpan, {
         placeholder,
         value,
@@ -1511,7 +1634,10 @@
         fillMode
       } = this.props;
       return /* @__PURE__ */ React43.createElement("span", {
-        className: classNames(className, "k-spin-button")
+        className: classNames(
+          className,
+          "k-spin-button"
+        )
       }, /* @__PURE__ */ React43.createElement(Button, {
         className: "k-spinner-increase",
         icon: "arrow-n",
@@ -1750,9 +1876,13 @@
       } = this.props;
       return /* @__PURE__ */ React48.createElement("span", {
         style,
-        className: classNames(className, "k-daterangepicker", {
-          "k-disabled": disabled
-        })
+        className: classNames(
+          className,
+          "k-daterangepicker",
+          {
+            "k-disabled": disabled
+          }
+        )
       }, /* @__PURE__ */ React48.createElement(FloatingLabel, {
         label: "Start"
       }, /* @__PURE__ */ React48.createElement(DateInput, {
@@ -1866,9 +1996,13 @@
         required,
         loading,
         disabled,
-        className: classNames(className, "k-dropdown", {
-          "k-icon-picker": !showValue && valueIconName
-        })
+        className: classNames(
+          className,
+          "k-dropdown",
+          {
+            "k-icon-picker": !showValue && valueIconName
+          }
+        )
       }, /* @__PURE__ */ React50.createElement(InputPrefix, null, prefix), /* @__PURE__ */ React50.createElement(InputInnerSpan, {
         placeholder,
         value,
@@ -2114,18 +2248,25 @@
         disabled
       } = this.props;
       return /* @__PURE__ */ React55.createElement("span", {
-        className: classNames(className, "k-switch", {
-          [`k-switch-${kendoThemeMaps.sizeMap[size] || size}`]: size,
-          "k-hover": hover,
-          "k-focus": focus,
-          "k-disabled": disabled,
-          "k-switch-on": checked,
-          "k-switch-off": !checked
-        })
+        className: classNames(
+          className,
+          "k-switch",
+          {
+            [`k-switch-${kendoThemeMaps.sizeMap[size] || size}`]: size,
+            "k-hover": hover,
+            "k-focus": focus,
+            "k-disabled": disabled,
+            "k-switch-on": checked,
+            "k-switch-off": !checked
+          }
+        )
       }, /* @__PURE__ */ React55.createElement("span", {
-        className: classNames("k-switch-track", {
-          [`k-rounded-${kendoThemeMaps.roundedMap[trackRounded] || trackRounded}`]: trackRounded
-        })
+        className: classNames(
+          "k-switch-track",
+          {
+            [`k-rounded-${kendoThemeMaps.roundedMap[trackRounded] || trackRounded}`]: trackRounded
+          }
+        )
       }, onLabel && /* @__PURE__ */ React55.createElement("span", {
         className: "k-switch-label-on"
       }, onLabel), offLabel && /* @__PURE__ */ React55.createElement("span", {
@@ -2133,9 +2274,12 @@
       }, offLabel)), /* @__PURE__ */ React55.createElement("span", {
         className: "k-switch-thumb-wrap"
       }, /* @__PURE__ */ React55.createElement("span", {
-        className: classNames("k-switch-thumb", {
-          [`k-rounded-${kendoThemeMaps.roundedMap[thumbRounded] || thumbRounded}`]: thumbRounded
-        })
+        className: classNames(
+          "k-switch-thumb",
+          {
+            [`k-rounded-${kendoThemeMaps.roundedMap[thumbRounded] || thumbRounded}`]: thumbRounded
+          }
+        )
       })));
     }
   };
@@ -2171,19 +2315,23 @@
       return /* @__PURE__ */ React56.createElement("button", {
         ...htmlAttributes,
         type,
-        className: classNames(className, "k-fab", {
-          [`k-fab-${kendoThemeMaps.sizeMap[size] || size}`]: size,
-          [`k-fab-${shape}`]: shape,
-          [`k-fab-${fillMode}`]: fillMode,
-          [`k-fab-${fillMode}-${themeColor}`]: Boolean(fillMode && themeColor),
-          [`k-rounded-${kendoThemeMaps.roundedMap[rounded] || rounded}`]: rounded,
-          [`k-pos-absolute k-${position}`]: position,
-          "k-hover": hover,
-          "k-focus": focus,
-          "k-active": active,
-          "k-selected": selected,
-          "k-disabled": disabled
-        }),
+        className: classNames(
+          className,
+          "k-fab",
+          {
+            [`k-fab-${kendoThemeMaps.sizeMap[size] || size}`]: size,
+            [`k-fab-${shape}`]: shape,
+            [`k-fab-${fillMode}`]: fillMode,
+            [`k-fab-${fillMode}-${themeColor}`]: Boolean(fillMode && themeColor),
+            [`k-rounded-${kendoThemeMaps.roundedMap[rounded] || rounded}`]: rounded,
+            [`k-pos-absolute k-${position}`]: position,
+            "k-hover": hover,
+            "k-focus": focus,
+            "k-active": active,
+            "k-selected": selected,
+            "k-disabled": disabled
+          }
+        ),
         style
       }, icon && /* @__PURE__ */ React56.createElement(Icon, {
         className: "k-fab-icon",
@@ -2235,17 +2383,25 @@
         expandArrowName = dir === "rtl" ? "arrow-w" : "arrow-e";
       }
       return /* @__PURE__ */ React57.createElement("li", {
-        className: classNames(className, "k-item k-menu-item", {
-          "k-disabled": disabled,
-          "k-focus": focus
-        })
+        className: classNames(
+          className,
+          "k-item k-menu-item",
+          {
+            "k-disabled": disabled,
+            "k-focus": focus
+          }
+        )
       }, /* @__PURE__ */ React57.createElement("span", {
-        className: classNames(className, "k-link k-menu-link", {
-          "k-hover": hover,
-          "k-active": active,
-          "k-selected": selected,
-          "k-disabled": disabled
-        })
+        className: classNames(
+          className,
+          "k-link k-menu-link",
+          {
+            "k-hover": hover,
+            "k-active": active,
+            "k-selected": selected,
+            "k-disabled": disabled
+          }
+        )
       }, icon && /* @__PURE__ */ React57.createElement(Icon, {
         className: "k-menu-link-icon",
         name: icon
@@ -2275,7 +2431,10 @@
         return /* @__PURE__ */ React58.createElement(React58.Fragment, null);
       }
       return /* @__PURE__ */ React58.createElement("span", {
-        className: classNames(className, "k-menu-item-content")
+        className: classNames(
+          className,
+          "k-menu-item-content"
+        )
       }, children);
     }
   };
@@ -2293,9 +2452,13 @@
         return /* @__PURE__ */ React59.createElement(React59.Fragment, null);
       }
       return /* @__PURE__ */ React59.createElement("ul", {
-        className: classNames(className, "k-menu-group", {
-          [`k-menu-group-${kendoThemeMaps.sizeMap[size] || size}`]: size
-        })
+        className: classNames(
+          className,
+          "k-menu-group",
+          {
+            [`k-menu-group-${kendoThemeMaps.sizeMap[size] || size}`]: size
+          }
+        )
       }, children);
     }
   };
@@ -2319,9 +2482,12 @@
         className: classNames(className, "k-popover"),
         ...htmlAttributes
       }, callout && /* @__PURE__ */ React60.createElement("div", {
-        className: classNames("k-popover-callout", {
-          [`k-callout-${kendoThemeMaps.calloutMap[callout] || callout}`]: callout
-        })
+        className: classNames(
+          "k-popover-callout",
+          {
+            [`k-callout-${kendoThemeMaps.calloutMap[callout] || callout}`]: callout
+          }
+        )
       }), title && /* @__PURE__ */ React60.createElement("div", {
         className: "k-popover-header"
       }, title), body && /* @__PURE__ */ React60.createElement("div", {
@@ -2356,9 +2522,13 @@
         children
       } = this.props;
       return /* @__PURE__ */ React62.createElement("div", {
-        className: classNames(className, "k-treeview", {
-          [`k-treeview-${kendoThemeMaps.sizeMap[size] || size}`]: size
-        })
+        className: classNames(
+          className,
+          "k-treeview",
+          {
+            [`k-treeview-${kendoThemeMaps.sizeMap[size] || size}`]: size
+          }
+        )
       }, /* @__PURE__ */ React62.createElement(TreeviewGroup, {
         className: "k-treeview-lines"
       }, children));
@@ -2385,11 +2555,15 @@
         selected
       } = this.props;
       return /* @__PURE__ */ React63.createElement("span", {
-        className: classNames(className, "k-treeview-leaf", {
-          "k-hover": hover,
-          "k-focus": focus,
-          "k-selected": selected
-        })
+        className: classNames(
+          className,
+          "k-treeview-leaf",
+          {
+            "k-hover": hover,
+            "k-focus": focus,
+            "k-selected": selected
+          }
+        )
       }, showIcon && /* @__PURE__ */ React63.createElement(Icon, {
         name: icon
       }), /* @__PURE__ */ React63.createElement("span", {
@@ -2419,9 +2593,13 @@
       } = this.props;
       const _hasChildren = hasChildren || children;
       return /* @__PURE__ */ React64.createElement("li", {
-        className: classNames(className, "k-treeview-item", {
-          "k-disabled": disabled
-        })
+        className: classNames(
+          className,
+          "k-treeview-item",
+          {
+            "k-disabled": disabled
+          }
+        )
       }, /* @__PURE__ */ React64.createElement("span", {
         className: "k-treeview-mid"
       }, _hasChildren && /* @__PURE__ */ React64.createElement("span", {
@@ -2461,15 +2639,19 @@
       return /* @__PURE__ */ React65.createElement("div", {
         style: this.props.style,
         ...htmlAttributes,
-        className: classNames("k-card", {
-          [`k-card-${themeColor}`]: themeColor,
-          [`k-card-${orientation}`]: orientation,
-          "k-card-with-callout": callout,
-          "k-hover": hover,
-          "k-focus": focus,
-          "k-selected": selected,
-          "k-disabled": disabled
-        }, className)
+        className: classNames(
+          "k-card",
+          {
+            [`k-card-${themeColor}`]: themeColor,
+            [`k-card-${orientation}`]: orientation,
+            "k-card-with-callout": callout,
+            "k-hover": hover,
+            "k-focus": focus,
+            "k-selected": selected,
+            "k-disabled": disabled
+          },
+          className
+        )
       }, callout && callout !== "true" && /* @__PURE__ */ React65.createElement(CardCallout, {
         callout
       }), /* @__PURE__ */ React65.createElement(React65.Fragment, null, children));
@@ -2487,9 +2669,13 @@
       } = this.props;
       return /* @__PURE__ */ React66.createElement("span", {
         ...htmlAttributes,
-        className: classNames("k-card-callout", {
-          [`k-callout-${kendoThemeMaps.calloutMap[callout] || callout}`]: callout
-        }, className)
+        className: classNames(
+          "k-card-callout",
+          {
+            [`k-callout-${kendoThemeMaps.calloutMap[callout] || callout}`]: callout
+          },
+          className
+        )
       });
     }
   };
@@ -2507,10 +2693,14 @@
       } = this.props;
       return /* @__PURE__ */ React67.createElement("div", {
         ...htmlAttributes,
-        className: classNames("k-card-title", {
-          "k-hover": hover,
-          "k-focus": focus
-        }, className)
+        className: classNames(
+          "k-card-title",
+          {
+            "k-hover": hover,
+            "k-focus": focus
+          },
+          className
+        )
       }, children);
     }
   };
@@ -2526,7 +2716,10 @@
       } = this.props;
       return /* @__PURE__ */ React68.createElement("div", {
         ...htmlAttributes,
-        className: classNames("k-card-subtitle", className)
+        className: classNames(
+          "k-card-subtitle",
+          className
+        )
       }, children);
     }
   };
@@ -2544,12 +2737,18 @@
       return /* @__PURE__ */ React69.createElement(React69.Fragment, null, src ? /* @__PURE__ */ React69.createElement("img", {
         style: this.props.style,
         ...htmlAttributes,
-        className: classNames("k-card-image", className),
+        className: classNames(
+          "k-card-image",
+          className
+        ),
         src
       }) : /* @__PURE__ */ React69.createElement("span", {
         style: this.props.style,
         ...htmlAttributes,
-        className: classNames("k-card-image", className)
+        className: classNames(
+          "k-card-image",
+          className
+        )
       }, /* @__PURE__ */ React69.createElement(React69.Fragment, null, children)));
     }
   };
@@ -2568,7 +2767,10 @@
       } = this.props;
       return /* @__PURE__ */ React70.createElement("div", {
         ...htmlAttributes,
-        className: classNames("k-card-header", className)
+        className: classNames(
+          "k-card-header",
+          className
+        )
       }, title && /* @__PURE__ */ React70.createElement(CardTitle, null, title), subtitle && /* @__PURE__ */ React70.createElement(CardSubtitle, null, subtitle), /* @__PURE__ */ React70.createElement(React70.Fragment, null, children), details && /* @__PURE__ */ React70.createElement("span", {
         className: "k-card-header-actions"
       }, /* @__PURE__ */ React70.createElement(Button, {
@@ -2593,7 +2795,10 @@
       } = this.props;
       return /* @__PURE__ */ React71.createElement("div", {
         ...htmlAttributes,
-        className: classNames("k-card-footer", className)
+        className: classNames(
+          "k-card-footer",
+          className
+        )
       }, children);
     }
   };
@@ -2613,7 +2818,10 @@
       return /* @__PURE__ */ React72.createElement("div", {
         style: this.props.style,
         ...htmlAttributes,
-        className: classNames("k-card-body", className)
+        className: classNames(
+          "k-card-body",
+          className
+        )
       }, title && /* @__PURE__ */ React72.createElement(CardTitle, null, title), subtitle && /* @__PURE__ */ React72.createElement(CardSubtitle, null, subtitle), /* @__PURE__ */ React72.createElement(React72.Fragment, null, children), details && /* @__PURE__ */ React72.createElement("span", {
         className: "k-card-body-actions"
       }, /* @__PURE__ */ React72.createElement(Button, {
@@ -2638,7 +2846,10 @@
       } = this.props;
       return /* @__PURE__ */ React73.createElement("div", {
         ...htmlAttributes,
-        className: classNames("k-card-deck", className)
+        className: classNames(
+          "k-card-deck",
+          className
+        )
       }, children);
     }
   };