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

package/dist/cjs/captcha/captcha.spec.js

@@ -5023,7 +5023,9 @@ var states14 = [
   States.disabled
 ];
 var options13 = {};
-var defaultProps14 = {};
+var defaultProps14 = {
+  imgPath: "/packages/html/assets/captcha.jpg"
+};
 var Captcha = (props) => {
   const {
     value,
@@ -5031,6 +5033,7 @@ var Captcha = (props) => {
     invalid,
     loading,
     disabled,
+    imgPath = defaultProps14.imgPath,
     ...other
   } = props;
   return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
@@ -5054,7 +5057,7 @@ var Captcha = (props) => {
               "img",
               {
                 className: classNames({ "k-hidden": loading }),
-                src: "/packages/html/assets/captcha.jpg"
+                src: imgPath
               }
             ),
             loading && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(SkeletonRectangle, { style: { width: "100%", height: "100%" } })

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

@@ -5021,7 +5021,9 @@ var states14 = [
   States.disabled
 ];
 var options13 = {};
-var defaultProps14 = {};
+var defaultProps14 = {
+  imgPath: "/packages/html/assets/captcha.jpg"
+};
 var Captcha = (props) => {
   const {
     value,
@@ -5029,6 +5031,7 @@ var Captcha = (props) => {
     invalid,
     loading,
     disabled,
+    imgPath = defaultProps14.imgPath,
     ...other
   } = props;
   return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
@@ -5052,7 +5055,7 @@ var Captcha = (props) => {
               "img",
               {
                 className: classNames({ "k-hidden": loading }),
-                src: "/packages/html/assets/captcha.jpg"
+                src: imgPath
               }
             ),
             loading && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(SkeletonRectangle, { style: { width: "100%", height: "100%" } })

package/dist/cjs/captcha/tests/captcha-rtl.js

@@ -5021,7 +5021,9 @@ var states14 = [
   States.disabled
 ];
 var options13 = {};
-var defaultProps14 = {};
+var defaultProps14 = {
+  imgPath: "/packages/html/assets/captcha.jpg"
+};
 var Captcha = (props) => {
   const {
     value,
@@ -5029,6 +5031,7 @@ var Captcha = (props) => {
     invalid,
     loading,
     disabled,
+    imgPath = defaultProps14.imgPath,
     ...other
   } = props;
   return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
@@ -5052,7 +5055,7 @@ var Captcha = (props) => {
               "img",
               {
                 className: classNames({ "k-hidden": loading }),
-                src: "/packages/html/assets/captcha.jpg"
+                src: imgPath
               }
             ),
             loading && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(SkeletonRectangle, { style: { width: "100%", height: "100%" } })

package/dist/cjs/captcha/tests/captcha.js

@@ -5021,7 +5021,9 @@ var states14 = [
   States.disabled
 ];
 var options13 = {};
-var defaultProps14 = {};
+var defaultProps14 = {
+  imgPath: "/packages/html/assets/captcha.jpg"
+};
 var Captcha = (props) => {
   const {
     value,
@@ -5029,6 +5031,7 @@ var Captcha = (props) => {
     invalid,
     loading,
     disabled,
+    imgPath = defaultProps14.imgPath,
     ...other
   } = props;
   return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
@@ -5052,7 +5055,7 @@ var Captcha = (props) => {
               "img",
               {
                 className: classNames({ "k-hidden": loading }),
-                src: "/packages/html/assets/captcha.jpg"
+                src: imgPath
               }
             ),
             loading && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(SkeletonRectangle, { style: { width: "100%", height: "100%" } })

package/dist/cjs/card/tests/card-horizontal.js

@@ -4812,7 +4812,7 @@ var CardHorizontal = (props) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
 var import_jsx_runtime20 = require("react/jsx-runtime");
 var styles = `
     .k-card {
-        height: 300px;
+        height: 250px;
     }
     .k-card-media {
         display: block;
@@ -4822,7 +4822,7 @@ var styles = `
 `;
 var card_horizontal_default = () => /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime20.Fragment, { children: [
   /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("style", { children: styles }),
-  /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { id: "test-area", className: "k-d-grid k-grid-cols-4", children: [
+  /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { id: "test-area", className: "k-d-grid k-grid-cols-3", children: [
     /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(CardHorizontal, {}),
     /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(CardHorizontal, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { children: [
@@ -4878,6 +4878,13 @@ var card_horizontal_default = () => /* @__PURE__ */ (0, import_jsx_runtime20.jsx
         /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Button, { fillMode: "flat", themeColor: "primary", children: "Action 1" }),
         /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Button, { fillMode: "flat", themeColor: "primary", children: "Action 2" })
       ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(CardHorizontal, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(CardBody, { title: "Card Title", subtitle: "Horizontal card - Action buttons with horizontal layout.", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { children: "Horizontal card - Action buttons with horizontal layout." }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(ActionButtons, { className: "k-card-actions", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Button, { fillMode: "flat", themeColor: "primary", children: "Action 1" }),
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Button, { fillMode: "flat", themeColor: "primary", children: "Action 2" })
+      ] })
     ] })
   ] })
 ] });

package/dist/cjs/coloreditor/color-editor.spec.js

@@ -4584,7 +4584,9 @@ var defaultProps7 = {
   orientation: "horizontal",
   readonly: false,
   disabled: false,
-  handlePosition: "end"
+  handlePosition: "end",
+  showButtons: true,
+  showTicks: true
 };
 var Slider = (props) => {
   const {
@@ -4593,6 +4595,8 @@ var Slider = (props) => {
     readonly = defaultProps7.readonly,
     disabled = defaultProps7.disabled,
     handlePosition = defaultProps7.handlePosition,
+    showButtons = defaultProps7.showButtons,
+    showTicks = defaultProps7.showTicks,
     hover,
     focus,
     active,
@@ -4621,9 +4625,9 @@ var Slider = (props) => {
       "k-range-slider": type === "range"
     }
   ), dir, children: [
-    type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-decrease", rounded: "full", icon: iconDecrease }),
+    showButtons && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-decrease", rounded: "full", icon: iconDecrease }),
     /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "k-slider-track-wrap", children: [
-      type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("ul", { className: "k-reset k-slider-items", children: props.children }),
+      showTicks && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("ul", { className: "k-reset k-slider-items", children: props.children }),
       /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "k-slider-track", style: trackStyle, children: [
         /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "k-slider-selection" }),
         type === "range" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: classNames(
@@ -4646,7 +4650,7 @@ var Slider = (props) => {
         ) })
       ] })
     ] }),
-    type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-increase", rounded: "full", icon: iconIncrease })
+    showButtons && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-increase", rounded: "full", icon: iconIncrease })
   ] });
 };
 Slider.states = states7;
@@ -4706,6 +4710,8 @@ var SliderGradientVertical = (props) => /* @__PURE__ */ (0, import_jsx_runtime21
   {
     type: "gradient",
     orientation: "vertical",
+    showButtons: false,
+    showTicks: false,
     children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SliderTick, { label: true, large: true, text: "0" }),
       /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SliderTick, {}),

package/dist/cjs/coloreditor/templates/coloreditor-group.js

@@ -4583,7 +4583,9 @@ var defaultProps7 = {
   orientation: "horizontal",
   readonly: false,
   disabled: false,
-  handlePosition: "end"
+  handlePosition: "end",
+  showButtons: true,
+  showTicks: true
 };
 var Slider = (props) => {
   const {
@@ -4592,6 +4594,8 @@ var Slider = (props) => {
     readonly = defaultProps7.readonly,
     disabled = defaultProps7.disabled,
     handlePosition = defaultProps7.handlePosition,
+    showButtons = defaultProps7.showButtons,
+    showTicks = defaultProps7.showTicks,
     hover,
     focus,
     active,
@@ -4620,9 +4624,9 @@ var Slider = (props) => {
       "k-range-slider": type === "range"
     }
   ), dir, children: [
-    type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-decrease", rounded: "full", icon: iconDecrease }),
+    showButtons && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-decrease", rounded: "full", icon: iconDecrease }),
     /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "k-slider-track-wrap", children: [
-      type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("ul", { className: "k-reset k-slider-items", children: props.children }),
+      showTicks && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("ul", { className: "k-reset k-slider-items", children: props.children }),
       /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "k-slider-track", style: trackStyle, children: [
         /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "k-slider-selection" }),
         type === "range" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: classNames(
@@ -4645,7 +4649,7 @@ var Slider = (props) => {
         ) })
       ] })
     ] }),
-    type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-increase", rounded: "full", icon: iconIncrease })
+    showButtons && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-increase", rounded: "full", icon: iconIncrease })
   ] });
 };
 Slider.states = states7;
@@ -4705,6 +4709,8 @@ var SliderGradientVertical = (props) => /* @__PURE__ */ (0, import_jsx_runtime21
   {
     type: "gradient",
     orientation: "vertical",
+    showButtons: false,
+    showTicks: false,
     children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SliderTick, { label: true, large: true, text: "0" }),
       /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SliderTick, {}),

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

@@ -4583,7 +4583,9 @@ var defaultProps7 = {
   orientation: "horizontal",
   readonly: false,
   disabled: false,
-  handlePosition: "end"
+  handlePosition: "end",
+  showButtons: true,
+  showTicks: true
 };
 var Slider = (props) => {
   const {
@@ -4592,6 +4594,8 @@ var Slider = (props) => {
     readonly = defaultProps7.readonly,
     disabled = defaultProps7.disabled,
     handlePosition = defaultProps7.handlePosition,
+    showButtons = defaultProps7.showButtons,
+    showTicks = defaultProps7.showTicks,
     hover,
     focus,
     active,
@@ -4620,9 +4624,9 @@ var Slider = (props) => {
       "k-range-slider": type === "range"
     }
   ), dir, children: [
-    type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-decrease", rounded: "full", icon: iconDecrease }),
+    showButtons && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-decrease", rounded: "full", icon: iconDecrease }),
     /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "k-slider-track-wrap", children: [
-      type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("ul", { className: "k-reset k-slider-items", children: props.children }),
+      showTicks && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("ul", { className: "k-reset k-slider-items", children: props.children }),
       /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "k-slider-track", style: trackStyle, children: [
         /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "k-slider-selection" }),
         type === "range" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: classNames(
@@ -4645,7 +4649,7 @@ var Slider = (props) => {
         ) })
       ] })
     ] }),
-    type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-increase", rounded: "full", icon: iconIncrease })
+    showButtons && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-increase", rounded: "full", icon: iconIncrease })
   ] });
 };
 Slider.states = states7;
@@ -4705,6 +4709,8 @@ var SliderGradientVertical = (props) => /* @__PURE__ */ (0, import_jsx_runtime21
   {
     type: "gradient",
     orientation: "vertical",
+    showButtons: false,
+    showTicks: false,
     children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SliderTick, { label: true, large: true, text: "0" }),
       /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SliderTick, {}),

package/dist/cjs/coloreditor/templates/coloreditor-palette-group.js

@@ -4583,7 +4583,9 @@ var defaultProps7 = {
   orientation: "horizontal",
   readonly: false,
   disabled: false,
-  handlePosition: "end"
+  handlePosition: "end",
+  showButtons: true,
+  showTicks: true
 };
 var Slider = (props) => {
   const {
@@ -4592,6 +4594,8 @@ var Slider = (props) => {
     readonly = defaultProps7.readonly,
     disabled = defaultProps7.disabled,
     handlePosition = defaultProps7.handlePosition,
+    showButtons = defaultProps7.showButtons,
+    showTicks = defaultProps7.showTicks,
     hover,
     focus,
     active,
@@ -4620,9 +4624,9 @@ var Slider = (props) => {
       "k-range-slider": type === "range"
     }
   ), dir, children: [
-    type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-decrease", rounded: "full", icon: iconDecrease }),
+    showButtons && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-decrease", rounded: "full", icon: iconDecrease }),
     /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "k-slider-track-wrap", children: [
-      type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("ul", { className: "k-reset k-slider-items", children: props.children }),
+      showTicks && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("ul", { className: "k-reset k-slider-items", children: props.children }),
       /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "k-slider-track", style: trackStyle, children: [
         /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "k-slider-selection" }),
         type === "range" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: classNames(
@@ -4645,7 +4649,7 @@ var Slider = (props) => {
         ) })
       ] })
     ] }),
-    type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-increase", rounded: "full", icon: iconIncrease })
+    showButtons && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-increase", rounded: "full", icon: iconIncrease })
   ] });
 };
 Slider.states = states7;
@@ -4705,6 +4709,8 @@ var SliderGradientVertical = (props) => /* @__PURE__ */ (0, import_jsx_runtime21
   {
     type: "gradient",
     orientation: "vertical",
+    showButtons: false,
+    showTicks: false,
     children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SliderTick, { label: true, large: true, text: "0" }),
       /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SliderTick, {}),

package/dist/cjs/coloreditor/templates/coloreditor-palette.js

@@ -4583,7 +4583,9 @@ var defaultProps7 = {
   orientation: "horizontal",
   readonly: false,
   disabled: false,
-  handlePosition: "end"
+  handlePosition: "end",
+  showButtons: true,
+  showTicks: true
 };
 var Slider = (props) => {
   const {
@@ -4592,6 +4594,8 @@ var Slider = (props) => {
     readonly = defaultProps7.readonly,
     disabled = defaultProps7.disabled,
     handlePosition = defaultProps7.handlePosition,
+    showButtons = defaultProps7.showButtons,
+    showTicks = defaultProps7.showTicks,
     hover,
     focus,
     active,
@@ -4620,9 +4624,9 @@ var Slider = (props) => {
       "k-range-slider": type === "range"
     }
   ), dir, children: [
-    type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-decrease", rounded: "full", icon: iconDecrease }),
+    showButtons && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-decrease", rounded: "full", icon: iconDecrease }),
     /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "k-slider-track-wrap", children: [
-      type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("ul", { className: "k-reset k-slider-items", children: props.children }),
+      showTicks && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("ul", { className: "k-reset k-slider-items", children: props.children }),
       /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "k-slider-track", style: trackStyle, children: [
         /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "k-slider-selection" }),
         type === "range" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: classNames(
@@ -4645,7 +4649,7 @@ var Slider = (props) => {
         ) })
       ] })
     ] }),
-    type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-increase", rounded: "full", icon: iconIncrease })
+    showButtons && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-increase", rounded: "full", icon: iconIncrease })
   ] });
 };
 Slider.states = states7;
@@ -4705,6 +4709,8 @@ var SliderGradientVertical = (props) => /* @__PURE__ */ (0, import_jsx_runtime21
   {
     type: "gradient",
     orientation: "vertical",
+    showButtons: false,
+    showTicks: false,
     children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SliderTick, { label: true, large: true, text: "0" }),
       /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SliderTick, {}),

package/dist/cjs/coloreditor/tests/coloreditor-focused-colorgradient.js

@@ -4583,7 +4583,9 @@ var defaultProps7 = {
   orientation: "horizontal",
   readonly: false,
   disabled: false,
-  handlePosition: "end"
+  handlePosition: "end",
+  showButtons: true,
+  showTicks: true
 };
 var Slider = (props) => {
   const {
@@ -4592,6 +4594,8 @@ var Slider = (props) => {
     readonly = defaultProps7.readonly,
     disabled = defaultProps7.disabled,
     handlePosition = defaultProps7.handlePosition,
+    showButtons = defaultProps7.showButtons,
+    showTicks = defaultProps7.showTicks,
     hover,
     focus,
     active,
@@ -4620,9 +4624,9 @@ var Slider = (props) => {
       "k-range-slider": type === "range"
     }
   ), dir, children: [
-    type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-decrease", rounded: "full", icon: iconDecrease }),
+    showButtons && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-decrease", rounded: "full", icon: iconDecrease }),
     /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "k-slider-track-wrap", children: [
-      type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("ul", { className: "k-reset k-slider-items", children: props.children }),
+      showTicks && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("ul", { className: "k-reset k-slider-items", children: props.children }),
       /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "k-slider-track", style: trackStyle, children: [
         /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "k-slider-selection" }),
         type === "range" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: classNames(
@@ -4645,7 +4649,7 @@ var Slider = (props) => {
         ) })
       ] })
     ] }),
-    type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-increase", rounded: "full", icon: iconIncrease })
+    showButtons && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-increase", rounded: "full", icon: iconIncrease })
   ] });
 };
 Slider.states = states7;
@@ -4705,6 +4709,8 @@ var SliderGradientVertical = (props) => /* @__PURE__ */ (0, import_jsx_runtime21
   {
     type: "gradient",
     orientation: "vertical",
+    showButtons: false,
+    showTicks: false,
     children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SliderTick, { label: true, large: true, text: "0" }),
       /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SliderTick, {}),

package/dist/cjs/coloreditor/tests/coloreditor-rtl.js

@@ -4583,7 +4583,9 @@ var defaultProps7 = {
   orientation: "horizontal",
   readonly: false,
   disabled: false,
-  handlePosition: "end"
+  handlePosition: "end",
+  showButtons: true,
+  showTicks: true
 };
 var Slider = (props) => {
   const {
@@ -4592,6 +4594,8 @@ var Slider = (props) => {
     readonly = defaultProps7.readonly,
     disabled = defaultProps7.disabled,
     handlePosition = defaultProps7.handlePosition,
+    showButtons = defaultProps7.showButtons,
+    showTicks = defaultProps7.showTicks,
     hover,
     focus,
     active,
@@ -4620,9 +4624,9 @@ var Slider = (props) => {
       "k-range-slider": type === "range"
     }
   ), dir, children: [
-    type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-decrease", rounded: "full", icon: iconDecrease }),
+    showButtons && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-decrease", rounded: "full", icon: iconDecrease }),
     /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "k-slider-track-wrap", children: [
-      type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("ul", { className: "k-reset k-slider-items", children: props.children }),
+      showTicks && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("ul", { className: "k-reset k-slider-items", children: props.children }),
       /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "k-slider-track", style: trackStyle, children: [
         /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "k-slider-selection" }),
         type === "range" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: classNames(
@@ -4645,7 +4649,7 @@ var Slider = (props) => {
         ) })
       ] })
     ] }),
-    type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-increase", rounded: "full", icon: iconIncrease })
+    showButtons && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-increase", rounded: "full", icon: iconIncrease })
   ] });
 };
 Slider.states = states7;
@@ -4705,6 +4709,8 @@ var SliderGradientVertical = (props) => /* @__PURE__ */ (0, import_jsx_runtime21
   {
     type: "gradient",
     orientation: "vertical",
+    showButtons: false,
+    showTicks: false,
     children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SliderTick, { label: true, large: true, text: "0" }),
       /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SliderTick, {}),

package/dist/cjs/coloreditor/tests/coloreditor-states.js

@@ -4583,7 +4583,9 @@ var defaultProps7 = {
   orientation: "horizontal",
   readonly: false,
   disabled: false,
-  handlePosition: "end"
+  handlePosition: "end",
+  showButtons: true,
+  showTicks: true
 };
 var Slider = (props) => {
   const {
@@ -4592,6 +4594,8 @@ var Slider = (props) => {
     readonly = defaultProps7.readonly,
     disabled = defaultProps7.disabled,
     handlePosition = defaultProps7.handlePosition,
+    showButtons = defaultProps7.showButtons,
+    showTicks = defaultProps7.showTicks,
     hover,
     focus,
     active,
@@ -4620,9 +4624,9 @@ var Slider = (props) => {
       "k-range-slider": type === "range"
     }
   ), dir, children: [
-    type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-decrease", rounded: "full", icon: iconDecrease }),
+    showButtons && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-decrease", rounded: "full", icon: iconDecrease }),
     /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "k-slider-track-wrap", children: [
-      type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("ul", { className: "k-reset k-slider-items", children: props.children }),
+      showTicks && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("ul", { className: "k-reset k-slider-items", children: props.children }),
       /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "k-slider-track", style: trackStyle, children: [
         /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "k-slider-selection" }),
         type === "range" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: classNames(
@@ -4645,7 +4649,7 @@ var Slider = (props) => {
         ) })
       ] })
     ] }),
-    type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-increase", rounded: "full", icon: iconIncrease })
+    showButtons && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-increase", rounded: "full", icon: iconIncrease })
   ] });
 };
 Slider.states = states7;
@@ -4705,6 +4709,8 @@ var SliderGradientVertical = (props) => /* @__PURE__ */ (0, import_jsx_runtime21
   {
     type: "gradient",
     orientation: "vertical",
+    showButtons: false,
+    showTicks: false,
     children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SliderTick, { label: true, large: true, text: "0" }),
       /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SliderTick, {}),

package/dist/cjs/coloreditor/tests/coloreditor.js

@@ -4583,7 +4583,9 @@ var defaultProps7 = {
   orientation: "horizontal",
   readonly: false,
   disabled: false,
-  handlePosition: "end"
+  handlePosition: "end",
+  showButtons: true,
+  showTicks: true
 };
 var Slider = (props) => {
   const {
@@ -4592,6 +4594,8 @@ var Slider = (props) => {
     readonly = defaultProps7.readonly,
     disabled = defaultProps7.disabled,
     handlePosition = defaultProps7.handlePosition,
+    showButtons = defaultProps7.showButtons,
+    showTicks = defaultProps7.showTicks,
     hover,
     focus,
     active,
@@ -4620,9 +4624,9 @@ var Slider = (props) => {
       "k-range-slider": type === "range"
     }
   ), dir, children: [
-    type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-decrease", rounded: "full", icon: iconDecrease }),
+    showButtons && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-decrease", rounded: "full", icon: iconDecrease }),
     /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "k-slider-track-wrap", children: [
-      type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("ul", { className: "k-reset k-slider-items", children: props.children }),
+      showTicks && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("ul", { className: "k-reset k-slider-items", children: props.children }),
       /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "k-slider-track", style: trackStyle, children: [
         /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "k-slider-selection" }),
         type === "range" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: classNames(
@@ -4645,7 +4649,7 @@ var Slider = (props) => {
         ) })
       ] })
     ] }),
-    type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-increase", rounded: "full", icon: iconIncrease })
+    showButtons && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { className: "k-button-increase", rounded: "full", icon: iconIncrease })
   ] });
 };
 Slider.states = states7;
@@ -4705,6 +4709,8 @@ var SliderGradientVertical = (props) => /* @__PURE__ */ (0, import_jsx_runtime21
   {
     type: "gradient",
     orientation: "vertical",
+    showButtons: false,
+    showTicks: false,
     children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SliderTick, { label: true, large: true, text: "0" }),
       /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SliderTick, {}),

package/dist/cjs/colorgradient/color-gradient.spec.js

@@ -4491,7 +4491,9 @@ var defaultProps5 = {
   orientation: "horizontal",
   readonly: false,
   disabled: false,
-  handlePosition: "end"
+  handlePosition: "end",
+  showButtons: true,
+  showTicks: true
 };
 var Slider = (props) => {
   const {
@@ -4500,6 +4502,8 @@ var Slider = (props) => {
     readonly = defaultProps5.readonly,
     disabled = defaultProps5.disabled,
     handlePosition = defaultProps5.handlePosition,
+    showButtons = defaultProps5.showButtons,
+    showTicks = defaultProps5.showTicks,
     hover,
     focus,
     active,
@@ -4528,9 +4532,9 @@ var Slider = (props) => {
       "k-range-slider": type === "range"
     }
   ), dir, children: [
-    type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Button, { className: "k-button-decrease", rounded: "full", icon: iconDecrease }),
+    showButtons && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Button, { className: "k-button-decrease", rounded: "full", icon: iconDecrease }),
     /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "k-slider-track-wrap", children: [
-      type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("ul", { className: "k-reset k-slider-items", children: props.children }),
+      showTicks && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("ul", { className: "k-reset k-slider-items", children: props.children }),
       /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "k-slider-track", style: trackStyle, children: [
         /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "k-slider-selection" }),
         type === "range" && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: classNames(
@@ -4553,7 +4557,7 @@ var Slider = (props) => {
         ) })
       ] })
     ] }),
-    type !== "gradient" && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Button, { className: "k-button-increase", rounded: "full", icon: iconIncrease })
+    showButtons && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Button, { className: "k-button-increase", rounded: "full", icon: iconIncrease })
   ] });
 };
 Slider.states = states5;
@@ -4613,6 +4617,8 @@ var SliderGradientVertical = (props) => /* @__PURE__ */ (0, import_jsx_runtime15
   {
     type: "gradient",
     orientation: "vertical",
+    showButtons: false,
+    showTicks: false,
     children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_jsx_runtime15.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(SliderTick, { label: true, large: true, text: "0" }),
       /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(SliderTick, {}),