@progress/kendo-themes-html 7.1.0-dev.8 → 7.1.0-dev.9

package/dist/cjs/mediaplayer/tests/mediaplayer.js

@@ -5850,7 +5850,9 @@ var defaultProps26 = {
   orientation: "horizontal",
   readonly: false,
   disabled: false,
-  handlePosition: "end"
+  handlePosition: "end",
+  showButtons: true,
+  showTicks: true
 };
 var Slider = (props) => {
   const {
@@ -5859,6 +5861,8 @@ var Slider = (props) => {
     readonly = defaultProps26.readonly,
     disabled = defaultProps26.disabled,
     handlePosition = defaultProps26.handlePosition,
+    showButtons = defaultProps26.showButtons,
+    showTicks = defaultProps26.showTicks,
     hover,
     focus,
     active,
@@ -5887,9 +5891,9 @@ var Slider = (props) => {
       "k-range-slider": type === "range"
     }
   ), dir, children: [
-    type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Button, { className: "k-button-decrease", rounded: "full", icon: iconDecrease }),
+    showButtons && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Button, { className: "k-button-decrease", rounded: "full", icon: iconDecrease }),
     /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: "k-slider-track-wrap", children: [
-      type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("ul", { className: "k-reset k-slider-items", children: props.children }),
+      showTicks && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("ul", { className: "k-reset k-slider-items", children: props.children }),
       /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: "k-slider-track", style: trackStyle, children: [
         /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: "k-slider-selection" }),
         type === "range" && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("span", { className: classNames(
@@ -5912,7 +5916,7 @@ var Slider = (props) => {
         ) })
       ] })
     ] }),
-    type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Button, { className: "k-button-increase", rounded: "full", icon: iconIncrease })
+    showButtons && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Button, { className: "k-button-increase", rounded: "full", icon: iconIncrease })
   ] });
 };
 Slider.states = states27;
@@ -5952,6 +5956,25 @@ SliderTick.defaultProps = defaultProps27;
 
 // src/slider/templates/slider-normal.tsx
 var import_jsx_runtime64 = require("react/jsx-runtime");
+var SliderNormal = (props) => /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
+  Slider,
+  {
+    children: /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(import_jsx_runtime64.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(SliderTick, { label: true, large: true, text: "0" }),
+      /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(SliderTick, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(SliderTick, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(SliderTick, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(SliderTick, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(SliderTick, { label: true, large: true, text: "5" }),
+      /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(SliderTick, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(SliderTick, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(SliderTick, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(SliderTick, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(SliderTick, { label: true, large: true, text: "10" })
+    ] }),
+    ...props
+  }
+);
 
 // src/slider/templates/slider-vertical.tsx
 var import_jsx_runtime65 = require("react/jsx-runtime");
@@ -5972,6 +5995,8 @@ var SliderGradientVertical = (props) => /* @__PURE__ */ (0, import_jsx_runtime69
   {
     type: "gradient",
     orientation: "vertical",
+    showButtons: false,
+    showTicks: false,
     children: /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)(import_jsx_runtime69.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(SliderTick, { label: true, large: true, text: "0" }),
       /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(SliderTick, {}),
@@ -7870,10 +7895,7 @@ var mediaplayer_default = () => /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)(
   /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("div", { id: "test-area", className: "k-d-grid", children: /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)("div", { className: "k-mediaplayer k-widget", children: [
     /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("div", { className: "k-mediaplayer-titlebar", children: "Media player title" }),
     /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)("div", { className: "k-mediaplayer-toolbar-wrap", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("div", { className: "k-slider k-slider-horizontal k-mediaplayer-seekbar", children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("div", { className: "k-slider-track-wrap", children: /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)("div", { className: "k-slider-track", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("div", { className: "k-slider-selection" }),
-        /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("a", { href: "#", className: "k-draghandle k-draghandle-end" })
-      ] }) }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(SliderNormal, { className: "k-mediaplayer-seekbar", showButtons: false, showTicks: false }),
       /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)(Toolbar, { className: "k-mediaplayer-toolbar", children: [
         /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(Button, { fillMode: "flat", icon: "play", className: "k-play-button" }),
         /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)("div", { className: "k-mediaplayer-currenttime-wrap", children: [
@@ -7883,10 +7905,7 @@ var mediaplayer_default = () => /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)(
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("div", { className: "k-spacer" }),
         /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(Button, { fillMode: "flat", icon: "volume-up", className: "k-volume-button" }),
-        /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("div", { className: "k-mediaplayer-volume-wrap", children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("div", { className: "k-slider k-slider-horizontal k-mediaplayer-volume", children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("div", { className: "k-slider-track-wrap", children: /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)("div", { className: "k-slider-track", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("div", { className: "k-slider-selection" }),
-          /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("a", { href: "#", className: "k-draghandle k-draghandle-end" })
-        ] }) }) }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("div", { className: "k-mediaplayer-volume-wrap", children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(SliderNormal, { className: "k-mediaplayer-volume", showButtons: false, showTicks: false }) }),
         /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("div", { className: "k-mediaplayer-quality-wrap", children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(DropdownList, { value: "360p", arrowIconName: "hd", className: "k-mediaplayer-quality" }) }),
         /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(Button, { fillMode: "flat", icon: "fullscreen", className: "k-fullscreen-button" })
       ] })