@progress/kendo-react-chart-wizard 16.2.0-develop.2 → 16.2.0-develop.20

package/components/panels/PieChartPanel.mjs

@@ -6,41 +6,40 @@
  *-------------------------------------------------------------------------------------------
  */
 import * as e from "react";
-import { Reveal as l } from "@progress/kendo-react-animation";
-import { useLocalization as d } from "@progress/kendo-react-intl";
-import { ExpansionPanel as h, ExpansionPanelContent as C } from "@progress/kendo-react-layout";
-import { mergeStates as u, createState as P } from "../../utils.mjs";
-import { pieChart as x, messages as i, pieChartPie as f } from "../../messages.mjs";
+import { useLocalization as l } from "@progress/kendo-react-intl";
+import { ExpansionPanel as d, ExpansionPanelContent as h } from "@progress/kendo-react-layout";
+import { mergeStates as C, createState as P } from "../../utils.mjs";
+import { pieChart as u, messages as i, pieChartPie as x } from "../../messages.mjs";
 import { SeriesTypesWrap as g } from "../SeriesTypesWrap.mjs";
 import { SeriesTypeButton as S } from "../SeriesTypeButton.mjs";
-import { chartPieIcon as E } from "@progress/kendo-svg-icons";
-const R = (a) => {
-  const n = d(), t = a.state, o = t.seriesType, [r, s] = e.useState(!0), p = e.useCallback((c) => {
-    s(!c.expanded);
-  }, []), m = () => {
-    a.onStateChange(u(t, P(t.data, "pie")));
+import { chartPieIcon as f } from "@progress/kendo-svg-icons";
+const A = (a) => {
+  const n = l(), t = a.state, r = t.seriesType, [o, s] = e.useState(!0), p = e.useCallback((m) => {
+    s(!m.expanded);
+  }, []), c = () => {
+    a.onStateChange(C(t, P(t.data, "pie")));
   };
   return /* @__PURE__ */ e.createElement(
-    h,
+    d,
     {
       style: { maxWidth: "576px" },
-      title: n.toLanguageString(x, i.pieChart),
-      expanded: r,
+      title: n.toLanguageString(u, i.pieChart),
+      expanded: o,
       tabIndex: 0,
       onAction: p
     },
-    /* @__PURE__ */ e.createElement(l, null, r && /* @__PURE__ */ e.createElement(C, null, /* @__PURE__ */ e.createElement(g, null, /* @__PURE__ */ e.createElement(
+    /* @__PURE__ */ e.createElement(h, null, /* @__PURE__ */ e.createElement(g, null, /* @__PURE__ */ e.createElement(
       S,
       {
-        selected: o === "pie",
-        onClick: m,
-        icon: E,
+        selected: r === "pie",
+        onClick: c,
+        icon: f,
         iconName: "chart-pie"
       },
-      n.toLanguageString(f, i.pieChartPie)
-    ))))
+      n.toLanguageString(x, i.pieChartPie)
+    )))
   );
 };
 export {
-  R as PieChartPanel
+  A as PieChartPanel
 };

package/components/panels/ScatterChartPanel.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 p=require("react"),g=require("@progress/kendo-react-animation"),m=require("@progress/kendo-react-intl"),o=require("@progress/kendo-react-layout"),i=require("../../utils.js"),c=require("../../messages.js"),y=require("../SeriesTypesWrap.js"),h=require("../SeriesTypeButton.js"),C=require("@progress/kendo-svg-icons");function b(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,r.get?r:{enumerable:!0,get:()=>e[t]})}}return n.default=e,Object.freeze(n)}const a=b(p),f=e=>{const n=m.useLocalization(),t=e.state,r=t.seriesType,[s,l]=a.useState(!0),u=a.useCallback(d=>{l(!d.expanded)},[]),S=()=>{e.onStateChange(i.mergeStates(t,i.createState(t.data,"scatter")))};return a.createElement(o.ExpansionPanel,{style:{maxWidth:"576px"},title:n.toLanguageString(c.scatterChart,c.messages.scatterChart),expanded:s,tabIndex:0,onAction:u},a.createElement(g.Reveal,null,s&&a.createElement(o.ExpansionPanelContent,null,a.createElement(y.SeriesTypesWrap,null,a.createElement(h.SeriesTypeButton,{selected:r==="scatter",onClick:S,icon:C.chartScatterIcon,iconName:"chart-scatter"},n.toLanguageString(c.scatterChartScatter,c.messages.scatterChartScatter))))))};exports.ScatterChartPanel=f;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("react"),g=require("@progress/kendo-react-intl"),s=require("@progress/kendo-react-layout"),o=require("../../utils.js"),c=require("../../messages.js"),m=require("../SeriesTypesWrap.js"),y=require("../SeriesTypeButton.js"),h=require("@progress/kendo-svg-icons");function C(e){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const n=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(a,t,n.get?n:{enumerable:!0,get:()=>e[t]})}}return a.default=e,Object.freeze(a)}const r=C(p),b=e=>{const a=g.useLocalization(),t=e.state,n=t.seriesType,[i,l]=r.useState(!0),u=r.useCallback(d=>{l(!d.expanded)},[]),S=()=>{e.onStateChange(o.mergeStates(t,o.createState(t.data,"scatter")))};return r.createElement(s.ExpansionPanel,{style:{maxWidth:"576px"},title:a.toLanguageString(c.scatterChart,c.messages.scatterChart),expanded:i,tabIndex:0,onAction:u},r.createElement(s.ExpansionPanelContent,null,r.createElement(m.SeriesTypesWrap,null,r.createElement(y.SeriesTypeButton,{selected:n==="scatter",onClick:S,icon:h.chartScatterIcon,iconName:"chart-scatter"},a.toLanguageString(c.scatterChartScatter,c.messages.scatterChartScatter)))))};exports.ScatterChartPanel=b;

package/components/panels/ScatterChartPanel.mjs

@@ -6,41 +6,40 @@
  *-------------------------------------------------------------------------------------------
  */
 import * as t from "react";
-import { Reveal as p } from "@progress/kendo-react-animation";
-import { useLocalization as S } from "@progress/kendo-react-intl";
-import { ExpansionPanel as d, ExpansionPanelContent as h } from "@progress/kendo-react-layout";
-import { mergeStates as C, createState as u } from "../../utils.mjs";
-import { scatterChart as x, messages as o, scatterChartScatter as f } from "../../messages.mjs";
+import { useLocalization as p } from "@progress/kendo-react-intl";
+import { ExpansionPanel as S, ExpansionPanelContent as d } from "@progress/kendo-react-layout";
+import { mergeStates as h, createState as C } from "../../utils.mjs";
+import { scatterChart as u, messages as n, scatterChartScatter as x } from "../../messages.mjs";
 import { SeriesTypesWrap as g } from "../SeriesTypesWrap.mjs";
