@progress/kendo-react-chart-wizard 11.0.0-develop.8 → 11.0.0

package/components/SeriesGrid.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 n=require("react"),h=require("@progress/kendo-react-buttons"),o=require("@progress/kendo-react-grid"),D=require("@progress/kendo-react-intl"),I=require("@progress/kendo-svg-icons"),d=require("./SeriesGridCells.js"),x=require("../messages.js"),b=require("@progress/kendo-charts"),{messages:G}=b.ChartWizardCommon,s="inEdit",k=e=>{const[r,u]=n.useState(null),m=t=>{if(r===t)return;const a=e.data.slice(),i=a.findIndex(c=>c===r),l=a.findIndex(c=>c===t);a.splice(i,1),a.splice(l,0,r||a[0]),e.onChange.call(void 0,a)},C=t=>{u(t)},g=()=>{const t=e.initialData.find(a=>!e.data.find(i=>i.id===a.id));t&&e.onChange.call(void 0,[...e.data,t])},v=(t,a)=>{const i=e.data.map(l=>({...l,[s]:l.id===t.id?a:void 0}));e.onChange.call(void 0,i)},f=()=>{const t=e.data.map(a=>({...a,[s]:void 0}));e.onChange.call(void 0,t)},E=t=>{const a=t.field||"",i=e.data.map(l=>l.id===t.dataItem.id?{...l,[a]:t.value}:l);e.onChange.call(void 0,i)},S=t=>{const a=e.data.filter(i=>i.id!==t);e.onChange.call(void 0,a)};return n.createElement(d.RemoveSeriesContext.Provider,{value:{onRemove:S,count:e.data.length}},n.createElement(d.ReorderContext.Provider,{value:{reorder:m,dragStart:C}},n.createElement(d.SeriesEditContext.Provider,{value:{enterEdit:v,exitEdit:f}},n.createElement(o.Grid,{className:"k-series-grid",style:{width:"100%"},size:"medium",data:e.data,dataItemKey:"id",onItemChange:E,scrollable:"none",editField:s,cells:{headerCell:d.SeriesHeaderCell,data:d.SeriesDataCell,edit:{text:d.SeriesDataEditCell,boolean:d.SeriesDataEditCell,numeric:d.SeriesDataEditCell,date:d.SeriesDataEditCell}}},n.createElement(o.GridToolbar,null,n.createElement(h.Button,{type:"button",className:"k-toolbar-button",fillMode:"flat",onClick:g,disabled:e.data.length===e.initialData.length,svgIcon:I.plusIcon,icon:"plus"},D.useLocalization().toLanguageString(x.configurationSeriesAdd,G.configurationSeriesAdd))),n.createElement(o.GridColumn,{field:"reorder",width:"40px",editable:!1}),n.createElement(o.GridColumn,{field:"name",title:"Name"}),n.createElement(o.GridColumn,{field:"delete",width:"40px",editable:!1})))))};exports.SeriesGrid=k;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react"),x=require("@progress/kendo-react-buttons"),o=require("@progress/kendo-react-grid"),I=require("@progress/kendo-react-intl"),D=require("@progress/kendo-svg-icons"),d=require("./SeriesGridCells.js"),G=require("../messages.js"),k=require("@progress/kendo-charts"),{messages:q}=k.ChartWizardCommon,R=a=>{const[u,c]=n.useState({}),[s,m]=n.useState(null),C=e=>{if(s===e)return;const t=a.data.slice(),i=t.findIndex(r=>r===s),l=t.findIndex(r=>r===e);t.splice(i,1),t.splice(l,0,s||t[0]),a.onChange.call(void 0,t)},g=e=>{m(e)},f=()=>{const e=a.initialData.find(t=>!a.data.find(i=>i.id===t.id));e&&a.onChange.call(void 0,[...a.data,e])},S=e=>{c(t=>({...t,[e.id]:!0}))},E=e=>{c(t=>Object.keys(t).reduce((i,l)=>{if(l===e.id){const r={...t};return delete r[l],r}return i},{}))},h=e=>{const t=e.field||"",i=a.data.map(l=>l.id===e.dataItem.id?{...l,[t]:e.value}:l);a.onChange.call(void 0,i)},v=e=>{const t=a.data.filter(i=>i.id!==e);a.onChange.call(void 0,t)},b=e=>{c(e.edit)};return n.createElement(d.RemoveSeriesContext.Provider,{value:{onRemove:v,count:a.data.length}},n.createElement(d.ReorderContext.Provider,{value:{reorder:C,dragStart:g}},n.createElement(d.SeriesEditContext.Provider,{value:{enterEdit:S,exitEdit:E}},n.createElement(o.Grid,{className:"k-series-grid",style:{width:"100%"},size:"medium",data:a.data,dataItemKey:"id",onItemChange:h,scrollable:"none",editable:!0,cells:{headerCell:d.SeriesHeaderCell,data:d.SeriesDataCell,edit:{text:d.SeriesDataEditCell,boolean:d.SeriesDataEditCell,numeric:d.SeriesDataEditCell,date:d.SeriesDataEditCell}},edit:u,onEditChange:b},n.createElement(o.GridToolbar,null,n.createElement(x.Button,{type:"button",className:"k-toolbar-button",fillMode:"flat",onClick:f,disabled:a.data.length===a.initialData.length,svgIcon:D.plusIcon,icon:"plus"},I.useLocalization().toLanguageString(G.configurationSeriesAdd,q.configurationSeriesAdd))),n.createElement(o.GridColumn,{field:"reorder",width:"40px",editable:!1}),n.createElement(o.GridColumn,{field:"name",title:"Name"}),n.createElement(o.GridColumn,{field:"delete",width:"40px",editable:!1})))))};exports.SeriesGrid=R;

package/components/SeriesGrid.mjs

