@progress/kendo-react-chart-wizard 8.3.0-develop.9 → 8.3.0

package/components/panels/TitlePanel.mjs

@@ -0,0 +1,172 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+"use client";
+import * as t from "react";
+import { ExpansionPanel as P, ExpansionPanelContent as N } from "@progress/kendo-react-layout";
+import { FormElement as A } from "@progress/kendo-react-form";
+import { FormField as u } from "../FormField.mjs";
+import { stopPropagation as w, dropdownlistCommonProps as f, fontNames as p, parseFont as x, nullItem as g, itemRender as C, fontSizes as S, ActionTypes as n, updateState as T, ensureValue as K } from "../../utils.mjs";
+import { DropDownList as D, ComboBox as h } from "@progress/kendo-react-dropdowns";
+import { Input as R, ColorPicker as B } from "@progress/kendo-react-inputs";
+import { useLocalization as M } from "@progress/kendo-react-intl";
+import { formatTitleChartTitle as V, messages as o, formatTitleChartSubtitle as W, formatTitle as j, formatTitleApplyTo as q, formatTitleLabel as G, formatTitleFont as H, formatTitleFontPlaceholder as J, formatTitleSize as O, formatTitleSizePlaceholder as Q, formatTitleColor as U } from "../../messages.mjs";
+import { Reveal as X } from "@progress/kendo-react-animation";
+const nt = (c) => {
+  const l = M(), m = c.state, [v, F] = t.useState(!1), b = t.useCallback((e) => {
+    F(!e.expanded);
+  }, []), a = [
+    {
+      value: "chartTitle",
+      text: l.toLanguageString(V, o.formatTitleChartTitle)
+    },
+    {
+      value: "chartSubtitle",
+      text: l.toLanguageString(W, o.formatTitleChartSubtitle)
+    }
+  ], [i, E] = t.useState(a[0]), z = t.useCallback((e) => {
+    E(e.target.value);
+  }, []), L = (e) => {
+    const r = i.value === a[0].value ? n.titleText : n.subtitleText;
+    c.onStateChange(T(m, r, e.target.value));
+  }, y = (e) => {
+    const r = i.value === a[0].value ? n.titleFontName : n.subtitleFontName, d = e.target.value || g;
+    c.onStateChange(T(m, r, d.value));
+  }, I = (e) => {
+    const r = i.value === a[0].value ? n.titleFontSize : n.subtitleFontSize, d = e.target.value || g;
+    K(d) && c.onStateChange(T(m, r, d.value));
+  }, k = (e) => {
+    const r = i.value === a[0].value ? n.titleColor : n.subtitleColor;
+    c.onStateChange(T(m, r, e.value));
+  }, s = (i.value === a[0].value ? m.title : m.subtitle) || {
+    text: "",
+    font: "",
+    color: ""
+  };
+  return /* @__PURE__ */ t.createElement(
+    P,
+    {
+      style: { maxWidth: "576px" },
+      title: l.toLanguageString(j, o.formatTitle),
+      expanded: v,
+      tabIndex: 0,
+      onAction: b
+    },
+    /* @__PURE__ */ t.createElement(X, null, v && /* @__PURE__ */ t.createElement(N, null, /* @__PURE__ */ t.createElement(A, { onKeyDown: w }, /* @__PURE__ */ t.createElement("div", { className: "k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4" }, /* @__PURE__ */ t.createElement(
+      u,
+      {
+        className: "k-col-span-2",
+        editorId: "apply-to-title",
+        labelText: l.toLanguageString(
+          q,
+          o.formatTitleApplyTo
+        )
+      },
+      /* @__PURE__ */ t.createElement(
+        D,
+        {
+          id: "apply-to-title",
+          data: a,
+          textField: "text",
+          dataItemKey: "value",
+          value: a.find((e) => e.value === i.value),
+          onChange: z,
+          ...f
+        }
+      )
+    ), /* @__PURE__ */ t.createElement(
+      u,
+      {
+        className: "k-col-span-2",
+        editorId: "titleText",
+        labelText: l.toLanguageString(
+          G,
+          o.formatTitleLabel
+        )
+      },
+      /* @__PURE__ */ t.createElement(
+        R,
+        {
+          id: "titleText",
+          placeholder: i.value === a[0].value ? a[0].text : a[1].text,
+          value: s.text,
+          onChange: L
+        }
+      )
+    ), /* @__PURE__ */ t.createElement(
+      u,
+      {
+        className: "k-col-span-2",
+        editorId: "titleFont",
+        labelText: l.toLanguageString(H, o.formatTitleFont)
+      },
+      /* @__PURE__ */ t.createElement(
+        h,
+        {
+          id: "titleFont",
+          data: p,
+          textField: "text",
+          dataItemKey: "value",
+          placeholder: l.toLanguageString(
+            J,
+            o.formatTitleFontPlaceholder
+          ),
+          value: p.find((e) => e.value === x(s.font).name) || g,
+          onChange: y,
+          itemRender: C,
+          ...f
+        }
+      )
+    ), /* @__PURE__ */ t.createElement(
+      u,
+      {
+        editorId: "titleFontSize",
+        labelText: l.toLanguageString(O, o.formatTitleSize)
+      },
+      /* @__PURE__ */ t.createElement(
+        h,
+        {
+          id: "titleFontSize",
+          data: S,
+          textField: "text",
+          dataItemKey: "value",
+          placeholder: l.toLanguageString(
+            Q,
+            o.formatTitleSizePlaceholder
+          ),
+          value: S.find((e) => e.value === x(s.font).size) || g,
+          onChange: I,
+          itemRender: C,
+          allowCustom: !0,
+          ...f
+        }
+      )
+    ), /* @__PURE__ */ t.createElement(
+      u,
+      {
+        editorId: "titleColor",
+        labelText: l.toLanguageString(
+          U,
+          o.formatTitleColor
+        )
+      },
+      /* @__PURE__ */ t.createElement(
+        B,
+        {
+          id: "titleColor",
+          value: s.color || "",
+          onChange: k,
+          view: "gradient",
+          fillMode: "outline"
+        }
+      )
+    )))))
+  );
+};
+export {
+  nt as TitlePanel
+};