-import { SeriesTypeButton as E } from "../SeriesTypeButton.mjs";
-import { chartScatterIcon as y } from "@progress/kendo-svg-icons";
-const R = (a) => {
-  const r = S(), e = a.state, c = e.seriesType, [n, s] = t.useState(!0), i = t.useCallback((l) => {
+import { SeriesTypeButton as f } from "../SeriesTypeButton.mjs";
+import { chartScatterIcon as E } from "@progress/kendo-svg-icons";
+const A = (a) => {
+  const r = p(), e = a.state, o = e.seriesType, [c, s] = t.useState(!0), i = t.useCallback((l) => {
     s(!l.expanded);
   }, []), m = () => {
-    a.onStateChange(C(e, u(e.data, "scatter")));
+    a.onStateChange(h(e, C(e.data, "scatter")));
   };
   return /* @__PURE__ */ t.createElement(
-    d,
+    S,
     {
       style: { maxWidth: "576px" },
-      title: r.toLanguageString(x, o.scatterChart),
-      expanded: n,
+      title: r.toLanguageString(u, n.scatterChart),
+      expanded: c,
       tabIndex: 0,
       onAction: i
     },
-    /* @__PURE__ */ t.createElement(p, null, n && /* @__PURE__ */ t.createElement(h, null, /* @__PURE__ */ t.createElement(g, null, /* @__PURE__ */ t.createElement(
-      E,
+    /* @__PURE__ */ t.createElement(d, null, /* @__PURE__ */ t.createElement(g, null, /* @__PURE__ */ t.createElement(
+      f,
       {
-        selected: c === "scatter",
+        selected: o === "scatter",
         onClick: m,
-        icon: y,
+        icon: E,
         iconName: "chart-scatter"
       },
-      r.toLanguageString(f, o.scatterChartScatter)
-    ))))
+      r.toLanguageString(x, n.scatterChartScatter)
+    )))
   );
 };
 export {
-  R as ScatterChartPanel
+  A as ScatterChartPanel
 };

package/components/panels/SeriesPanel.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 F=require("react"),C=require("@progress/kendo-react-layout"),q=require("@progress/kendo-react-form"),d=require("../FormField.js"),v=require("@progress/kendo-react-inputs"),l=require("../../utils.js"),n=require("../../messages.js"),P=require("@progress/kendo-react-intl"),T=require("@progress/kendo-react-dropdowns"),w=require("@progress/kendo-react-animation");function R(o){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(o){for(const i in o)if(i!=="default"){const r=Object.getOwnPropertyDescriptor(o,i);Object.defineProperty(t,i,r.get?r:{enumerable:!0,get:()=>o[i]})}}return t.default=o,Object.freeze(t)}const a=R(F),D=o=>{var g,p,f,b,y;const[t,i]=a.useState(""),r=P.useLocalization(),s=o.state,u=s.seriesType,E=typeof((g=s.series[0])==null?void 0:g.stack)=="object"?(p=s.series[0])==null?void 0:p.stack.type:!1,[S,h]=a.useState(!1),k=a.useCallback(e=>{h(!e.expanded)},[]),x=e=>{t&&o.onStateChange(l.updateState(s,l.ActionTypes.seriesColor,{seriesName:t,color:e.value}))},L=e=>{o.onStateChange(l.updateState(s,l.ActionTypes.seriesLabel,{seriesName:t,all:!t,visible:e.value}))},m={name:r.toLanguageString(n.formatSeriesAllSeries,n.messages.formatSeriesAllSeries)},A=e=>{const c=e.target.value.name;i(c===m.name?"":c)};return a.useEffect(()=>{i("")},[u,E]),a.createElement(C.ExpansionPanel,{style:{maxWidth:"576px"},title:r.toLanguageString(n.formatSeries,n.messages.formatSeries),expanded:S,tabIndex:0,onAction:k},a.createElement(w.Reveal,null,S&&a.createElement(C.ExpansionPanelContent,null,a.createElement(q.FormElement,{onKeyDown:l.stopPropagation},a.createElement(d.FormField,{editorId:"apply-to-series",labelText:r.toLanguageString(n.formatSeriesApplyTo,n.messages.formatSeriesApplyTo)},a.createElement(T.DropDownList,{id:"apply-to-series",data:s.series,textField:"name",dataItemKey:"name",defaultItem:m,disabled:!l.isCategorical(u),value:s.series.find(e=>e.name===t)||m,onChange:A,...l.dropdownlistCommonProps})),a.createElement(d.FormField,{editorId:"seriesColor",labelText:r.toLanguageString(n.formatSeriesColor,n.messages.formatSeriesColor)},a.createElement(v.ColorPicker,{id:"seriesColor",value:t?(f=s.series.find(e=>e.name===t))==null?void 0:f.color:"",onChange:x,disabled:!t,view:"gradient",fillMode:"outline"})),a.createElement(d.FormField,null,a.createElement(v.Checkbox,{label:r.toLanguageString(n.formatSeriesShowLabels,n.messages.formatSeriesShowLabels),checked:t?(y=(b=s.series.find(e=>e.name===t))==null?void 0:b.labels)==null?void 0:y.visible:s.series.every(e=>{var c;return(c=e.labels)==null?void 0:c.visible}),onChange:L}))))))};exports.SeriesPanel=D;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const A=require("react"),y=require("@progress/kendo-react-layout"),P=require("@progress/kendo-react-form"),d=require("../FormField.js"),C=require("@progress/kendo-react-inputs"),l=require("../../utils.js"),o=require("../../messages.js"),T=require("@progress/kendo-react-intl"),q=require("@progress/kendo-react-dropdowns");function w(n){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const i in n)if(i!=="default"){const r=Object.getOwnPropertyDescriptor(n,i);Object.defineProperty(t,i,r.get?r:{enumerable:!0,get:()=>n[i]})}}return t.default=n,Object.freeze(t)}const a=w(A),D=n=>{var S,g,p,f,b;const[t,i]=a.useState(""),r=T.useLocalization(),s=n.state,u=s.seriesType,v=typeof((S=s.series[0])==null?void 0:S.stack)=="object"?(g=s.series[0])==null?void 0:g.stack.type:!1,[h,E]=a.useState(!1),k=a.useCallback(e=>{E(!e.expanded)},[]),x=e=>{t&&n.onStateChange(l.updateState(s,l.ActionTypes.seriesColor,{seriesName:t,color:e.value}))},L=e=>{n.onStateChange(l.updateState(s,l.ActionTypes.seriesLabel,{seriesName:t,all:!t,visible:e.value}))},m={name:r.toLanguageString(o.formatSeriesAllSeries,o.messages.formatSeriesAllSeries)},F=e=>{const c=e.target.value.name;i(c===m.name?"":c)};return a.useEffect(()=>{i("")},[u,v]),a.createElement(y.ExpansionPanel,{style:{maxWidth:"576px"},title:r.toLanguageString(o.formatSeries,o.messages.formatSeries),expanded:h,tabIndex:0,onAction:k},a.createElement(y.ExpansionPanelContent,null,a.createElement(P.FormElement,{onKeyDown:l.stopPropagation},a.createElement(d.FormField,{editorId:"apply-to-series",labelText:r.toLanguageString(o.formatSeriesApplyTo,o.messages.formatSeriesApplyTo)},a.createElement(q.DropDownList,{id:"apply-to-series",data:s.series,textField:"name",dataItemKey:"name",defaultItem:m,disabled:!l.isCategorical(u),value:s.series.find(e=>e.name===t)||m,onChange:F,...l.dropdownlistCommonProps})),a.createElement(d.FormField,{editorId:"seriesColor",labelText:r.toLanguageString(o.formatSeriesColor,o.messages.formatSeriesColor)},a.createElement(C.ColorPicker,{id:"seriesColor",value:t?(p=s.series.find(e=>e.name===t))==null?void 0:p.color:"",onChange:x,disabled:!t,view:"gradient",fillMode:"outline"})),a.createElement(d.FormField,null,a.createElement(C.Checkbox,{label:r.toLanguageString(o.formatSeriesShowLabels,o.messages.formatSeriesShowLabels),checked:t?(b=(f=s.series.find(e=>e.name===t))==null?void 0:f.labels)==null?void 0:b.visible:s.series.every(e=>{var c;return(c=e.labels)==null?void 0:c.visible}),onChange:L})))))};exports.SeriesPanel=D;

package/components/panels/SeriesPanel.mjs

@@ -10,22 +10,21 @@ import { ExpansionPanel as k, ExpansionPanelContent as w } from "@progress/kendo
 import { FormElement as T } from "@progress/kendo-react-form";
 import { FormField as m } from "../FormField.mjs";
 import { ColorPicker as P, Checkbox as I } from "@progress/kendo-react-inputs";
-import { stopPropagation as D, dropdownlistCommonProps as F, isCategorical as z, updateState as b, ActionTypes as v } from "../../utils.mjs";
-import { formatSeriesAllSeries as K, messages as i, formatSeries as N, formatSeriesApplyTo as R, formatSeriesColor as j, formatSeriesShowLabels as M } from "../../messages.mjs";
+import { stopPropagation as D, dropdownlistCommonProps as F, isCategorical as z, updateState as C, ActionTypes as b } from "../../utils.mjs";
+import { formatSeriesAllSeries as K, messages as i, formatSeries as N, formatSeriesApplyTo as j, formatSeriesColor as M, formatSeriesShowLabels as R } from "../../messages.mjs";
 import { useLocalization as W } from "@progress/kendo-react-intl";
 import { DropDownList as q } from "@progress/kendo-react-dropdowns";
-import { Reveal as B } from "@progress/kendo-react-animation";
-const Z = (n) => {
-  var p, f, g, u, C;
-  const [a, c] = t.useState(""), r = W(), o = n.state, S = o.seriesType, E = typeof ((p = o.series[0]) == null ? void 0 : p.stack) == "object" ? (f = o.series[0]) == null ? void 0 : f.stack.type : !1, [d, h] = t.useState(!1), x = t.useCallback((e) => {
-    h(!e.expanded);
+const X = (n) => {
+  var d, p, f, g, u;
+  const [a, c] = t.useState(""), r = W(), o = n.state, S = o.seriesType, h = typeof ((d = o.series[0]) == null ? void 0 : d.stack) == "object" ? (p = o.series[0]) == null ? void 0 : p.stack.type : !1, [v, x] = t.useState(!1), E = t.useCallback((e) => {
+    x(!e.expanded);
   }, []), y = (e) => {
     a && n.onStateChange(
-      b(o, v.seriesColor, { seriesName: a, color: e.value })
+      C(o, b.seriesColor, { seriesName: a, color: e.value })
     );
   }, L = (e) => {
     n.onStateChange(
-      b(o, v.seriesLabel, {
+      C(o, b.seriesLabel, {
         seriesName: a,
         all: !a,
         visible: e.value
@@ -39,23 +38,20 @@ const Z = (n) => {
   };
   return t.useEffect(() => {
     c("");
-  }, [S, E]), /* @__PURE__ */ t.createElement(
+  }, [S, h]), /* @__PURE__ */ t.createElement(
     k,
     {
       style: { maxWidth: "576px" },
       title: r.toLanguageString(N, i.formatSeries),
-      expanded: d,
+      expanded: v,
       tabIndex: 0,
-      onAction: x
+      onAction: E
     },
-    /* @__PURE__ */ t.createElement(B, null, d && /* @__PURE__ */ t.createElement(w, null, /* @__PURE__ */ t.createElement(T, { onKeyDown: D }, /* @__PURE__ */ t.createElement(
+    /* @__PURE__ */ t.createElement(w, null, /* @__PURE__ */ t.createElement(T, { onKeyDown: D }, /* @__PURE__ */ t.createElement(
       m,
       {
         editorId: "apply-to-series",
-        labelText: r.toLanguageString(
-          R,
-          i.formatSeriesApplyTo
-        )
+        labelText: r.toLanguageString(j, i.formatSeriesApplyTo)
       },
       /* @__PURE__ */ t.createElement(
         q,
@@ -75,13 +71,13 @@ const Z = (n) => {
       m,
       {
         editorId: "seriesColor",
-        labelText: r.toLanguageString(j, i.formatSeriesColor)
+        labelText: r.toLanguageString(M, i.formatSeriesColor)
       },
       /* @__PURE__ */ t.createElement(
         P,
         {
           id: "seriesColor",
-          value: a ? (g = o.series.find((e) => e.name === a)) == null ? void 0 : g.color : "",
+          value: a ? (f = o.series.find((e) => e.name === a)) == null ? void 0 : f.color : "",
           onChange: y,
           disabled: !a,
           view: "gradient",
@@ -92,18 +88,18 @@ const Z = (n) => {
       I,
       {
         label: r.toLanguageString(
-          M,
+          R,
           i.formatSeriesShowLabels
         ),
-        checked: a ? (C = (u = o.series.find((e) => e.name === a)) == null ? void 0 : u.labels) == null ? void 0 : C.visible : o.series.every((e) => {
+        checked: a ? (u = (g = o.series.find((e) => e.name === a)) == null ? void 0 : g.labels) == null ? void 0 : u.visible : o.series.every((e) => {
           var s;
           return (s = e.labels) == null ? void 0 : s.visible;
         }),
         onChange: L
       }
-    )))))
+    ))))
   );
 };
 export {
-  Z as SeriesPanel
+  X as SeriesPanel
 };

package/components/panels/TitlePanel.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 E=require("react"),p=require("@progress/kendo-react-layout"),k=require("@progress/kendo-react-form"),m=require("../FormField.js"),e=require("../../utils.js"),T=require("@progress/kendo-react-dropdowns"),f=require("@progress/kendo-react-inputs"),z=require("@progress/kendo-react-intl"),t=require("../../messages.js"),I=require("@progress/kendo-react-animation");function P(n){const l=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const i in n)if(i!=="default"){const u=Object.getOwnPropertyDescriptor(n,i);Object.defineProperty(l,i,u.get?u:{enumerable:!0,get:()=>n[i]})}}return l.default=n,Object.freeze(l)}const a=P(E),A=n=>{const l=z.useLocalization(),i=n.state,[u,v]=a.useState(!1),S=a.useCallback(o=>{v(!o.expanded)},[]),r=[{value:"chartTitle",text:l.toLanguageString(t.formatTitleChartTitle,t.messages.formatTitleChartTitle)},{value:"chartSubtitle",text:l.toLanguageString(t.formatTitleChartSubtitle,t.messages.formatTitleChartSubtitle)}],[s,C]=a.useState(r[0]),x=a.useCallback(o=>{C(o.target.value)},[]),F=o=>{const c=s.value===r[0].value?e.ActionTypes.titleText:e.ActionTypes.subtitleText;n.onStateChange(e.updateState(i,c,o.target.value))},b=o=>{const c=s.value===r[0].value?e.ActionTypes.titleFontName:e.ActionTypes.subtitleFontName,g=o.target.value||e.nullItem;n.onStateChange(e.updateState(i,c,g.value))},h=o=>{const c=s.value===r[0].value?e.ActionTypes.titleFontSize:e.ActionTypes.subtitleFontSize,g=o.target.value||e.nullItem;e.ensureValue(g)&&n.onStateChange(e.updateState(i,c,g.value))},y=o=>{const c=s.value===r[0].value?e.ActionTypes.titleColor:e.ActionTypes.subtitleColor;n.onStateChange(e.updateState(i,c,o.value))},d=(s.value===r[0].value?i.title:i.subtitle)||{text:"",font:"",color:""};return a.createElement(p.ExpansionPanel,{style:{maxWidth:"576px"},title:l.toLanguageString(t.formatTitle,t.messages.formatTitle),expanded:u,tabIndex:0,onAction:S},a.createElement(I.Reveal,null,u&&a.createElement(p.ExpansionPanelContent,null,a.createElement(k.FormElement,{onKeyDown:e.stopPropagation},a.createElement("div",{className:"k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4"},a.createElement(m.FormField,{className:"k-col-span-2",editorId:"apply-to-title",labelText:l.toLanguageString(t.formatTitleApplyTo,t.messages.formatTitleApplyTo)},a.createElement(T.DropDownList,{id:"apply-to-title",data:r,textField:"text",dataItemKey:"value",value:r.find(o=>o.value===s.value),onChange:x,...e.dropdownlistCommonProps})),a.createElement(m.FormField,{className:"k-col-span-2",editorId:"titleText",labelText:l.toLanguageString(t.formatTitleLabel,t.messages.formatTitleLabel)},a.createElement(f.Input,{id:"titleText",placeholder:s.value===r[0].value?r[0].text:r[1].text,value:d.text,onChange:F})),a.createElement(m.FormField,{className:"k-col-span-2",editorId:"titleFont",labelText:l.toLanguageString(t.formatTitleFont,t.messages.formatTitleFont)},a.createElement(T.ComboBox,{id:"titleFont",data:e.fontNames,textField:"text",dataItemKey:"value",placeholder:l.toLanguageString(t.formatTitleFontPlaceholder,t.messages.formatTitleFontPlaceholder),value:e.fontNames.find(o=>o.value===e.parseFont(d.font).name)||e.nullItem,onChange:b,itemRender:e.itemRender,...e.dropdownlistCommonProps})),a.createElement(m.FormField,{editorId:"titleFontSize",labelText:l.toLanguageString(t.formatTitleSize,t.messages.formatTitleSize)},a.createElement(T.ComboBox,{id:"titleFontSize",data:e.fontSizes,textField:"text",dataItemKey:"value",placeholder:l.toLanguageString(t.formatTitleSizePlaceholder,t.messages.formatTitleSizePlaceholder),value:e.fontSizes.find(o=>o.value===e.parseFont(d.font).size)||e.nullItem,onChange:h,itemRender:e.itemRender,allowCustom:!0,...e.dropdownlistCommonProps})),a.createElement(m.FormField,{editorId:"titleColor",labelText:l.toLanguageString(t.formatTitleColor,t.messages.formatTitleColor)},a.createElement(f.ColorPicker,{id:"titleColor",value:d.color||"",onChange:y,view:"gradient",fillMode:"outline"})))))))};exports.TitlePanel=A;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const E=require("react"),p=require("@progress/kendo-react-layout"),k=require("@progress/kendo-react-form"),u=require("../FormField.js"),e=require("../../utils.js"),T=require("@progress/kendo-react-dropdowns"),f=require("@progress/kendo-react-inputs"),z=require("@progress/kendo-react-intl"),t=require("../../messages.js");function I(n){const l=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const i in n)if(i!=="default"){const m=Object.getOwnPropertyDescriptor(n,i);Object.defineProperty(l,i,m.get?m:{enumerable:!0,get:()=>n[i]})}}return l.default=n,Object.freeze(l)}const a=I(E),P=n=>{const l=z.useLocalization(),i=n.state,[m,v]=a.useState(!1),S=a.useCallback(o=>{v(!o.expanded)},[]),r=[{value:"chartTitle",text:l.toLanguageString(t.formatTitleChartTitle,t.messages.formatTitleChartTitle)},{value:"chartSubtitle",text:l.toLanguageString(t.formatTitleChartSubtitle,t.messages.formatTitleChartSubtitle)}],[s,C]=a.useState(r[0]),x=a.useCallback(o=>{C(o.target.value)},[]),F=o=>{const c=s.value===r[0].value?e.ActionTypes.titleText:e.ActionTypes.subtitleText;n.onStateChange(e.updateState(i,c,o.target.value))},b=o=>{const c=s.value===r[0].value?e.ActionTypes.titleFontName:e.ActionTypes.subtitleFontName,g=o.target.value||e.nullItem;n.onStateChange(e.updateState(i,c,g.value))},h=o=>{const c=s.value===r[0].value?e.ActionTypes.titleFontSize:e.ActionTypes.subtitleFontSize,g=o.target.value||e.nullItem;e.ensureValue(g)&&n.onStateChange(e.updateState(i,c,g.value))},y=o=>{const c=s.value===r[0].value?e.ActionTypes.titleColor:e.ActionTypes.subtitleColor;n.onStateChange(e.updateState(i,c,o.value))},d=(s.value===r[0].value?i.title:i.subtitle)||{text:"",font:"",color:""};return a.createElement(p.ExpansionPanel,{style:{maxWidth:"576px"},title:l.toLanguageString(t.formatTitle,t.messages.formatTitle),expanded:m,tabIndex:0,onAction:S},a.createElement(p.ExpansionPanelContent,null,a.createElement(k.FormElement,{onKeyDown:e.stopPropagation},a.createElement("div",{className:"k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4"},a.createElement(u.FormField,{className:"k-col-span-2",editorId:"apply-to-title",labelText:l.toLanguageString(t.formatTitleApplyTo,t.messages.formatTitleApplyTo)},a.createElement(T.DropDownList,{id:"apply-to-title",data:r,textField:"text",dataItemKey:"value",value:r.find(o=>o.value===s.value),onChange:x,...e.dropdownlistCommonProps})),a.createElement(u.FormField,{className:"k-col-span-2",editorId:"titleText",labelText:l.toLanguageString(t.formatTitleLabel,t.messages.formatTitleLabel)},a.createElement(f.Input,{id:"titleText",placeholder:s.value===r[0].value?r[0].text:r[1].text,value:d.text,onChange:F})),a.createElement(u.FormField,{className:"k-col-span-2",editorId:"titleFont",labelText:l.toLanguageString(t.formatTitleFont,t.messages.formatTitleFont)},a.createElement(T.ComboBox,{id:"titleFont",data:e.fontNames,textField:"text",dataItemKey:"value",placeholder:l.toLanguageString(t.formatTitleFontPlaceholder,t.messages.formatTitleFontPlaceholder),value:e.fontNames.find(o=>o.value===e.parseFont(d.font).name)||e.nullItem,onChange:b,itemRender:e.itemRender,...e.dropdownlistCommonProps})),a.createElement(u.FormField,{editorId:"titleFontSize",labelText:l.toLanguageString(t.formatTitleSize,t.messages.formatTitleSize)},a.createElement(T.ComboBox,{id:"titleFontSize",data:e.fontSizes,textField:"text",dataItemKey:"value",placeholder:l.toLanguageString(t.formatTitleSizePlaceholder,t.messages.formatTitleSizePlaceholder),value:e.fontSizes.find(o=>o.value===e.parseFont(d.font).size)||e.nullItem,onChange:h,itemRender:e.itemRender,allowCustom:!0,...e.dropdownlistCommonProps})),a.createElement(u.FormField,{editorId:"titleColor",labelText:l.toLanguageString(t.formatTitleColor,t.messages.formatTitleColor)},a.createElement(f.ColorPicker,{id:"titleColor",value:d.color||"",onChange:y,view:"gradient",fillMode:"outline"}))))))};exports.TitlePanel=P;

package/components/panels/TitlePanel.mjs

@@ -9,14 +9,13 @@ import * as t from "react";
 import { ExpansionPanel as P, ExpansionPanelContent as N } from "@progress/kendo-react-layout";
 import { FormElement as A } from "@progress/kendo-react-form";
 import { FormField as u } from "../FormField.mjs";
-import { stopPropagation as w, dropdownlistCommonProps as f, itemRender as p, nullItem as g, fontNames as x, parseFont as C, fontSizes as S, ActionTypes as n, updateState as T, ensureValue as K } from "../../utils.mjs";
-import { DropDownList as D, ComboBox as h } from "@progress/kendo-react-dropdowns";
+import { stopPropagation as w, dropdownlistCommonProps as f, itemRender as v, nullItem as g, fontNames as x, parseFont as p, fontSizes as C, ActionTypes as n, updateState as T, ensureValue as K } from "../../utils.mjs";
+import { DropDownList as D, ComboBox as S } from "@progress/kendo-react-dropdowns";
 import { Input as R, ColorPicker as B } from "@progress/kendo-react-inputs";
 import { useLocalization as M } from "@progress/kendo-react-intl";
 import { formatTitleChartTitle as V, messages as o, formatTitleChartSubtitle as W, formatTitle as j, formatTitleApplyTo as q, formatTitleLabel as G, formatTitleFont as H, formatTitleFontPlaceholder as J, formatTitleSize as O, formatTitleSizePlaceholder as Q, formatTitleColor as U } from "../../messages.mjs";
-import { Reveal as X } from "@progress/kendo-react-animation";
-const nt = (c) => {
-  const l = M(), m = c.state, [v, F] = t.useState(!1), b = t.useCallback((e) => {
+const lt = (c) => {
+  const l = M(), m = c.state, [h, F] = t.useState(!1), b = t.useCallback((e) => {
     F(!e.expanded);
   }, []), a = [
     {
@@ -51,19 +50,16 @@ const nt = (c) => {
     {
       style: { maxWidth: "576px" },
       title: l.toLanguageString(j, o.formatTitle),
-      expanded: v,
+      expanded: h,
       tabIndex: 0,
       onAction: b
     },
-    /* @__PURE__ */ t.createElement(X, null, v && /* @__PURE__ */ t.createElement(N, null, /* @__PURE__ */ t.createElement(A, { onKeyDown: w }, /* @__PURE__ */ t.createElement("div", { className: "k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4" }, /* @__PURE__ */ t.createElement(
+    /* @__PURE__ */ t.createElement(N, null, /* @__PURE__ */ t.createElement(A, { onKeyDown: w }, /* @__PURE__ */ t.createElement("div", { className: "k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4" }, /* @__PURE__ */ t.createElement(
       u,
       {
         className: "k-col-span-2",
         editorId: "apply-to-title",
-        labelText: l.toLanguageString(
-          q,
-          o.formatTitleApplyTo
-        )
+        labelText: l.toLanguageString(q, o.formatTitleApplyTo)
       },
       /* @__PURE__ */ t.createElement(
         D,
@@ -82,10 +78,7 @@ const nt = (c) => {
       {
         className: "k-col-span-2",
         editorId: "titleText",
-        labelText: l.toLanguageString(
-          G,
-          o.formatTitleLabel
-        )
+        labelText: l.toLanguageString(G, o.formatTitleLabel)
       },
       /* @__PURE__ */ t.createElement(
         R,
@@ -104,7 +97,7 @@ const nt = (c) => {
         labelText: l.toLanguageString(H, o.formatTitleFont)
       },
       /* @__PURE__ */ t.createElement(
-        h,
+        S,
         {
           id: "titleFont",
           data: x,
@@ -114,9 +107,9 @@ const nt = (c) => {
             J,
             o.formatTitleFontPlaceholder
           ),
-          value: x.find((e) => e.value === C(s.font).name) || g,
+          value: x.find((e) => e.value === p(s.font).name) || g,
           onChange: y,
-          itemRender: p,
+          itemRender: v,
           ...f
         }
       )
@@ -127,19 +120,19 @@ const nt = (c) => {
         labelText: l.toLanguageString(O, o.formatTitleSize)
       },
       /* @__PURE__ */ t.createElement(
-        h,
+        S,
         {
           id: "titleFontSize",
-          data: S,
+          data: C,
           textField: "text",
           dataItemKey: "value",
           placeholder: l.toLanguageString(
             Q,
             o.formatTitleSizePlaceholder
           ),
-          value: S.find((e) => e.value === C(s.font).size) || g,
+          value: C.find((e) => e.value === p(s.font).size) || g,
           onChange: I,
-          itemRender: p,
+          itemRender: v,
           allowCustom: !0,
           ...f
         }
@@ -148,10 +141,7 @@ const nt = (c) => {
       u,
       {
         editorId: "titleColor",
-        labelText: l.toLanguageString(
-          U,
-          o.formatTitleColor
-        )
+        labelText: l.toLanguageString(U, o.formatTitleColor)
       },
       /* @__PURE__ */ t.createElement(
         B,
@@ -163,9 +153,9 @@ const nt = (c) => {
           fillMode: "outline"
         }
       )
-    )))))
+    ))))
   );
 };
 export {
-  nt as TitlePanel
+  lt as TitlePanel
 };

package/components/panels/ValueAxisPanel.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 j=require("react"),E=require("@progress/kendo-react-layout"),B=require("@progress/kendo-react-form"),y=require("../FormFieldSet.js"),m=require("../FormField.js"),x=require("@progress/kendo-react-inputs"),e=require("../../utils.js"),a=require("../../messages.js"),M=require("@progress/kendo-react-intl"),_=require("@progress/kendo-react-animation"),g=require("@progress/kendo-react-dropdowns");function Y(i){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(i){for(const s in i)if(s!=="default"){const d=Object.getOwnPropertyDescriptor(i,s);Object.defineProperty(o,s,d.get?d:{enumerable:!0,get:()=>i[s]})}}return o.default=i,Object.freeze(o)}const l=Y(j),W=i=>{var v,b,F,L,S,V,C,T,p,h;const o=M.useLocalization(),s=i.state,d=s.seriesType,c={text:o.toLanguageString(a.formatValueAxisLabelsFormatText,a.messages.formatValueAxisLabelsFormatText),value:""},A=[{value:"n0",text:o.toLanguageString(a.formatValueAxisLabelsFormatNumber,a.messages.formatValueAxisLabelsFormatNumber)},{value:"c0",text:o.toLanguageString(a.formatValueAxisLabelsFormatCurrency,a.messages.formatValueAxisLabelsFormatCurrency)},{value:"p0",text:o.toLanguageString(a.formatValueAxisLabelsFormatPercent,a.messages.formatValueAxisLabelsFormatPercent)}],[f,z]=l.useState(!1),P=l.useCallback(t=>{z(!t.expanded)},[]),I=t=>{i.onStateChange(e.updateState(s,e.ActionTypes.valueAxisTitleText,t.target.value))},k=t=>{const n=t.target.value||e.nullItem;e.ensureValue(n)&&i.onStateChange(e.updateState(s,e.ActionTypes.valueAxisTitleFontSize,n.value))},R=t=>{const n=t.target.value||e.nullItem;i.onStateChange(e.updateState(s,e.ActionTypes.valueAxisTitleFontName,n.value))},N=t=>{i.onStateChange(e.updateState(s,e.ActionTypes.valueAxisTitleColor,t.value))},w=t=>{const n=t.target.value||e.nullItem;e.ensureValue(n)&&i.onStateChange(e.updateState(s,e.ActionTypes.valueAxisLabelsFontSize,n.value))},q=t=>{const n=t.target.value||e.nullItem;i.onStateChange(e.updateState(s,e.ActionTypes.valueAxisLabelsFontName,n.value))},D=t=>{i.onStateChange(e.updateState(s,e.ActionTypes.valueAxisLabelsColor,t.value))},K=t=>{i.onStateChange(e.updateState(s,e.ActionTypes.valueAxisLabelsRotation,t.target.value))},O=t=>{const n=t.target.value;i.onStateChange(e.updateState(s,e.ActionTypes.valueAxisLabelsFormat,n.value))};return l.createElement(E.ExpansionPanel,{style:{maxWidth:"576px"},title:d==="scatter"?o.toLanguageString(a.formatYAxis,a.messages.formatYAxis):o.toLanguageString(a.formatValueAxis,a.messages.formatValueAxis),expanded:f,tabIndex:0,onAction:P},l.createElement(_.Reveal,null,f&&l.createElement(E.ExpansionPanelContent,null,l.createElement(B.FormElement,{onKeyDown:e.stopPropagation},l.createElement(y.FormFieldSet,{legend:o.toLanguageString(a.formatValueAxisTitle,a.messages.formatValueAxisTitle)},l.createElement("div",{className:"k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4"},l.createElement(m.FormField,{className:"k-col-span-2"},l.createElement(x.Input,{placeholder:o.toLanguageString(a.formatValueAxisTitlePlaceholder,a.messages.formatValueAxisTitlePlaceholder),value:((b=(v=s.valueAxis[0])==null?void 0:v.title)==null?void 0:b.text)||"",onChange:I})),l.createElement(m.FormField,{className:"k-col-span-2",editorId:"valueAxisTitleFont",labelText:o.toLanguageString(a.formatValueAxisTitleFont,a.messages.formatValueAxisTitleFont)},l.createElement(g.ComboBox,{id:"valueAxisTitleFont",data:e.fontNames,textField:"text",dataItemKey:"value",itemRender:e.itemRender,placeholder:o.toLanguageString(a.formatValueAxisTitleFontPlaceholder,a.messages.formatValueAxisTitleFontPlaceholder),value:e.fontNames.find(t=>{var n,r,u;return t.value===((u=e.parseFont(((r=(n=s.valueAxis[0])==null?void 0:n.title)==null?void 0:r.font)||""))==null?void 0:u.name)})||e.nullItem,onChange:R,...e.dropdownlistCommonProps})),l.createElement(m.FormField,{editorId:"valueAxisTitleFontSize",labelText:o.toLanguageString(a.formatValueAxisTitleSize,a.messages.formatValueAxisTitleSize)},l.createElement(g.ComboBox,{id:"valueAxisTitleFontSize",data:e.fontSizes,textField:"text",dataItemKey:"value",placeholder:o.toLanguageString(a.formatValueAxisTitleSizePlaceholder,a.messages.formatValueAxisTitleSizePlaceholder),value:e.fontSizes.find(t=>{var n,r,u;return t.value===((u=e.parseFont(((r=(n=s.valueAxis[0])==null?void 0:n.title)==null?void 0:r.font)||""))==null?void 0:u.size)})||e.nullItem,onChange:k,allowCustom:!0,...e.dropdownlistCommonProps})),l.createElement(m.FormField,{editorId:"valueAxisTitleColor",labelText:o.toLanguageString(a.formatValueAxisTitleColor,a.messages.formatValueAxisTitleColor)},l.createElement(x.ColorPicker,{id:"valueAxisTitleColor",view:"gradient",value:((L=(F=s.valueAxis[0])==null?void 0:F.title)==null?void 0:L.color)||"",onChange:N,fillMode:"outline"})))),l.createElement(y.FormFieldSet,{legend:o.toLanguageString(a.formatValueAxisLabels,a.messages.formatValueAxisLabels)},l.createElement("div",{className:"k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4"},l.createElement(m.FormField,{className:"k-col-span-2",editorId:"valueAxisLabelsFormat",labelText:o.toLanguageString(a.formatValueAxisLabelsFormat,a.messages.formatValueAxisLabelsFormat)},l.createElement(g.DropDownList,{id:"valueAxisLabelsFormat",data:A,textField:"text",dataItemKey:"value",defaultItem:c,value:A.find(t=>{var n,r;return t.value===((r=(n=s.valueAxis[0])==null?void 0:n.labels)==null?void 0:r.format)})||c,onChange:O,...e.dropdownlistCommonProps})),l.createElement(m.FormField,{className:"k-col-span-2",editorId:"valueAxisLabelsFont",labelText:o.toLanguageString(a.formatValueAxisLabelsFont,a.messages.formatValueAxisLabelsFont)},l.createElement(g.ComboBox,{id:"valueAxisLabelsFont",data:e.fontNames,textField:"text",dataItemKey:"value",placeholder:o.toLanguageString(a.formatValueAxisLabelsFontPlaceholder,a.messages.formatValueAxisLabelsFontPlaceholder),value:e.fontNames.find(t=>{var n,r,u;return t.value===((u=e.parseFont(((r=(n=s.valueAxis[0])==null?void 0:n.labels)==null?void 0:r.font)||""))==null?void 0:u.name)})||e.nullItem,onChange:q,itemRender:e.itemRender,...e.dropdownlistCommonProps})),l.createElement(m.FormField,{editorId:"valueAxisLabelsFontSize",labelText:o.toLanguageString(a.formatValueAxisLabelsSize,a.messages.formatValueAxisLabelsSize)},l.createElement(g.ComboBox,{id:"valueAxisLabelsFontSize",data:e.fontSizes,textField:"text",dataItemKey:"value",placeholder:o.toLanguageString(a.formatValueAxisLabelsSizePlaceholder,a.messages.formatValueAxisLabelsSizePlaceholder),value:e.fontSizes.find(t=>{var n,r,u;return t.value===((u=e.parseFont(((r=(n=s.valueAxis[0])==null?void 0:n.labels)==null?void 0:r.font)||""))==null?void 0:u.size)})||e.nullItem,onChange:w,allowCustom:!0,...e.dropdownlistCommonProps})),l.createElement(m.FormField,{editorId:"valueAxisLabelsColor",labelText:o.toLanguageString(a.formatValueAxisLabelsColor,a.messages.formatValueAxisLabelsColor)},l.createElement(x.ColorPicker,{id:"valueAxisLabelsColor",view:"gradient",value:((V=(S=s.valueAxis[0])==null?void 0:S.labels)==null?void 0:V.color)||"",onChange:D,fillMode:"outline"})),l.createElement(m.FormField,{editorId:"valueAxisLabelsRotation",labelText:o.toLanguageString(a.formatValueAxisLabelsRotation,a.messages.formatValueAxisLabelsRotation)},l.createElement(x.NumericTextBox,{id:"valueAxisLabelsRotation",value:typeof((T=(C=s.valueAxis[0])==null?void 0:C.labels)==null?void 0:T.rotation)=="number"?(h=(p=s.valueAxis[0])==null?void 0:p.labels)==null?void 0:h.rotation:null,placeholder:o.toLanguageString(a.formatValueAxisLabelsRotationAuto,a.messages.formatValueAxisLabelsRotationAuto),onChange:K,fillMode:"outline",min:-360,max:360,step:1}))))))))};exports.ValueAxisPanel=W;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const j=require("react"),h=require("@progress/kendo-react-layout"),B=require("@progress/kendo-react-form"),y=require("../FormFieldSet.js"),m=require("../FormField.js"),d=require("@progress/kendo-react-inputs"),e=require("../../utils.js"),a=require("../../messages.js"),M=require("@progress/kendo-react-intl"),g=require("@progress/kendo-react-dropdowns");function _(i){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(i){for(const s in i)if(s!=="default"){const x=Object.getOwnPropertyDescriptor(i,s);Object.defineProperty(o,s,x.get?x:{enumerable:!0,get:()=>i[s]})}}return o.default=i,Object.freeze(o)}const l=_(j),Y=i=>{var f,b,v,F,L,S,V,C,T,p;const o=M.useLocalization(),s=i.state,x=s.seriesType,c={text:o.toLanguageString(a.formatValueAxisLabelsFormatText,a.messages.formatValueAxisLabelsFormatText),value:""},A=[{value:"n0",text:o.toLanguageString(a.formatValueAxisLabelsFormatNumber,a.messages.formatValueAxisLabelsFormatNumber)},{value:"c0",text:o.toLanguageString(a.formatValueAxisLabelsFormatCurrency,a.messages.formatValueAxisLabelsFormatCurrency)},{value:"p0",text:o.toLanguageString(a.formatValueAxisLabelsFormatPercent,a.messages.formatValueAxisLabelsFormatPercent)}],[E,z]=l.useState(!1),P=l.useCallback(t=>{z(!t.expanded)},[]),I=t=>{i.onStateChange(e.updateState(s,e.ActionTypes.valueAxisTitleText,t.target.value))},k=t=>{const n=t.target.value||e.nullItem;e.ensureValue(n)&&i.onStateChange(e.updateState(s,e.ActionTypes.valueAxisTitleFontSize,n.value))},N=t=>{const n=t.target.value||e.nullItem;i.onStateChange(e.updateState(s,e.ActionTypes.valueAxisTitleFontName,n.value))},R=t=>{i.onStateChange(e.updateState(s,e.ActionTypes.valueAxisTitleColor,t.value))},w=t=>{const n=t.target.value||e.nullItem;e.ensureValue(n)&&i.onStateChange(e.updateState(s,e.ActionTypes.valueAxisLabelsFontSize,n.value))},q=t=>{const n=t.target.value||e.nullItem;i.onStateChange(e.updateState(s,e.ActionTypes.valueAxisLabelsFontName,n.value))},D=t=>{i.onStateChange(e.updateState(s,e.ActionTypes.valueAxisLabelsColor,t.value))},K=t=>{i.onStateChange(e.updateState(s,e.ActionTypes.valueAxisLabelsRotation,t.target.value))},O=t=>{const n=t.target.value;i.onStateChange(e.updateState(s,e.ActionTypes.valueAxisLabelsFormat,n.value))};return l.createElement(h.ExpansionPanel,{style:{maxWidth:"576px"},title:x==="scatter"?o.toLanguageString(a.formatYAxis,a.messages.formatYAxis):o.toLanguageString(a.formatValueAxis,a.messages.formatValueAxis),expanded:E,tabIndex:0,onAction:P},l.createElement(h.ExpansionPanelContent,null,l.createElement(B.FormElement,{onKeyDown:e.stopPropagation},l.createElement(y.FormFieldSet,{legend:o.toLanguageString(a.formatValueAxisTitle,a.messages.formatValueAxisTitle)},l.createElement("div",{className:"k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4"},l.createElement(m.FormField,{className:"k-col-span-2"},l.createElement(d.Input,{placeholder:o.toLanguageString(a.formatValueAxisTitlePlaceholder,a.messages.formatValueAxisTitlePlaceholder),value:((b=(f=s.valueAxis[0])==null?void 0:f.title)==null?void 0:b.text)||"",onChange:I})),l.createElement(m.FormField,{className:"k-col-span-2",editorId:"valueAxisTitleFont",labelText:o.toLanguageString(a.formatValueAxisTitleFont,a.messages.formatValueAxisTitleFont)},l.createElement(g.ComboBox,{id:"valueAxisTitleFont",data:e.fontNames,textField:"text",dataItemKey:"value",itemRender:e.itemRender,placeholder:o.toLanguageString(a.formatValueAxisTitleFontPlaceholder,a.messages.formatValueAxisTitleFontPlaceholder),value:e.fontNames.find(t=>{var n,r,u;return t.value===((u=e.parseFont(((r=(n=s.valueAxis[0])==null?void 0:n.title)==null?void 0:r.font)||""))==null?void 0:u.name)})||e.nullItem,onChange:N,...e.dropdownlistCommonProps})),l.createElement(m.FormField,{editorId:"valueAxisTitleFontSize",labelText:o.toLanguageString(a.formatValueAxisTitleSize,a.messages.formatValueAxisTitleSize)},l.createElement(g.ComboBox,{id:"valueAxisTitleFontSize",data:e.fontSizes,textField:"text",dataItemKey:"value",placeholder:o.toLanguageString(a.formatValueAxisTitleSizePlaceholder,a.messages.formatValueAxisTitleSizePlaceholder),value:e.fontSizes.find(t=>{var n,r,u;return t.value===((u=e.parseFont(((r=(n=s.valueAxis[0])==null?void 0:n.title)==null?void 0:r.font)||""))==null?void 0:u.size)})||e.nullItem,onChange:k,allowCustom:!0,...e.dropdownlistCommonProps})),l.createElement(m.FormField,{editorId:"valueAxisTitleColor",labelText:o.toLanguageString(a.formatValueAxisTitleColor,a.messages.formatValueAxisTitleColor)},l.createElement(d.ColorPicker,{id:"valueAxisTitleColor",view:"gradient",value:((F=(v=s.valueAxis[0])==null?void 0:v.title)==null?void 0:F.color)||"",onChange:R,fillMode:"outline"})))),l.createElement(y.FormFieldSet,{legend:o.toLanguageString(a.formatValueAxisLabels,a.messages.formatValueAxisLabels)},l.createElement("div",{className:"k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4"},l.createElement(m.FormField,{className:"k-col-span-2",editorId:"valueAxisLabelsFormat",labelText:o.toLanguageString(a.formatValueAxisLabelsFormat,a.messages.formatValueAxisLabelsFormat)},l.createElement(g.DropDownList,{id:"valueAxisLabelsFormat",data:A,textField:"text",dataItemKey:"value",defaultItem:c,value:A.find(t=>{var n,r;return t.value===((r=(n=s.valueAxis[0])==null?void 0:n.labels)==null?void 0:r.format)})||c,onChange:O,...e.dropdownlistCommonProps})),l.createElement(m.FormField,{className:"k-col-span-2",editorId:"valueAxisLabelsFont",labelText:o.toLanguageString(a.formatValueAxisLabelsFont,a.messages.formatValueAxisLabelsFont)},l.createElement(g.ComboBox,{id:"valueAxisLabelsFont",data:e.fontNames,textField:"text",dataItemKey:"value",placeholder:o.toLanguageString(a.formatValueAxisLabelsFontPlaceholder,a.messages.formatValueAxisLabelsFontPlaceholder),value:e.fontNames.find(t=>{var n,r,u;return t.value===((u=e.parseFont(((r=(n=s.valueAxis[0])==null?void 0:n.labels)==null?void 0:r.font)||""))==null?void 0:u.name)})||e.nullItem,onChange:q,itemRender:e.itemRender,...e.dropdownlistCommonProps})),l.createElement(m.FormField,{editorId:"valueAxisLabelsFontSize",labelText:o.toLanguageString(a.formatValueAxisLabelsSize,a.messages.formatValueAxisLabelsSize)},l.createElement(g.ComboBox,{id:"valueAxisLabelsFontSize",data:e.fontSizes,textField:"text",dataItemKey:"value",placeholder:o.toLanguageString(a.formatValueAxisLabelsSizePlaceholder,a.messages.formatValueAxisLabelsSizePlaceholder),value:e.fontSizes.find(t=>{var n,r,u;return t.value===((u=e.parseFont(((r=(n=s.valueAxis[0])==null?void 0:n.labels)==null?void 0:r.font)||""))==null?void 0:u.size)})||e.nullItem,onChange:w,allowCustom:!0,...e.dropdownlistCommonProps})),l.createElement(m.FormField,{editorId:"valueAxisLabelsColor",labelText:o.toLanguageString(a.formatValueAxisLabelsColor,a.messages.formatValueAxisLabelsColor)},l.createElement(d.ColorPicker,{id:"valueAxisLabelsColor",view:"gradient",value:((S=(L=s.valueAxis[0])==null?void 0:L.labels)==null?void 0:S.color)||"",onChange:D,fillMode:"outline"})),l.createElement(m.FormField,{editorId:"valueAxisLabelsRotation",labelText:o.toLanguageString(a.formatValueAxisLabelsRotation,a.messages.formatValueAxisLabelsRotation)},l.createElement(d.NumericTextBox,{id:"valueAxisLabelsRotation",value:typeof((C=(V=s.valueAxis[0])==null?void 0:V.labels)==null?void 0:C.rotation)=="number"?(p=(T=s.valueAxis[0])==null?void 0:T.labels)==null?void 0:p.rotation:null,placeholder:o.toLanguageString(a.formatValueAxisLabelsRotationAuto,a.messages.formatValueAxisLabelsRotationAuto),onChange:K,fillMode:"outline",min:-360,max:360,step:1})))))))};exports.ValueAxisPanel=Y;