@@ -5,84 +5,89 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import i from "react";
-import { Button as x } from "@progress/kendo-react-buttons";
-import { Grid as D, GridToolbar as I, GridColumn as c } from "@progress/kendo-react-grid";
-import { useLocalization as S } from "@progress/kendo-react-intl";
-import { plusIcon as b } from "@progress/kendo-svg-icons";
-import { RemoveSeriesContext as w, ReorderContext as A, SeriesEditContext as G, SeriesHeaderCell as R, SeriesDataCell as k, SeriesDataEditCell as l } from "./SeriesGridCells.mjs";
-import { configurationSeriesAdd as y } from "../messages.mjs";
-import { ChartWizardCommon as z } from "@progress/kendo-charts";
-const { messages: L } = z, m = "inEdit", M = (e) => {
-  const [o, s] = i.useState(null), f = (t) => {
-    if (o === t)
+import n from "react";
+import { Button as b } from "@progress/kendo-react-buttons";
+import { Grid as I, GridToolbar as D, GridColumn as s } from "@progress/kendo-react-grid";
+import { useLocalization as w } from "@progress/kendo-react-intl";
+import { plusIcon as A } from "@progress/kendo-svg-icons";
+import { RemoveSeriesContext as G, ReorderContext as R, SeriesEditContext as k, SeriesHeaderCell as y, SeriesDataCell as z, SeriesDataEditCell as o } from "./SeriesGridCells.mjs";
+import { configurationSeriesAdd as N } from "../messages.mjs";
+import { ChartWizardCommon as P } from "@progress/kendo-charts";
+const { messages: L } = P, W = (a) => {
+  const [m, r] = n.useState({}), [c, u] = n.useState(null), f = (e) => {
+    if (c === e)
       return;
-    const a = e.data.slice(), n = a.findIndex((r) => r === o), d = a.findIndex((r) => r === t);
-    a.splice(n, 1), a.splice(d, 0, o || a[0]), e.onChange.call(void 0, a);
-  }, u = (t) => {
-    s(t);
-  }, g = () => {
-    const t = e.initialData.find((a) => !e.data.find((n) => n.id === a.id));
-    t && e.onChange.call(void 0, [...e.data, t]);
-  }, v = (t, a) => {
-    const n = e.data.map((d) => ({
-      ...d,
-      [m]: d.id === t.id ? a : void 0
-    }));
-    e.onChange.call(void 0, n);
+    const t = a.data.slice(), i = t.findIndex((l) => l === c), d = t.findIndex((l) => l === e);
+    t.splice(i, 1), t.splice(d, 0, c || t[0]), a.onChange.call(void 0, t);
+  }, g = (e) => {
+    u(e);
   }, C = () => {
-    const t = e.data.map((a) => ({ ...a, [m]: void 0 }));
-    e.onChange.call(void 0, t);
-  }, h = (t) => {
-    const a = t.field || "", n = e.data.map((d) => d.id === t.dataItem.id ? { ...d, [a]: t.value } : d);
-    e.onChange.call(void 0, n);
-  }, E = (t) => {
-    const a = e.data.filter((n) => n.id !== t);
-    e.onChange.call(void 0, a);
+    const e = a.initialData.find((t) => !a.data.find((i) => i.id === t.id));
+    e && a.onChange.call(void 0, [...a.data, e]);
+  }, h = (e) => {
+    r((t) => ({ ...t, [e.id]: !0 }));
+  }, E = (e) => {
+    r((t) => Object.keys(t).reduce((i, d) => {
+      if (d === e.id) {
+        const l = { ...t };
+        return delete l[d], l;
+      }
+      return i;
+    }, {}));
+  }, v = (e) => {
+    const t = e.field || "", i = a.data.map((d) => d.id === e.dataItem.id ? { ...d, [t]: e.value } : d);
+    a.onChange.call(void 0, i);
+  }, x = (e) => {
+    const t = a.data.filter((i) => i.id !== e);
+    a.onChange.call(void 0, t);
+  }, S = (e) => {
+    r(e.edit);
   };
-  return /* @__PURE__ */ i.createElement(w.Provider, { value: { onRemove: E, count: e.data.length } }, /* @__PURE__ */ i.createElement(A.Provider, { value: { reorder: f, dragStart: u } }, /* @__PURE__ */ i.createElement(G.Provider, { value: { enterEdit: v, exitEdit: C } }, /* @__PURE__ */ i.createElement(
-    D,
+  return /* @__PURE__ */ n.createElement(G.Provider, { value: { onRemove: x, count: a.data.length } }, /* @__PURE__ */ n.createElement(R.Provider, { value: { reorder: f, dragStart: g } }, /* @__PURE__ */ n.createElement(k.Provider, { value: { enterEdit: h, exitEdit: E } }, /* @__PURE__ */ n.createElement(
+    I,
     {
       className: "k-series-grid",
       style: { width: "100%" },
       size: "medium",
-      data: e.data,
+      data: a.data,
       dataItemKey: "id",
-      onItemChange: h,
+      onItemChange: v,
       scrollable: "none",
-      editField: m,
+      editable: !0,
       cells: {
-        headerCell: R,
-        data: k,
+        headerCell: y,
+        data: z,
         edit: {
-          text: l,
-          boolean: l,
-          numeric: l,
-          date: l
+          text: o,
+          boolean: o,
+          numeric: o,
+          date: o
         }
-      }
+      },
+      edit: m,
+      onEditChange: S
     },
-    /* @__PURE__ */ i.createElement(I, null, /* @__PURE__ */ i.createElement(
-      x,
+    /* @__PURE__ */ n.createElement(D, null, /* @__PURE__ */ n.createElement(
+      b,
       {
         type: "button",
         className: "k-toolbar-button",
         fillMode: "flat",
-        onClick: g,
-        disabled: e.data.length === e.initialData.length,
-        svgIcon: b,
+        onClick: C,
+        disabled: a.data.length === a.initialData.length,
+        svgIcon: A,
         icon: "plus"
       },
-      S().toLanguageString(
-        y,
+      w().toLanguageString(
+        N,
         L.configurationSeriesAdd
       )
     )),
-    /* @__PURE__ */ i.createElement(c, { field: "reorder", width: "40px", editable: !1 }),
-    /* @__PURE__ */ i.createElement(c, { field: "name", title: "Name" }),
-    /* @__PURE__ */ i.createElement(c, { field: "delete", width: "40px", editable: !1 })
+    /* @__PURE__ */ n.createElement(s, { field: "reorder", width: "40px", editable: !1 }),
+    /* @__PURE__ */ n.createElement(s, { field: "name", title: "Name" }),
+    /* @__PURE__ */ n.createElement(s, { field: "delete", width: "40px", editable: !1 })
   ))));
 };
 export {
-  M as SeriesGrid
+  W as SeriesGrid
 };

package/dist/cdn/js/kendo-react-chart-wizard.js

@@ -12,4 +12,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("@progress/kendo-react-dialogs"),require("@progress/kendo-react-layout"),require("@progress/kendo-react-buttons"),require("@progress/kendo-svg-icons"),require("@progress/kendo-charts"),require("@progress/kendo-react-charts"),require("@progress/kendo-drawing"),require("@progress/kendo-file-saver"),require("@progress/kendo-react-intl"),require("@progress/kendo-react-form"),require("@progress/kendo-react-dropdowns"),require("@progress/kendo-react-grid"),require("@progress/kendo-react-common"),require("@progress/kendo-react-animation"),require("@progress/kendo-react-labels"),require("@progress/kendo-react-inputs")):"function"==typeof define&&define.amd?define(["exports","react","@progress/kendo-react-dialogs","@progress/kendo-react-layout","@progress/kendo-react-buttons","@progress/kendo-svg-icons","@progress/kendo-charts","@progress/kendo-react-charts","@progress/kendo-drawing","@progress/kendo-file-saver","@progress/kendo-react-intl","@progress/kendo-react-form","@progress/kendo-react-dropdowns","@progress/kendo-react-grid","@progress/kendo-react-common","@progress/kendo-react-animation","@progress/kendo-react-labels","@progress/kendo-react-inputs"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactChartWizard={},e.React,e.KendoReactDialogs,e.KendoReactLayout,e.KendoReactButtons,e.KendoSvgIcons,e.KendoCharts,e.KendoReactCharts,e.KendoDrawing,e.KendoFileSaver,e.KendoReactIntl,e.KendoReactForm,e.KendoReactDropdowns,e.KendoReactGrid,e.KendoReactCommon,e.KendoReactAnimation,e.KendoReactLabels,e.KendoReactInputs)}(this,(function(e,t,a,r,l,n,o,i,c,s,d,u,g,m,h,x,v,f){"use strict";function p(e){var t=Object.create(null);return e&&Object.keys(e).forEach((function(a){if("default"!==a){var r=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(t,a,r.get?r:{enumerable:!0,get:function(){return e[a]}})}})),t.default=e,Object.freeze(t)}var C=p(t);const b=e=>{e.stopPropagation()},S="chart",E={paperSize:"A4",margin:"1cm"},k={width:800,height:600},L=(e={})=>({fileName:e.fileName||S,pdf:{...E,...e.pdf},image:{...k,...e.image}}),A=e=>{const t=i.exportVisual(e.chart),a=e.exportOptions;t&&c.exportPDF(t,a.pdf).then((e=>s.saveAs(e,a.fileName+".pdf")))},z=e=>{const t=i.exportVisual(e.chart),a=e.exportOptions;t&&c.exportSVG(t).then((e=>s.saveAs(e,a.fileName+".svg")))},y=e=>{const t=e.exportOptions,a=i.exportVisual(e.chart,t.image);a&&c.exportImage(a,t.image).then((e=>s.saveAs(e,t.fileName+".png")))},T={value:null,text:""},W=(e,t)=>t.dataItem.style?C.cloneElement(e,e.props,C.createElement("span",{style:t.dataItem.style},e.props.children)):e,I=/^\d+$/,F=e=>{if(""===e.text)return!0;if(void 0===e.value){if(!I.test(e.text))return!1;e.value=e.text+"px"}return D.find((t=>t.value===e.value))||(D.push(e),D.sort(((e,t)=>parseInt(e.text,10)-parseInt(t.text,10)))),!0},P={fillMode:"outline",popupSettings:{animate:!1}},N={type:"normal"},w={type:"100%"},R=e=>{var t,a;const r="object"==typeof(null==(t=e.series[0])?void 0:t.stack)&&(null==(a=e.series[0])?void 0:a.stack);return{isStackFalse:!1===r,isStackNormal:r&&"normal"===r.type,isStack100:r&&"100%"===r.type}},D=o.ChartWizardCommon.fontSizes,K=o.ChartWizardCommon.fontNames,B=o.ChartWizardCommon.createInitialState,M=(e,t)=>o.ChartWizardCommon.createState(e,t),V=o.ChartWizardCommon.updateState,q=o.ChartWizardCommon.mergeStates,O=o.ChartWizardCommon.isCategorical,G=o.ChartWizardCommon.parseFont,j=o.ChartWizardCommon.ActionTypes,{getWizardDataFromDataRows:H}=o.ChartWizardCommon,X=o.ChartWizardCommon.messages,Y="chartWizard.format.chartArea.margins.auto";class U{constructor(){this.prevented=!1}preventDefault(){this.prevented=!0}isDefaultPrevented(){return this.prevented}}class $ extends U{constructor(e,t){super(),this.chart=e,this.exportOptions=t}}const J=e=>t.createElement("fieldset",{className:"k-form-fieldset"},e.legend&&t.createElement("legend",{className:"k-form-legend"},e.legend),e.children),Q=C.createContext({onRemove:e=>{},count:0}),Z=e=>{const{onRemove:t,count:a}=C.useContext(Q);return C.createElement("td",{...e.tdProps},C.createElement(l.Button,{type:"button",onClick:()=>{t.call(void 0,e.dataItem.id)},icon:"trash",svgIcon:n.trashIcon,fillMode:"flat",disabled:a<2}))},_=C.createContext({reorder:()=>{},dragStart:()=>{}}),ee=e=>{const t=C.useContext(_);return C.createElement("td",{...e.tdProps,onDragOver:a=>{t.reorder.call(void 0,e.dataItem),a.preventDefault(),a.dataTransfer.dropEffect="copy"}},C.createElement("span",{draggable:!0,style:{cursor:"move"},onDragStart:a=>{t.dragStart.call(void 0,e.dataItem),a.dataTransfer.setData("dragging","")}},C.createElement(h.IconWrap,{icon:n.reorderIcon,name:"reorder"})))},te=C.createContext({enterEdit:(e,t)=>{},exitEdit:(e,t)=>{}}),ae=e=>{const{enterEdit:t}=C.useContext(te);return C.createElement("td",{...e.tdProps,onClick:()=>{t(e.dataItem,e.field)}},e.children)},re=e=>"delete"===e.field?C.createElement(Z,{...e}):"reorder"===e.field?C.createElement(ee,{...e}):"name"===e.field?C.createElement(ae,{...e}):null,le=e=>{const t=C.useRef(null),{exitEdit:a}=C.useContext(te);return C.useEffect((()=>{var e;const a=null==(e=t.current)?void 0:e.querySelector("input");null==a||a.focus()}),[]),C.createElement("td",{...e.tdProps,ref:t,onBlur:()=>{a(e.dataItem,e.field)},onKeyDown:t=>{"Enter"===t.key||"Escape"===t.key?(t.stopPropagation(),a(e.dataItem,e.field)):" "===t.key&&t.stopPropagation()}},e.children)},ne=()=>null,{messages:oe}=o.ChartWizardCommon,ie="inEdit",ce=e=>{const[a,r]=t.useState(null);return t.createElement(Q.Provider,{value:{onRemove:t=>{const a=e.data.filter((e=>e.id!==t));e.onChange.call(void 0,a)},count:e.data.length}},t.createElement(_.Provider,{value:{reorder:t=>{if(a===t)return;const r=e.data.slice(),l=r.findIndex((e=>e===a)),n=r.findIndex((e=>e===t));r.splice(l,1),r.splice(n,0,a||r[0]),e.onChange.call(void 0,r)},dragStart:e=>{r(e)}}},t.createElement(te.Provider,{value:{enterEdit:(t,a)=>{const r=e.data.map((e=>({...e,[ie]:e.id===t.id?a:void 0})));e.onChange.call(void 0,r)},exitEdit:()=>{const t=e.data.map((e=>({...e,[ie]:void 0})));e.onChange.call(void 0,t)}}},t.createElement(m.Grid,{className:"k-series-grid",style:{width:"100%"},size:"medium",data:e.data,dataItemKey:"id",onItemChange:t=>{const a=t.field||"",r=e.data.map((e=>e.id===t.dataItem.id?{...e,[a]:t.value}:e));e.onChange.call(void 0,r)},scrollable:"none",editField:ie,cells:{headerCell:ne,data:re,edit:{text:le,boolean:le,numeric:le,date:le}}},t.createElement(m.GridToolbar,null,t.createElement(l.Button,{type:"button",className:"k-toolbar-button",fillMode:"flat",onClick:()=>{const t=e.initialData.find((t=>!e.data.find((e=>e.id===t.id))));t&&e.onChange.call(void 0,[...e.data,t])},disabled:e.data.length===e.initialData.length,svgIcon:n.plusIcon,icon:"plus"},d.useLocalization().toLanguageString("chartWizard.data.configuration.series.add",oe.configurationSeriesAdd))),t.createElement(m.GridColumn,{field:"reorder",width:"40px",editable:!1}),t.createElement(m.GridColumn,{field:"name",title:"Name"}),t.createElement(m.GridColumn,{field:"delete",width:"40px",editable:!1})))))},se=e=>{const a=d.useLocalization(),l=e.state,n=l.seriesType,[o,i]=t.useState(!0),c=t.useCallback((e=>{i(!e.expanded)}),[]),s=t.useCallback((t=>{e.onStateChange(V(l,j.categoryAxisX,t.target.value))}),[l]),m=t.useCallback((t=>{e.onStateChange(V(l,j.seriesChange,t))}),[l]),h=t.useCallback((t=>{e.onStateChange(V(l,j.valueAxisY,t.target.value))}),[l]);return t.createElement(r.ExpansionPanel,{style:{maxWidth:"576px"},title:a.toLanguageString("chartWizard.data.configuration.expandText",X.configuration),expanded:o,tabIndex:0,onAction:c},t.createElement(x.Reveal,null,o&&t.createElement(r.ExpansionPanelContent,null,t.createElement(u.FormElement,{onKeyDown:b},t.createElement(J,{legend:"scatter"===n?a.toLanguageString("chartWizard.data.configuration.xAxis",X.configurationXAxis):a.toLanguageString("chartWizard.data.configuration.categoryAxis",X.configurationCategoryAxis)},t.createElement(g.DropDownList,{data:l.columns||[],value:l.categoryField,onChange:s,...P})),O(n)&&t.createElement(J,{legend:a.toLanguageString("chartWizard.data.configuration.series.title",X.configurationSeries)},t.createElement(ce,{data:l.series,initialData:l.initialSeries,onChange:m})),"pie"===n&&t.createElement(J,{legend:a.toLanguageString("chartWizard.data.configuration.valueAxis",X.configurationValueAxis)},t.createElement(g.DropDownList,{data:l.columns||[],value:l.valueField||"",...P,onChange:h}))))))},de=e=>t.createElement(u.FieldWrapper,{className:e.className},e.labelText&&e.editorId&&t.createElement(v.Label,{className:"k-form-label",editorId:e.editorId},e.labelText),t.createElement("div",{className:"k-form-field-wrap",onKeyDown:b},e.children)),ue=e=>{var a;const l=d.useLocalization(),n=e.state,[o,i]=t.useState(!1),c=t.useCallback((e=>{i(!e.expanded)}),[]),s=t.useCallback((t=>{e.onStateChange(V(n,j.areaMarginLeft,t.target.value))}),[n]),g=t.useCallback((t=>{e.onStateChange(V(n,j.areaMarginRight,t.target.value))}),[n]),m=t.useCallback((t=>{e.onStateChange(V(n,j.areaMarginTop,t.target.value))}),[n]),h=t.useCallback((t=>{e.onStateChange(V(n,j.areaMarginBottom,t.target.value))}),[n]),v=n.area.margin,p=t.useCallback((t=>{e.onStateChange(V(n,j.areaBackground,t.value))}),[n]);return t.createElement(r.ExpansionPanel,{style:{maxWidth:"576px"},title:l.toLanguageString("chartWizard.format.chartArea.expandText",X.formatChartArea),expanded:o,tabIndex:0,onAction:c},t.createElement(x.Reveal,null,o&&t.createElement(r.ExpansionPanelContent,null,t.createElement(u.FormElement,{onKeyDown:b},t.createElement(J,{legend:l.toLanguageString("chartWizard.format.chartArea.margins",X.formatChartAreaMargins)},t.createElement("div",{className:"k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4"},t.createElement(de,{labelText:l.toLanguageString("chartWizard.format.chartArea.margins.left",X.formatChartAreaMarginsLeft),editorId:"left"},t.createElement(f.NumericTextBox,{id:"left",value:void 0!==v.left?v.left:null,onChange:s,placeholder:l.toLanguageString(Y,X.formatChartAreaMarginsAuto),min:0,max:1e3,step:1,fillMode:"outline"})),t.createElement(de,{labelText:l.toLanguageString("chartWizard.format.chartArea.margins.right",X.formatChartAreaMarginsRight),editorId:"right"},t.createElement(f.NumericTextBox,{id:"right",value:void 0!==v.right?v.right:null,onChange:g,placeholder:l.toLanguageString(Y,X.formatChartAreaMarginsAuto),min:0,max:1e3,step:1,fillMode:"outline"})),t.createElement(de,{labelText:l.toLanguageString("chartWizard.format.chartArea.margins.top",X.formatChartAreaMarginsTop),editorId:"top"},t.createElement(f.NumericTextBox,{id:"top",value:void 0!==v.top?v.top:null,onChange:m,placeholder:l.toLanguageString(Y,X.formatChartAreaMarginsAuto),min:0,max:1e3,step:1,fillMode:"outline"})),t.createElement(de,{labelText:l.toLanguageString("chartWizard.format.chartArea.margins.bottom",X.formatChartAreaMarginsBottom),editorId:"bottom"},t.createElement(f.NumericTextBox,{id:"bottom",value:void 0!==v.bottom?v.bottom:null,onChange:h,placeholder:l.toLanguageString(Y,X.formatChartAreaMarginsAuto),min:0,max:1e3,step:1,fillMode:"outline"})))),t.createElement(J,{legend:l.toLanguageString("chartWizard.format.chartArea.background",X.formatChartAreaBackground)},t.createElement(de,{labelText:l.toLanguageString("chartWizard.format.chartArea.background.color",X.formatChartAreaBackgroundColor),editorId:"background"},t.createElement(f.ColorPicker,{id:"background",value:(null==(a=n.area)?void 0:a.background)||"",onChange:p,view:"gradient",fillMode:"outline"})))))))},ge=e=>{const t=d.useLocalization(),a=e.state,[l,n]=C.useState(!1),o=C.useCallback((e=>{n(!e.expanded)}),[]),i=[{value:"chartTitle",text:t.toLanguageString("chartWizard.format.title.chartTitle",X.formatTitleChartTitle)},{value:"chartSubtitle",text:t.toLanguageString("chartWizard.format.title.chartSubtitle",X.formatTitleChartSubtitle)}],[c,s]=C.useState(i[0]),m=C.useCallback((e=>{s(e.target.value)}),[]),h=(c.value===i[0].value?a.title:a.subtitle)||{text:"",font:"",color:""};return C.createElement(r.ExpansionPanel,{style:{maxWidth:"576px"},title:t.toLanguageString("chartWizard.format.title.expandText",X.formatTitle),expanded:l,tabIndex:0,onAction:o},C.createElement(x.Reveal,null,l&&C.createElement(r.ExpansionPanelContent,null,C.createElement(u.FormElement,{onKeyDown:b},C.createElement("div",{className:"k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4"},C.createElement(de,{className:"k-col-span-2",editorId:"apply-to-title",labelText:t.toLanguageString("chartWizard.format.title.applyTo",X.formatTitleApplyTo)},C.createElement(g.DropDownList,{id:"apply-to-title",data:i,textField:"text",dataItemKey:"value",value:i.find((e=>e.value===c.value)),onChange:m,...P})),C.createElement(de,{className:"k-col-span-2",editorId:"titleText",labelText:t.toLanguageString("chartWizard.format.title.label",X.formatTitleLabel)},C.createElement(f.Input,{id:"titleText",placeholder:c.value===i[0].value?i[0].text:i[1].text,value:h.text,onChange:t=>{const r=c.value===i[0].value?j.titleText:j.subtitleText;e.onStateChange(V(a,r,t.target.value))}})),C.createElement(de,{className:"k-col-span-2",editorId:"titleFont",labelText:t.toLanguageString("chartWizard.format.title.font",X.formatTitleFont)},C.createElement(g.ComboBox,{id:"titleFont",data:K,textField:"text",dataItemKey:"value",placeholder:t.toLanguageString("chartWizard.format.title.fontPlaceholder",X.formatTitleFontPlaceholder),value:K.find((e=>e.value===G(h.font).name))||T,onChange:t=>{const r=c.value===i[0].value?j.titleFontName:j.subtitleFontName,l=t.target.value||T;e.onStateChange(V(a,r,l.value))},itemRender:W,...P})),C.createElement(de,{editorId:"titleFontSize",labelText:t.toLanguageString("chartWizard.format.title.size",X.formatTitleSize)},C.createElement(g.ComboBox,{id:"titleFontSize",data:D,textField:"text",dataItemKey:"value",placeholder:t.toLanguageString("chartWizard.format.title.sizePlaceholder",X.formatTitleSizePlaceholder),value:D.find((e=>e.value===G(h.font).size))||T,onChange:t=>{const r=c.value===i[0].value?j.titleFontSize:j.subtitleFontSize,l=t.target.value||T;F(l)&&e.onStateChange(V(a,r,l.value))},itemRender:W,allowCustom:!0,...P})),C.createElement(de,{editorId:"titleColor",labelText:t.toLanguageString("chartWizard.format.title.color",X.formatTitleColor)},C.createElement(f.ColorPicker,{id:"titleColor",value:h.color||"",onChange:t=>{const r=c.value===i[0].value?j.titleColor:j.subtitleColor;e.onStateChange(V(a,r,t.value))},view:"gradient",fillMode:"outline"})))))))},me=e=>{var a,l,n,o,i;const[c,s]=t.useState(""),m=d.useLocalization(),h=e.state,v=h.seriesType,p="object"==typeof(null==(a=h.series[0])?void 0:a.stack)&&(null==(l=h.series[0])?void 0:l.stack.type),[C,S]=t.useState(!1),E=t.useCallback((e=>{S(!e.expanded)}),[]),k={name:m.toLanguageString("chartWizard.format.series.allSeries",X.formatSeriesAllSeries)};return t.useEffect((()=>{s("")}),[v,p]),t.createElement(r.ExpansionPanel,{style:{maxWidth:"576px"},title:m.toLanguageString("chartWizard.format.series.expandText",X.formatSeries),expanded:C,tabIndex:0,onAction:E},t.createElement(x.Reveal,null,C&&t.createElement(r.ExpansionPanelContent,null,t.createElement(u.FormElement,{onKeyDown:b},t.createElement(de,{editorId:"apply-to-series",labelText:m.toLanguageString("chartWizard.format.series.applyTo",X.formatSeriesApplyTo)},t.createElement(g.DropDownList,{id:"apply-to-series",data:h.series,textField:"name",dataItemKey:"name",defaultItem:k,disabled:!O(v),value:h.series.find((e=>e.name===c))||k,onChange:e=>{const t=e.target.value.name;s(t===k.name?"":t)},...P})),t.createElement(de,{editorId:"seriesColor",labelText:m.toLanguageString("chartWizard.format.series.color",X.formatSeriesColor)},t.createElement(f.ColorPicker,{id:"seriesColor",value:c?null==(n=h.series.find((e=>e.name===c)))?void 0:n.color:"",onChange:t=>{c&&e.onStateChange(V(h,j.seriesColor,{seriesName:c,color:t.value}))},disabled:!c,view:"gradient",fillMode:"outline"})),t.createElement(de,null,t.createElement(f.Checkbox,{label:m.toLanguageString("chartWizard.format.series.showLabels",X.formatSeriesShowLabels),checked:c?null==(i=null==(o=h.series.find((e=>e.name===c)))?void 0:o.labels)?void 0:i.visible:h.series.every((e=>{var t;return null==(t=e.labels)?void 0:t.visible})),onChange:t=>{e.onStateChange(V(h,j.seriesLabel,{seriesName:c,all:!c,visible:t.value}))}}))))))},he=e=>{var a,l,n,o,i,c,s;const m=d.useLocalization(),h=e.state,[p,C]=t.useState(!1),S=t.useCallback((e=>{C(!e.expanded)}),[]),E=[{value:"top",text:m.toLanguageString("chartWizard.format.legend.position.top",X.formatLegendPositionTop)},{value:"bottom",text:m.toLanguageString("chartWizard.format.legend.position.bottom",X.formatLegendPositionBottom)},{value:"left",text:m.toLanguageString("chartWizard.format.legend.position.left",X.formatLegendPositionLeft)},{value:"right",text:m.toLanguageString("chartWizard.format.legend.position.right",X.formatLegendPositionRight)}];return t.createElement(r.ExpansionPanel,{style:{maxWidth:"576px"},title:m.toLanguageString("chartWizard.format.legend.expandText",X.formatLegend),expanded:p,tabIndex:0,onAction:S},t.createElement(x.Reveal,null,p&&t.createElement(r.ExpansionPanelContent,null,t.createElement(u.FormElement,{onKeyDown:b},t.createElement("div",{className:"k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4"},t.createElement(v.Label,{editorId:"show-legend"},m.toLanguageString("chartWizard.format.legend.showLegend",X.formatLegendShowLegend)),t.createElement(f.Switch,{id:"show-legend",checked:null==(a=h.legend)?void 0:a.visible,onChange:t=>{e.onStateChange(V(h,j.legendVisible,t.value))}}),t.createElement(de,{className:"k-col-span-2",editorId:"legendLabelsFont",labelText:m.toLanguageString("chartWizard.format.legend.font",X.formatLegendFont)},t.createElement(g.ComboBox,{id:"legendLabelsFont",data:K,textField:"text",dataItemKey:"value",placeholder:m.toLanguageString("chartWizard.format.legend.fontPlaceholder",X.formatLegendFontPlaceholder),value:K.find((e=>{var t,a,r;return e.value===(null==(r=G((null==(a=null==(t=h.legend)?void 0:t.labels)?void 0:a.font)||""))?void 0:r.name)}))||T,onChange:t=>{const a=t.target.value||T;e.onStateChange(V(h,j.legendFontName,a.value))},itemRender:W,disabled:!1===(null==(l=h.legend)?void 0:l.visible),...P})),t.createElement(de,{editorId:"legendLabelsSize",labelText:m.toLanguageString("chartWizard.format.legend.size",X.formatLegendSize)},t.createElement(g.ComboBox,{id:"legendLabelsSize",data:D,textField:"text",dataItemKey:"value",placeholder:m.toLanguageString("chartWizard.format.legend.sizePlaceholder",X.formatLegendSizePlaceholder),value:D.find((e=>{var t,a,r;return e.value===(null==(r=G((null==(a=null==(t=h.legend)?void 0:t.labels)?void 0:a.font)||""))?void 0:r.size)}))||T,onChange:t=>{const a=t.target.value||T;F(a)&&e.onStateChange(V(h,j.legendFontSize,a.value))},disabled:!1===(null==(n=h.legend)?void 0:n.visible),allowCustom:!0,...P})),t.createElement(de,{editorId:"legendLabelsColor",labelText:m.toLanguageString("chartWizard.format.legend.color",X.formatLegendColor)},t.createElement(f.ColorPicker,{id:"legendLabelsColor",value:(null==(i=null==(o=h.legend)?void 0:o.labels)?void 0:i.color)||"",onChange:t=>{e.onStateChange(V(h,j.legendColor,t.value))},disabled:!1===(null==(c=h.legend)?void 0:c.visible),view:"gradient",fillMode:"outline"})),t.createElement(de,{className:"k-col-span-2",editorId:"legendPosition",labelText:m.toLanguageString("chartWizard.format.legend.position",X.formatLegendPosition)},t.createElement(g.DropDownList,{id:"legendPosition",data:E,textField:"text",dataItemKey:"value",value:E.find((e=>{var t;return e.value===(null==(t=h.legend)?void 0:t.position)})),onChange:t=>{const a=t.target.value;e.onStateChange(V(h,j.legendPosition,a.value))},disabled:!1===(null==(s=h.legend)?void 0:s.visible),...P})))))))},xe=e=>{var a,l,n,o,i;const c=d.useLocalization(),s=e.state,m=s.seriesType,[h,v]=t.useState(!1),p=t.useCallback((e=>{v(!e.expanded)}),[]),C=t.useCallback((t=>{e.onStateChange(V(s,j.categoryAxisTitleText,t.target.value))}),[s]),S=t.useCallback((t=>{const a=t.target.value||T;F(a)&&e.onStateChange(V(s,j.categoryAxisTitleFontSize,a.value))}),[s]),E=t.useCallback((t=>{const a=t.target.value||T;e.onStateChange(V(s,j.categoryAxisTitleFontName,a.value))}),[s]),k=t.useCallback((t=>{e.onStateChange(V(s,j.categoryAxisTitleColor,t.value))}),[s]),L=t.useCallback((t=>{const a=t.target.value||T;F(a)&&e.onStateChange(V(s,j.categoryAxisLabelsFontSize,a.value))}),[s]),A=t.useCallback((t=>{const a=t.target.value||T;e.onStateChange(V(s,j.categoryAxisLabelsFontName,a.value))}),[s]),z=t.useCallback((t=>{e.onStateChange(V(s,j.categoryAxisLabelsColor,t.value))}),[s]),y=t.useCallback((t=>{e.onStateChange(V(s,j.categoryAxisLabelsRotation,t.target.value))}),[s]),I=t.useCallback((t=>{e.onStateChange(V(s,j.categoryAxisReverseOrder,t.value))}),[s]);return t.createElement(r.ExpansionPanel,{style:{maxWidth:"576px"},title:"scatter"===m?c.toLanguageString("chartWizard.format.xAxis.expandText",X.formatXAxis):c.toLanguageString("chartWizard.format.categoryAxis.expandText",X.formatCategoryAxis),expanded:h,tabIndex:0,onAction:p},t.createElement(x.Reveal,null,h&&t.createElement(r.ExpansionPanelContent,null,t.createElement(u.FormElement,{onKeyDown:b},t.createElement(J,{legend:c.toLanguageString("chartWizard.format.categoryAxis.title.expandText",X.formatCategoryAxisTitle)},t.createElement("div",{className:"k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4"},t.createElement(de,{className:"k-col-span-2"},t.createElement(f.Input,{placeholder:c.toLanguageString("chartWizard.format.categoryAxis.title.placeholder",X.formatCategoryAxisTitlePlaceholder),value:(null==(a=s.categoryAxis[0].title)?void 0:a.text)||"",onChange:C})),t.createElement(de,{className:"k-col-span-2",editorId:"categoryAxisTitleFont",labelText:c.toLanguageString("chartWizard.format.categoryAxis.title.font",X.formatCategoryAxisTitleFont)},t.createElement(g.ComboBox,{id:"categoryAxisTitleFont",data:K,textField:"text",dataItemKey:"value",itemRender:W,placeholder:c.toLanguageString("chartWizard.format.categoryAxis.title.fontPlaceholder",X.formatCategoryAxisTitleFontPlaceholder),value:K.find((e=>{var t,a;return e.value===(null==(a=G((null==(t=s.categoryAxis[0].title)?void 0:t.font)||""))?void 0:a.name)}))||T,onChange:E,...P})),t.createElement(de,{editorId:"categoryAxisTitleFontSize",labelText:c.toLanguageString("chartWizard.format.categoryAxis.title.size",X.formatCategoryAxisTitleSize)},t.createElement(g.ComboBox,{id:"categoryAxisTitleFontSize",data:D,textField:"text",dataItemKey:"value",placeholder:c.toLanguageString("chartWizard.format.categoryAxis.title.sizePlaceholder",X.formatCategoryAxisTitleSizePlaceholder),value:D.find((e=>{var t,a;return e.value===(null==(a=G((null==(t=s.categoryAxis[0].title)?void 0:t.font)||""))?void 0:a.size)}))||T,onChange:S,allowCustom:!0,...P})),t.createElement(de,{editorId:"categoryAxisTitleColor",labelText:c.toLanguageString("chartWizard.format.categoryAxis.title.color",X.formatCategoryAxisTitleColor)},t.createElement(f.ColorPicker,{id:"categoryAxisTitleColor",view:"gradient",value:(null==(l=s.categoryAxis[0].title)?void 0:l.color)||"",onChange:k,fillMode:"outline"})))),t.createElement(J,{legend:c.toLanguageString("chartWizard.format.categoryAxis.labels.text",X.formatCategoryAxisLabels)},t.createElement("div",{className:"k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4"},t.createElement(de,{className:"k-col-span-2",editorId:"categoryAxisLabelsFont",labelText:c.toLanguageString("chartWizard.format.categoryAxis.labels.font",X.formatCategoryAxisLabelsFont)},t.createElement(g.ComboBox,{id:"categoryAxisLabelsFont",data:K,textField:"text",dataItemKey:"value",placeholder:c.toLanguageString("chartWizard.format.categoryAxis.labels.fontPlaceholder",X.formatCategoryAxisLabelsFontPlaceholder),value:K.find((e=>{var t,a;return e.value===(null==(a=G((null==(t=s.categoryAxis[0].labels)?void 0:t.font)||""))?void 0:a.name)}))||T,onChange:A,itemRender:W,...P})),t.createElement(de,{editorId:"categoryAxisLabelsFontSize",labelText:c.toLanguageString("chartWizard.format.categoryAxis.labels.size",X.formatCategoryAxisLabelsSize)},t.createElement(g.ComboBox,{id:"categoryAxisLabelsFontSize",data:D,textField:"text",dataItemKey:"value",placeholder:c.toLanguageString("chartWizard.format.categoryAxis.labels.sizePlaceholder",X.formatCategoryAxisLabelsSizePlaceholder),value:D.find((e=>{var t,a;return e.value===(null==(a=G((null==(t=s.categoryAxis[0].labels)?void 0:t.font)||""))?void 0:a.size)}))||T,onChange:L,allowCustom:!0,...P})),t.createElement(de,{editorId:"categoryAxisLabelsColor",labelText:c.toLanguageString("chartWizard.format.categoryAxis.labels.color",X.formatCategoryAxisLabelsColor)},t.createElement(f.ColorPicker,{id:"categoryAxisLabelsColor",view:"gradient",value:(null==(n=s.categoryAxis[0].labels)?void 0:n.color)||"",onChange:z,fillMode:"outline"})),t.createElement(de,{editorId:"categoryAxisLabelsRotation",labelText:c.toLanguageString("chartWizard.format.categoryAxis.labels.rotation.text",X.formatCategoryAxisLabelsRotation)},t.createElement(f.NumericTextBox,{id:"categoryAxisLabelsRotation",value:"number"==typeof(null==(o=s.categoryAxis[0].labels)?void 0:o.rotation)?null==(i=s.categoryAxis[0].labels)?void 0:i.rotation:null,placeholder:c.toLanguageString("chartWizard.format.categoryAxis.labels.rotation.auto",X.formatCategoryAxisLabelsRotationAuto),onChange:y,fillMode:"outline",min:-360,max:360,step:1})),t.createElement(de,{className:"k-col-span-2"},t.createElement(f.Checkbox,{label:c.toLanguageString("chartWizard.format.categoryAxis.labels.reverseOrder",X.formatCategoryAxisLabelsReverseOrder),checked:s.categoryAxis[0].reverse||!1,onChange:I}))))))))},ve=e=>{var a,l,n,o,i,c,s,m,h,v;const p=d.useLocalization(),C=e.state,S=C.seriesType,E={text:p.toLanguageString("chartWizard.format.valueAxis.labelFormat.text",X.formatValueAxisLabelsFormatText),value:""},k=[{value:"n0",text:p.toLanguageString("chartWizard.format.valueAxis.labelFormat.number",X.formatValueAxisLabelsFormatNumber)},{value:"c0",text:p.toLanguageString("chartWizard.format.valueAxis.labelFormat.currency",X.formatValueAxisLabelsFormatCurrency)},{value:"p0",text:p.toLanguageString("chartWizard.format.valueAxis.labelFormat.percent",X.formatValueAxisLabelsFormatPercent)}],[L,A]=t.useState(!1),z=t.useCallback((e=>{A(!e.expanded)}),[]);return t.createElement(r.ExpansionPanel,{style:{maxWidth:"576px"},title:"scatter"===S?p.toLanguageString("chartWizard.format.yAxis.expandText",X.formatYAxis):p.toLanguageString("chartWizard.format.valueAxis.expandText",X.formatValueAxis),expanded:L,tabIndex:0,onAction:z},t.createElement(x.Reveal,null,L&&t.createElement(r.ExpansionPanelContent,null,t.createElement(u.FormElement,{onKeyDown:b},t.createElement(J,{legend:p.toLanguageString("chartWizard.format.valueAxis.title.text",X.formatValueAxisTitle)},t.createElement("div",{className:"k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4"},t.createElement(de,{className:"k-col-span-2"},t.createElement(f.Input,{placeholder:p.toLanguageString("chartWizard.format.valueAxis.title.placeholder",X.formatValueAxisTitlePlaceholder),value:(null==(l=null==(a=C.valueAxis[0])?void 0:a.title)?void 0:l.text)||"",onChange:t=>{e.onStateChange(V(C,j.valueAxisTitleText,t.target.value))}})),t.createElement(de,{className:"k-col-span-2",editorId:"valueAxisTitleFont",labelText:p.toLanguageString("chartWizard.format.valueAxis.title.font",X.formatValueAxisTitleFont)},t.createElement(g.ComboBox,{id:"valueAxisTitleFont",data:K,textField:"text",dataItemKey:"value",itemRender:W,placeholder:p.toLanguageString("chartWizard.format.valueAxis.title.fontPlaceholder",X.formatValueAxisTitleFontPlaceholder),value:K.find((e=>{var t,a,r;return e.value===(null==(r=G((null==(a=null==(t=C.valueAxis[0])?void 0:t.title)?void 0:a.font)||""))?void 0:r.name)}))||T,onChange:t=>{const a=t.target.value||T;e.onStateChange(V(C,j.valueAxisTitleFontName,a.value))},...P})),t.createElement(de,{editorId:"valueAxisTitleFontSize",labelText:p.toLanguageString("chartWizard.format.valueAxis.title.size",X.formatValueAxisTitleSize)},t.createElement(g.ComboBox,{id:"valueAxisTitleFontSize",data:D,textField:"text",dataItemKey:"value",placeholder:p.toLanguageString("chartWizard.format.valueAxis.title.sizePlaceholder",X.formatValueAxisTitleSizePlaceholder),value:D.find((e=>{var t,a,r;return e.value===(null==(r=G((null==(a=null==(t=C.valueAxis[0])?void 0:t.title)?void 0:a.font)||""))?void 0:r.size)}))||T,onChange:t=>{const a=t.target.value||T;F(a)&&e.onStateChange(V(C,j.valueAxisTitleFontSize,a.value))},allowCustom:!0,...P})),t.createElement(de,{editorId:"valueAxisTitleColor",labelText:p.toLanguageString("chartWizard.format.valueAxis.title.color",X.formatValueAxisTitleColor)},t.createElement(f.ColorPicker,{id:"valueAxisTitleColor",view:"gradient",value:(null==(o=null==(n=C.valueAxis[0])?void 0:n.title)?void 0:o.color)||"",onChange:t=>{e.onStateChange(V(C,j.valueAxisTitleColor,t.value))},fillMode:"outline"})))),t.createElement(J,{legend:p.toLanguageString("chartWizard.format.valueAxis.labels.text",X.formatValueAxisLabels)},t.createElement("div",{className:"k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4"},t.createElement(de,{className:"k-col-span-2",editorId:"valueAxisLabelsFormat",labelText:p.toLanguageString("chartWizard.format.valueAxis.labelFormat",X.formatValueAxisLabelsFormat)},t.createElement(g.DropDownList,{id:"valueAxisLabelsFormat",data:k,textField:"text",dataItemKey:"value",defaultItem:E,value:k.find((e=>{var t,a;return e.value===(null==(a=null==(t=C.valueAxis[0])?void 0:t.labels)?void 0:a.format)}))||E,onChange:t=>{const a=t.target.value;e.onStateChange(V(C,j.valueAxisLabelsFormat,a.value))},...P})),t.createElement(de,{className:"k-col-span-2",editorId:"valueAxisLabelsFont",labelText:p.toLanguageString("chartWizard.format.valueAxis.labels.font",X.formatValueAxisLabelsFont)},t.createElement(g.ComboBox,{id:"valueAxisLabelsFont",data:K,textField:"text",dataItemKey:"value",placeholder:p.toLanguageString("chartWizard.format.valueAxis.labels.fontPlaceholder",X.formatValueAxisLabelsFontPlaceholder),value:K.find((e=>{var t,a,r;return e.value===(null==(r=G((null==(a=null==(t=C.valueAxis[0])?void 0:t.labels)?void 0:a.font)||""))?void 0:r.name)}))||T,onChange:t=>{const a=t.target.value||T;e.onStateChange(V(C,j.valueAxisLabelsFontName,a.value))},itemRender:W,...P})),t.createElement(de,{editorId:"valueAxisLabelsFontSize",labelText:p.toLanguageString("chartWizard.format.valueAxis.labels.size",X.formatValueAxisLabelsSize)},t.createElement(g.ComboBox,{id:"valueAxisLabelsFontSize",data:D,textField:"text",dataItemKey:"value",placeholder:p.toLanguageString("chartWizard.format.valueAxis.labels.sizePlaceholder",X.formatValueAxisLabelsSizePlaceholder),value:D.find((e=>{var t,a,r;return e.value===(null==(r=G((null==(a=null==(t=C.valueAxis[0])?void 0:t.labels)?void 0:a.font)||""))?void 0:r.size)}))||T,onChange:t=>{const a=t.target.value||T;F(a)&&e.onStateChange(V(C,j.valueAxisLabelsFontSize,a.value))},allowCustom:!0,...P})),t.createElement(de,{editorId:"valueAxisLabelsColor",labelText:p.toLanguageString("chartWizard.format.valueAxis.labels.color",X.formatValueAxisLabelsColor)},t.createElement(f.ColorPicker,{id:"valueAxisLabelsColor",view:"gradient",value:(null==(c=null==(i=C.valueAxis[0])?void 0:i.labels)?void 0:c.color)||"",onChange:t=>{e.onStateChange(V(C,j.valueAxisLabelsColor,t.value))},fillMode:"outline"})),t.createElement(de,{editorId:"valueAxisLabelsRotation",labelText:p.toLanguageString("chartWizard.format.valueAxis.labels.rotation.text",X.formatValueAxisLabelsRotation)},t.createElement(f.NumericTextBox,{id:"valueAxisLabelsRotation",value:"number"==typeof(null==(m=null==(s=C.valueAxis[0])?void 0:s.labels)?void 0:m.rotation)?null==(v=null==(h=C.valueAxis[0])?void 0:h.labels)?void 0:v.rotation:null,placeholder:p.toLanguageString("chartWizard.format.valueAxis.labels.rotation.auto",X.formatValueAxisLabelsRotationAuto),onChange:t=>{e.onStateChange(V(C,j.valueAxisLabelsRotation,t.target.value))},fillMode:"outline",min:-360,max:360,step:1}))))))))},fe=e=>t.createElement("div",{className:"k-chart-types-wrapper",onKeyDown:b},e.children),pe=e=>{const a=t.useCallback((t=>{("Enter"===t.key||" "===t.key)&&(t.preventDefault(),e.onClick.call(void 0))}),[e.onClick]);return t.createElement("div",{className:h.classNames("k-icon-text-wrapper",{"k-selected":e.selected}),onClick:e.onClick},t.createElement("div",{className:"k-icon-background-area",tabIndex:0,onKeyDown:a},t.createElement(h.IconWrap,{name:e.iconName,icon:e.icon,size:"xlarge",className:"k-svg-i-chart-bar-clustered"})),e.children)},Ce=e=>{const t=d.useLocalization(),a=e.state,l=a.seriesType,{isStackFalse:o,isStackNormal:i,isStack100:c}=R(a),[s,u]=C.useState(!0),g=C.useCallback((e=>{u(!e.expanded)}),[]);return C.createElement(r.ExpansionPanel,{style:{maxWidth:"576px"},title:t.toLanguageString("chartWizard.chart.barChart.expandText",X.barChart),expanded:s,tabIndex:0,onAction:g},C.createElement(x.Reveal,null,s&&C.createElement(r.ExpansionPanelContent,null,C.createElement(fe,null,C.createElement(pe,{selected:"bar"===l&&o,onClick:()=>{e.onStateChange(q(a,M(a.data,"bar")))},icon:n.chartBarClusteredIcon,iconName:"chart-bar-clustered"},t.toLanguageString("chartWizard.chart.barChart.bar",X.barChartBar)),C.createElement(pe,{selected:"bar"===l&&i,onClick:()=>{const t=q(a,M(a.data,"bar"));e.onStateChange(V(t,j.stacked,N))},icon:n.chartBarStackedIcon,iconName:"chart-bar-stacked"},t.toLanguageString("chartWizard.chart.barChart.stackedBar",X.barChartStackedBar)),C.createElement(pe,{selected:"bar"===l&&c,onClick:()=>{const t=q(a,M(a.data,"bar"));e.onStateChange(V(t,j.stacked,w))},icon:n.chartBarStacked100Icon,iconName:"chart-bar-stacked100"},t.toLanguageString("chartWizard.chart.barChart.100%stackedBar",X.barChart100StackedBar))))))},be=e=>{const t=d.useLocalization(),a=e.state,l=a.seriesType,{isStackFalse:o,isStackNormal:i,isStack100:c}=R(a),[s,u]=C.useState(!0),g=C.useCallback((e=>{u(!e.expanded)}),[]);return C.createElement(r.ExpansionPanel,{style:{maxWidth:"576px"},title:t.toLanguageString("chartWizard.chart.columnChart.expandText",X.columnChart),expanded:s,tabIndex:0,onAction:g},C.createElement(x.Reveal,null,s&&C.createElement(r.ExpansionPanelContent,null,C.createElement(fe,null,C.createElement(pe,{selected:"column"===l&&o,onClick:()=>{e.onStateChange(q(a,M(a.data,"column")))},icon:n.chartColumnClusteredIcon,iconName:"chart-column-clustered"},t.toLanguageString("chartWizard.chart.columnChart.column",X.columnChartColumn)),C.createElement(pe,{selected:"column"===l&&i,onClick:()=>{const t=q(a,M(a.data,"column"));e.onStateChange(V(t,j.stacked,N))},icon:n.chartColumnStackedIcon,iconName:"chart-column-stacked"},t.toLanguageString("chartWizard.chart.columnChart.stackedColumn",X.columnChartStackedColumn)),C.createElement(pe,{selected:"column"===l&&c,onClick:()=>{const t=q(a,M(a.data,"column"));e.onStateChange(V(t,j.stacked,w))},icon:n.chartColumnStacked100Icon,iconName:"chart-column-stacked100"},t.toLanguageString("chartWizard.chart.columnChart.100%stackedColumn",X.columnChart100StackedColumn))))))},Se=e=>{const t=d.useLocalization(),a=e.state,l=a.seriesType,{isStackFalse:o,isStackNormal:i,isStack100:c}=R(a),[s,u]=C.useState(!0),g=C.useCallback((e=>{u(!e.expanded)}),[]);return C.createElement(r.ExpansionPanel,{style:{maxWidth:"576px"},title:t.toLanguageString("chartWizard.chart.lineChart.expandText",X.lineChart),expanded:s,tabIndex:0,onAction:g},C.createElement(x.Reveal,null,s&&C.createElement(r.ExpansionPanelContent,null,C.createElement(fe,null,C.createElement(pe,{selected:"line"===l&&o,onClick:()=>{e.onStateChange(q(a,M(a.data,"line")))},icon:n.chartLineIcon,iconName:"chart-line"},t.toLanguageString("chartWizard.chart.lineChart.line",X.lineChartLine)),C.createElement(pe,{selected:"line"===l&&i,onClick:()=>{const t=q(a,M(a.data,"line"));e.onStateChange(V(t,j.stacked,N))},icon:n.chartLineStackedIcon,iconName:"chart-line-stacked"},t.toLanguageString("chartWizard.chart.lineChart.stackedLine",X.lineChartStackedLine)),C.createElement(pe,{selected:"line"===l&&c,onClick:()=>{const t=q(a,M(a.data,"line"));e.onStateChange(V(t,j.stacked,w))},icon:n.chartLineStacked100Icon,iconName:"chart-line-stacked100"},t.toLanguageString("chartWizard.chart.lineChart.100%stackedLine",X.lineChart100StackedLine))))))},Ee=e=>{const t=d.useLocalization(),a=e.state,l=a.seriesType,[o,i]=C.useState(!0),c=C.useCallback((e=>{i(!e.expanded)}),[]);return C.createElement(r.ExpansionPanel,{style:{maxWidth:"576px"},title:t.toLanguageString("chartWizard.chart.scatterChart.expandText",X.scatterChart),expanded:o,tabIndex:0,onAction:c},C.createElement(x.Reveal,null,o&&C.createElement(r.ExpansionPanelContent,null,C.createElement(fe,null,C.createElement(pe,{selected:"scatter"===l,onClick:()=>{e.onStateChange(q(a,M(a.data,"scatter")))},icon:n.chartScatterIcon,iconName:"chart-scatter"},t.toLanguageString("chartWizard.chart.scatterChart.scatter",X.scatterChartScatter))))))},ke=e=>{const t=d.useLocalization(),a=e.state,l=a.seriesType,[o,i]=C.useState(!0),c=C.useCallback((e=>{i(!e.expanded)}),[]);return C.createElement(r.ExpansionPanel,{style:{maxWidth:"576px"},title:t.toLanguageString("chartWizard.chart.pieChart.expandText",X.pieChart),expanded:o,tabIndex:0,onAction:c},C.createElement(x.Reveal,null,o&&C.createElement(r.ExpansionPanelContent,null,C.createElement(fe,null,C.createElement(pe,{selected:"pie"===l,onClick:()=>{e.onStateChange(q(a,M(a.data,"pie")))},icon:n.chartPieIcon,iconName:"chart-pie"},t.toLanguageString("chartWizard.chart.pieChart.pie",X.pieChartPie))))))},Le=t.forwardRef(((e,a)=>{var r,l,n,o,c,s,d,u,g,m,h,x,v;const f=e.state;return t.createElement(i.Chart,{style:{width:"100%",height:"100%"},transitions:!1,ref:a},t.createElement(i.ChartTitle,{text:null==(r=f.title)?void 0:r.text,font:null==(l=f.title)?void 0:l.font,color:(null==(n=f.title)?void 0:n.color)||"#000"}),t.createElement(i.ChartSubtitle,{text:null==(o=f.subtitle)?void 0:o.text,font:null==(c=f.subtitle)?void 0:c.font,color:(null==(s=f.subtitle)?void 0:s.color)||"#000"}),t.createElement(i.ChartArea,{background:null==(d=f.area)?void 0:d.background,margin:f.area.margin}),f.categoryAxis&&t.createElement(i.ChartCategoryAxis,null,f.categoryAxis.map(((e,a)=>t.createElement(i.ChartCategoryAxisItem,{key:a,categories:e.categories,title:e.title&&{text:e.title.text,font:e.title.font,color:e.title.color},labels:e.labels&&{font:e.labels.font,color:e.labels.color,rotation:e.labels.rotation},reverse:e.reverse})))),f.valueAxis&&t.createElement(i.ChartValueAxis,null,f.valueAxis.map(((e,a)=>t.createElement(i.ChartValueAxisItem,{key:a,title:e.title&&{text:e.title.text,font:e.title.font,color:e.title.color},labels:e.labels&&{format:e.labels.format,font:e.labels.font,color:e.labels.color,rotation:e.labels.rotation}})))),t.createElement(i.ChartSeries,null,f.series.map(((e,a)=>t.createElement(i.ChartSeriesItem,{key:String(e.name)+a,...e})))),t.createElement(i.ChartLegend,{visible:null==(u=f.legend)?void 0:u.visible,position:null==(g=f.legend)?void 0:g.position,labels:{color:(null==(h=null==(m=f.legend)?void 0:m.labels)?void 0:h.color)||void 0,font:(null==(v=null==(x=f.legend)?void 0:x.labels)?void 0:v.font)||void 0}}))}));Le.displayName="ChartComponent";const Ae=C.forwardRef(((e,t)=>{const o=d.useLocalization(),i=C.useRef(null),c=C.useRef(null),s=C.useCallback((t=>{var a;if(c.current){const r=new $(c.current,L(e.exportOptions));null==(a=e.onExport)||a.call(void 0,r),r.isDefaultPrevented()||t.item.exportHandler.call(void 0,r)}}),[e.onExport,e.exportOptions]),u=e.window||a.Window,[g,m]=C.useState({width:700,height:550}),[h,x]=C.useState("DEFAULT"),v=C.useCallback((e=>{m({width:e.width,height:e.height})}),[]),f=C.useCallback((e=>{x(e.state)}),[]),[p,b]=C.useState([{collapsible:!1},{size:"300px",collapsible:!1}]),S=C.useCallback((e=>{b(e.newState)}),[]),[E,k]=C.useState(0),T=C.useCallback((e=>{k(e.selected)}),[]),[W,I]=C.useState(B(e.data||[],"bar",e.defaultState)),F=t=>{var a;null==(a=e.onStateChange)||a.call(void 0,t),e.state||I(t)},P=e.state||W,N=C.useRef(P);N.current=P;const w=C.useRef(e);w.current=e;const R=C.useCallback((()=>({get chart(){return c.current},get state(){return N.current}})),[]);C.useImperativeHandle(t,R),C.useEffect((()=>{var t;if(N.current.seriesType&&e.data){const a=q(N.current,M(e.data,N.current.seriesType));null==(t=w.current.onStateChange)||t.call(void 0,a),w.current.state||I(a)}}),[e.data]),C.useEffect((()=>{var e,t;null==(t=null==(e=i.current)?void 0:e.element)||t.focus()}),[]);const D=P.seriesType;return C.createElement(u,{title:o.toLanguageString("chartWizard.window.title",X.windowTitle),className:"k-chart-wizard",modal:!0,resizable:!0,minimizeButton:()=>null,onClose:e.onClose,onResize:v,stage:h,onStageChange:f,...g},C.createElement(r.Splitter,{panes:p,onChange:S,className:"k-chart-wizard-splitter"},C.createElement("div",{className:"k-chart-wizard-preview-pane k-pane"},C.createElement("div",{className:"k-preview-pane-header"},C.createElement(l.DropDownButton,{ref:i,text:o.toLanguageString("chartWizard.export.button",X.exportButton),fillMode:"flat",svgIcon:n.exportIcon,icon:"export",onItemClick:s,items:[{svgIcon:n.filePdfIcon,icon:"file-pdf",exportHandler:A,text:o.toLanguageString("chartWizard.exportPDF.button",X.exportPDFButton)},{svgIcon:n.fileIcon,icon:"file",exportHandler:z,text:o.toLanguageString("chartWizard.exportSVG.button",X.exportSVGButton)},{svgIcon:n.fileImageIcon,icon:"file-image",exportHandler:y,text:o.toLanguageString("chartWizard.exportPNG.button",X.exportPNGButton)}]})),C.createElement("div",{className:"k-preview-pane-content",style:{height:"calc(100% - 50px)"}},C.createElement(Le,{ref:c,state:P}))),C.createElement("div",{className:"k-chart-wizard-property-pane k-pane k-pane-static"},C.createElement(r.TabStrip,{selected:E,onSelect:T,animation:!1},C.createElement(r.TabStripTab,{title:o.toLanguageString("chartWizard.tab.chart",X.tabChart)},C.createElement("div",null,C.createElement(Ce,{state:P,onStateChange:F}),C.createElement(ke,{state:P,onStateChange:F}),C.createElement(be,{state:P,onStateChange:F}),C.createElement(Se,{state:P,onStateChange:F}),C.createElement(Ee,{state:P,onStateChange:F}))),C.createElement(r.TabStripTab,{title:o.toLanguageString("chartWizard.tab.data",X.tabData)},C.createElement(se,{state:P,onStateChange:F})),C.createElement(r.TabStripTab,{title:o.toLanguageString("chartWizard.tab.format",X.tabFormat)},C.createElement("div",null,C.createElement(ue,{state:P,onStateChange:F}),C.createElement(ge,{state:P,onStateChange:F}),C.createElement(me,{state:P,onStateChange:F}),C.createElement(he,{state:P,onStateChange:F}),"pie"!==D&&C.createElement(xe,{state:P,onStateChange:F}),"pie"!==D&&C.createElement(ve,{state:P,onStateChange:F})))))))}));function ze(e){const{grid:t,data:a,selectedState:r,dataItemKey:l}=e;if(!t)return[];const n=m.leafColumns(t.columns||[]),o=h.getter(l),i=h.getter("field"),c=h.getter("title"),s=new Map(a.map((e=>[String(o(e)),e]))),d=new Map(Array.from(s.keys()).map(((e,t)=>[e,t]))),u=Object.keys(r).sort(((e,t)=>(d.get(e)||0)-(d.get(t)||0))),g=[];return u.forEach((e=>{let t=r[e];if(t){!0===t&&(t=Array.from({length:n.length},((e,t)=>t)));const a=t.slice();a.sort(((e,t)=>e-t));const r=a.map((e=>({title:c(n[e]),field:i(n[e])})));g.push({dataItem:s.get(e),dataColumns:r})}})),g}Ae.displayName="ChartWizard";const{getWizardDataFromDataRows:ye}=o.ChartWizardCommon;e.ChartWizard=Ae,e.createState=M,e.getGridSelectedRows=ze,e.getWizardDataFromDataRows=H,e.getWizardDataFromGridSelection=e=>ye(ze(e))}));
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("@progress/kendo-react-dialogs"),require("@progress/kendo-react-layout"),require("@progress/kendo-react-buttons"),require("@progress/kendo-svg-icons"),require("@progress/kendo-charts"),require("@progress/kendo-react-charts"),require("@progress/kendo-drawing"),require("@progress/kendo-file-saver"),require("@progress/kendo-react-intl"),require("@progress/kendo-react-form"),require("@progress/kendo-react-dropdowns"),require("@progress/kendo-react-grid"),require("@progress/kendo-react-common"),require("@progress/kendo-react-animation"),require("@progress/kendo-react-labels"),require("@progress/kendo-react-inputs")):"function"==typeof define&&define.amd?define(["exports","react","@progress/kendo-react-dialogs","@progress/kendo-react-layout","@progress/kendo-react-buttons","@progress/kendo-svg-icons","@progress/kendo-charts","@progress/kendo-react-charts","@progress/kendo-drawing","@progress/kendo-file-saver","@progress/kendo-react-intl","@progress/kendo-react-form","@progress/kendo-react-dropdowns","@progress/kendo-react-grid","@progress/kendo-react-common","@progress/kendo-react-animation","@progress/kendo-react-labels","@progress/kendo-react-inputs"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactChartWizard={},e.React,e.KendoReactDialogs,e.KendoReactLayout,e.KendoReactButtons,e.KendoSvgIcons,e.KendoCharts,e.KendoReactCharts,e.KendoDrawing,e.KendoFileSaver,e.KendoReactIntl,e.KendoReactForm,e.KendoReactDropdowns,e.KendoReactGrid,e.KendoReactCommon,e.KendoReactAnimation,e.KendoReactLabels,e.KendoReactInputs)}(this,(function(e,t,a,r,l,n,o,i,c,s,d,u,g,m,h,x,v,f){"use strict";function p(e){var t=Object.create(null);return e&&Object.keys(e).forEach((function(a){if("default"!==a){var r=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(t,a,r.get?r:{enumerable:!0,get:function(){return e[a]}})}})),t.default=e,Object.freeze(t)}var C=p(t);const b=e=>{e.stopPropagation()},S="chart",E={paperSize:"A4",margin:"1cm"},k={width:800,height:600},L=(e={})=>({fileName:e.fileName||S,pdf:{...E,...e.pdf},image:{...k,...e.image}}),A=e=>{const t=i.exportVisual(e.chart),a=e.exportOptions;t&&c.exportPDF(t,a.pdf).then((e=>s.saveAs(e,a.fileName+".pdf")))},z=e=>{const t=i.exportVisual(e.chart),a=e.exportOptions;t&&c.exportSVG(t).then((e=>s.saveAs(e,a.fileName+".svg")))},y=e=>{const t=e.exportOptions,a=i.exportVisual(e.chart,t.image);a&&c.exportImage(a,t.image).then((e=>s.saveAs(e,t.fileName+".png")))},T={value:null,text:""},W=(e,t)=>t.dataItem.style?C.cloneElement(e,e.props,C.createElement("span",{style:t.dataItem.style},e.props.children)):e,I=/^\d+$/,F=e=>{if(""===e.text)return!0;if(void 0===e.value){if(!I.test(e.text))return!1;e.value=e.text+"px"}return D.find((t=>t.value===e.value))||(D.push(e),D.sort(((e,t)=>parseInt(e.text,10)-parseInt(t.text,10)))),!0},P={fillMode:"outline",popupSettings:{animate:!1}},N={type:"normal"},w={type:"100%"},R=e=>{var t,a;const r="object"==typeof(null==(t=e.series[0])?void 0:t.stack)&&(null==(a=e.series[0])?void 0:a.stack);return{isStackFalse:!1===r,isStackNormal:r&&"normal"===r.type,isStack100:r&&"100%"===r.type}},D=o.ChartWizardCommon.fontSizes,K=o.ChartWizardCommon.fontNames,B=o.ChartWizardCommon.createInitialState,M=(e,t)=>o.ChartWizardCommon.createState(e,t),V=o.ChartWizardCommon.updateState,q=o.ChartWizardCommon.mergeStates,O=o.ChartWizardCommon.isCategorical,G=o.ChartWizardCommon.parseFont,j=o.ChartWizardCommon.ActionTypes,{getWizardDataFromDataRows:H}=o.ChartWizardCommon,X=o.ChartWizardCommon.messages,Y="chartWizard.format.chartArea.margins.auto";class U{constructor(){this.prevented=!1}preventDefault(){this.prevented=!0}isDefaultPrevented(){return this.prevented}}class $ extends U{constructor(e,t){super(),this.chart=e,this.exportOptions=t}}const J=e=>t.createElement("fieldset",{className:"k-form-fieldset"},e.legend&&t.createElement("legend",{className:"k-form-legend"},e.legend),e.children),Q=C.createContext({onRemove:e=>{},count:0}),Z=e=>{const{onRemove:t,count:a}=C.useContext(Q);return C.createElement("td",{...e.tdProps},C.createElement(l.Button,{type:"button",onClick:()=>{t.call(void 0,e.dataItem.id)},icon:"trash",svgIcon:n.trashIcon,fillMode:"flat",disabled:a<2}))},_=C.createContext({reorder:()=>{},dragStart:()=>{}}),ee=e=>{const t=C.useContext(_);return C.createElement("td",{...e.tdProps,onDragOver:a=>{t.reorder.call(void 0,e.dataItem),a.preventDefault(),a.dataTransfer.dropEffect="copy"}},C.createElement("span",{draggable:!0,style:{cursor:"move"},onDragStart:a=>{t.dragStart.call(void 0,e.dataItem),a.dataTransfer.setData("dragging","")}},C.createElement(h.IconWrap,{icon:n.reorderIcon,name:"reorder"})))},te=C.createContext({enterEdit:(e,t)=>{},exitEdit:(e,t)=>{}}),ae=e=>{const{enterEdit:t}=C.useContext(te);return C.createElement("td",{...e.tdProps,onClick:()=>{t(e.dataItem,e.field)}},e.children)},re=e=>"delete"===e.field?C.createElement(Z,{...e}):"reorder"===e.field?C.createElement(ee,{...e}):"name"===e.field?C.createElement(ae,{...e}):null,le=e=>{const t=C.useRef(null),{exitEdit:a}=C.useContext(te);return C.useEffect((()=>{var e;const a=null==(e=t.current)?void 0:e.querySelector("input");null==a||a.focus()}),[]),C.createElement("td",{...e.tdProps,ref:t,onBlur:()=>{a(e.dataItem,e.field)},onKeyDown:t=>{"Enter"===t.key||"Escape"===t.key?(t.stopPropagation(),a(e.dataItem,e.field)):" "===t.key&&t.stopPropagation()}},e.children)},ne=()=>null,{messages:oe}=o.ChartWizardCommon,ie=e=>{const[a,r]=t.useState({}),[o,i]=t.useState(null);return t.createElement(Q.Provider,{value:{onRemove:t=>{const a=e.data.filter((e=>e.id!==t));e.onChange.call(void 0,a)},count:e.data.length}},t.createElement(_.Provider,{value:{reorder:t=>{if(o===t)return;const a=e.data.slice(),r=a.findIndex((e=>e===o)),l=a.findIndex((e=>e===t));a.splice(r,1),a.splice(l,0,o||a[0]),e.onChange.call(void 0,a)},dragStart:e=>{i(e)}}},t.createElement(te.Provider,{value:{enterEdit:e=>{r((t=>({...t,[e.id]:!0})))},exitEdit:e=>{r((t=>Object.keys(t).reduce(((a,r)=>{if(r===e.id){const e={...t};return delete e[r],e}return a}),{})))}}},t.createElement(m.Grid,{className:"k-series-grid",style:{width:"100%"},size:"medium",data:e.data,dataItemKey:"id",onItemChange:t=>{const a=t.field||"",r=e.data.map((e=>e.id===t.dataItem.id?{...e,[a]:t.value}:e));e.onChange.call(void 0,r)},scrollable:"none",editable:!0,cells:{headerCell:ne,data:re,edit:{text:le,boolean:le,numeric:le,date:le}},edit:a,onEditChange:e=>{r(e.edit)}},t.createElement(m.GridToolbar,null,t.createElement(l.Button,{type:"button",className:"k-toolbar-button",fillMode:"flat",onClick:()=>{const t=e.initialData.find((t=>!e.data.find((e=>e.id===t.id))));t&&e.onChange.call(void 0,[...e.data,t])},disabled:e.data.length===e.initialData.length,svgIcon:n.plusIcon,icon:"plus"},d.useLocalization().toLanguageString("chartWizard.data.configuration.series.add",oe.configurationSeriesAdd))),t.createElement(m.GridColumn,{field:"reorder",width:"40px",editable:!1}),t.createElement(m.GridColumn,{field:"name",title:"Name"}),t.createElement(m.GridColumn,{field:"delete",width:"40px",editable:!1})))))},ce=e=>{const a=d.useLocalization(),l=e.state,n=l.seriesType,[o,i]=t.useState(!0),c=t.useCallback((e=>{i(!e.expanded)}),[]),s=t.useCallback((t=>{e.onStateChange(V(l,j.categoryAxisX,t.target.value))}),[l]),m=t.useCallback((t=>{e.onStateChange(V(l,j.seriesChange,t))}),[l]),h=t.useCallback((t=>{e.onStateChange(V(l,j.valueAxisY,t.target.value))}),[l]);return t.createElement(r.ExpansionPanel,{style:{maxWidth:"576px"},title:a.toLanguageString("chartWizard.data.configuration.expandText",X.configuration),expanded:o,tabIndex:0,onAction:c},t.createElement(x.Reveal,null,o&&t.createElement(r.ExpansionPanelContent,null,t.createElement(u.FormElement,{onKeyDown:b},t.createElement(J,{legend:"scatter"===n?a.toLanguageString("chartWizard.data.configuration.xAxis",X.configurationXAxis):a.toLanguageString("chartWizard.data.configuration.categoryAxis",X.configurationCategoryAxis)},t.createElement(g.DropDownList,{data:l.columns||[],value:l.categoryField,onChange:s,...P})),O(n)&&t.createElement(J,{legend:a.toLanguageString("chartWizard.data.configuration.series.title",X.configurationSeries)},t.createElement(ie,{data:l.series,initialData:l.initialSeries,onChange:m})),"pie"===n&&t.createElement(J,{legend:a.toLanguageString("chartWizard.data.configuration.valueAxis",X.configurationValueAxis)},t.createElement(g.DropDownList,{data:l.columns||[],value:l.valueField||"",...P,onChange:h}))))))},se=e=>t.createElement(u.FieldWrapper,{className:e.className},e.labelText&&e.editorId&&t.createElement(v.Label,{className:"k-form-label",editorId:e.editorId},e.labelText),t.createElement("div",{className:"k-form-field-wrap",onKeyDown:b},e.children)),de=e=>{var a;const l=d.useLocalization(),n=e.state,[o,i]=t.useState(!1),c=t.useCallback((e=>{i(!e.expanded)}),[]),s=t.useCallback((t=>{e.onStateChange(V(n,j.areaMarginLeft,t.target.value))}),[n]),g=t.useCallback((t=>{e.onStateChange(V(n,j.areaMarginRight,t.target.value))}),[n]),m=t.useCallback((t=>{e.onStateChange(V(n,j.areaMarginTop,t.target.value))}),[n]),h=t.useCallback((t=>{e.onStateChange(V(n,j.areaMarginBottom,t.target.value))}),[n]),v=n.area.margin,p=t.useCallback((t=>{e.onStateChange(V(n,j.areaBackground,t.value))}),[n]);return t.createElement(r.ExpansionPanel,{style:{maxWidth:"576px"},title:l.toLanguageString("chartWizard.format.chartArea.expandText",X.formatChartArea),expanded:o,tabIndex:0,onAction:c},t.createElement(x.Reveal,null,o&&t.createElement(r.ExpansionPanelContent,null,t.createElement(u.FormElement,{onKeyDown:b},t.createElement(J,{legend:l.toLanguageString("chartWizard.format.chartArea.margins",X.formatChartAreaMargins)},t.createElement("div",{className:"k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4"},t.createElement(se,{labelText:l.toLanguageString("chartWizard.format.chartArea.margins.left",X.formatChartAreaMarginsLeft),editorId:"left"},t.createElement(f.NumericTextBox,{id:"left",value:void 0!==v.left?v.left:null,onChange:s,placeholder:l.toLanguageString(Y,X.formatChartAreaMarginsAuto),min:0,max:1e3,step:1,fillMode:"outline"})),t.createElement(se,{labelText:l.toLanguageString("chartWizard.format.chartArea.margins.right",X.formatChartAreaMarginsRight),editorId:"right"},t.createElement(f.NumericTextBox,{id:"right",value:void 0!==v.right?v.right:null,onChange:g,placeholder:l.toLanguageString(Y,X.formatChartAreaMarginsAuto),min:0,max:1e3,step:1,fillMode:"outline"})),t.createElement(se,{labelText:l.toLanguageString("chartWizard.format.chartArea.margins.top",X.formatChartAreaMarginsTop),editorId:"top"},t.createElement(f.NumericTextBox,{id:"top",value:void 0!==v.top?v.top:null,onChange:m,placeholder:l.toLanguageString(Y,X.formatChartAreaMarginsAuto),min:0,max:1e3,step:1,fillMode:"outline"})),t.createElement(se,{labelText:l.toLanguageString("chartWizard.format.chartArea.margins.bottom",X.formatChartAreaMarginsBottom),editorId:"bottom"},t.createElement(f.NumericTextBox,{id:"bottom",value:void 0!==v.bottom?v.bottom:null,onChange:h,placeholder:l.toLanguageString(Y,X.formatChartAreaMarginsAuto),min:0,max:1e3,step:1,fillMode:"outline"})))),t.createElement(J,{legend:l.toLanguageString("chartWizard.format.chartArea.background",X.formatChartAreaBackground)},t.createElement(se,{labelText:l.toLanguageString("chartWizard.format.chartArea.background.color",X.formatChartAreaBackgroundColor),editorId:"background"},t.createElement(f.ColorPicker,{id:"background",value:(null==(a=n.area)?void 0:a.background)||"",onChange:p,view:"gradient",fillMode:"outline"})))))))},ue=e=>{const t=d.useLocalization(),a=e.state,[l,n]=C.useState(!1),o=C.useCallback((e=>{n(!e.expanded)}),[]),i=[{value:"chartTitle",text:t.toLanguageString("chartWizard.format.title.chartTitle",X.formatTitleChartTitle)},{value:"chartSubtitle",text:t.toLanguageString("chartWizard.format.title.chartSubtitle",X.formatTitleChartSubtitle)}],[c,s]=C.useState(i[0]),m=C.useCallback((e=>{s(e.target.value)}),[]),h=(c.value===i[0].value?a.title:a.subtitle)||{text:"",font:"",color:""};return C.createElement(r.ExpansionPanel,{style:{maxWidth:"576px"},title:t.toLanguageString("chartWizard.format.title.expandText",X.formatTitle),expanded:l,tabIndex:0,onAction:o},C.createElement(x.Reveal,null,l&&C.createElement(r.ExpansionPanelContent,null,C.createElement(u.FormElement,{onKeyDown:b},C.createElement("div",{className:"k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4"},C.createElement(se,{className:"k-col-span-2",editorId:"apply-to-title",labelText:t.toLanguageString("chartWizard.format.title.applyTo",X.formatTitleApplyTo)},C.createElement(g.DropDownList,{id:"apply-to-title",data:i,textField:"text",dataItemKey:"value",value:i.find((e=>e.value===c.value)),onChange:m,...P})),C.createElement(se,{className:"k-col-span-2",editorId:"titleText",labelText:t.toLanguageString("chartWizard.format.title.label",X.formatTitleLabel)},C.createElement(f.Input,{id:"titleText",placeholder:c.value===i[0].value?i[0].text:i[1].text,value:h.text,onChange:t=>{const r=c.value===i[0].value?j.titleText:j.subtitleText;e.onStateChange(V(a,r,t.target.value))}})),C.createElement(se,{className:"k-col-span-2",editorId:"titleFont",labelText:t.toLanguageString("chartWizard.format.title.font",X.formatTitleFont)},C.createElement(g.ComboBox,{id:"titleFont",data:K,textField:"text",dataItemKey:"value",placeholder:t.toLanguageString("chartWizard.format.title.fontPlaceholder",X.formatTitleFontPlaceholder),value:K.find((e=>e.value===G(h.font).name))||T,onChange:t=>{const r=c.value===i[0].value?j.titleFontName:j.subtitleFontName,l=t.target.value||T;e.onStateChange(V(a,r,l.value))},itemRender:W,...P})),C.createElement(se,{editorId:"titleFontSize",labelText:t.toLanguageString("chartWizard.format.title.size",X.formatTitleSize)},C.createElement(g.ComboBox,{id:"titleFontSize",data:D,textField:"text",dataItemKey:"value",placeholder:t.toLanguageString("chartWizard.format.title.sizePlaceholder",X.formatTitleSizePlaceholder),value:D.find((e=>e.value===G(h.font).size))||T,onChange:t=>{const r=c.value===i[0].value?j.titleFontSize:j.subtitleFontSize,l=t.target.value||T;F(l)&&e.onStateChange(V(a,r,l.value))},itemRender:W,allowCustom:!0,...P})),C.createElement(se,{editorId:"titleColor",labelText:t.toLanguageString("chartWizard.format.title.color",X.formatTitleColor)},C.createElement(f.ColorPicker,{id:"titleColor",value:h.color||"",onChange:t=>{const r=c.value===i[0].value?j.titleColor:j.subtitleColor;e.onStateChange(V(a,r,t.value))},view:"gradient",fillMode:"outline"})))))))},ge=e=>{var a,l,n,o,i;const[c,s]=t.useState(""),m=d.useLocalization(),h=e.state,v=h.seriesType,p="object"==typeof(null==(a=h.series[0])?void 0:a.stack)&&(null==(l=h.series[0])?void 0:l.stack.type),[C,S]=t.useState(!1),E=t.useCallback((e=>{S(!e.expanded)}),[]),k={name:m.toLanguageString("chartWizard.format.series.allSeries",X.formatSeriesAllSeries)};return t.useEffect((()=>{s("")}),[v,p]),t.createElement(r.ExpansionPanel,{style:{maxWidth:"576px"},title:m.toLanguageString("chartWizard.format.series.expandText",X.formatSeries),expanded:C,tabIndex:0,onAction:E},t.createElement(x.Reveal,null,C&&t.createElement(r.ExpansionPanelContent,null,t.createElement(u.FormElement,{onKeyDown:b},t.createElement(se,{editorId:"apply-to-series",labelText:m.toLanguageString("chartWizard.format.series.applyTo",X.formatSeriesApplyTo)},t.createElement(g.DropDownList,{id:"apply-to-series",data:h.series,textField:"name",dataItemKey:"name",defaultItem:k,disabled:!O(v),value:h.series.find((e=>e.name===c))||k,onChange:e=>{const t=e.target.value.name;s(t===k.name?"":t)},...P})),t.createElement(se,{editorId:"seriesColor",labelText:m.toLanguageString("chartWizard.format.series.color",X.formatSeriesColor)},t.createElement(f.ColorPicker,{id:"seriesColor",value:c?null==(n=h.series.find((e=>e.name===c)))?void 0:n.color:"",onChange:t=>{c&&e.onStateChange(V(h,j.seriesColor,{seriesName:c,color:t.value}))},disabled:!c,view:"gradient",fillMode:"outline"})),t.createElement(se,null,t.createElement(f.Checkbox,{label:m.toLanguageString("chartWizard.format.series.showLabels",X.formatSeriesShowLabels),checked:c?null==(i=null==(o=h.series.find((e=>e.name===c)))?void 0:o.labels)?void 0:i.visible:h.series.every((e=>{var t;return null==(t=e.labels)?void 0:t.visible})),onChange:t=>{e.onStateChange(V(h,j.seriesLabel,{seriesName:c,all:!c,visible:t.value}))}}))))))},me=e=>{var a,l,n,o,i,c,s;const m=d.useLocalization(),h=e.state,[p,C]=t.useState(!1),S=t.useCallback((e=>{C(!e.expanded)}),[]),E=[{value:"top",text:m.toLanguageString("chartWizard.format.legend.position.top",X.formatLegendPositionTop)},{value:"bottom",text:m.toLanguageString("chartWizard.format.legend.position.bottom",X.formatLegendPositionBottom)},{value:"left",text:m.toLanguageString("chartWizard.format.legend.position.left",X.formatLegendPositionLeft)},{value:"right",text:m.toLanguageString("chartWizard.format.legend.position.right",X.formatLegendPositionRight)}];return t.createElement(r.ExpansionPanel,{style:{maxWidth:"576px"},title:m.toLanguageString("chartWizard.format.legend.expandText",X.formatLegend),expanded:p,tabIndex:0,onAction:S},t.createElement(x.Reveal,null,p&&t.createElement(r.ExpansionPanelContent,null,t.createElement(u.FormElement,{onKeyDown:b},t.createElement("div",{className:"k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4"},t.createElement(v.Label,{editorId:"show-legend"},m.toLanguageString("chartWizard.format.legend.showLegend",X.formatLegendShowLegend)),t.createElement(f.Switch,{id:"show-legend",checked:null==(a=h.legend)?void 0:a.visible,onChange:t=>{e.onStateChange(V(h,j.legendVisible,t.value))}}),t.createElement(se,{className:"k-col-span-2",editorId:"legendLabelsFont",labelText:m.toLanguageString("chartWizard.format.legend.font",X.formatLegendFont)},t.createElement(g.ComboBox,{id:"legendLabelsFont",data:K,textField:"text",dataItemKey:"value",placeholder:m.toLanguageString("chartWizard.format.legend.fontPlaceholder",X.formatLegendFontPlaceholder),value:K.find((e=>{var t,a,r;return e.value===(null==(r=G((null==(a=null==(t=h.legend)?void 0:t.labels)?void 0:a.font)||""))?void 0:r.name)}))||T,onChange:t=>{const a=t.target.value||T;e.onStateChange(V(h,j.legendFontName,a.value))},itemRender:W,disabled:!1===(null==(l=h.legend)?void 0:l.visible),...P})),t.createElement(se,{editorId:"legendLabelsSize",labelText:m.toLanguageString("chartWizard.format.legend.size",X.formatLegendSize)},t.createElement(g.ComboBox,{id:"legendLabelsSize",data:D,textField:"text",dataItemKey:"value",placeholder:m.toLanguageString("chartWizard.format.legend.sizePlaceholder",X.formatLegendSizePlaceholder),value:D.find((e=>{var t,a,r;return e.value===(null==(r=G((null==(a=null==(t=h.legend)?void 0:t.labels)?void 0:a.font)||""))?void 0:r.size)}))||T,onChange:t=>{const a=t.target.value||T;F(a)&&e.onStateChange(V(h,j.legendFontSize,a.value))},disabled:!1===(null==(n=h.legend)?void 0:n.visible),allowCustom:!0,...P})),t.createElement(se,{editorId:"legendLabelsColor",labelText:m.toLanguageString("chartWizard.format.legend.color",X.formatLegendColor)},t.createElement(f.ColorPicker,{id:"legendLabelsColor",value:(null==(i=null==(o=h.legend)?void 0:o.labels)?void 0:i.color)||"",onChange:t=>{e.onStateChange(V(h,j.legendColor,t.value))},disabled:!1===(null==(c=h.legend)?void 0:c.visible),view:"gradient",fillMode:"outline"})),t.createElement(se,{className:"k-col-span-2",editorId:"legendPosition",labelText:m.toLanguageString("chartWizard.format.legend.position",X.formatLegendPosition)},t.createElement(g.DropDownList,{id:"legendPosition",data:E,textField:"text",dataItemKey:"value",value:E.find((e=>{var t;return e.value===(null==(t=h.legend)?void 0:t.position)})),onChange:t=>{const a=t.target.value;e.onStateChange(V(h,j.legendPosition,a.value))},disabled:!1===(null==(s=h.legend)?void 0:s.visible),...P})))))))},he=e=>{var a,l,n,o,i;const c=d.useLocalization(),s=e.state,m=s.seriesType,[h,v]=t.useState(!1),p=t.useCallback((e=>{v(!e.expanded)}),[]),C=t.useCallback((t=>{e.onStateChange(V(s,j.categoryAxisTitleText,t.target.value))}),[s]),S=t.useCallback((t=>{const a=t.target.value||T;F(a)&&e.onStateChange(V(s,j.categoryAxisTitleFontSize,a.value))}),[s]),E=t.useCallback((t=>{const a=t.target.value||T;e.onStateChange(V(s,j.categoryAxisTitleFontName,a.value))}),[s]),k=t.useCallback((t=>{e.onStateChange(V(s,j.categoryAxisTitleColor,t.value))}),[s]),L=t.useCallback((t=>{const a=t.target.value||T;F(a)&&e.onStateChange(V(s,j.categoryAxisLabelsFontSize,a.value))}),[s]),A=t.useCallback((t=>{const a=t.target.value||T;e.onStateChange(V(s,j.categoryAxisLabelsFontName,a.value))}),[s]),z=t.useCallback((t=>{e.onStateChange(V(s,j.categoryAxisLabelsColor,t.value))}),[s]),y=t.useCallback((t=>{e.onStateChange(V(s,j.categoryAxisLabelsRotation,t.target.value))}),[s]),I=t.useCallback((t=>{e.onStateChange(V(s,j.categoryAxisReverseOrder,t.value))}),[s]);return t.createElement(r.ExpansionPanel,{style:{maxWidth:"576px"},title:"scatter"===m?c.toLanguageString("chartWizard.format.xAxis.expandText",X.formatXAxis):c.toLanguageString("chartWizard.format.categoryAxis.expandText",X.formatCategoryAxis),expanded:h,tabIndex:0,onAction:p},t.createElement(x.Reveal,null,h&&t.createElement(r.ExpansionPanelContent,null,t.createElement(u.FormElement,{onKeyDown:b},t.createElement(J,{legend:c.toLanguageString("chartWizard.format.categoryAxis.title.expandText",X.formatCategoryAxisTitle)},t.createElement("div",{className:"k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4"},t.createElement(se,{className:"k-col-span-2"},t.createElement(f.Input,{placeholder:c.toLanguageString("chartWizard.format.categoryAxis.title.placeholder",X.formatCategoryAxisTitlePlaceholder),value:(null==(a=s.categoryAxis[0].title)?void 0:a.text)||"",onChange:C})),t.createElement(se,{className:"k-col-span-2",editorId:"categoryAxisTitleFont",labelText:c.toLanguageString("chartWizard.format.categoryAxis.title.font",X.formatCategoryAxisTitleFont)},t.createElement(g.ComboBox,{id:"categoryAxisTitleFont",data:K,textField:"text",dataItemKey:"value",itemRender:W,placeholder:c.toLanguageString("chartWizard.format.categoryAxis.title.fontPlaceholder",X.formatCategoryAxisTitleFontPlaceholder),value:K.find((e=>{var t,a;return e.value===(null==(a=G((null==(t=s.categoryAxis[0].title)?void 0:t.font)||""))?void 0:a.name)}))||T,onChange:E,...P})),t.createElement(se,{editorId:"categoryAxisTitleFontSize",labelText:c.toLanguageString("chartWizard.format.categoryAxis.title.size",X.formatCategoryAxisTitleSize)},t.createElement(g.ComboBox,{id:"categoryAxisTitleFontSize",data:D,textField:"text",dataItemKey:"value",placeholder:c.toLanguageString("chartWizard.format.categoryAxis.title.sizePlaceholder",X.formatCategoryAxisTitleSizePlaceholder),value:D.find((e=>{var t,a;return e.value===(null==(a=G((null==(t=s.categoryAxis[0].title)?void 0:t.font)||""))?void 0:a.size)}))||T,onChange:S,allowCustom:!0,...P})),t.createElement(se,{editorId:"categoryAxisTitleColor",labelText:c.toLanguageString("chartWizard.format.categoryAxis.title.color",X.formatCategoryAxisTitleColor)},t.createElement(f.ColorPicker,{id:"categoryAxisTitleColor",view:"gradient",value:(null==(l=s.categoryAxis[0].title)?void 0:l.color)||"",onChange:k,fillMode:"outline"})))),t.createElement(J,{legend:c.toLanguageString("chartWizard.format.categoryAxis.labels.text",X.formatCategoryAxisLabels)},t.createElement("div",{className:"k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4"},t.createElement(se,{className:"k-col-span-2",editorId:"categoryAxisLabelsFont",labelText:c.toLanguageString("chartWizard.format.categoryAxis.labels.font",X.formatCategoryAxisLabelsFont)},t.createElement(g.ComboBox,{id:"categoryAxisLabelsFont",data:K,textField:"text",dataItemKey:"value",placeholder:c.toLanguageString("chartWizard.format.categoryAxis.labels.fontPlaceholder",X.formatCategoryAxisLabelsFontPlaceholder),value:K.find((e=>{var t,a;return e.value===(null==(a=G((null==(t=s.categoryAxis[0].labels)?void 0:t.font)||""))?void 0:a.name)}))||T,onChange:A,itemRender:W,...P})),t.createElement(se,{editorId:"categoryAxisLabelsFontSize",labelText:c.toLanguageString("chartWizard.format.categoryAxis.labels.size",X.formatCategoryAxisLabelsSize)},t.createElement(g.ComboBox,{id:"categoryAxisLabelsFontSize",data:D,textField:"text",dataItemKey:"value",placeholder:c.toLanguageString("chartWizard.format.categoryAxis.labels.sizePlaceholder",X.formatCategoryAxisLabelsSizePlaceholder),value:D.find((e=>{var t,a;return e.value===(null==(a=G((null==(t=s.categoryAxis[0].labels)?void 0:t.font)||""))?void 0:a.size)}))||T,onChange:L,allowCustom:!0,...P})),t.createElement(se,{editorId:"categoryAxisLabelsColor",labelText:c.toLanguageString("chartWizard.format.categoryAxis.labels.color",X.formatCategoryAxisLabelsColor)},t.createElement(f.ColorPicker,{id:"categoryAxisLabelsColor",view:"gradient",value:(null==(n=s.categoryAxis[0].labels)?void 0:n.color)||"",onChange:z,fillMode:"outline"})),t.createElement(se,{editorId:"categoryAxisLabelsRotation",labelText:c.toLanguageString("chartWizard.format.categoryAxis.labels.rotation.text",X.formatCategoryAxisLabelsRotation)},t.createElement(f.NumericTextBox,{id:"categoryAxisLabelsRotation",value:"number"==typeof(null==(o=s.categoryAxis[0].labels)?void 0:o.rotation)?null==(i=s.categoryAxis[0].labels)?void 0:i.rotation:null,placeholder:c.toLanguageString("chartWizard.format.categoryAxis.labels.rotation.auto",X.formatCategoryAxisLabelsRotationAuto),onChange:y,fillMode:"outline",min:-360,max:360,step:1})),t.createElement(se,{className:"k-col-span-2"},t.createElement(f.Checkbox,{label:c.toLanguageString("chartWizard.format.categoryAxis.labels.reverseOrder",X.formatCategoryAxisLabelsReverseOrder),checked:s.categoryAxis[0].reverse||!1,onChange:I}))))))))},xe=e=>{var a,l,n,o,i,c,s,m,h,v;const p=d.useLocalization(),C=e.state,S=C.seriesType,E={text:p.toLanguageString("chartWizard.format.valueAxis.labelFormat.text",X.formatValueAxisLabelsFormatText),value:""},k=[{value:"n0",text:p.toLanguageString("chartWizard.format.valueAxis.labelFormat.number",X.formatValueAxisLabelsFormatNumber)},{value:"c0",text:p.toLanguageString("chartWizard.format.valueAxis.labelFormat.currency",X.formatValueAxisLabelsFormatCurrency)},{value:"p0",text:p.toLanguageString("chartWizard.format.valueAxis.labelFormat.percent",X.formatValueAxisLabelsFormatPercent)}],[L,A]=t.useState(!1),z=t.useCallback((e=>{A(!e.expanded)}),[]);return t.createElement(r.ExpansionPanel,{style:{maxWidth:"576px"},title:"scatter"===S?p.toLanguageString("chartWizard.format.yAxis.expandText",X.formatYAxis):p.toLanguageString("chartWizard.format.valueAxis.expandText",X.formatValueAxis),expanded:L,tabIndex:0,onAction:z},t.createElement(x.Reveal,null,L&&t.createElement(r.ExpansionPanelContent,null,t.createElement(u.FormElement,{onKeyDown:b},t.createElement(J,{legend:p.toLanguageString("chartWizard.format.valueAxis.title.text",X.formatValueAxisTitle)},t.createElement("div",{className:"k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4"},t.createElement(se,{className:"k-col-span-2"},t.createElement(f.Input,{placeholder:p.toLanguageString("chartWizard.format.valueAxis.title.placeholder",X.formatValueAxisTitlePlaceholder),value:(null==(l=null==(a=C.valueAxis[0])?void 0:a.title)?void 0:l.text)||"",onChange:t=>{e.onStateChange(V(C,j.valueAxisTitleText,t.target.value))}})),t.createElement(se,{className:"k-col-span-2",editorId:"valueAxisTitleFont",labelText:p.toLanguageString("chartWizard.format.valueAxis.title.font",X.formatValueAxisTitleFont)},t.createElement(g.ComboBox,{id:"valueAxisTitleFont",data:K,textField:"text",dataItemKey:"value",itemRender:W,placeholder:p.toLanguageString("chartWizard.format.valueAxis.title.fontPlaceholder",X.formatValueAxisTitleFontPlaceholder),value:K.find((e=>{var t,a,r;return e.value===(null==(r=G((null==(a=null==(t=C.valueAxis[0])?void 0:t.title)?void 0:a.font)||""))?void 0:r.name)}))||T,onChange:t=>{const a=t.target.value||T;e.onStateChange(V(C,j.valueAxisTitleFontName,a.value))},...P})),t.createElement(se,{editorId:"valueAxisTitleFontSize",labelText:p.toLanguageString("chartWizard.format.valueAxis.title.size",X.formatValueAxisTitleSize)},t.createElement(g.ComboBox,{id:"valueAxisTitleFontSize",data:D,textField:"text",dataItemKey:"value",placeholder:p.toLanguageString("chartWizard.format.valueAxis.title.sizePlaceholder",X.formatValueAxisTitleSizePlaceholder),value:D.find((e=>{var t,a,r;return e.value===(null==(r=G((null==(a=null==(t=C.valueAxis[0])?void 0:t.title)?void 0:a.font)||""))?void 0:r.size)}))||T,onChange:t=>{const a=t.target.value||T;F(a)&&e.onStateChange(V(C,j.valueAxisTitleFontSize,a.value))},allowCustom:!0,...P})),t.createElement(se,{editorId:"valueAxisTitleColor",labelText:p.toLanguageString("chartWizard.format.valueAxis.title.color",X.formatValueAxisTitleColor)},t.createElement(f.ColorPicker,{id:"valueAxisTitleColor",view:"gradient",value:(null==(o=null==(n=C.valueAxis[0])?void 0:n.title)?void 0:o.color)||"",onChange:t=>{e.onStateChange(V(C,j.valueAxisTitleColor,t.value))},fillMode:"outline"})))),t.createElement(J,{legend:p.toLanguageString("chartWizard.format.valueAxis.labels.text",X.formatValueAxisLabels)},t.createElement("div",{className:"k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4"},t.createElement(se,{className:"k-col-span-2",editorId:"valueAxisLabelsFormat",labelText:p.toLanguageString("chartWizard.format.valueAxis.labelFormat",X.formatValueAxisLabelsFormat)},t.createElement(g.DropDownList,{id:"valueAxisLabelsFormat",data:k,textField:"text",dataItemKey:"value",defaultItem:E,value:k.find((e=>{var t,a;return e.value===(null==(a=null==(t=C.valueAxis[0])?void 0:t.labels)?void 0:a.format)}))||E,onChange:t=>{const a=t.target.value;e.onStateChange(V(C,j.valueAxisLabelsFormat,a.value))},...P})),t.createElement(se,{className:"k-col-span-2",editorId:"valueAxisLabelsFont",labelText:p.toLanguageString("chartWizard.format.valueAxis.labels.font",X.formatValueAxisLabelsFont)},t.createElement(g.ComboBox,{id:"valueAxisLabelsFont",data:K,textField:"text",dataItemKey:"value",placeholder:p.toLanguageString("chartWizard.format.valueAxis.labels.fontPlaceholder",X.formatValueAxisLabelsFontPlaceholder),value:K.find((e=>{var t,a,r;return e.value===(null==(r=G((null==(a=null==(t=C.valueAxis[0])?void 0:t.labels)?void 0:a.font)||""))?void 0:r.name)}))||T,onChange:t=>{const a=t.target.value||T;e.onStateChange(V(C,j.valueAxisLabelsFontName,a.value))},itemRender:W,...P})),t.createElement(se,{editorId:"valueAxisLabelsFontSize",labelText:p.toLanguageString("chartWizard.format.valueAxis.labels.size",X.formatValueAxisLabelsSize)},t.createElement(g.ComboBox,{id:"valueAxisLabelsFontSize",data:D,textField:"text",dataItemKey:"value",placeholder:p.toLanguageString("chartWizard.format.valueAxis.labels.sizePlaceholder",X.formatValueAxisLabelsSizePlaceholder),value:D.find((e=>{var t,a,r;return e.value===(null==(r=G((null==(a=null==(t=C.valueAxis[0])?void 0:t.labels)?void 0:a.font)||""))?void 0:r.size)}))||T,onChange:t=>{const a=t.target.value||T;F(a)&&e.onStateChange(V(C,j.valueAxisLabelsFontSize,a.value))},allowCustom:!0,...P})),t.createElement(se,{editorId:"valueAxisLabelsColor",labelText:p.toLanguageString("chartWizard.format.valueAxis.labels.color",X.formatValueAxisLabelsColor)},t.createElement(f.ColorPicker,{id:"valueAxisLabelsColor",view:"gradient",value:(null==(c=null==(i=C.valueAxis[0])?void 0:i.labels)?void 0:c.color)||"",onChange:t=>{e.onStateChange(V(C,j.valueAxisLabelsColor,t.value))},fillMode:"outline"})),t.createElement(se,{editorId:"valueAxisLabelsRotation",labelText:p.toLanguageString("chartWizard.format.valueAxis.labels.rotation.text",X.formatValueAxisLabelsRotation)},t.createElement(f.NumericTextBox,{id:"valueAxisLabelsRotation",value:"number"==typeof(null==(m=null==(s=C.valueAxis[0])?void 0:s.labels)?void 0:m.rotation)?null==(v=null==(h=C.valueAxis[0])?void 0:h.labels)?void 0:v.rotation:null,placeholder:p.toLanguageString("chartWizard.format.valueAxis.labels.rotation.auto",X.formatValueAxisLabelsRotationAuto),onChange:t=>{e.onStateChange(V(C,j.valueAxisLabelsRotation,t.target.value))},fillMode:"outline",min:-360,max:360,step:1}))))))))},ve=e=>t.createElement("div",{className:"k-chart-types-wrapper",onKeyDown:b},e.children),fe=e=>{const a=t.useCallback((t=>{("Enter"===t.key||" "===t.key)&&(t.preventDefault(),e.onClick.call(void 0))}),[e.onClick]);return t.createElement("div",{className:h.classNames("k-icon-text-wrapper",{"k-selected":e.selected}),onClick:e.onClick},t.createElement("div",{className:"k-icon-background-area",tabIndex:0,onKeyDown:a},t.createElement(h.IconWrap,{name:e.iconName,icon:e.icon,size:"xlarge",className:"k-svg-i-chart-bar-clustered"})),e.children)},pe=e=>{const t=d.useLocalization(),a=e.state,l=a.seriesType,{isStackFalse:o,isStackNormal:i,isStack100:c}=R(a),[s,u]=C.useState(!0),g=C.useCallback((e=>{u(!e.expanded)}),[]);return C.createElement(r.ExpansionPanel,{style:{maxWidth:"576px"},title:t.toLanguageString("chartWizard.chart.barChart.expandText",X.barChart),expanded:s,tabIndex:0,onAction:g},C.createElement(x.Reveal,null,s&&C.createElement(r.ExpansionPanelContent,null,C.createElement(ve,null,C.createElement(fe,{selected:"bar"===l&&o,onClick:()=>{e.onStateChange(q(a,M(a.data,"bar")))},icon:n.chartBarClusteredIcon,iconName:"chart-bar-clustered"},t.toLanguageString("chartWizard.chart.barChart.bar",X.barChartBar)),C.createElement(fe,{selected:"bar"===l&&i,onClick:()=>{const t=q(a,M(a.data,"bar"));e.onStateChange(V(t,j.stacked,N))},icon:n.chartBarStackedIcon,iconName:"chart-bar-stacked"},t.toLanguageString("chartWizard.chart.barChart.stackedBar",X.barChartStackedBar)),C.createElement(fe,{selected:"bar"===l&&c,onClick:()=>{const t=q(a,M(a.data,"bar"));e.onStateChange(V(t,j.stacked,w))},icon:n.chartBarStacked100Icon,iconName:"chart-bar-stacked100"},t.toLanguageString("chartWizard.chart.barChart.100%stackedBar",X.barChart100StackedBar))))))},Ce=e=>{const t=d.useLocalization(),a=e.state,l=a.seriesType,{isStackFalse:o,isStackNormal:i,isStack100:c}=R(a),[s,u]=C.useState(!0),g=C.useCallback((e=>{u(!e.expanded)}),[]);return C.createElement(r.ExpansionPanel,{style:{maxWidth:"576px"},title:t.toLanguageString("chartWizard.chart.columnChart.expandText",X.columnChart),expanded:s,tabIndex:0,onAction:g},C.createElement(x.Reveal,null,s&&C.createElement(r.ExpansionPanelContent,null,C.createElement(ve,null,C.createElement(fe,{selected:"column"===l&&o,onClick:()=>{e.onStateChange(q(a,M(a.data,"column")))},icon:n.chartColumnClusteredIcon,iconName:"chart-column-clustered"},t.toLanguageString("chartWizard.chart.columnChart.column",X.columnChartColumn)),C.createElement(fe,{selected:"column"===l&&i,onClick:()=>{const t=q(a,M(a.data,"column"));e.onStateChange(V(t,j.stacked,N))},icon:n.chartColumnStackedIcon,iconName:"chart-column-stacked"},t.toLanguageString("chartWizard.chart.columnChart.stackedColumn",X.columnChartStackedColumn)),C.createElement(fe,{selected:"column"===l&&c,onClick:()=>{const t=q(a,M(a.data,"column"));e.onStateChange(V(t,j.stacked,w))},icon:n.chartColumnStacked100Icon,iconName:"chart-column-stacked100"},t.toLanguageString("chartWizard.chart.columnChart.100%stackedColumn",X.columnChart100StackedColumn))))))},be=e=>{const t=d.useLocalization(),a=e.state,l=a.seriesType,{isStackFalse:o,isStackNormal:i,isStack100:c}=R(a),[s,u]=C.useState(!0),g=C.useCallback((e=>{u(!e.expanded)}),[]);return C.createElement(r.ExpansionPanel,{style:{maxWidth:"576px"},title:t.toLanguageString("chartWizard.chart.lineChart.expandText",X.lineChart),expanded:s,tabIndex:0,onAction:g},C.createElement(x.Reveal,null,s&&C.createElement(r.ExpansionPanelContent,null,C.createElement(ve,null,C.createElement(fe,{selected:"line"===l&&o,onClick:()=>{e.onStateChange(q(a,M(a.data,"line")))},icon:n.chartLineIcon,iconName:"chart-line"},t.toLanguageString("chartWizard.chart.lineChart.line",X.lineChartLine)),C.createElement(fe,{selected:"line"===l&&i,onClick:()=>{const t=q(a,M(a.data,"line"));e.onStateChange(V(t,j.stacked,N))},icon:n.chartLineStackedIcon,iconName:"chart-line-stacked"},t.toLanguageString("chartWizard.chart.lineChart.stackedLine",X.lineChartStackedLine)),C.createElement(fe,{selected:"line"===l&&c,onClick:()=>{const t=q(a,M(a.data,"line"));e.onStateChange(V(t,j.stacked,w))},icon:n.chartLineStacked100Icon,iconName:"chart-line-stacked100"},t.toLanguageString("chartWizard.chart.lineChart.100%stackedLine",X.lineChart100StackedLine))))))},Se=e=>{const t=d.useLocalization(),a=e.state,l=a.seriesType,[o,i]=C.useState(!0),c=C.useCallback((e=>{i(!e.expanded)}),[]);return C.createElement(r.ExpansionPanel,{style:{maxWidth:"576px"},title:t.toLanguageString("chartWizard.chart.scatterChart.expandText",X.scatterChart),expanded:o,tabIndex:0,onAction:c},C.createElement(x.Reveal,null,o&&C.createElement(r.ExpansionPanelContent,null,C.createElement(ve,null,C.createElement(fe,{selected:"scatter"===l,onClick:()=>{e.onStateChange(q(a,M(a.data,"scatter")))},icon:n.chartScatterIcon,iconName:"chart-scatter"},t.toLanguageString("chartWizard.chart.scatterChart.scatter",X.scatterChartScatter))))))},Ee=e=>{const t=d.useLocalization(),a=e.state,l=a.seriesType,[o,i]=C.useState(!0),c=C.useCallback((e=>{i(!e.expanded)}),[]);return C.createElement(r.ExpansionPanel,{style:{maxWidth:"576px"},title:t.toLanguageString("chartWizard.chart.pieChart.expandText",X.pieChart),expanded:o,tabIndex:0,onAction:c},C.createElement(x.Reveal,null,o&&C.createElement(r.ExpansionPanelContent,null,C.createElement(ve,null,C.createElement(fe,{selected:"pie"===l,onClick:()=>{e.onStateChange(q(a,M(a.data,"pie")))},icon:n.chartPieIcon,iconName:"chart-pie"},t.toLanguageString("chartWizard.chart.pieChart.pie",X.pieChartPie))))))},ke=t.forwardRef(((e,a)=>{var r,l,n,o,c,s,d,u,g,m,h,x,v;const f=e.state;return t.createElement(i.Chart,{style:{width:"100%",height:"100%"},transitions:!1,ref:a},t.createElement(i.ChartTitle,{text:null==(r=f.title)?void 0:r.text,font:null==(l=f.title)?void 0:l.font,color:(null==(n=f.title)?void 0:n.color)||"#000"}),t.createElement(i.ChartSubtitle,{text:null==(o=f.subtitle)?void 0:o.text,font:null==(c=f.subtitle)?void 0:c.font,color:(null==(s=f.subtitle)?void 0:s.color)||"#000"}),t.createElement(i.ChartArea,{background:null==(d=f.area)?void 0:d.background,margin:f.area.margin}),f.categoryAxis&&t.createElement(i.ChartCategoryAxis,null,f.categoryAxis.map(((e,a)=>t.createElement(i.ChartCategoryAxisItem,{key:a,categories:e.categories,title:e.title&&{text:e.title.text,font:e.title.font,color:e.title.color},labels:e.labels&&{font:e.labels.font,color:e.labels.color,rotation:e.labels.rotation},reverse:e.reverse})))),f.valueAxis&&t.createElement(i.ChartValueAxis,null,f.valueAxis.map(((e,a)=>t.createElement(i.ChartValueAxisItem,{key:a,title:e.title&&{text:e.title.text,font:e.title.font,color:e.title.color},labels:e.labels&&{format:e.labels.format,font:e.labels.font,color:e.labels.color,rotation:e.labels.rotation}})))),t.createElement(i.ChartSeries,null,f.series.map(((e,a)=>t.createElement(i.ChartSeriesItem,{key:String(e.name)+a,...e})))),t.createElement(i.ChartLegend,{visible:null==(u=f.legend)?void 0:u.visible,position:null==(g=f.legend)?void 0:g.position,labels:{color:(null==(h=null==(m=f.legend)?void 0:m.labels)?void 0:h.color)||void 0,font:(null==(v=null==(x=f.legend)?void 0:x.labels)?void 0:v.font)||void 0}}))}));ke.displayName="ChartComponent";const Le=C.forwardRef(((e,t)=>{const o=d.useLocalization(),i=C.useRef(null),c=C.useRef(null),s=C.useCallback((t=>{var a;if(c.current){const r=new $(c.current,L(e.exportOptions));null==(a=e.onExport)||a.call(void 0,r),r.isDefaultPrevented()||t.item.exportHandler.call(void 0,r)}}),[e.onExport,e.exportOptions]),u=e.window||a.Window,[g,m]=C.useState({width:700,height:550}),[h,x]=C.useState("DEFAULT"),v=C.useCallback((e=>{m({width:e.width,height:e.height})}),[]),f=C.useCallback((e=>{x(e.state)}),[]),[p,b]=C.useState([{collapsible:!1},{size:"300px",collapsible:!1}]),S=C.useCallback((e=>{b(e.newState)}),[]),[E,k]=C.useState(0),T=C.useCallback((e=>{k(e.selected)}),[]),[W,I]=C.useState(B(e.data||[],"bar",e.defaultState)),F=t=>{var a;null==(a=e.onStateChange)||a.call(void 0,t),e.state||I(t)},P=e.state||W,N=C.useRef(P);N.current=P;const w=C.useRef(e);w.current=e;const R=C.useCallback((()=>({get chart(){return c.current},get state(){return N.current}})),[]);C.useImperativeHandle(t,R),C.useEffect((()=>{var t;if(N.current.seriesType&&e.data){const a=q(N.current,M(e.data,N.current.seriesType));null==(t=w.current.onStateChange)||t.call(void 0,a),w.current.state||I(a)}}),[e.data]),C.useEffect((()=>{var e,t;null==(t=null==(e=i.current)?void 0:e.element)||t.focus()}),[]);const D=P.seriesType;return C.createElement(u,{title:o.toLanguageString("chartWizard.window.title",X.windowTitle),className:"k-chart-wizard",modal:!0,resizable:!0,minimizeButton:()=>null,onClose:e.onClose,onResize:v,stage:h,onStageChange:f,...g},C.createElement(r.Splitter,{panes:p,onChange:S,className:"k-chart-wizard-splitter"},C.createElement("div",{className:"k-chart-wizard-preview-pane k-pane"},C.createElement("div",{className:"k-preview-pane-header"},C.createElement(l.DropDownButton,{ref:i,text:o.toLanguageString("chartWizard.export.button",X.exportButton),fillMode:"flat",svgIcon:n.exportIcon,icon:"export",onItemClick:s,items:[{svgIcon:n.filePdfIcon,icon:"file-pdf",exportHandler:A,text:o.toLanguageString("chartWizard.exportPDF.button",X.exportPDFButton)},{svgIcon:n.fileIcon,icon:"file",exportHandler:z,text:o.toLanguageString("chartWizard.exportSVG.button",X.exportSVGButton)},{svgIcon:n.fileImageIcon,icon:"file-image",exportHandler:y,text:o.toLanguageString("chartWizard.exportPNG.button",X.exportPNGButton)}]})),C.createElement("div",{className:"k-preview-pane-content",style:{height:"calc(100% - 50px)"}},C.createElement(ke,{ref:c,state:P}))),C.createElement("div",{className:"k-chart-wizard-property-pane k-pane k-pane-static"},C.createElement(r.TabStrip,{selected:E,onSelect:T,animation:!1},C.createElement(r.TabStripTab,{title:o.toLanguageString("chartWizard.tab.chart",X.tabChart)},C.createElement("div",null,C.createElement(pe,{state:P,onStateChange:F}),C.createElement(Ee,{state:P,onStateChange:F}),C.createElement(Ce,{state:P,onStateChange:F}),C.createElement(be,{state:P,onStateChange:F}),C.createElement(Se,{state:P,onStateChange:F}))),C.createElement(r.TabStripTab,{title:o.toLanguageString("chartWizard.tab.data",X.tabData)},C.createElement(ce,{state:P,onStateChange:F})),C.createElement(r.TabStripTab,{title:o.toLanguageString("chartWizard.tab.format",X.tabFormat)},C.createElement("div",null,C.createElement(de,{state:P,onStateChange:F}),C.createElement(ue,{state:P,onStateChange:F}),C.createElement(ge,{state:P,onStateChange:F}),C.createElement(me,{state:P,onStateChange:F}),"pie"!==D&&C.createElement(he,{state:P,onStateChange:F}),"pie"!==D&&C.createElement(xe,{state:P,onStateChange:F})))))))}));function Ae(e){const{grid:t,data:a,selectedState:r,dataItemKey:l}=e;if(!t)return[];const n=m.leafColumns(t.columns||[]),o=h.getter(l),i=h.getter("field"),c=h.getter("title"),s=new Map(a.map((e=>[String(o(e)),e]))),d=new Map(Array.from(s.keys()).map(((e,t)=>[e,t]))),u=Object.keys(r).sort(((e,t)=>(d.get(e)||0)-(d.get(t)||0))),g=[];return u.forEach((e=>{let t=r[e];if(t){!0===t&&(t=Array.from({length:n.length},((e,t)=>t)));const a=t.slice();a.sort(((e,t)=>e-t));const r=a.map((e=>({title:c(n[e]),field:i(n[e])})));g.push({dataItem:s.get(e),dataColumns:r})}})),g}Le.displayName="ChartWizard";const{getWizardDataFromDataRows:ze}=o.ChartWizardCommon;e.ChartWizard=Le,e.createState=M,e.getGridSelectedRows=Ae,e.getWizardDataFromDataRows=H,e.getWizardDataFromGridSelection=e=>ze(Ae(e))}));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-react-chart-wizard",
-  "version": "11.0.0-develop.8",
+  "version": "11.0.0",
   "description": "React Chart Wizard lets you create a chart using data from a Grid, another data-bound component, or an external source",
   "author": "Progress",
   "license": "SEE LICENSE IN LICENSE.md",
@@ -20,20 +20,20 @@
   "peerDependencies": {
     "@progress/kendo-drawing": "^1.21.2",
     "@progress/kendo-file-saver": "^1.0.1",
-    "@progress/kendo-licensing": "^1.5.1",
-    "@progress/kendo-react-animation": "11.0.0-develop.8",
-    "@progress/kendo-react-buttons": "11.0.0-develop.8",
-    "@progress/kendo-react-charts": "11.0.0-develop.8",
-    "@progress/kendo-react-common": "11.0.0-develop.8",
-    "@progress/kendo-react-dialogs": "11.0.0-develop.8",
-    "@progress/kendo-react-form": "11.0.0-develop.8",
-    "@progress/kendo-react-dropdowns": "11.0.0-develop.8",
-    "@progress/kendo-react-grid": "11.0.0-develop.8",
-    "@progress/kendo-react-inputs": "11.0.0-develop.8",
-    "@progress/kendo-react-intl": "11.0.0-develop.8",
-    "@progress/kendo-react-labels": "11.0.0-develop.8",
-    "@progress/kendo-react-layout": "11.0.0-develop.8",
-    "@progress/kendo-react-popup": "11.0.0-develop.8",
+    "@progress/kendo-licensing": "^1.6.0",
+    "@progress/kendo-react-animation": "11.0.0",
+    "@progress/kendo-react-buttons": "11.0.0",
+    "@progress/kendo-react-charts": "11.0.0",
+    "@progress/kendo-react-common": "11.0.0",
+    "@progress/kendo-react-dialogs": "11.0.0",
+    "@progress/kendo-react-form": "11.0.0",
+    "@progress/kendo-react-dropdowns": "11.0.0",
+    "@progress/kendo-react-grid": "11.0.0",
+    "@progress/kendo-react-inputs": "11.0.0",
+    "@progress/kendo-react-intl": "11.0.0",
+    "@progress/kendo-react-labels": "11.0.0",
+    "@progress/kendo-react-layout": "11.0.0",
+    "@progress/kendo-react-popup": "11.0.0",
     "@progress/kendo-svg-icons": "^4.0.0",
     "react": "^16.8.2 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc",
     "react-dom": "^16.8.2 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc"