@progress/kendo-react-chart-wizard 16.2.0-develop.1 → 16.2.0-develop.3

package/components/panels/BarChartPanel.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const B=require("react"),y=require("@progress/kendo-react-animation"),T=require("@progress/kendo-react-intl"),S=require("@progress/kendo-react-layout"),f=require("../SeriesTypesWrap.js"),i=require("../SeriesTypeButton.js"),t=require("../../utils.js"),c=require("../../messages.js"),l=require("@progress/kendo-svg-icons");function E(a){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(a){for(const e in a)if(e!=="default"){const s=Object.getOwnPropertyDescriptor(a,e);Object.defineProperty(n,e,s.get?s:{enumerable:!0,get:()=>a[e]})}}return n.default=a,Object.freeze(n)}const r=E(B),q=a=>{const n=T.useLocalization(),e=a.state,s=e.seriesType,{isStackFalse:d,isStackNormal:g,isStack100:b}=t.stackState(e),[u,k]=r.useState(!0),m=r.useCallback(o=>{k(!o.expanded)},[]),p=()=>{a.onStateChange(t.mergeStates(e,t.createState(e.data,"bar")))},h=()=>{const o=t.mergeStates(e,t.createState(e.data,"bar"));a.onStateChange(t.updateState(o,t.ActionTypes.stacked,t.stackNormal))},C=()=>{const o=t.mergeStates(e,t.createState(e.data,"bar"));a.onStateChange(t.updateState(o,t.ActionTypes.stacked,t.stack100))};return r.createElement(S.ExpansionPanel,{style:{maxWidth:"576px"},title:n.toLanguageString(c.barChart,c.messages.barChart),expanded:u,tabIndex:0,onAction:m},r.createElement(y.Reveal,null,u&&r.createElement(S.ExpansionPanelContent,null,r.createElement(f.SeriesTypesWrap,null,r.createElement(i.SeriesTypeButton,{selected:s==="bar"&&d,onClick:p,icon:l.chartBarClusteredIcon,iconName:"chart-bar-clustered"},n.toLanguageString(c.barChartBar,c.messages.barChartBar)),r.createElement(i.SeriesTypeButton,{selected:s==="bar"&&g,onClick:h,icon:l.chartBarStackedIcon,iconName:"chart-bar-stacked"},n.toLanguageString(c.barChartStackedBar,c.messages.barChartStackedBar)),r.createElement(i.SeriesTypeButton,{selected:s==="bar"&&b,onClick:C,icon:l.chartBarStacked100Icon,iconName:"chart-bar-stacked100"},n.toLanguageString(c.barChart100StackedBar,c.messages.barChart100StackedBar))))))};exports.BarChartPanel=q;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const B=require("react"),y=require("@progress/kendo-react-intl"),S=require("@progress/kendo-react-layout"),T=require("../SeriesTypesWrap.js"),i=require("../SeriesTypeButton.js"),t=require("../../utils.js"),n=require("../../messages.js"),l=require("@progress/kendo-svg-icons");function f(a){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(a){for(const e in a)if(e!=="default"){const s=Object.getOwnPropertyDescriptor(a,e);Object.defineProperty(r,e,s.get?s:{enumerable:!0,get:()=>a[e]})}}return r.default=a,Object.freeze(r)}const c=f(B),x=a=>{const r=y.useLocalization(),e=a.state,s=e.seriesType,{isStackFalse:d,isStackNormal:u,isStack100:g}=t.stackState(e),[b,k]=c.useState(!0),m=c.useCallback(o=>{k(!o.expanded)},[]),p=()=>{a.onStateChange(t.mergeStates(e,t.createState(e.data,"bar")))},h=()=>{const o=t.mergeStates(e,t.createState(e.data,"bar"));a.onStateChange(t.updateState(o,t.ActionTypes.stacked,t.stackNormal))},C=()=>{const o=t.mergeStates(e,t.createState(e.data,"bar"));a.onStateChange(t.updateState(o,t.ActionTypes.stacked,t.stack100))};return c.createElement(S.ExpansionPanel,{style:{maxWidth:"576px"},title:r.toLanguageString(n.barChart,n.messages.barChart),expanded:b,tabIndex:0,onAction:m},c.createElement(S.ExpansionPanelContent,null,c.createElement(T.SeriesTypesWrap,null,c.createElement(i.SeriesTypeButton,{selected:s==="bar"&&d,onClick:p,icon:l.chartBarClusteredIcon,iconName:"chart-bar-clustered"},r.toLanguageString(n.barChartBar,n.messages.barChartBar)),c.createElement(i.SeriesTypeButton,{selected:s==="bar"&&u,onClick:h,icon:l.chartBarStackedIcon,iconName:"chart-bar-stacked"},r.toLanguageString(n.barChartStackedBar,n.messages.barChartStackedBar)),c.createElement(i.SeriesTypeButton,{selected:s==="bar"&&g,onClick:C,icon:l.chartBarStacked100Icon,iconName:"chart-bar-stacked100"},r.toLanguageString(n.barChart100StackedBar,n.messages.barChart100StackedBar)))))};exports.BarChartPanel=x;

package/components/panels/BarChartPanel.mjs

@@ -5,66 +5,65 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import * as a from "react";
-import { Reveal as x } from "@progress/kendo-react-animation";
-import { useLocalization as E } from "@progress/kendo-react-intl";
-import { ExpansionPanel as f, ExpansionPanelContent as y } from "@progress/kendo-react-layout";
-import { SeriesTypesWrap as T } from "../SeriesTypesWrap.mjs";
+import * as t from "react";
+import { useLocalization as x } from "@progress/kendo-react-intl";
+import { ExpansionPanel as y, ExpansionPanelContent as E } from "@progress/kendo-react-layout";
+import { SeriesTypesWrap as f } from "../SeriesTypesWrap.mjs";
 import { SeriesTypeButton as s } from "../SeriesTypeButton.mjs";
