@progress/kendo-themes-html 7.0.3-dev.0 → 7.0.3-dev.2

package/dist/cjs/skeleton/index.js

@@ -20,7 +20,10 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var skeleton_exports = {};
 __export(skeleton_exports, {
   SKELETON_CLASSNAME: () => SKELETON_CLASSNAME,
-  Skeleton: () => Skeleton
+  Skeleton: () => Skeleton,
+  SkeletonCircle: () => SkeletonCircle,
+  SkeletonNormal: () => SkeletonNormal,
+  SkeletonRectangle: () => SkeletonRectangle
 });
 module.exports = __toCommonJS(skeleton_exports);
 
@@ -66,3 +69,27 @@ Skeleton.states = states;
 Skeleton.options = options;
 Skeleton.className = SKELETON_CLASSNAME;
 Skeleton.defaultProps = defaultProps;
+
+// src/skeleton/templates/skeleton-normal.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var SkeletonNormal = (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Skeleton, { ...props });
+
+// src/skeleton/templates/skeleton-rectangle.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var SkeletonRectangle = (props) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+  Skeleton,
+  {
+    shape: "rect",
+    ...props
+  }
+);
+
+// src/skeleton/templates/skeleton-circle.tsx
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var SkeletonCircle = (props) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+  Skeleton,
+  {
+    shape: "circle",
+    ...props
+  }
+);

package/dist/cjs/skeleton/templates/skeleton-circle.js

@@ -0,0 +1,83 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/skeleton/templates/skeleton-circle.tsx
+var skeleton_circle_exports = {};
+__export(skeleton_circle_exports, {
+  SkeletonCircle: () => SkeletonCircle
+});
+module.exports = __toCommonJS(skeleton_circle_exports);
+
+// src/misc/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/skeleton/skeleton.spec.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var SKELETON_CLASSNAME = `k-skeleton`;
+var states = [];
+var options = {};
+var defaultProps = {
+  shape: "text",
+  animation: "pulse"
+};
+var Skeleton = (props) => {
+  const {
+    shape = defaultProps.shape,
+    animation = defaultProps.animation,
+    ...other
+  } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "span",
+    {
+      ...other,
+      className: classNames(
+        props.className,
+        SKELETON_CLASSNAME,
+        {
+          [`k-skeleton-${shape}`]: shape,
+          [`k-skeleton-${animation}`]: animation
+        }
+      ),
+      style: props.style
+    }
+  );
+};
+Skeleton.states = states;
+Skeleton.options = options;
+Skeleton.className = SKELETON_CLASSNAME;
+Skeleton.defaultProps = defaultProps;
+
+// src/skeleton/templates/skeleton-normal.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+
+// src/skeleton/templates/skeleton-rectangle.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+
+// src/skeleton/templates/skeleton-circle.tsx
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var SkeletonCircle = (props) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+  Skeleton,
+  {
+    shape: "circle",
+    ...props
+  }
+);

package/dist/cjs/skeleton/templates/skeleton-normal.js

@@ -0,0 +1,77 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/skeleton/templates/skeleton-normal.tsx
+var skeleton_normal_exports = {};
+__export(skeleton_normal_exports, {
+  SkeletonNormal: () => SkeletonNormal
+});
+module.exports = __toCommonJS(skeleton_normal_exports);
+
+// src/misc/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/skeleton/skeleton.spec.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var SKELETON_CLASSNAME = `k-skeleton`;
+var states = [];
+var options = {};
+var defaultProps = {
+  shape: "text",
+  animation: "pulse"
+};
+var Skeleton = (props) => {
+  const {
+    shape = defaultProps.shape,
+    animation = defaultProps.animation,
+    ...other
+  } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "span",
+    {
+      ...other,
+      className: classNames(
+        props.className,
+        SKELETON_CLASSNAME,
+        {
+          [`k-skeleton-${shape}`]: shape,
+          [`k-skeleton-${animation}`]: animation
+        }
+      ),
+      style: props.style
+    }
+  );
+};
+Skeleton.states = states;
+Skeleton.options = options;
+Skeleton.className = SKELETON_CLASSNAME;
+Skeleton.defaultProps = defaultProps;
+
+// src/skeleton/templates/skeleton-rectangle.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+
+// src/skeleton/templates/skeleton-circle.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+
+// src/skeleton/templates/skeleton-normal.tsx
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var SkeletonNormal = (props) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Skeleton, { ...props });

package/dist/cjs/skeleton/templates/skeleton-rectangle.js

