@progress/kendo-themes-html 10.1.1-dev.1 → 10.2.0-dev.1

package/dist/cjs/imageeditor/imageeditor.spec.js

@@ -2744,12 +2744,16 @@ var COLORPALETTE_CLASSNAME = `k-colorpalette`;
 var states37 = [
   States.disabled
 ];
-var options35 = {};
+var options35 = {
+  size: [Size.small, Size.medium, Size.large]
+};
 var defaultOptions34 = {
-  columns: 10
+  columns: 10,
+  size: Size.medium
 };
 var ColorPalette = (props) => {
   const {
+    size = defaultOptions34.size,
     palette,
     columns = defaultOptions34.columns,
     tileSize,
@@ -2780,7 +2784,8 @@ var ColorPalette = (props) => {
         COLORPALETTE_CLASSNAME,
         stateClassNames(COLORPALETTE_CLASSNAME, {
           disabled
-        })
+        }),
+        optionClassNames(COLORPALETTE_CLASSNAME, { size })
       ),
       children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("table", { className: "k-colorpalette-table", children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("tbody", { children: newChildren.length > 0 ? newChildren : props.children }) })
     }
@@ -2897,7 +2902,7 @@ var ColorEditor = (props) => {
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("div", { className: "k-coloreditor-views k-vstack", children: view === "gradient" ? /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorGradient, { focus: focusView, size, canvasOrientation }) : /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorPalette, { palette }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("div", { className: "k-coloreditor-views k-vstack", children: view === "gradient" ? /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorGradient, { focus: focusView, size, canvasOrientation }) : /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorPalette, { palette, size }) }),
     actionButtons && /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)(ActionButtons, { className: "k-coloreditor-footer", alignment: "end", children: [
       /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(Button, { className: "k-coloreditor-cancel", size, children: "Cancel" }),
       /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(Button, { themeColor: "primary", size, className: "k-coloreditor-apply", children: "Apply" })

package/dist/cjs/imageeditor/templates/imageeditor-crop.js

@@ -2747,12 +2747,16 @@ var COLORPALETTE_CLASSNAME = `k-colorpalette`;
 var states37 = [
   States.disabled
 ];
-var options35 = {};
+var options35 = {
+  size: [Size.small, Size.medium, Size.large]
+};
 var defaultOptions34 = {
-  columns: 10
+  columns: 10,
+  size: Size.medium
 };
 var ColorPalette = (props) => {
   const {
+    size = defaultOptions34.size,
     palette,
     columns = defaultOptions34.columns,
     tileSize,
@@ -2783,7 +2787,8 @@ var ColorPalette = (props) => {
         COLORPALETTE_CLASSNAME,
         stateClassNames(COLORPALETTE_CLASSNAME, {
           disabled
-        })
+        }),
+        optionClassNames(COLORPALETTE_CLASSNAME, { size })
       ),
       children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("table", { className: "k-colorpalette-table", children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("tbody", { children: newChildren.length > 0 ? newChildren : props.children }) })
     }
@@ -2900,7 +2905,7 @@ var ColorEditor = (props) => {
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("div", { className: "k-coloreditor-views k-vstack", children: view === "gradient" ? /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorGradient, { focus: focusView, size, canvasOrientation }) : /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorPalette, { palette }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("div", { className: "k-coloreditor-views k-vstack", children: view === "gradient" ? /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorGradient, { focus: focusView, size, canvasOrientation }) : /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorPalette, { palette, size }) }),
     actionButtons && /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)(ActionButtons, { className: "k-coloreditor-footer", alignment: "end", children: [
       /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(Button, { className: "k-coloreditor-cancel", size, children: "Cancel" }),
       /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(Button, { themeColor: "primary", size, className: "k-coloreditor-apply", children: "Apply" })

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

@@ -2742,12 +2742,16 @@ var COLORPALETTE_CLASSNAME = `k-colorpalette`;
 var states37 = [
   States.disabled
 ];
-var options35 = {};
+var options35 = {
+  size: [Size.small, Size.medium, Size.large]
+};
 var defaultOptions34 = {
-  columns: 10
+  columns: 10,
+  size: Size.medium
 };
 var ColorPalette = (props) => {
   const {
+    size = defaultOptions34.size,
     palette,
     columns = defaultOptions34.columns,
     tileSize,
@@ -2778,7 +2782,8 @@ var ColorPalette = (props) => {
         COLORPALETTE_CLASSNAME,
         stateClassNames(COLORPALETTE_CLASSNAME, {
           disabled
-        })
+        }),
+        optionClassNames(COLORPALETTE_CLASSNAME, { size })
       ),
       children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("table", { className: "k-colorpalette-table", children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("tbody", { children: newChildren.length > 0 ? newChildren : props.children }) })
     }
@@ -2895,7 +2900,7 @@ var ColorEditor = (props) => {
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("div", { className: "k-coloreditor-views k-vstack", children: view === "gradient" ? /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorGradient, { focus: focusView, size, canvasOrientation }) : /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorPalette, { palette }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("div", { className: "k-coloreditor-views k-vstack", children: view === "gradient" ? /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorGradient, { focus: focusView, size, canvasOrientation }) : /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorPalette, { palette, size }) }),
     actionButtons && /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)(ActionButtons, { className: "k-coloreditor-footer", alignment: "end", children: [
       /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(Button, { className: "k-coloreditor-cancel", size, children: "Cancel" }),
       /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(Button, { themeColor: "primary", size, className: "k-coloreditor-apply", children: "Apply" })

package/dist/cjs/imageeditor/templates/imageeditor-resize.js

@@ -2747,12 +2747,16 @@ var COLORPALETTE_CLASSNAME = `k-colorpalette`;
 var states37 = [
   States.disabled
 ];
-var options35 = {};
+var options35 = {
+  size: [Size.small, Size.medium, Size.large]
+};
 var defaultOptions34 = {
-  columns: 10
+  columns: 10,
+  size: Size.medium
 };
 var ColorPalette = (props) => {
   const {
+    size = defaultOptions34.size,
     palette,
     columns = defaultOptions34.columns,
     tileSize,
@@ -2783,7 +2787,8 @@ var ColorPalette = (props) => {
         COLORPALETTE_CLASSNAME,
         stateClassNames(COLORPALETTE_CLASSNAME, {
           disabled
-        })
+        }),
+        optionClassNames(COLORPALETTE_CLASSNAME, { size })
       ),
       children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("table", { className: "k-colorpalette-table", children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("tbody", { children: newChildren.length > 0 ? newChildren : props.children }) })
     }
@@ -2900,7 +2905,7 @@ var ColorEditor = (props) => {
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("div", { className: "k-coloreditor-views k-vstack", children: view === "gradient" ? /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorGradient, { focus: focusView, size, canvasOrientation }) : /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorPalette, { palette }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("div", { className: "k-coloreditor-views k-vstack", children: view === "gradient" ? /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorGradient, { focus: focusView, size, canvasOrientation }) : /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorPalette, { palette, size }) }),
     actionButtons && /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)(ActionButtons, { className: "k-coloreditor-footer", alignment: "end", children: [
       /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(Button, { className: "k-coloreditor-cancel", size, children: "Cancel" }),
       /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(Button, { themeColor: "primary", size, className: "k-coloreditor-apply", children: "Apply" })

package/dist/cjs/imageeditor/tests/imageeditor-crop-pane.js

@@ -2747,12 +2747,16 @@ var COLORPALETTE_CLASSNAME = `k-colorpalette`;
 var states37 = [
   States.disabled
 ];
-var options35 = {};
+var options35 = {
+  size: [Size.small, Size.medium, Size.large]
+};
 var defaultOptions34 = {
-  columns: 10
+  columns: 10,
+  size: Size.medium
 };
 var ColorPalette = (props) => {
   const {
+    size = defaultOptions34.size,
     palette,
     columns = defaultOptions34.columns,
     tileSize,
@@ -2783,7 +2787,8 @@ var ColorPalette = (props) => {
         COLORPALETTE_CLASSNAME,
         stateClassNames(COLORPALETTE_CLASSNAME, {
           disabled
-        })
+        }),
+        optionClassNames(COLORPALETTE_CLASSNAME, { size })
       ),
       children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("table", { className: "k-colorpalette-table", children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("tbody", { children: newChildren.length > 0 ? newChildren : props.children }) })
     }
@@ -2900,7 +2905,7 @@ var ColorEditor = (props) => {
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("div", { className: "k-coloreditor-views k-vstack", children: view === "gradient" ? /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorGradient, { focus: focusView, size, canvasOrientation }) : /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorPalette, { palette }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("div", { className: "k-coloreditor-views k-vstack", children: view === "gradient" ? /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorGradient, { focus: focusView, size, canvasOrientation }) : /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorPalette, { palette, size }) }),
     actionButtons && /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)(ActionButtons, { className: "k-coloreditor-footer", alignment: "end", children: [
       /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(Button, { className: "k-coloreditor-cancel", size, children: "Cancel" }),
       /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(Button, { themeColor: "primary", size, className: "k-coloreditor-apply", children: "Apply" })

package/dist/cjs/imageeditor/tests/imageeditor-resize-pane.js

@@ -2747,12 +2747,16 @@ var COLORPALETTE_CLASSNAME = `k-colorpalette`;
 var states37 = [
   States.disabled
 ];
-var options35 = {};
+var options35 = {
+  size: [Size.small, Size.medium, Size.large]
+};
 var defaultOptions34 = {
-  columns: 10
+  columns: 10,
+  size: Size.medium
 };
 var ColorPalette = (props) => {
   const {
+    size = defaultOptions34.size,
     palette,
     columns = defaultOptions34.columns,
     tileSize,
@@ -2783,7 +2787,8 @@ var ColorPalette = (props) => {
         COLORPALETTE_CLASSNAME,
         stateClassNames(COLORPALETTE_CLASSNAME, {
           disabled
-        })
+        }),
+        optionClassNames(COLORPALETTE_CLASSNAME, { size })
       ),
       children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("table", { className: "k-colorpalette-table", children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("tbody", { children: newChildren.length > 0 ? newChildren : props.children }) })
     }
@@ -2900,7 +2905,7 @@ var ColorEditor = (props) => {
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("div", { className: "k-coloreditor-views k-vstack", children: view === "gradient" ? /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorGradient, { focus: focusView, size, canvasOrientation }) : /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorPalette, { palette }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("div", { className: "k-coloreditor-views k-vstack", children: view === "gradient" ? /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorGradient, { focus: focusView, size, canvasOrientation }) : /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorPalette, { palette, size }) }),
     actionButtons && /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)(ActionButtons, { className: "k-coloreditor-footer", alignment: "end", children: [
       /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(Button, { className: "k-coloreditor-cancel", size, children: "Cancel" }),
       /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(Button, { themeColor: "primary", size, className: "k-coloreditor-apply", children: "Apply" })

package/dist/cjs/imageeditor/tests/imageeditor.js

@@ -2742,12 +2742,16 @@ var COLORPALETTE_CLASSNAME = `k-colorpalette`;
 var states37 = [
   States.disabled
 ];
-var options35 = {};
+var options35 = {
+  size: [Size.small, Size.medium, Size.large]
+};
 var defaultOptions34 = {
-  columns: 10
+  columns: 10,
+  size: Size.medium
 };
 var ColorPalette = (props) => {
   const {
+    size = defaultOptions34.size,
     palette,
     columns = defaultOptions34.columns,
     tileSize,
@@ -2778,7 +2782,8 @@ var ColorPalette = (props) => {
         COLORPALETTE_CLASSNAME,
         stateClassNames(COLORPALETTE_CLASSNAME, {
           disabled
-        })
+        }),
+        optionClassNames(COLORPALETTE_CLASSNAME, { size })
       ),
       children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("table", { className: "k-colorpalette-table", children: /* @__PURE__ */ (0, import_jsx_runtime98.jsx)("tbody", { children: newChildren.length > 0 ? newChildren : props.children }) })
     }
@@ -2895,7 +2900,7 @@ var ColorEditor = (props) => {
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("div", { className: "k-coloreditor-views k-vstack", children: view === "gradient" ? /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorGradient, { focus: focusView, size, canvasOrientation }) : /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorPalette, { palette }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime100.jsx)("div", { className: "k-coloreditor-views k-vstack", children: view === "gradient" ? /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorGradient, { focus: focusView, size, canvasOrientation }) : /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(ColorPalette, { palette, size }) }),
     actionButtons && /* @__PURE__ */ (0, import_jsx_runtime100.jsxs)(ActionButtons, { className: "k-coloreditor-footer", alignment: "end", children: [
       /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(Button, { className: "k-coloreditor-cancel", size, children: "Cancel" }),
       /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(Button, { themeColor: "primary", size, className: "k-coloreditor-apply", children: "Apply" })

package/dist/cjs/index.js

@@ -6327,12 +6327,16 @@ var COLORPALETTE_CLASSNAME = `k-colorpalette`;
 var states58 = [
   States.disabled
 ];
-var options55 = {};
+var options55 = {
+  size: [Size.small, Size.medium, Size.large]
+};
 var defaultOptions54 = {
-  columns: 10
+  columns: 10,
+  size: Size.medium
 };
 var ColorPalette = (props) => {
   const {
+    size = defaultOptions54.size,
     palette,
     columns = defaultOptions54.columns,
     tileSize,
@@ -6363,7 +6367,8 @@ var ColorPalette = (props) => {
         COLORPALETTE_CLASSNAME,
         stateClassNames(COLORPALETTE_CLASSNAME, {
           disabled
-        })
+        }),
+        optionClassNames(COLORPALETTE_CLASSNAME, { size })
       ),
       children: /* @__PURE__ */ (0, import_jsx_runtime171.jsx)("table", { className: "k-colorpalette-table", children: /* @__PURE__ */ (0, import_jsx_runtime171.jsx)("tbody", { children: newChildren.length > 0 ? newChildren : props.children }) })
     }
@@ -6904,7 +6909,7 @@ var ColorEditor = (props) => {
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime183.jsx)("div", { className: "k-coloreditor-views k-vstack", children: view === "gradient" ? /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(ColorGradient, { focus: focusView, size, canvasOrientation }) : /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(ColorPalette, { palette }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime183.jsx)("div", { className: "k-coloreditor-views k-vstack", children: view === "gradient" ? /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(ColorGradient, { focus: focusView, size, canvasOrientation }) : /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(ColorPalette, { palette, size }) }),
     actionButtons && /* @__PURE__ */ (0, import_jsx_runtime183.jsxs)(ActionButtons, { className: "k-coloreditor-footer", alignment: "end", children: [
       /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(Button, { className: "k-coloreditor-cancel", size, children: "Cancel" }),
       /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(Button, { themeColor: "primary", size, className: "k-coloreditor-apply", children: "Apply" })
@@ -15164,8 +15169,8 @@ var ChartWizardNormal = (props) => /* @__PURE__ */ (0, import_jsx_runtime419.jsx
           /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("clipPath", { id: "kdef4", children: /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("path", { d: "M0 0 L 1337 0 1337 400 0 400Z", stroke: "#000", strokeLinejoin: "miter", fill: "none" }) })
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime419.jsxs)("g", { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("path", { d: "M0 0 L 1337 0 1337 400 0 400Z", stroke: "none", className: "k-var--background" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("path", { d: "M38 68 L 1319 68 1319 338 38 338Z", stroke: "none", className: "k-var--background", fillOpacity: "0" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("path", { d: "M0 0 L 1337 0 1337 400 0 400Z", stroke: "none", fill: "var(--kendo-chart-bg)" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("path", { d: "M38 68 L 1319 68 1319 338 38 338Z", stroke: "none", fill: "var(--kendo-chart-bg)", fillOpacity: "0" }),
           /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("path", { d: "M38.5 311.5 L 1319.5 311.5", stroke: "#c8c8c8", strokeWidth: "1", fill: "none" }),
           /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("path", { d: "M38.5 284.5 L 1319.5 284.5", stroke: "#c8c8c8", strokeWidth: "1", fill: "none" }),
           /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("path", { d: "M38.5 257.5 L 1319.5 257.5", stroke: "#c8c8c8", strokeWidth: "1", fill: "none" }),
@@ -15191,39 +15196,39 @@ var ChartWizardNormal = (props) => /* @__PURE__ */ (0, import_jsx_runtime419.jsx
           /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("path", { d: "M1319.5 338.5 L 1319.5 342.5", stroke: "#c8c8c8", strokeWidth: "1", fill: "none" })
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime419.jsxs)("g", { clipPath: "url(#kdef4)", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("path", { d: "M38 177.255 C 85.397 159.112 132.936 122.77 180.333 122.77 227.73 122.77 275.27 124.052 322.667 124.052 370.064 124.052 417.603 104.666 465 104.666 512.397 104.666 559.936 104.95 607.333 104.95 654.73 104.95 702.27 97.687 749.667 97.687 797.064 97.687 844.603 177.485 892 177.485 939.397 177.485 986.936 131.514 1034.333 118.787 1081.73 106.06 1129.27 101.048 1176.667 101.048 1224.064 101.048 1271.603 125.333 1319 137.457 L 1319 338 38 338", stroke: "none", className: "k-var--series-a", fillOpacity: "0.8" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("path", { d: "M38 203.162 C 85.397 199.813 132.936 197.613 180.333 193.104 227.73 188.596 275.27 176.081 322.667 176.081 370.064 176.081 417.603 183.236 465 183.236 512.397 183.236 559.936 175.986 607.333 175.986 654.73 175.986 743.051 175.986 749.667 176.824 797.064 182.82 844.603 198.104 892 212.005 939.397 225.905 986.936 260.308 1034.333 260.308 1081.73 260.308 1129.27 171.424 1176.667 171.424 1224.064 171.424 1271.603 185.939 1319 193.186 L 1319 338 38 338", stroke: "none", className: "k-var--series-b", fillOpacity: "0.8" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("path", { d: "M38 233.416 C 85.397 230.651 132.936 225.113 180.333 225.113 227.73 225.113 275.27 277.506 322.667 277.506 370.064 277.506 417.603 218.685 465 205.714 487.345 199.598 559.936 203.069 607.333 199.598 654.73 196.127 702.27 184.87 749.667 184.87 797.064 184.87 844.603 218.62 892 218.62 939.397 218.62 986.936 191.161 1034.333 191.161 1081.73 191.161 1129.27 303.116 1176.667 303.116 1224.064 303.116 1271.603 204.012 1319 154.535 L 1319 338 38 338", stroke: "none", className: "k-var--series-c", fillOpacity: "0.8" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "465", cy: "182.382", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-b", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "465", cy: "204.693", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-c", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "607.333", cy: "198.623", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-c", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "749.667", cy: "184.004", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-c", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "892", cy: "217.504", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-c", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "1034.333", cy: "190.248", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-c", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "1176.667", cy: "301.374", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-c", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "607.333", cy: "104.676", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-a", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "465", cy: "104.394", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-a", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "322.667", cy: "175.28", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-b", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "322.667", cy: "123.637", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-a", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "180.333", cy: "122.364", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-a", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "749.667", cy: "97.467", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-a", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "749.667", cy: "176.017", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-b", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "892", cy: "210.938", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-b", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "892", cy: "176.674", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-a", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "607.333", cy: "175.187", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-b", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "322.667", cy: "275.955", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-c", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "38", cy: "176.446", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-a", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "1034.333", cy: "118.411", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-a", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "1176.667", cy: "100.803", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-a", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "1319", cy: "136.943", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-a", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "38", cy: "202.161", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-b", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "180.333", cy: "192.178", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-b", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "1034.333", cy: "258.883", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-b", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "1176.667", cy: "170.657", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-b", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "1319", cy: "192.258", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-b", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "38", cy: "232.19", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-c", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "180.333", cy: "223.949", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-c", fillOpacity: "1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "1319", cy: "153.894", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", className: "k-var--series-c", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("path", { d: "M38 177.255 C 85.397 159.112 132.936 122.77 180.333 122.77 227.73 122.77 275.27 124.052 322.667 124.052 370.064 124.052 417.603 104.666 465 104.666 512.397 104.666 559.936 104.95 607.333 104.95 654.73 104.95 702.27 97.687 749.667 97.687 797.064 97.687 844.603 177.485 892 177.485 939.397 177.485 986.936 131.514 1034.333 118.787 1081.73 106.06 1129.27 101.048 1176.667 101.048 1224.064 101.048 1271.603 125.333 1319 137.457 L 1319 338 38 338", stroke: "none", fill: "var(--kendo-chart-series-1)", fillOpacity: "0.8" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("path", { d: "M38 203.162 C 85.397 199.813 132.936 197.613 180.333 193.104 227.73 188.596 275.27 176.081 322.667 176.081 370.064 176.081 417.603 183.236 465 183.236 512.397 183.236 559.936 175.986 607.333 175.986 654.73 175.986 743.051 175.986 749.667 176.824 797.064 182.82 844.603 198.104 892 212.005 939.397 225.905 986.936 260.308 1034.333 260.308 1081.73 260.308 1129.27 171.424 1176.667 171.424 1224.064 171.424 1271.603 185.939 1319 193.186 L 1319 338 38 338", stroke: "none", fill: "var(--kendo-chart-series-2)", fillOpacity: "0.8" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("path", { d: "M38 233.416 C 85.397 230.651 132.936 225.113 180.333 225.113 227.73 225.113 275.27 277.506 322.667 277.506 370.064 277.506 417.603 218.685 465 205.714 487.345 199.598 559.936 203.069 607.333 199.598 654.73 196.127 702.27 184.87 749.667 184.87 797.064 184.87 844.603 218.62 892 218.62 939.397 218.62 986.936 191.161 1034.333 191.161 1081.73 191.161 1129.27 303.116 1176.667 303.116 1224.064 303.116 1271.603 204.012 1319 154.535 L 1319 338 38 338", stroke: "none", fill: "var(--kendo-chart-series-3)", fillOpacity: "0.8" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "465", cy: "182.382", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-2)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "465", cy: "204.693", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-3)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "607.333", cy: "198.623", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-3)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "749.667", cy: "184.004", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-3)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "892", cy: "217.504", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-3)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "1034.333", cy: "190.248", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-3)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "1176.667", cy: "301.374", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-3)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "607.333", cy: "104.676", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-1)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "465", cy: "104.394", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-1)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "322.667", cy: "175.28", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-2)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "322.667", cy: "123.637", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-1)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "180.333", cy: "122.364", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-1)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "749.667", cy: "97.467", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-1)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "749.667", cy: "176.017", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-2)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "892", cy: "210.938", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-2)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "892", cy: "176.674", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-1)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "607.333", cy: "175.187", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-2)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "322.667", cy: "275.955", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-3)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "38", cy: "176.446", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-1)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "1034.333", cy: "118.411", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-1)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "1176.667", cy: "100.803", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-1)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "1319", cy: "136.943", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-1)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "38", cy: "202.161", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-2)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "180.333", cy: "192.178", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-2)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "1034.333", cy: "258.883", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-2)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "1176.667", cy: "170.657", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-2)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "1319", cy: "192.258", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-2)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "38", cy: "232.19", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-3)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "180.333", cy: "223.949", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-3)", fillOpacity: "1" }),
+          /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("circle", { cx: "1319", cy: "153.894", r: "5", stroke: "#fff", strokeWidth: "2", strokeOpacity: "1", fill: "var(--kendo-chart-series-3)", fillOpacity: "1" }),
           /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("text", { style: { font: "12px Arial, Helvetica, sans-serif", whiteSpace: "pre" }, x: "24.5", y: "358", stroke: "none", fillOpacity: "1", children: "2002" }),
           /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("text", { style: { font: "12px Arial, Helvetica, sans-serif", whiteSpace: "pre" }, x: "166.833", y: "358", stroke: "none", fillOpacity: "1", children: "2003" }),
           /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("text", { style: { font: "12px Arial, Helvetica, sans-serif", whiteSpace: "pre" }, x: "309.167", y: "358", stroke: "none", fillOpacity: "1", children: "2004" }),
@@ -15248,17 +15253,17 @@ var ChartWizardNormal = (props) => /* @__PURE__ */ (0, import_jsx_runtime419.jsx
           /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("text", { style: { font: "16px Arial, Helvetica, sans-serif", whiteSpace: "pre" }, x: "558", y: "29", stroke: "none", fillOpacity: "1", children: "Gross domestic product growth" }),
           /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("text", { style: { font: "16px Arial, Helvetica, sans-serif", whiteSpace: "pre" }, x: "611", y: "47", stroke: "none", fillOpacity: "1", children: "/GDP annual %/" }),
           /* @__PURE__ */ (0, import_jsx_runtime419.jsxs)("g", { transform: "matrix(1,0,0,1,590.5,371)", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("path", { d: "M0 5.5 L 15 5.5 15 8.5 0 8.5Z", stroke: "#008fd3", strokeWidth: "0", className: "k-var--series-a" }),
+            /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("path", { d: "M0 5.5 L 15 5.5 15 8.5 0 8.5Z", stroke: "#008fd3", strokeWidth: "0", fill: "var(--kendo-chart-series-1)" }),
             /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("text", { style: { font: "12px Arial, Helvetica, sans-serif", whiteSpace: "pre" }, x: "21", y: "11", stroke: "none", fillOpacity: "1", children: "India" }) }),
             /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("path", { style: { cursor: "pointer" }, d: "M0 0 L 47 0 47 14 0 14Z", stroke: "none", fill: "#fff", fillOpacity: "0" })
           ] }),
           /* @__PURE__ */ (0, import_jsx_runtime419.jsxs)("g", { transform: "matrix(1,0,0,1,643.5,371)", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("path", { d: "M0 5.5 L 15 5.5 15 8.5 0 8.5Z", stroke: "#99d101", strokeWidth: "0", className: "k-var--series-b" }),
+            /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("path", { d: "M0 5.5 L 15 5.5 15 8.5 0 8.5Z", stroke: "#99d101", strokeWidth: "0", fill: "var(--kendo-chart-series-2)" }),
             /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("text", { style: { font: "12px Arial, Helvetica, sans-serif", whiteSpace: "pre" }, x: "21", y: "11", stroke: "none", fillOpacity: "1", children: "World" }) }),
             /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("path", { style: { cursor: "pointer" }, d: "M0 0 L 52 0 52 14 0 14Z", stroke: "none", fill: "#fff", fillOpacity: "0" })
           ] }),
           /* @__PURE__ */ (0, import_jsx_runtime419.jsxs)("g", { transform: "matrix(1,0,0,1,701.5,371)", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("path", { d: "M0 5.5 L 15 5.5 15 8.5 0 8.5Z", stroke: "#f39b02", strokeWidth: "0", className: "k-var--series-c" }),
+            /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("path", { d: "M0 5.5 L 15 5.5 15 8.5 0 8.5Z", stroke: "#f39b02", strokeWidth: "0", fill: "var(--kendo-chart-series-3)" }),
             /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("g", { children: /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("text", { style: { font: "12px Arial, Helvetica, sans-serif", whiteSpace: "pre" }, x: "21", y: "11", stroke: "none", fillOpacity: "1", children: "Haiti" }) }),
             /* @__PURE__ */ (0, import_jsx_runtime419.jsx)("path", { style: { cursor: "pointer" }, d: "M0 0 L 45 0 45 14 0 14Z", stroke: "none", fill: "#fff", fillOpacity: "0" })
           ] })

package/dist/cjs/map/map.spec.js

@@ -4402,12 +4402,16 @@ var COLORPALETTE_CLASSNAME = `k-colorpalette`;
 var states58 = [
   States.disabled
 ];
-var options55 = {};
+var options55 = {
+  size: [Size.small, Size.medium, Size.large]
+};
 var defaultOptions54 = {
-  columns: 10
+  columns: 10,
+  size: Size.medium
 };
 var ColorPalette = (props) => {
   const {
+    size = defaultOptions54.size,
     palette,
     columns = defaultOptions54.columns,
     tileSize,
@@ -4438,7 +4442,8 @@ var ColorPalette = (props) => {
         COLORPALETTE_CLASSNAME,
         stateClassNames(COLORPALETTE_CLASSNAME, {
           disabled
-        })
+        }),
+        optionClassNames(COLORPALETTE_CLASSNAME, { size })
       ),
       children: /* @__PURE__ */ (0, import_jsx_runtime171.jsx)("table", { className: "k-colorpalette-table", children: /* @__PURE__ */ (0, import_jsx_runtime171.jsx)("tbody", { children: newChildren.length > 0 ? newChildren : props.children }) })
     }
@@ -4959,7 +4964,7 @@ var ColorEditor = (props) => {
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime183.jsx)("div", { className: "k-coloreditor-views k-vstack", children: view === "gradient" ? /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(ColorGradient, { focus: focusView, size, canvasOrientation }) : /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(ColorPalette, { palette }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime183.jsx)("div", { className: "k-coloreditor-views k-vstack", children: view === "gradient" ? /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(ColorGradient, { focus: focusView, size, canvasOrientation }) : /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(ColorPalette, { palette, size }) }),
     actionButtons && /* @__PURE__ */ (0, import_jsx_runtime183.jsxs)(ActionButtons, { className: "k-coloreditor-footer", alignment: "end", children: [
       /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(Button, { className: "k-coloreditor-cancel", size, children: "Cancel" }),
       /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(Button, { themeColor: "primary", size, className: "k-coloreditor-apply", children: "Apply" })

package/dist/cjs/map/navigator.js

@@ -4402,12 +4402,16 @@ var COLORPALETTE_CLASSNAME = `k-colorpalette`;
 var states58 = [
   States.disabled
 ];
-var options55 = {};
+var options55 = {
+  size: [Size.small, Size.medium, Size.large]
+};
 var defaultOptions54 = {
-  columns: 10
+  columns: 10,
+  size: Size.medium
 };
 var ColorPalette = (props) => {
   const {
+    size = defaultOptions54.size,
     palette,
     columns = defaultOptions54.columns,
     tileSize,
@@ -4438,7 +4442,8 @@ var ColorPalette = (props) => {
         COLORPALETTE_CLASSNAME,
         stateClassNames(COLORPALETTE_CLASSNAME, {
           disabled
-        })
+        }),
+        optionClassNames(COLORPALETTE_CLASSNAME, { size })
       ),
       children: /* @__PURE__ */ (0, import_jsx_runtime171.jsx)("table", { className: "k-colorpalette-table", children: /* @__PURE__ */ (0, import_jsx_runtime171.jsx)("tbody", { children: newChildren.length > 0 ? newChildren : props.children }) })
     }
@@ -4959,7 +4964,7 @@ var ColorEditor = (props) => {
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime183.jsx)("div", { className: "k-coloreditor-views k-vstack", children: view === "gradient" ? /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(ColorGradient, { focus: focusView, size, canvasOrientation }) : /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(ColorPalette, { palette }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime183.jsx)("div", { className: "k-coloreditor-views k-vstack", children: view === "gradient" ? /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(ColorGradient, { focus: focusView, size, canvasOrientation }) : /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(ColorPalette, { palette, size }) }),
     actionButtons && /* @__PURE__ */ (0, import_jsx_runtime183.jsxs)(ActionButtons, { className: "k-coloreditor-footer", alignment: "end", children: [
       /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(Button, { className: "k-coloreditor-cancel", size, children: "Cancel" }),
       /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(Button, { themeColor: "primary", size, className: "k-coloreditor-apply", children: "Apply" })

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

@@ -4458,12 +4458,16 @@ var COLORPALETTE_CLASSNAME = `k-colorpalette`;
 var states59 = [
   States.disabled
 ];
-var options56 = {};
+var options56 = {
+  size: [Size.small, Size.medium, Size.large]
+};
 var defaultOptions55 = {
-  columns: 10
+  columns: 10,
+  size: Size.medium
 };
 var ColorPalette = (props) => {
   const {
+    size = defaultOptions55.size,
     palette,
     columns = defaultOptions55.columns,
     tileSize,
@@ -4494,7 +4498,8 @@ var ColorPalette = (props) => {
         COLORPALETTE_CLASSNAME,
         stateClassNames(COLORPALETTE_CLASSNAME, {
           disabled
-        })
+        }),
+        optionClassNames(COLORPALETTE_CLASSNAME, { size })
       ),
       children: /* @__PURE__ */ (0, import_jsx_runtime172.jsx)("table", { className: "k-colorpalette-table", children: /* @__PURE__ */ (0, import_jsx_runtime172.jsx)("tbody", { children: newChildren.length > 0 ? newChildren : props.children }) })
     }
@@ -5015,7 +5020,7 @@ var ColorEditor = (props) => {
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime184.jsx)("div", { className: "k-coloreditor-views k-vstack", children: view === "gradient" ? /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(ColorGradient, { focus: focusView, size, canvasOrientation }) : /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(ColorPalette, { palette }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime184.jsx)("div", { className: "k-coloreditor-views k-vstack", children: view === "gradient" ? /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(ColorGradient, { focus: focusView, size, canvasOrientation }) : /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(ColorPalette, { palette, size }) }),
     actionButtons && /* @__PURE__ */ (0, import_jsx_runtime184.jsxs)(ActionButtons, { className: "k-coloreditor-footer", alignment: "end", children: [
       /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(Button, { className: "k-coloreditor-cancel", size, children: "Cancel" }),
       /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(Button, { themeColor: "primary", size, className: "k-coloreditor-apply", children: "Apply" })

package/dist/cjs/map/tests/map.js

@@ -4458,12 +4458,16 @@ var COLORPALETTE_CLASSNAME = `k-colorpalette`;
 var states59 = [
   States.disabled
 ];
-var options56 = {};
+var options56 = {
+  size: [Size.small, Size.medium, Size.large]
+};
 var defaultOptions55 = {
-  columns: 10
+  columns: 10,
+  size: Size.medium
 };
 var ColorPalette = (props) => {
   const {
+    size = defaultOptions55.size,
     palette,
     columns = defaultOptions55.columns,
     tileSize,
@@ -4494,7 +4498,8 @@ var ColorPalette = (props) => {
         COLORPALETTE_CLASSNAME,
         stateClassNames(COLORPALETTE_CLASSNAME, {
           disabled
-        })
+        }),
+        optionClassNames(COLORPALETTE_CLASSNAME, { size })
       ),
       children: /* @__PURE__ */ (0, import_jsx_runtime172.jsx)("table", { className: "k-colorpalette-table", children: /* @__PURE__ */ (0, import_jsx_runtime172.jsx)("tbody", { children: newChildren.length > 0 ? newChildren : props.children }) })
     }
@@ -5015,7 +5020,7 @@ var ColorEditor = (props) => {
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime184.jsx)("div", { className: "k-coloreditor-views k-vstack", children: view === "gradient" ? /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(ColorGradient, { focus: focusView, size, canvasOrientation }) : /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(ColorPalette, { palette }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime184.jsx)("div", { className: "k-coloreditor-views k-vstack", children: view === "gradient" ? /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(ColorGradient, { focus: focusView, size, canvasOrientation }) : /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(ColorPalette, { palette, size }) }),
     actionButtons && /* @__PURE__ */ (0, import_jsx_runtime184.jsxs)(ActionButtons, { className: "k-coloreditor-footer", alignment: "end", children: [
       /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(Button, { className: "k-coloreditor-cancel", size, children: "Cancel" }),
       /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(Button, { themeColor: "primary", size, className: "k-coloreditor-apply", children: "Apply" })