-import { stackState as L, mergeStates as i, createState as l, updateState as d, ActionTypes as S, stackNormal as N, stack100 as I } from "../../utils.mjs";
-import { barChart as A, messages as c, barChartBar as P, barChartStackedBar as w, barChart100StackedBar as z } from "../../messages.mjs";
-import { chartBarClusteredIcon as R, chartBarStackedIcon as W, chartBarStacked100Icon as v } from "@progress/kendo-svg-icons";
-const M = (r) => {
-  const n = E(), t = r.state, o = t.seriesType, { isStackFalse: h, isStackNormal: k, isStack100: p } = L(t), [m, C] = a.useState(!0), b = a.useCallback((e) => {
-    C(!e.expanded);
+import { stackState as T, mergeStates as i, createState as d, updateState as l, ActionTypes as m, stackNormal as L, stack100 as N } from "../../utils.mjs";
+import { barChart as I, messages as c, barChartBar as A, barChartStackedBar as P, barChart100StackedBar as w } from "../../messages.mjs";
+import { chartBarClusteredIcon as z, chartBarStackedIcon as W, chartBarStacked100Icon as F } from "@progress/kendo-svg-icons";
+const J = (r) => {
+  const n = x(), a = r.state, o = a.seriesType, { isStackFalse: S, isStackNormal: h, isStack100: k } = T(a), [C, p] = t.useState(!0), b = t.useCallback((e) => {
+    p(!e.expanded);
   }, []), g = () => {
-    r.onStateChange(i(t, l(t.data, "bar")));
+    r.onStateChange(i(a, d(a.data, "bar")));
   }, B = () => {
-    const e = i(t, l(t.data, "bar"));
-    r.onStateChange(d(e, S.stacked, N));
+    const e = i(a, d(a.data, "bar"));
+    r.onStateChange(l(e, m.stacked, L));
   }, u = () => {
-    const e = i(t, l(t.data, "bar"));
-    r.onStateChange(d(e, S.stacked, I));
+    const e = i(a, d(a.data, "bar"));
+    r.onStateChange(l(e, m.stacked, N));
   };
-  return /* @__PURE__ */ a.createElement(
-    f,
+  return /* @__PURE__ */ t.createElement(
+    y,
     {
       style: { maxWidth: "576px" },
-      title: n.toLanguageString(A, c.barChart),
-      expanded: m,
+      title: n.toLanguageString(I, c.barChart),
+      expanded: C,
       tabIndex: 0,
       onAction: b
     },
-    /* @__PURE__ */ a.createElement(x, null, m && /* @__PURE__ */ a.createElement(y, null, /* @__PURE__ */ a.createElement(T, null, /* @__PURE__ */ a.createElement(
+    /* @__PURE__ */ t.createElement(E, null, /* @__PURE__ */ t.createElement(f, null, /* @__PURE__ */ t.createElement(
       s,
       {
-        selected: o === "bar" && h,
+        selected: o === "bar" && S,
         onClick: g,
-        icon: R,
+        icon: z,
         iconName: "chart-bar-clustered"
       },
-      n.toLanguageString(P, c.barChartBar)
-    ), /* @__PURE__ */ a.createElement(
+      n.toLanguageString(A, c.barChartBar)
+    ), /* @__PURE__ */ t.createElement(
       s,
       {
-        selected: o === "bar" && k,
+        selected: o === "bar" && h,
         onClick: B,
         icon: W,
         iconName: "chart-bar-stacked"
       },
-      n.toLanguageString(w, c.barChartStackedBar)
-    ), /* @__PURE__ */ a.createElement(
+      n.toLanguageString(P, c.barChartStackedBar)
+    ), /* @__PURE__ */ t.createElement(
       s,
       {
-        selected: o === "bar" && p,
+        selected: o === "bar" && k,
         onClick: u,
-        icon: v,
+        icon: F,
         iconName: "chart-bar-stacked100"
       },
-      n.toLanguageString(z, c.barChart100StackedBar)
-    ))))
+      n.toLanguageString(w, c.barChart100StackedBar)
+    )))
   );
 };
 export {
-  M as BarChartPanel
+  J as BarChartPanel
 };

package/components/panels/CategoryAxisPanel.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const I=require("react"),b=require("@progress/kendo-react-layout"),N=require("@progress/kendo-react-form"),S=require("../FormFieldSet.js"),g=require("../FormField.js"),c=require("@progress/kendo-react-inputs"),e=require("../../utils.js"),a=require("../../messages.js"),q=require("@progress/kendo-react-intl"),w=require("@progress/kendo-react-animation"),d=require("@progress/kendo-react-dropdowns");function O(s){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(s){for(const o in s)if(o!=="default"){const m=Object.getOwnPropertyDescriptor(s,o);Object.defineProperty(n,o,m.get?m:{enumerable:!0,get:()=>s[o]})}}return n.default=s,Object.freeze(n)}const t=O(I),j=s=>{var x,C,y,A,f;const n=q.useLocalization(),o=s.state,m=o.seriesType,[u,F]=t.useState(!1),L=t.useCallback(l=>{F(!l.expanded)},[]),T=t.useCallback(l=>{s.onStateChange(e.updateState(o,e.ActionTypes.categoryAxisTitleText,l.target.value))},[o]),p=t.useCallback(l=>{const r=l.target.value||e.nullItem;e.ensureValue(r)&&s.onStateChange(e.updateState(o,e.ActionTypes.categoryAxisTitleFontSize,r.value))},[o]),h=t.useCallback(l=>{const r=l.target.value||e.nullItem;s.onStateChange(e.updateState(o,e.ActionTypes.categoryAxisTitleFontName,r.value))},[o]),v=t.useCallback(l=>{s.onStateChange(e.updateState(o,e.ActionTypes.categoryAxisTitleColor,l.value))},[o]),k=t.useCallback(l=>{const r=l.target.value||e.nullItem;e.ensureValue(r)&&s.onStateChange(e.updateState(o,e.ActionTypes.categoryAxisLabelsFontSize,r.value))},[o]),E=t.useCallback(l=>{const r=l.target.value||e.nullItem;s.onStateChange(e.updateState(o,e.ActionTypes.categoryAxisLabelsFontName,r.value))},[o]),z=t.useCallback(l=>{s.onStateChange(e.updateState(o,e.ActionTypes.categoryAxisLabelsColor,l.value))},[o]),R=t.useCallback(l=>{s.onStateChange(e.updateState(o,e.ActionTypes.categoryAxisLabelsRotation,l.target.value))},[o]),P=t.useCallback(l=>{s.onStateChange(e.updateState(o,e.ActionTypes.categoryAxisReverseOrder,l.value))},[o]);return t.createElement(b.ExpansionPanel,{style:{maxWidth:"576px"},title:m==="scatter"?n.toLanguageString(a.formatXAxis,a.messages.formatXAxis):n.toLanguageString(a.formatCategoryAxis,a.messages.formatCategoryAxis),expanded:u,tabIndex:0,onAction:L},t.createElement(w.Reveal,null,u&&t.createElement(b.ExpansionPanelContent,null,t.createElement(N.FormElement,{onKeyDown:e.stopPropagation},t.createElement(S.FormFieldSet,{legend:n.toLanguageString(a.formatCategoryAxisTitle,a.messages.formatCategoryAxisTitle)},t.createElement("div",{className:"k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4"},t.createElement(g.FormField,{className:"k-col-span-2"},t.createElement(c.Input,{placeholder:n.toLanguageString(a.formatCategoryAxisTitlePlaceholder,a.messages.formatCategoryAxisTitlePlaceholder),value:((x=o.categoryAxis[0].title)==null?void 0:x.text)||"",onChange:T})),t.createElement(g.FormField,{className:"k-col-span-2",editorId:"categoryAxisTitleFont",labelText:n.toLanguageString(a.formatCategoryAxisTitleFont,a.messages.formatCategoryAxisTitleFont)},t.createElement(d.ComboBox,{id:"categoryAxisTitleFont",data:e.fontNames,textField:"text",dataItemKey:"value",itemRender:e.itemRender,placeholder:n.toLanguageString(a.formatCategoryAxisTitleFontPlaceholder,a.messages.formatCategoryAxisTitleFontPlaceholder),value:e.fontNames.find(l=>{var r,i;return l.value===((i=e.parseFont(((r=o.categoryAxis[0].title)==null?void 0:r.font)||""))==null?void 0:i.name)})||e.nullItem,onChange:h,...e.dropdownlistCommonProps})),t.createElement(g.FormField,{editorId:"categoryAxisTitleFontSize",labelText:n.toLanguageString(a.formatCategoryAxisTitleSize,a.messages.formatCategoryAxisTitleSize)},t.createElement(d.ComboBox,{id:"categoryAxisTitleFontSize",data:e.fontSizes,textField:"text",dataItemKey:"value",placeholder:n.toLanguageString(a.formatCategoryAxisTitleSizePlaceholder,a.messages.formatCategoryAxisTitleSizePlaceholder),value:e.fontSizes.find(l=>{var r,i;return l.value===((i=e.parseFont(((r=o.categoryAxis[0].title)==null?void 0:r.font)||""))==null?void 0:i.size)})||e.nullItem,onChange:p,allowCustom:!0,...e.dropdownlistCommonProps})),t.createElement(g.FormField,{editorId:"categoryAxisTitleColor",labelText:n.toLanguageString(a.formatCategoryAxisTitleColor,a.messages.formatCategoryAxisTitleColor)},t.createElement(c.ColorPicker,{id:"categoryAxisTitleColor",view:"gradient",value:((C=o.categoryAxis[0].title)==null?void 0:C.color)||"",onChange:v,fillMode:"outline"})))),t.createElement(S.FormFieldSet,{legend:n.toLanguageString(a.formatCategoryAxisLabels,a.messages.formatCategoryAxisLabels)},t.createElement("div",{className:"k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4"},t.createElement(g.FormField,{className:"k-col-span-2",editorId:"categoryAxisLabelsFont",labelText:n.toLanguageString(a.formatCategoryAxisLabelsFont,a.messages.formatCategoryAxisLabelsFont)},t.createElement(d.ComboBox,{id:"categoryAxisLabelsFont",data:e.fontNames,textField:"text",dataItemKey:"value",placeholder:n.toLanguageString(a.formatCategoryAxisLabelsFontPlaceholder,a.messages.formatCategoryAxisLabelsFontPlaceholder),value:e.fontNames.find(l=>{var r,i;return l.value===((i=e.parseFont(((r=o.categoryAxis[0].labels)==null?void 0:r.font)||""))==null?void 0:i.name)})||e.nullItem,onChange:E,itemRender:e.itemRender,...e.dropdownlistCommonProps})),t.createElement(g.FormField,{editorId:"categoryAxisLabelsFontSize",labelText:n.toLanguageString(a.formatCategoryAxisLabelsSize,a.messages.formatCategoryAxisLabelsSize)},t.createElement(d.ComboBox,{id:"categoryAxisLabelsFontSize",data:e.fontSizes,textField:"text",dataItemKey:"value",placeholder:n.toLanguageString(a.formatCategoryAxisLabelsSizePlaceholder,a.messages.formatCategoryAxisLabelsSizePlaceholder),value:e.fontSizes.find(l=>{var r,i;return l.value===((i=e.parseFont(((r=o.categoryAxis[0].labels)==null?void 0:r.font)||""))==null?void 0:i.size)})||e.nullItem,onChange:k,allowCustom:!0,...e.dropdownlistCommonProps})),t.createElement(g.FormField,{editorId:"categoryAxisLabelsColor",labelText:n.toLanguageString(a.formatCategoryAxisLabelsColor,a.messages.formatCategoryAxisLabelsColor)},t.createElement(c.ColorPicker,{id:"categoryAxisLabelsColor",view:"gradient",value:((y=o.categoryAxis[0].labels)==null?void 0:y.color)||"",onChange:z,fillMode:"outline"})),t.createElement(g.FormField,{editorId:"categoryAxisLabelsRotation",labelText:n.toLanguageString(a.formatCategoryAxisLabelsRotation,a.messages.formatCategoryAxisLabelsRotation)},t.createElement(c.NumericTextBox,{id:"categoryAxisLabelsRotation",value:typeof((A=o.categoryAxis[0].labels)==null?void 0:A.rotation)=="number"?(f=o.categoryAxis[0].labels)==null?void 0:f.rotation:null,placeholder:n.toLanguageString(a.formatCategoryAxisLabelsRotationAuto,a.messages.formatCategoryAxisLabelsRotationAuto),onChange:R,fillMode:"outline",min:-360,max:360,step:1})),t.createElement(g.FormField,{className:"k-col-span-2"},t.createElement(c.Checkbox,{label:n.toLanguageString(a.formatCategoryAxisLabelsReverseOrder,a.messages.formatCategoryAxisLabelsReverseOrder),checked:o.categoryAxis[0].reverse||!1,onChange:P}))))))))};exports.CategoryAxisPanel=j;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const R=require("react"),f=require("@progress/kendo-react-layout"),N=require("@progress/kendo-react-form"),b=require("../FormFieldSet.js"),g=require("../FormField.js"),c=require("@progress/kendo-react-inputs"),e=require("../../utils.js"),t=require("../../messages.js"),w=require("@progress/kendo-react-intl"),d=require("@progress/kendo-react-dropdowns");function q(s){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(s){for(const o in s)if(o!=="default"){const m=Object.getOwnPropertyDescriptor(s,o);Object.defineProperty(n,o,m.get?m:{enumerable:!0,get:()=>s[o]})}}return n.default=s,Object.freeze(n)}const a=q(R),O=s=>{var u,x,C,y,A;const n=w.useLocalization(),o=s.state,m=o.seriesType,[S,F]=a.useState(!1),L=a.useCallback(l=>{F(!l.expanded)},[]),T=a.useCallback(l=>{s.onStateChange(e.updateState(o,e.ActionTypes.categoryAxisTitleText,l.target.value))},[o]),p=a.useCallback(l=>{const r=l.target.value||e.nullItem;e.ensureValue(r)&&s.onStateChange(e.updateState(o,e.ActionTypes.categoryAxisTitleFontSize,r.value))},[o]),h=a.useCallback(l=>{const r=l.target.value||e.nullItem;s.onStateChange(e.updateState(o,e.ActionTypes.categoryAxisTitleFontName,r.value))},[o]),v=a.useCallback(l=>{s.onStateChange(e.updateState(o,e.ActionTypes.categoryAxisTitleColor,l.value))},[o]),k=a.useCallback(l=>{const r=l.target.value||e.nullItem;e.ensureValue(r)&&s.onStateChange(e.updateState(o,e.ActionTypes.categoryAxisLabelsFontSize,r.value))},[o]),E=a.useCallback(l=>{const r=l.target.value||e.nullItem;s.onStateChange(e.updateState(o,e.ActionTypes.categoryAxisLabelsFontName,r.value))},[o]),z=a.useCallback(l=>{s.onStateChange(e.updateState(o,e.ActionTypes.categoryAxisLabelsColor,l.value))},[o]),P=a.useCallback(l=>{s.onStateChange(e.updateState(o,e.ActionTypes.categoryAxisLabelsRotation,l.target.value))},[o]),I=a.useCallback(l=>{s.onStateChange(e.updateState(o,e.ActionTypes.categoryAxisReverseOrder,l.value))},[o]);return a.createElement(f.ExpansionPanel,{style:{maxWidth:"576px"},title:m==="scatter"?n.toLanguageString(t.formatXAxis,t.messages.formatXAxis):n.toLanguageString(t.formatCategoryAxis,t.messages.formatCategoryAxis),expanded:S,tabIndex:0,onAction:L},a.createElement(f.ExpansionPanelContent,null,a.createElement(N.FormElement,{onKeyDown:e.stopPropagation},a.createElement(b.FormFieldSet,{legend:n.toLanguageString(t.formatCategoryAxisTitle,t.messages.formatCategoryAxisTitle)},a.createElement("div",{className:"k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4"},a.createElement(g.FormField,{className:"k-col-span-2"},a.createElement(c.Input,{placeholder:n.toLanguageString(t.formatCategoryAxisTitlePlaceholder,t.messages.formatCategoryAxisTitlePlaceholder),value:((u=o.categoryAxis[0].title)==null?void 0:u.text)||"",onChange:T})),a.createElement(g.FormField,{className:"k-col-span-2",editorId:"categoryAxisTitleFont",labelText:n.toLanguageString(t.formatCategoryAxisTitleFont,t.messages.formatCategoryAxisTitleFont)},a.createElement(d.ComboBox,{id:"categoryAxisTitleFont",data:e.fontNames,textField:"text",dataItemKey:"value",itemRender:e.itemRender,placeholder:n.toLanguageString(t.formatCategoryAxisTitleFontPlaceholder,t.messages.formatCategoryAxisTitleFontPlaceholder),value:e.fontNames.find(l=>{var r,i;return l.value===((i=e.parseFont(((r=o.categoryAxis[0].title)==null?void 0:r.font)||""))==null?void 0:i.name)})||e.nullItem,onChange:h,...e.dropdownlistCommonProps})),a.createElement(g.FormField,{editorId:"categoryAxisTitleFontSize",labelText:n.toLanguageString(t.formatCategoryAxisTitleSize,t.messages.formatCategoryAxisTitleSize)},a.createElement(d.ComboBox,{id:"categoryAxisTitleFontSize",data:e.fontSizes,textField:"text",dataItemKey:"value",placeholder:n.toLanguageString(t.formatCategoryAxisTitleSizePlaceholder,t.messages.formatCategoryAxisTitleSizePlaceholder),value:e.fontSizes.find(l=>{var r,i;return l.value===((i=e.parseFont(((r=o.categoryAxis[0].title)==null?void 0:r.font)||""))==null?void 0:i.size)})||e.nullItem,onChange:p,allowCustom:!0,...e.dropdownlistCommonProps})),a.createElement(g.FormField,{editorId:"categoryAxisTitleColor",labelText:n.toLanguageString(t.formatCategoryAxisTitleColor,t.messages.formatCategoryAxisTitleColor)},a.createElement(c.ColorPicker,{id:"categoryAxisTitleColor",view:"gradient",value:((x=o.categoryAxis[0].title)==null?void 0:x.color)||"",onChange:v,fillMode:"outline"})))),a.createElement(b.FormFieldSet,{legend:n.toLanguageString(t.formatCategoryAxisLabels,t.messages.formatCategoryAxisLabels)},a.createElement("div",{className:"k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4"},a.createElement(g.FormField,{className:"k-col-span-2",editorId:"categoryAxisLabelsFont",labelText:n.toLanguageString(t.formatCategoryAxisLabelsFont,t.messages.formatCategoryAxisLabelsFont)},a.createElement(d.ComboBox,{id:"categoryAxisLabelsFont",data:e.fontNames,textField:"text",dataItemKey:"value",placeholder:n.toLanguageString(t.formatCategoryAxisLabelsFontPlaceholder,t.messages.formatCategoryAxisLabelsFontPlaceholder),value:e.fontNames.find(l=>{var r,i;return l.value===((i=e.parseFont(((r=o.categoryAxis[0].labels)==null?void 0:r.font)||""))==null?void 0:i.name)})||e.nullItem,onChange:E,itemRender:e.itemRender,...e.dropdownlistCommonProps})),a.createElement(g.FormField,{editorId:"categoryAxisLabelsFontSize",labelText:n.toLanguageString(t.formatCategoryAxisLabelsSize,t.messages.formatCategoryAxisLabelsSize)},a.createElement(d.ComboBox,{id:"categoryAxisLabelsFontSize",data:e.fontSizes,textField:"text",dataItemKey:"value",placeholder:n.toLanguageString(t.formatCategoryAxisLabelsSizePlaceholder,t.messages.formatCategoryAxisLabelsSizePlaceholder),value:e.fontSizes.find(l=>{var r,i;return l.value===((i=e.parseFont(((r=o.categoryAxis[0].labels)==null?void 0:r.font)||""))==null?void 0:i.size)})||e.nullItem,onChange:k,allowCustom:!0,...e.dropdownlistCommonProps})),a.createElement(g.FormField,{editorId:"categoryAxisLabelsColor",labelText:n.toLanguageString(t.formatCategoryAxisLabelsColor,t.messages.formatCategoryAxisLabelsColor)},a.createElement(c.ColorPicker,{id:"categoryAxisLabelsColor",view:"gradient",value:((C=o.categoryAxis[0].labels)==null?void 0:C.color)||"",onChange:z,fillMode:"outline"})),a.createElement(g.FormField,{editorId:"categoryAxisLabelsRotation",labelText:n.toLanguageString(t.formatCategoryAxisLabelsRotation,t.messages.formatCategoryAxisLabelsRotation)},a.createElement(c.NumericTextBox,{id:"categoryAxisLabelsRotation",value:typeof((y=o.categoryAxis[0].labels)==null?void 0:y.rotation)=="number"?(A=o.categoryAxis[0].labels)==null?void 0:A.rotation:null,placeholder:n.toLanguageString(t.formatCategoryAxisLabelsRotationAuto,t.messages.formatCategoryAxisLabelsRotationAuto),onChange:P,fillMode:"outline",min:-360,max:360,step:1})),a.createElement(g.FormField,{className:"k-col-span-2"},a.createElement(c.Checkbox,{label:n.toLanguageString(t.formatCategoryAxisLabelsReverseOrder,t.messages.formatCategoryAxisLabelsReverseOrder),checked:o.categoryAxis[0].reverse||!1,onChange:I})))))))};exports.CategoryAxisPanel=O;

package/components/panels/CategoryAxisPanel.mjs

@@ -8,36 +8,35 @@
 import * as e from "react";
 import { ExpansionPanel as X, ExpansionPanelContent as D } from "@progress/kendo-react-layout";
 import { FormElement as V } from "@progress/kendo-react-form";
-import { FormFieldSet as T } from "../FormFieldSet.mjs";
+import { FormFieldSet as h } from "../FormFieldSet.mjs";
 import { FormField as s } from "../FormField.mjs";
-import { Input as W, ColorPicker as v, NumericTextBox as j, Checkbox as q } from "@progress/kendo-react-inputs";
-import { updateState as g, ActionTypes as c, nullItem as m, ensureValue as F, stopPropagation as G, dropdownlistCommonProps as x, itemRender as E, fontNames as C, parseFont as y, fontSizes as d } from "../../utils.mjs";
+import { Input as W, ColorPicker as T, NumericTextBox as j, Checkbox as q } from "@progress/kendo-react-inputs";
+import { updateState as g, ActionTypes as c, nullItem as m, ensureValue as v, stopPropagation as G, dropdownlistCommonProps as x, itemRender as F, fontNames as C, parseFont as y, fontSizes as d } from "../../utils.mjs";
 import { formatXAxis as H, messages as r, formatCategoryAxis as J, formatCategoryAxisTitle as Q, formatCategoryAxisTitlePlaceholder as U, formatCategoryAxisTitleFont as Y, formatCategoryAxisTitleFontPlaceholder as Z, formatCategoryAxisTitleSize as _, formatCategoryAxisTitleSizePlaceholder as $, formatCategoryAxisTitleColor as ee, formatCategoryAxisLabels as te, formatCategoryAxisLabelsFont as ae, formatCategoryAxisLabelsFontPlaceholder as oe, formatCategoryAxisLabelsSize as le, formatCategoryAxisLabelsSizePlaceholder as re, formatCategoryAxisLabelsColor as ie, formatCategoryAxisLabelsRotation as ne, formatCategoryAxisLabelsRotationAuto as se, formatCategoryAxisLabelsReverseOrder as ge } from "../../messages.mjs";
 import { useLocalization as ce } from "@progress/kendo-react-intl";
-import { Reveal as me } from "@progress/kendo-react-animation";
 import { ComboBox as A } from "@progress/kendo-react-dropdowns";
-const he = (n) => {
-  var f, b, L, S, h;
-  const l = ce(), t = n.state, k = t.seriesType, [u, p] = e.useState(!1), z = e.useCallback((a) => {
+const Le = (n) => {
+  var u, f, b, L, S;
+  const l = ce(), t = n.state, E = t.seriesType, [k, p] = e.useState(!1), z = e.useCallback((a) => {
     p(!a.expanded);
   }, []), P = e.useCallback(
     (a) => {
       n.onStateChange(g(t, c.categoryAxisTitleText, a.target.value));
     },
     [t]
-  ), R = e.useCallback(
+  ), I = e.useCallback(
     (a) => {
       const o = a.target.value || m;
-      F(o) && n.onStateChange(g(t, c.categoryAxisTitleFontSize, o.value));
+      v(o) && n.onStateChange(g(t, c.categoryAxisTitleFontSize, o.value));
     },
     [t]
-  ), I = e.useCallback(
+  ), N = e.useCallback(
     (a) => {
       const o = a.target.value || m;
       n.onStateChange(g(t, c.categoryAxisTitleFontName, o.value));
     },
     [t]
-  ), N = e.useCallback(
+  ), R = e.useCallback(
     (a) => {
       n.onStateChange(g(t, c.categoryAxisTitleColor, a.value));
     },
@@ -45,7 +44,7 @@ const he = (n) => {
   ), w = e.useCallback(
     (a) => {
       const o = a.target.value || m;
-      F(o) && n.onStateChange(g(t, c.categoryAxisLabelsFontSize, o.value));
+      v(o) && n.onStateChange(g(t, c.categoryAxisLabelsFontSize, o.value));
     },
     [t]
   ), K = e.useCallback(
@@ -74,13 +73,13 @@ const he = (n) => {
     X,
     {
       style: { maxWidth: "576px" },
-      title: k === "scatter" ? l.toLanguageString(H, r.formatXAxis) : l.toLanguageString(J, r.formatCategoryAxis),
-      expanded: u,
+      title: E === "scatter" ? l.toLanguageString(H, r.formatXAxis) : l.toLanguageString(J, r.formatCategoryAxis),
+      expanded: k,
       tabIndex: 0,
       onAction: z
     },
-    /* @__PURE__ */ e.createElement(me, null, u && /* @__PURE__ */ e.createElement(D, null, /* @__PURE__ */ e.createElement(V, { onKeyDown: G }, /* @__PURE__ */ e.createElement(
-      T,
+    /* @__PURE__ */ e.createElement(D, null, /* @__PURE__ */ e.createElement(V, { onKeyDown: G }, /* @__PURE__ */ e.createElement(
+      h,
       {
         legend: l.toLanguageString(
           Q,
@@ -94,7 +93,7 @@ const he = (n) => {
             U,
             r.formatCategoryAxisTitlePlaceholder
           ),
-          value: ((f = t.categoryAxis[0].title) == null ? void 0 : f.text) || "",
+          value: ((u = t.categoryAxis[0].title) == null ? void 0 : u.text) || "",
           onChange: P
         }
       )), /* @__PURE__ */ e.createElement(
@@ -114,7 +113,7 @@ const he = (n) => {
             data: C,
             textField: "text",
             dataItemKey: "value",
-            itemRender: E,
+            itemRender: F,
             placeholder: l.toLanguageString(
               Z,
               r.formatCategoryAxisTitleFontPlaceholder
@@ -125,7 +124,7 @@ const he = (n) => {
                 return a.value === ((i = y(((o = t.categoryAxis[0].title) == null ? void 0 : o.font) || "")) == null ? void 0 : i.name);
               }
             ) || m,
-            onChange: I,
+            onChange: N,
             ...x
           }
         )
@@ -155,7 +154,7 @@ const he = (n) => {
                 return a.value === ((i = y(((o = t.categoryAxis[0].title) == null ? void 0 : o.font) || "")) == null ? void 0 : i.size);
               }
             ) || m,
-            onChange: R,
+            onChange: I,
             allowCustom: !0,
             ...x
           }
@@ -170,18 +169,18 @@ const he = (n) => {
           )
         },
         /* @__PURE__ */ e.createElement(
-          v,
+          T,
           {
             id: "categoryAxisTitleColor",
             view: "gradient",
-            value: ((b = t.categoryAxis[0].title) == null ? void 0 : b.color) || "",
-            onChange: N,
+            value: ((f = t.categoryAxis[0].title) == null ? void 0 : f.color) || "",
+            onChange: R,
             fillMode: "outline"
           }
         )
       ))
     ), /* @__PURE__ */ e.createElement(
-      T,
+      h,
       {
         legend: l.toLanguageString(
           te,
@@ -216,7 +215,7 @@ const he = (n) => {
               }
             ) || m,
             onChange: K,
-            itemRender: E,
+            itemRender: F,
             ...x
           }
         )
@@ -261,11 +260,11 @@ const he = (n) => {
           )
         },
         /* @__PURE__ */ e.createElement(
-          v,
+          T,
           {
             id: "categoryAxisLabelsColor",
             view: "gradient",
-            value: ((L = t.categoryAxis[0].labels) == null ? void 0 : L.color) || "",
+            value: ((b = t.categoryAxis[0].labels) == null ? void 0 : b.color) || "",
             onChange: M,
             fillMode: "outline"
           }
@@ -283,7 +282,7 @@ const he = (n) => {
           j,
           {
             id: "categoryAxisLabelsRotation",
-            value: typeof ((S = t.categoryAxis[0].labels) == null ? void 0 : S.rotation) == "number" ? (h = t.categoryAxis[0].labels) == null ? void 0 : h.rotation : null,
+            value: typeof ((L = t.categoryAxis[0].labels) == null ? void 0 : L.rotation) == "number" ? (S = t.categoryAxis[0].labels) == null ? void 0 : S.rotation : null,
             placeholder: l.toLanguageString(
               se,
               r.formatCategoryAxisLabelsRotationAuto
@@ -306,9 +305,9 @@ const he = (n) => {
           onChange: B
         }
       )))
-    ))))
+    )))
   );
 };
 export {
-  he as CategoryAxisPanel
+  Le as CategoryAxisPanel
 };

package/components/panels/ChartAreaPanel.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("react"),u=require("@progress/kendo-react-layout"),x=require("@progress/kendo-react-form"),d=require("../FormFieldSet.js"),s=require("../FormField.js"),m=require("@progress/kendo-react-inputs"),i=require("../../utils.js"),e=require("../../messages.js"),k=require("@progress/kendo-react-intl"),E=require("@progress/kendo-react-animation");function F(n){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const t in n)if(t!=="default"){const g=Object.getOwnPropertyDescriptor(n,t);Object.defineProperty(r,t,g.get?g:{enumerable:!0,get:()=>n[t]})}}return r.default=n,Object.freeze(r)}const a=F(b),T=n=>{var c;const r=k.useLocalization(),t=n.state,[g,h]=a.useState(!1),C=a.useCallback(o=>{h(!o.expanded)},[]),f=a.useCallback(o=>{n.onStateChange(i.updateState(t,i.ActionTypes.areaMarginLeft,o.target.value))},[t]),A=a.useCallback(o=>{n.onStateChange(i.updateState(t,i.ActionTypes.areaMarginRight,o.target.value))},[t]),p=a.useCallback(o=>{n.onStateChange(i.updateState(t,i.ActionTypes.areaMarginTop,o.target.value))},[t]),M=a.useCallback(o=>{n.onStateChange(i.updateState(t,i.ActionTypes.areaMarginBottom,o.target.value))},[t]),l=t.area.margin,S=a.useCallback(o=>{n.onStateChange(i.updateState(t,i.ActionTypes.areaBackground,o.value))},[t]);return a.createElement(u.ExpansionPanel,{style:{maxWidth:"576px"},title:r.toLanguageString(e.formatChartArea,e.messages.formatChartArea),expanded:g,tabIndex:0,onAction:C},a.createElement(E.Reveal,null,g&&a.createElement(u.ExpansionPanelContent,null,a.createElement(x.FormElement,{onKeyDown:i.stopPropagation},a.createElement(d.FormFieldSet,{legend:r.toLanguageString(e.formatChartAreaMargins,e.messages.formatChartAreaMargins)},a.createElement("div",{className:"k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4"},a.createElement(s.FormField,{labelText:r.toLanguageString(e.formatChartAreaMarginsLeft,e.messages.formatChartAreaMarginsLeft),editorId:"left"},a.createElement(m.NumericTextBox,{id:"left",value:l.left!==void 0?l.left:null,onChange:f,placeholder:r.toLanguageString(e.formatChartAreaMarginsAuto,e.messages.formatChartAreaMarginsAuto),min:0,max:1e3,step:1,fillMode:"outline"})),a.createElement(s.FormField,{labelText:r.toLanguageString(e.formatChartAreaMarginsRight,e.messages.formatChartAreaMarginsRight),editorId:"right"},a.createElement(m.NumericTextBox,{id:"right",value:l.right!==void 0?l.right:null,onChange:A,placeholder:r.toLanguageString(e.formatChartAreaMarginsAuto,e.messages.formatChartAreaMarginsAuto),min:0,max:1e3,step:1,fillMode:"outline"})),a.createElement(s.FormField,{labelText:r.toLanguageString(e.formatChartAreaMarginsTop,e.messages.formatChartAreaMarginsTop),editorId:"top"},a.createElement(m.NumericTextBox,{id:"top",value:l.top!==void 0?l.top:null,onChange:p,placeholder:r.toLanguageString(e.formatChartAreaMarginsAuto,e.messages.formatChartAreaMarginsAuto),min:0,max:1e3,step:1,fillMode:"outline"})),a.createElement(s.FormField,{labelText:r.toLanguageString(e.formatChartAreaMarginsBottom,e.messages.formatChartAreaMarginsBottom),editorId:"bottom"},a.createElement(m.NumericTextBox,{id:"bottom",value:l.bottom!==void 0?l.bottom:null,onChange:M,placeholder:r.toLanguageString(e.formatChartAreaMarginsAuto,e.messages.formatChartAreaMarginsAuto),min:0,max:1e3,step:1,fillMode:"outline"})))),a.createElement(d.FormFieldSet,{legend:r.toLanguageString(e.formatChartAreaBackground,e.messages.formatChartAreaBackground)},a.createElement(s.FormField,{labelText:r.toLanguageString(e.formatChartAreaBackgroundColor,e.messages.formatChartAreaBackgroundColor),editorId:"background"},a.createElement(m.ColorPicker,{id:"background",value:((c=t.area)==null?void 0:c.background)||"",onChange:S,view:"gradient",fillMode:"outline"})))))))};exports.ChartAreaPanel=T;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("react"),c=require("@progress/kendo-react-layout"),x=require("@progress/kendo-react-form"),d=require("../FormFieldSet.js"),l=require("../FormField.js"),s=require("@progress/kendo-react-inputs"),i=require("../../utils.js"),e=require("../../messages.js"),k=require("@progress/kendo-react-intl");function E(n){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const t in n)if(t!=="default"){const m=Object.getOwnPropertyDescriptor(n,t);Object.defineProperty(r,t,m.get?m:{enumerable:!0,get:()=>n[t]})}}return r.default=n,Object.freeze(r)}const a=E(b),F=n=>{var u;const r=k.useLocalization(),t=n.state,[m,h]=a.useState(!1),C=a.useCallback(o=>{h(!o.expanded)},[]),f=a.useCallback(o=>{n.onStateChange(i.updateState(t,i.ActionTypes.areaMarginLeft,o.target.value))},[t]),A=a.useCallback(o=>{n.onStateChange(i.updateState(t,i.ActionTypes.areaMarginRight,o.target.value))},[t]),p=a.useCallback(o=>{n.onStateChange(i.updateState(t,i.ActionTypes.areaMarginTop,o.target.value))},[t]),M=a.useCallback(o=>{n.onStateChange(i.updateState(t,i.ActionTypes.areaMarginBottom,o.target.value))},[t]),g=t.area.margin,S=a.useCallback(o=>{n.onStateChange(i.updateState(t,i.ActionTypes.areaBackground,o.value))},[t]);return a.createElement(c.ExpansionPanel,{style:{maxWidth:"576px"},title:r.toLanguageString(e.formatChartArea,e.messages.formatChartArea),expanded:m,tabIndex:0,onAction:C},a.createElement(c.ExpansionPanelContent,null,a.createElement(x.FormElement,{onKeyDown:i.stopPropagation},a.createElement(d.FormFieldSet,{legend:r.toLanguageString(e.formatChartAreaMargins,e.messages.formatChartAreaMargins)},a.createElement("div",{className:"k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4"},a.createElement(l.FormField,{labelText:r.toLanguageString(e.formatChartAreaMarginsLeft,e.messages.formatChartAreaMarginsLeft),editorId:"left"},a.createElement(s.NumericTextBox,{id:"left",value:g.left!==void 0?g.left:null,onChange:f,placeholder:r.toLanguageString(e.formatChartAreaMarginsAuto,e.messages.formatChartAreaMarginsAuto),min:0,max:1e3,step:1,fillMode:"outline"})),a.createElement(l.FormField,{labelText:r.toLanguageString(e.formatChartAreaMarginsRight,e.messages.formatChartAreaMarginsRight),editorId:"right"},a.createElement(s.NumericTextBox,{id:"right",value:g.right!==void 0?g.right:null,onChange:A,placeholder:r.toLanguageString(e.formatChartAreaMarginsAuto,e.messages.formatChartAreaMarginsAuto),min:0,max:1e3,step:1,fillMode:"outline"})),a.createElement(l.FormField,{labelText:r.toLanguageString(e.formatChartAreaMarginsTop,e.messages.formatChartAreaMarginsTop),editorId:"top"},a.createElement(s.NumericTextBox,{id:"top",value:g.top!==void 0?g.top:null,onChange:p,placeholder:r.toLanguageString(e.formatChartAreaMarginsAuto,e.messages.formatChartAreaMarginsAuto),min:0,max:1e3,step:1,fillMode:"outline"})),a.createElement(l.FormField,{labelText:r.toLanguageString(e.formatChartAreaMarginsBottom,e.messages.formatChartAreaMarginsBottom),editorId:"bottom"},a.createElement(s.NumericTextBox,{id:"bottom",value:g.bottom!==void 0?g.bottom:null,onChange:M,placeholder:r.toLanguageString(e.formatChartAreaMarginsAuto,e.messages.formatChartAreaMarginsAuto),min:0,max:1e3,step:1,fillMode:"outline"})))),a.createElement(d.FormFieldSet,{legend:r.toLanguageString(e.formatChartAreaBackground,e.messages.formatChartAreaBackground)},a.createElement(l.FormField,{labelText:r.toLanguageString(e.formatChartAreaBackgroundColor,e.messages.formatChartAreaBackgroundColor),editorId:"background"},a.createElement(s.ColorPicker,{id:"background",value:((u=t.area)==null?void 0:u.background)||"",onChange:S,view:"gradient",fillMode:"outline"}))))))};exports.ChartAreaPanel=F;