@@ -0,0 +1,83 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/skeleton/templates/skeleton-rectangle.tsx
+var skeleton_rectangle_exports = {};
+__export(skeleton_rectangle_exports, {
+  SkeletonRectangle: () => SkeletonRectangle
+});
+module.exports = __toCommonJS(skeleton_rectangle_exports);
+
+// src/misc/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/skeleton/skeleton.spec.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var SKELETON_CLASSNAME = `k-skeleton`;
+var states = [];
+var options = {};
+var defaultProps = {
+  shape: "text",
+  animation: "pulse"
+};
+var Skeleton = (props) => {
+  const {
+    shape = defaultProps.shape,
+    animation = defaultProps.animation,
+    ...other
+  } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "span",
+    {
+      ...other,
+      className: classNames(
+        props.className,
+        SKELETON_CLASSNAME,
+        {
+          [`k-skeleton-${shape}`]: shape,
+          [`k-skeleton-${animation}`]: animation
+        }
+      ),
+      style: props.style
+    }
+  );
+};
+Skeleton.states = states;
+Skeleton.options = options;
+Skeleton.className = SKELETON_CLASSNAME;
+Skeleton.defaultProps = defaultProps;
+
+// src/skeleton/templates/skeleton-normal.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+
+// src/skeleton/templates/skeleton-circle.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+
+// src/skeleton/templates/skeleton-rectangle.tsx
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var SkeletonRectangle = (props) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+  Skeleton,
+  {
+    shape: "rect",
+    ...props
+  }
+);

package/dist/cjs/skeleton/tests/skeleton.js

@@ -66,8 +66,32 @@ Skeleton.options = options;
 Skeleton.className = SKELETON_CLASSNAME;
 Skeleton.defaultProps = defaultProps;
 
-// src/skeleton/tests/skeleton.tsx
+// src/skeleton/templates/skeleton-normal.tsx
 var import_jsx_runtime2 = require("react/jsx-runtime");
+var SkeletonNormal = (props) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Skeleton, { ...props });
+
+// src/skeleton/templates/skeleton-rectangle.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var SkeletonRectangle = (props) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+  Skeleton,
+  {
+    shape: "rect",
+    ...props
+  }
+);
+
+// src/skeleton/templates/skeleton-circle.tsx
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var SkeletonCircle = (props) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+  Skeleton,
+  {
+    shape: "circle",
+    ...props
+  }
+);
+
+// src/skeleton/tests/skeleton.tsx
+var import_jsx_runtime5 = require("react/jsx-runtime");
 var style = `
     .k-skeleton-container {
         width: 300px;
@@ -77,19 +101,19 @@ var style = `
         gap: 10px;
     }
 `;
-var skeleton_default = () => /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
-  /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("style", { children: style }),
-  /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { id: "test-area", className: "k-d-grid k-grid-cols-1", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Skeleton, { style: { width: "300px" } }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Skeleton, { shape: "circle", style: { width: "50px", height: "50px" } }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Skeleton, { shape: "rect", style: { width: "300px", height: "200px" } }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "k-skeleton-container k-d-grid", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Skeleton, { shape: "circle", style: { gridColumn: "1 / 3", gridRow: "1 / 3" } }),
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Skeleton, { style: { gridColumn: "3 / 10", gridRow: "1 / 2" } }),
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Skeleton, { style: { gridColumn: "3 / 7", gridRow: "2 / 3" } }),
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Skeleton, { shape: "rect", style: { gridColumn: "1 / 11", gridRow: "3 / 8" } }),
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Skeleton, { style: { gridColumn: "1 / 11", gridRow: "9 / 10" } }),
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Skeleton, { style: { gridColumn: "1 / 11", gridRow: "10 / 10" } })
+var skeleton_default = () => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
+  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("style", { children: style }),
+  /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { id: "test-area", className: "k-d-grid k-grid-cols-1", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SkeletonNormal, { style: { width: "300px" } }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SkeletonCircle, { style: { width: "50px", height: "50px" } }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SkeletonRectangle, { style: { width: "300px", height: "200px" } }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "k-skeleton-container k-d-grid", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SkeletonCircle, { style: { gridColumn: "1 / 3", gridRow: "1 / 3" } }),
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SkeletonNormal, { style: { gridColumn: "3 / 10", gridRow: "1 / 2" } }),
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SkeletonNormal, { style: { gridColumn: "3 / 7", gridRow: "2 / 3" } }),
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SkeletonRectangle, { style: { gridColumn: "1 / 11", gridRow: "3 / 8" } }),
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SkeletonNormal, { style: { gridColumn: "1 / 11", gridRow: "9 / 10" } }),
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SkeletonNormal, { style: { gridColumn: "1 / 11", gridRow: "10 / 10" } })
     ] })
   ] })
 ] });