package/components/panels/ValueAxisPanel.js

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

package/components/panels/ValueAxisPanel.mjs

@@ -0,0 +1,332 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+"use client";
+import a from "react";
+import { ExpansionPanel as J, ExpansionPanelContent as O } from "@progress/kendo-react-layout";
+import { FormElement as Q } from "@progress/kendo-react-form";
+import { FormFieldSet as N } from "../FormFieldSet.mjs";
+import { FormField as u } from "../FormField.mjs";
+import { Input as U, ColorPicker as y, NumericTextBox as X } from "@progress/kendo-react-inputs";
+import { stopPropagation as Z, fontNames as c, itemRender as k, parseFont as d, nullItem as g, dropdownlistCommonProps as A, fontSizes as f, updateState as m, ActionTypes as x, ensureValue as R } from "../../utils.mjs";
+import { formatValueAxisLabelsFormatText as $, messages as o, formatValueAxisLabelsFormatNumber as ee, formatValueAxisLabelsFormatCurrency as ae, formatValueAxisLabelsFormatPercent as te, formatYAxis as le, formatValueAxis as oe, formatValueAxisTitle as ie, formatValueAxisTitlePlaceholder as ne, formatValueAxisTitleFont as se, formatValueAxisTitleFontPlaceholder as re, formatValueAxisTitleSize as ue, formatValueAxisTitleSizePlaceholder as me, formatValueAxisTitleColor as xe, formatValueAxisLabels as ge, formatValueAxisLabelsFormat as Ae, formatValueAxisLabelsFont as ce, formatValueAxisLabelsFontPlaceholder as de, formatValueAxisLabelsSize as fe, formatValueAxisLabelsSizePlaceholder as ve, formatValueAxisLabelsColor as Le, formatValueAxisLabelsRotation as be, formatValueAxisLabelsRotationAuto as Ve } from "../../messages.mjs";
+import { useLocalization as Se } from "@progress/kendo-react-intl";
+import { Reveal as Fe } from "@progress/kendo-react-animation";
+import { ComboBox as v, DropDownList as Ce } from "@progress/kendo-react-dropdowns";
+const we = (r) => {
+  var S, F, C, h, T, E, p, z, P, I;
+  const l = Se(), i = r.state, w = i.seriesType, L = {
+    text: l.toLanguageString($, o.formatValueAxisLabelsFormatText),
+    value: ""
+  }, b = [
+    {
+      value: "n0",
+      text: l.toLanguageString(
+        ee,
+        o.formatValueAxisLabelsFormatNumber
+      )
+    },
+    {
+      value: "c0",
+      text: l.toLanguageString(
+        ae,
+        o.formatValueAxisLabelsFormatCurrency
+      )
+    },
+    {
+      value: "p0",
+      text: l.toLanguageString(
+        te,
+        o.formatValueAxisLabelsFormatPercent
+      )
+    }
+  ], [V, K] = a.useState(!1), D = a.useCallback((e) => {
+    K(!e.expanded);
+  }, []), M = (e) => {
+    r.onStateChange(m(i, x.valueAxisTitleText, e.target.value));
+  }, B = (e) => {
+    const t = e.target.value || g;
+    R(t) && r.onStateChange(m(i, x.valueAxisTitleFontSize, t.value));
+  }, Y = (e) => {
+    const t = e.target.value || g;
+    r.onStateChange(m(i, x.valueAxisTitleFontName, t.value));
+  }, _ = (e) => {
+    r.onStateChange(m(i, x.valueAxisTitleColor, e.value));
+  }, W = (e) => {
+    const t = e.target.value || g;
+    R(t) && r.onStateChange(m(i, x.valueAxisLabelsFontSize, t.value));
+  }, j = (e) => {
+    const t = e.target.value || g;
+    r.onStateChange(m(i, x.valueAxisLabelsFontName, t.value));
+  }, q = (e) => {
+    r.onStateChange(m(i, x.valueAxisLabelsColor, e.value));
+  }, G = (e) => {
+    r.onStateChange(m(i, x.valueAxisLabelsRotation, e.target.value));
+  }, H = (e) => {
+    const t = e.target.value;
+    r.onStateChange(m(i, x.valueAxisLabelsFormat, t.value));
+  };
+  return /* @__PURE__ */ a.createElement(
+    J,
+    {
+      style: { maxWidth: "576px" },
+      title: w === "scatter" ? l.toLanguageString(le, o.formatYAxis) : l.toLanguageString(oe, o.formatValueAxis),
+      expanded: V,
+      tabIndex: 0,
+      onAction: D
+    },
+    /* @__PURE__ */ a.createElement(Fe, null, V && /* @__PURE__ */ a.createElement(O, null, /* @__PURE__ */ a.createElement(Q, { onKeyDown: Z }, /* @__PURE__ */ a.createElement(
+      N,
+      {
+        legend: l.toLanguageString(
+          ie,
+          o.formatValueAxisTitle
+        )
+      },
+      /* @__PURE__ */ a.createElement("div", { className: "k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4" }, /* @__PURE__ */ a.createElement(u, { className: "k-col-span-2" }, /* @__PURE__ */ a.createElement(
+        U,
+        {
+          placeholder: l.toLanguageString(
+            ne,
+            o.formatValueAxisTitlePlaceholder
+          ),
+          value: ((F = (S = i.valueAxis[0]) == null ? void 0 : S.title) == null ? void 0 : F.text) || "",
+          onChange: M
+        }
+      )), /* @__PURE__ */ a.createElement(
+        u,
+        {
+          className: "k-col-span-2",
+          editorId: "valueAxisTitleFont",
+          labelText: l.toLanguageString(
+            se,
+            o.formatValueAxisTitleFont
+          )
+        },
+        /* @__PURE__ */ a.createElement(
+          v,
+          {
+            id: "valueAxisTitleFont",
+            data: c,
+            textField: "text",
+            dataItemKey: "value",
+            itemRender: k,
+            placeholder: l.toLanguageString(
+              re,
+              o.formatValueAxisTitleFontPlaceholder
+            ),
+            value: c.find(
+              (e) => {
+                var t, n, s;
+                return e.value === ((s = d(((n = (t = i.valueAxis[0]) == null ? void 0 : t.title) == null ? void 0 : n.font) || "")) == null ? void 0 : s.name);
+              }
+            ) || g,
+            onChange: Y,
+            ...A
+          }
+        )
+      ), /* @__PURE__ */ a.createElement(
+        u,
+        {
+          editorId: "valueAxisTitleFontSize",
+          labelText: l.toLanguageString(
+            ue,
+            o.formatValueAxisTitleSize
+          )
+        },
+        /* @__PURE__ */ a.createElement(
+          v,
+          {
+            id: "valueAxisTitleFontSize",
+            data: f,
+            textField: "text",
+            dataItemKey: "value",
+            placeholder: l.toLanguageString(
+              me,
+              o.formatValueAxisTitleSizePlaceholder
+            ),
+            value: f.find(
+              (e) => {
+                var t, n, s;
+                return e.value === ((s = d(((n = (t = i.valueAxis[0]) == null ? void 0 : t.title) == null ? void 0 : n.font) || "")) == null ? void 0 : s.size);
+              }
+            ) || g,
+            onChange: B,
+            allowCustom: !0,
+            ...A
+          }
+        )
+      ), /* @__PURE__ */ a.createElement(
+        u,
+        {
+          editorId: "valueAxisTitleColor",
+          labelText: l.toLanguageString(
+            xe,
+            o.formatValueAxisTitleColor
+          )
+        },
+        /* @__PURE__ */ a.createElement(
+          y,
+          {
+            id: "valueAxisTitleColor",
+            view: "gradient",
+            value: ((h = (C = i.valueAxis[0]) == null ? void 0 : C.title) == null ? void 0 : h.color) || "",
+            onChange: _,
+            fillMode: "outline"
+          }
+        )
+      ))
+    ), /* @__PURE__ */ a.createElement(
+      N,
+      {
+        legend: l.toLanguageString(
+          ge,
+          o.formatValueAxisLabels
+        )
+      },
+      /* @__PURE__ */ a.createElement("div", { className: "k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4" }, /* @__PURE__ */ a.createElement(
+        u,
+        {
+          className: "k-col-span-2",
+          editorId: "valueAxisLabelsFormat",
+          labelText: l.toLanguageString(
+            Ae,
+            o.formatValueAxisLabelsFormat
+          )
+        },
+        /* @__PURE__ */ a.createElement(
+          Ce,
+          {
+            id: "valueAxisLabelsFormat",
+            data: b,
+            textField: "text",
+            dataItemKey: "value",
+            defaultItem: L,
+            value: b.find(
+              (e) => {
+                var t, n;
+                return e.value === ((n = (t = i.valueAxis[0]) == null ? void 0 : t.labels) == null ? void 0 : n.format);
+              }
+            ) || L,
+            onChange: H,
+            ...A
+          }
+        )
+      ), /* @__PURE__ */ a.createElement(
+        u,
+        {
+          className: "k-col-span-2",
+          editorId: "valueAxisLabelsFont",
+          labelText: l.toLanguageString(
+            ce,
+            o.formatValueAxisLabelsFont
+          )
+        },
+        /* @__PURE__ */ a.createElement(
+          v,
+          {
+            id: "valueAxisLabelsFont",
+            data: c,
+            textField: "text",
+            dataItemKey: "value",
+            placeholder: l.toLanguageString(
+              de,
+              o.formatValueAxisLabelsFontPlaceholder
+            ),
+            value: c.find(
+              (e) => {
+                var t, n, s;
+                return e.value === ((s = d(((n = (t = i.valueAxis[0]) == null ? void 0 : t.labels) == null ? void 0 : n.font) || "")) == null ? void 0 : s.name);
+              }
+            ) || g,
+            onChange: j,
+            itemRender: k,
+            ...A
+          }
+        )
+      ), /* @__PURE__ */ a.createElement(
+        u,
+        {
+          editorId: "valueAxisLabelsFontSize",
+          labelText: l.toLanguageString(
+            fe,
+            o.formatValueAxisLabelsSize
+          )
+        },
+        /* @__PURE__ */ a.createElement(
+          v,
+          {
+            id: "valueAxisLabelsFontSize",
+            data: f,
+            textField: "text",
+            dataItemKey: "value",
+            placeholder: l.toLanguageString(
+              ve,
+              o.formatValueAxisLabelsSizePlaceholder
+            ),
+            value: f.find(
+              (e) => {
+                var t, n, s;
+                return e.value === ((s = d(((n = (t = i.valueAxis[0]) == null ? void 0 : t.labels) == null ? void 0 : n.font) || "")) == null ? void 0 : s.size);
+              }
+            ) || g,
+            onChange: W,
+            allowCustom: !0,
+            ...A
+          }
+        )
+      ), /* @__PURE__ */ a.createElement(
+        u,
+        {
+          editorId: "valueAxisLabelsColor",
+          labelText: l.toLanguageString(
+            Le,
+            o.formatValueAxisLabelsColor
+          )
+        },
+        /* @__PURE__ */ a.createElement(
+          y,
+          {
+            id: "valueAxisLabelsColor",
+            view: "gradient",
+            value: ((E = (T = i.valueAxis[0]) == null ? void 0 : T.labels) == null ? void 0 : E.color) || "",
+            onChange: q,
+            fillMode: "outline"
+          }
+        )
+      ), /* @__PURE__ */ a.createElement(
+        u,
+        {
+          editorId: "valueAxisLabelsRotation",
+          labelText: l.toLanguageString(
+            be,
+            o.formatValueAxisLabelsRotation
+          )
+        },
+        /* @__PURE__ */ a.createElement(
+          X,
+          {
+            id: "valueAxisLabelsRotation",
+            value: typeof ((z = (p = i.valueAxis[0]) == null ? void 0 : p.labels) == null ? void 0 : z.rotation) == "number" ? (I = (P = i.valueAxis[0]) == null ? void 0 : P.labels) == null ? void 0 : I.rotation : null,
+            placeholder: l.toLanguageString(
+              Ve,
+              o.formatValueAxisLabelsRotationAuto
+            ),
+            onChange: G,
+            fillMode: "outline",
+            min: -360,
+            max: 360,
+            step: 1
+          }
+        )
+      ))
+    ))))
+  );
+};
+export {
+  we as ValueAxisPanel
+};