package/components/panels/ChartAreaPanel.mjs

@@ -6,64 +6,60 @@
  *-------------------------------------------------------------------------------------------
  */
 import * as a from "react";
-import { ExpansionPanel as k, ExpansionPanelContent as S } from "@progress/kendo-react-layout";
+import { ExpansionPanel as E, ExpansionPanelContent as S } from "@progress/kendo-react-layout";
 import { FormElement as b } from "@progress/kendo-react-form";
-import { FormFieldSet as C } from "../FormFieldSet.mjs";
-import { FormField as g } from "../FormField.mjs";
-import { NumericTextBox as u, ColorPicker as v } from "@progress/kendo-react-inputs";
-import { updateState as i, ActionTypes as m, stopPropagation as L } from "../../utils.mjs";
-import { formatChartArea as B, messages as r, formatChartAreaMargins as T, formatChartAreaMarginsLeft as I, formatChartAreaMarginsAuto as c, formatChartAreaMarginsRight as R, formatChartAreaMarginsTop as F, formatChartAreaMarginsBottom as P, formatChartAreaBackground as y, formatChartAreaBackgroundColor as w } from "../../messages.mjs";
+import { FormFieldSet as h } from "../FormFieldSet.mjs";
+import { FormField as l } from "../FormField.mjs";
+import { NumericTextBox as u, ColorPicker as L } from "@progress/kendo-react-inputs";
+import { updateState as i, ActionTypes as m, stopPropagation as v } from "../../utils.mjs";
+import { formatChartArea as B, messages as r, formatChartAreaMargins as T, formatChartAreaMarginsLeft as I, formatChartAreaMarginsAuto as d, formatChartAreaMarginsRight as F, formatChartAreaMarginsTop as P, formatChartAreaMarginsBottom as R, formatChartAreaBackground as y, formatChartAreaBackgroundColor as w } from "../../messages.mjs";
 import { useLocalization as z } from "@progress/kendo-react-intl";
-import { Reveal as N } from "@progress/kendo-react-animation";
-const Q = (l) => {
-  var h;
-  const e = z(), t = l.state, [d, s] = a.useState(!1), f = a.useCallback((o) => {
+const J = (g) => {
+  var c;
+  const e = z(), t = g.state, [C, s] = a.useState(!1), f = a.useCallback((o) => {
     s(!o.expanded);
   }, []), A = a.useCallback(
     (o) => {
-      l.onStateChange(i(t, m.areaMarginLeft, o.target.value));
+      g.onStateChange(i(t, m.areaMarginLeft, o.target.value));
     },
     [t]
-  ), p = a.useCallback(
+  ), M = a.useCallback(
     (o) => {
-      l.onStateChange(i(t, m.areaMarginRight, o.target.value));
+      g.onStateChange(i(t, m.areaMarginRight, o.target.value));
     },
     [t]
-  ), M = a.useCallback(
+  ), p = a.useCallback(
     (o) => {
-      l.onStateChange(i(t, m.areaMarginTop, o.target.value));
+      g.onStateChange(i(t, m.areaMarginTop, o.target.value));
     },
     [t]
   ), x = a.useCallback(
     (o) => {
-      l.onStateChange(i(t, m.areaMarginBottom, o.target.value));
+      g.onStateChange(i(t, m.areaMarginBottom, o.target.value));
     },
     [t]
-  ), n = t.area.margin, E = a.useCallback(
+  ), n = t.area.margin, k = a.useCallback(
     (o) => {
-      l.onStateChange(i(t, m.areaBackground, o.value));
+      g.onStateChange(i(t, m.areaBackground, o.value));
     },
     [t]
   );
   return /* @__PURE__ */ a.createElement(
-    k,
+    E,
     {
       style: { maxWidth: "576px" },
       title: e.toLanguageString(B, r.formatChartArea),
-      expanded: d,
+      expanded: C,
       tabIndex: 0,
       onAction: f
     },
-    /* @__PURE__ */ a.createElement(N, null, d && /* @__PURE__ */ a.createElement(S, null, /* @__PURE__ */ a.createElement(b, { onKeyDown: L }, /* @__PURE__ */ a.createElement(
-      C,
+    /* @__PURE__ */ a.createElement(S, null, /* @__PURE__ */ a.createElement(b, { onKeyDown: v }, /* @__PURE__ */ a.createElement(
+      h,
       {
-        legend: e.toLanguageString(
-          T,
-          r.formatChartAreaMargins
-        )
+        legend: e.toLanguageString(T, r.formatChartAreaMargins)
       },
       /* @__PURE__ */ a.createElement("div", { className: "k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4" }, /* @__PURE__ */ a.createElement(
-        g,
+        l,
         {
           labelText: e.toLanguageString(
             I,
@@ -78,7 +74,7 @@ const Q = (l) => {
             value: n.left !== void 0 ? n.left : null,
             onChange: A,
             placeholder: e.toLanguageString(
-              c,
+              d,
               r.formatChartAreaMarginsAuto
             ),
             min: 0,
@@ -88,10 +84,10 @@ const Q = (l) => {
           }
         )
       ), /* @__PURE__ */ a.createElement(
-        g,
+        l,
         {
           labelText: e.toLanguageString(
-            R,
+            F,
             r.formatChartAreaMarginsRight
           ),
           editorId: "right"
@@ -101,9 +97,9 @@ const Q = (l) => {
           {
             id: "right",
             value: n.right !== void 0 ? n.right : null,
-            onChange: p,
+            onChange: M,
             placeholder: e.toLanguageString(
-              c,
+              d,
               r.formatChartAreaMarginsAuto
             ),
             min: 0,
@@ -113,10 +109,10 @@ const Q = (l) => {
           }
         )
       ), /* @__PURE__ */ a.createElement(
-        g,
+        l,
         {
           labelText: e.toLanguageString(
-            F,
+            P,
             r.formatChartAreaMarginsTop
           ),
           editorId: "top"
@@ -126,9 +122,9 @@ const Q = (l) => {
           {
             id: "top",
             value: n.top !== void 0 ? n.top : null,
-            onChange: M,
+            onChange: p,
             placeholder: e.toLanguageString(
-              c,
+              d,
               r.formatChartAreaMarginsAuto
             ),
             min: 0,
@@ -138,10 +134,10 @@ const Q = (l) => {
           }
         )
       ), /* @__PURE__ */ a.createElement(
-        g,
+        l,
         {
           labelText: e.toLanguageString(
-            P,
+            R,
             r.formatChartAreaMarginsBottom
           ),
           editorId: "bottom"
@@ -153,7 +149,7 @@ const Q = (l) => {
             value: n.bottom !== void 0 ? n.bottom : null,
             onChange: x,
             placeholder: e.toLanguageString(
-              c,
+              d,
               r.formatChartAreaMarginsAuto
             ),
             min: 0,
@@ -164,7 +160,7 @@ const Q = (l) => {
         )
       ))
     ), /* @__PURE__ */ a.createElement(
-      C,
+      h,
       {
         legend: e.toLanguageString(
           y,
@@ -172,7 +168,7 @@ const Q = (l) => {
         )
       },
       /* @__PURE__ */ a.createElement(
-        g,
+        l,
         {
           labelText: e.toLanguageString(
             w,
@@ -181,19 +177,19 @@ const Q = (l) => {
           editorId: "background"
         },
         /* @__PURE__ */ a.createElement(
-          v,
+          L,
           {
             id: "background",
-            value: ((h = t.area) == null ? void 0 : h.background) || "",
-            onChange: E,
+            value: ((c = t.area) == null ? void 0 : c.background) || "",
+            onChange: k,
             view: "gradient",
             fillMode: "outline"
           }
         )
       )
-    ))))
+    )))
   );
 };
 export {
-  Q as ChartAreaPanel
+  J as ChartAreaPanel
 };

package/components/panels/ColumnChartPanel.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const T=require("react"),b=require("@progress/kendo-react-animation"),f=require("@progress/kendo-react-intl"),m=require("@progress/kendo-react-layout"),t=require("../../utils.js"),E=require("../SeriesTypesWrap.js"),l=require("../SeriesTypeButton.js"),o=require("../../messages.js"),u=require("@progress/kendo-svg-icons");function q(n){const c=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const e in n)if(e!=="default"){const s=Object.getOwnPropertyDescriptor(n,e);Object.defineProperty(c,e,s.get?s:{enumerable:!0,get:()=>n[e]})}}return c.default=n,Object.freeze(c)}const a=q(T),x=n=>{const c=f.useLocalization(),e=n.state,s=e.seriesType,{isStackFalse:S,isStackNormal:d,isStack100:C}=t.stackState(e),[i,g]=a.useState(!0),k=a.useCallback(r=>{g(!r.expanded)},[]),p=()=>{n.onStateChange(t.mergeStates(e,t.createState(e.data,"column")))},h=()=>{const r=t.mergeStates(e,t.createState(e.data,"column"));n.onStateChange(t.updateState(r,t.ActionTypes.stacked,t.stackNormal))},y=()=>{const r=t.mergeStates(e,t.createState(e.data,"column"));n.onStateChange(t.updateState(r,t.ActionTypes.stacked,t.stack100))};return a.createElement(m.ExpansionPanel,{style:{maxWidth:"576px"},title:c.toLanguageString(o.columnChart,o.messages.columnChart),expanded:i,tabIndex:0,onAction:k},a.createElement(b.Reveal,null,i&&a.createElement(m.ExpansionPanelContent,null,a.createElement(E.SeriesTypesWrap,null,a.createElement(l.SeriesTypeButton,{selected:s==="column"&&S,onClick:p,icon:u.chartColumnClusteredIcon,iconName:"chart-column-clustered"},c.toLanguageString(o.columnChartColumn,o.messages.columnChartColumn)),a.createElement(l.SeriesTypeButton,{selected:s==="column"&&d,onClick:h,icon:u.chartColumnStackedIcon,iconName:"chart-column-stacked"},c.toLanguageString(o.columnChartStackedColumn,o.messages.columnChartStackedColumn)),a.createElement(l.SeriesTypeButton,{selected:s==="column"&&C,onClick:y,icon:u.chartColumnStacked100Icon,iconName:"chart-column-stacked100"},c.toLanguageString(o.columnChart100StackedColumn,o.messages.columnChart100StackedColumn))))))};exports.ColumnChartPanel=x;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const T=require("react"),b=require("@progress/kendo-react-intl"),i=require("@progress/kendo-react-layout"),t=require("../../utils.js"),f=require("../SeriesTypesWrap.js"),l=require("../SeriesTypeButton.js"),c=require("../../messages.js"),u=require("@progress/kendo-svg-icons");function x(n){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const e in n)if(e!=="default"){const s=Object.getOwnPropertyDescriptor(n,e);Object.defineProperty(a,e,s.get?s:{enumerable:!0,get:()=>n[e]})}}return a.default=n,Object.freeze(a)}const o=x(T),E=n=>{const a=b.useLocalization(),e=n.state,s=e.seriesType,{isStackFalse:m,isStackNormal:S,isStack100:d}=t.stackState(e),[C,g]=o.useState(!0),k=o.useCallback(r=>{g(!r.expanded)},[]),p=()=>{n.onStateChange(t.mergeStates(e,t.createState(e.data,"column")))},h=()=>{const r=t.mergeStates(e,t.createState(e.data,"column"));n.onStateChange(t.updateState(r,t.ActionTypes.stacked,t.stackNormal))},y=()=>{const r=t.mergeStates(e,t.createState(e.data,"column"));n.onStateChange(t.updateState(r,t.ActionTypes.stacked,t.stack100))};return o.createElement(i.ExpansionPanel,{style:{maxWidth:"576px"},title:a.toLanguageString(c.columnChart,c.messages.columnChart),expanded:C,tabIndex:0,onAction:k},o.createElement(i.ExpansionPanelContent,null,o.createElement(f.SeriesTypesWrap,null,o.createElement(l.SeriesTypeButton,{selected:s==="column"&&m,onClick:p,icon:u.chartColumnClusteredIcon,iconName:"chart-column-clustered"},a.toLanguageString(c.columnChartColumn,c.messages.columnChartColumn)),o.createElement(l.SeriesTypeButton,{selected:s==="column"&&S,onClick:h,icon:u.chartColumnStackedIcon,iconName:"chart-column-stacked"},a.toLanguageString(c.columnChartStackedColumn,c.messages.columnChartStackedColumn)),o.createElement(l.SeriesTypeButton,{selected:s==="column"&&d,onClick:y,icon:u.chartColumnStacked100Icon,iconName:"chart-column-stacked100"},a.toLanguageString(c.columnChart100StackedColumn,c.messages.columnChart100StackedColumn)))))};exports.ColumnChartPanel=E;