@progress/kendo-react-gauges 15.0.0 → 15.0.1-develop.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/ArcCenter.d.ts +2 -0
- package/ArcCenter.js +1 -1
- package/ArcCenter.mjs +25 -12
- package/dist/cdn/js/kendo-react-gauges.js +1 -1
- package/package-metadata.js +1 -1
- package/package-metadata.mjs +2 -2
- package/package.json +4 -4
package/ArcCenter.d.ts
CHANGED
|
@@ -50,9 +50,11 @@ declare class ArcCenter extends React.Component<ArcCenterProps, ArcCenterState>
|
|
|
50
50
|
readonly state: ArcCenterState;
|
|
51
51
|
gaugeObserver: InstanceObserver;
|
|
52
52
|
protected _element: HTMLDivElement | null;
|
|
53
|
+
private _gaugeInstance;
|
|
53
54
|
constructor(props: ArcCenterProps);
|
|
54
55
|
componentDidMount(): void;
|
|
55
56
|
render(): any;
|
|
57
|
+
componentDidUpdate(_prevProps: ArcCenterProps, prevState: ArcCenterState): void;
|
|
56
58
|
onRender(e: any): void;
|
|
57
59
|
}
|
|
58
60
|
export { ArcCenter };
|
package/ArcCenter.js
CHANGED
|
@@ -5,4 +5,4 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react"),
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react"),h=require("@progress/kendo-charts"),g=require("./GaugeContext.js");function d(s){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(s){for(const e in s)if(e!=="default"){const n=Object.getOwnPropertyDescriptor(s,e);Object.defineProperty(t,e,n.get?n:{enumerable:!0,get:()=>s[e]})}}return t.default=s,Object.freeze(t)}const l=d(u),c=class c extends l.Component{constructor(t){super(t),this.state={arcCenterStyles:null,arcCenterValue:{value:0,color:""}},this._element=null,this._gaugeInstance=null,this.gaugeObserver=new h.InstanceObserver(this,{render:"onRender"})}componentDidMount(){var t;(t=this.context)==null||t.observersStore.dispatch({type:"add",payload:this.gaugeObserver})}render(){const{render:t}=this.props,{arcCenterStyles:e,arcCenterValue:n}=this.state,o=e||{zIndex:-1};let r=null;return t&&(r=l.createElement("div",{className:"k-arcgauge-label",ref:i=>{this._element=i},style:o},t(n.value,n.color))),r}componentDidUpdate(t,e){if(!(!this._element||!this._gaugeInstance)&&(e.arcCenterValue.value!==this.state.arcCenterValue.value||e.arcCenterValue.color!==this.state.arcCenterValue.color)){const n=this._element.offsetWidth,o=this._element.offsetHeight,r=this._gaugeInstance.centerLabelPosition(n,o);this.setState({arcCenterStyles:{left:r.left,top:r.top}})}}onRender(t){if(!this._element)return;const e=t.sender.gaugeInstance;this._gaugeInstance=e;const n=this._element.offsetWidth,o=this._element.offsetHeight,r=e.centerLabelPosition(n,o);this.setState({arcCenterStyles:{left:r.left,top:r.top},arcCenterValue:{value:e.value(),color:e.currentColor()}})}};c.contextType=g.GaugeContext;let a=c;exports.ArcCenter=a;
|
package/ArcCenter.mjs
CHANGED
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
*/
|
|
8
8
|
import * as a from "react";
|
|
9
9
|
import { InstanceObserver as c } from "@progress/kendo-charts";
|
|
10
|
-
import { GaugeContext as
|
|
10
|
+
import { GaugeContext as h } from "./GaugeContext.mjs";
|
|
11
11
|
const o = class o extends a.Component {
|
|
12
12
|
constructor(e) {
|
|
13
13
|
super(e), this.state = {
|
|
@@ -16,7 +16,7 @@ const o = class o extends a.Component {
|
|
|
16
16
|
value: 0,
|
|
17
17
|
color: ""
|
|
18
18
|
}
|
|
19
|
-
}, this._element = null, this.gaugeObserver = new c(this, {
|
|
19
|
+
}, this._element = null, this._gaugeInstance = null, this.gaugeObserver = new c(this, {
|
|
20
20
|
render: "onRender"
|
|
21
21
|
});
|
|
22
22
|
}
|
|
@@ -28,28 +28,41 @@ const o = class o extends a.Component {
|
|
|
28
28
|
});
|
|
29
29
|
}
|
|
30
30
|
render() {
|
|
31
|
-
const { render: e } = this.props, { arcCenterStyles: t, arcCenterValue:
|
|
32
|
-
let
|
|
33
|
-
return e && (
|
|
31
|
+
const { render: e } = this.props, { arcCenterStyles: t, arcCenterValue: s } = this.state, r = t || { zIndex: -1 };
|
|
32
|
+
let n = null;
|
|
33
|
+
return e && (n = /* @__PURE__ */ a.createElement(
|
|
34
34
|
"div",
|
|
35
35
|
{
|
|
36
36
|
className: "k-arcgauge-label",
|
|
37
37
|
ref: (i) => {
|
|
38
38
|
this._element = i;
|
|
39
39
|
},
|
|
40
|
-
style:
|
|
40
|
+
style: r
|
|
41
41
|
},
|
|
42
|
-
e(
|
|
43
|
-
)),
|
|
42
|
+
e(s.value, s.color)
|
|
43
|
+
)), n;
|
|
44
|
+
}
|
|
45
|
+
componentDidUpdate(e, t) {
|
|
46
|
+
if (!(!this._element || !this._gaugeInstance) && (t.arcCenterValue.value !== this.state.arcCenterValue.value || t.arcCenterValue.color !== this.state.arcCenterValue.color)) {
|
|
47
|
+
const s = this._element.offsetWidth, r = this._element.offsetHeight, n = this._gaugeInstance.centerLabelPosition(s, r);
|
|
48
|
+
this.setState({
|
|
49
|
+
arcCenterStyles: {
|
|
50
|
+
left: n.left,
|
|
51
|
+
top: n.top
|
|
52
|
+
}
|
|
53
|
+
});
|
|
54
|
+
}
|
|
44
55
|
}
|
|
45
56
|
onRender(e) {
|
|
46
57
|
if (!this._element)
|
|
47
58
|
return;
|
|
48
|
-
const t = e.sender.gaugeInstance
|
|
59
|
+
const t = e.sender.gaugeInstance;
|
|
60
|
+
this._gaugeInstance = t;
|
|
61
|
+
const s = this._element.offsetWidth, r = this._element.offsetHeight, n = t.centerLabelPosition(s, r);
|
|
49
62
|
this.setState({
|
|
50
63
|
arcCenterStyles: {
|
|
51
|
-
left:
|
|
52
|
-
top:
|
|
64
|
+
left: n.left,
|
|
65
|
+
top: n.top
|
|
53
66
|
},
|
|
54
67
|
arcCenterValue: {
|
|
55
68
|
value: t.value(),
|
|
@@ -58,7 +71,7 @@ const o = class o extends a.Component {
|
|
|
58
71
|
});
|
|
59
72
|
}
|
|
60
73
|
};
|
|
61
|
-
o.contextType =
|
|
74
|
+
o.contextType = h;
|
|
62
75
|
let l = o;
|
|
63
76
|
export {
|
|
64
77
|
l as ArcCenter
|
|
@@ -12,4 +12,4 @@
|
|
|
12
12
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
13
13
|
*-------------------------------------------------------------------------------------------
|
|
14
14
|
*/
|
|
15
|
-
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("prop-types"),require("@progress/kendo-react-intl"),require("@progress/kendo-react-common"),require("@progress/kendo-charts"),require("@progress/kendo-drawing")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","@progress/kendo-react-intl","@progress/kendo-react-common","@progress/kendo-charts","@progress/kendo-drawing"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactGauges={},e.React,e.PropTypes,e.KendoReactIntl,e.KendoReactCommon,e.KendoCharts,e.KendoDrawing)}(this,function(e,t,s,r,n,a,i){"use strict";function o(e){var t=Object.create(null);return e&&Object.keys(e).forEach(function(s){if("default"!==s){var r=Object.getOwnPropertyDescriptor(e,s);Object.defineProperty(t,s,r.get?r:{enumerable:!0,get:function(){return e[s]}})}}),t.default=e,Object.freeze(t)}var l=o(t);const c=1e3/60,u=e=>{let t,s,r=[];const a=a=>{t=e(t,a),n.canUseDOM&&(window.clearTimeout(s),s=window.setTimeout(()=>r.forEach(e=>e()),c))};return a({}),{getState:()=>t,dispatch:a,subscribe:e=>(r.push(e),()=>r=r.filter(t=>t!==e))}},g=(e,t)=>{if(!t.type)return{};switch(t.type){case"set":return p.themeItem(e,t);case"push":return{...e,...t.payload};default:return e}},h=(e,t)=>{if(!t.type)return[];switch(t.type){case"add":return[...e,t.payload];case"remove":return e.filter(e=>e!==t.payload);default:return e}},p={configurationItem:(e,t)=>({...e,[t.gaugeKey]:t.payload}),collectionConfigurationItem(e,t){let s=!1;const[r,n]=t.gaugeCollectionIdxKey.split("_"),a=e[r].map((e,r)=>parseInt(n,10)===r?(s=!0,t.payload):e);return!1===s&&a.splice(parseInt(n,10),0,t.payload),{...e,[r]:a}},themeItem(e,t){let s={};const r={...s,...e},{field:n,value:a}=t.payload,i=n.split(".");let o=i.shift();for(;i.length>0;)s=s[o]=s[o]||{},o=i.shift();return s[o]=a,r}},d=e=>"object"==typeof e,m=(e,t)=>{if(Object.keys(e).length!==Object.keys(t).length)return!0;for(const s in e)if("value"!==s&&e.hasOwnProperty(s)){const r=e[s],n=t[s];if(d(r)&&d(n)?m(r,n):r!==n)return!0}return!1},f=l.createContext(null);f.displayName="GaugeContext";const y=Object.freeze({name:"@progress/kendo-react-gauges",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate:0,version:"15.0.0",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"}),b=class extends l.Component{constructor(e){super(e),this.gaugeInstance=null,this.surface=null,this._element=null,this.themeStore={},this.themeUnsubscriber=Function.prototype,this.observersStore={},this.showLicenseWatermark=!1,this.onWindowResize=()=>{null!==this.gaugeInstance&&(this.gaugeInstance.resize(),this.trigger("render",{sender:this}))},this.showLicenseWatermark=!n.validatePackage(y,{component:"Gauge"}),this.licenseMessage=n.getLicenseMessage(y),this.themeStore=u(g),this.observersStore=u(h),this.contextValue={observersStore:this.observersStore}}get element(){return this._element}componentDidMount(){this.element&&(this.themeStore.dispatch({type:"push",payload:a.gaugeTheme(this.element)}),this.instantiateCoreGauge()),this.themeUnsubscriber=this.themeStore.subscribe(this.refresh.bind(this)),window.addEventListener("resize",this.onWindowResize),this.trigger("render",{sender:this})}componentDidUpdate(e){const{dir:t,children:s,deriveOptionsFromParent:n,getTarget:a,gaugeConstructor:i,className:o,renderAs:l,...c}=this.props,{dir:u,children:g,deriveOptionsFromParent:h,getTarget:p,gaugeConstructor:d,className:f,renderAs:y,...b}=e;if(null!==this.gaugeInstance){const s=r.provideIntlService(this),n=this.gaugeInstance.contextService,a=s.locale!==n._intlService.locale,i=((e,t)=>{if(!e||!t||(e=[].concat(e),t=[].concat(t),e.length!==t.length))return!0;for(let s=0;s<e.length;s++)if(m(e[s],t[s]))return!0;return!1})(b,c),o=c;a&&(this.gaugeInstance.contextService._intlService=s,this.gaugeInstance.contextService.format._intlService=s,i||this.gaugeInstance.noTransitionsRedraw()),i||(l||"svg")!==(y||"svg")?this.refresh():Object.keys(c).indexOf("pointer")>-1?Array.isArray(o.pointer)?this.refreshAllValues(o.pointer.map(e=>e.value)):this.refreshValue((o.pointer||{}).value):this.refreshValue(o.value),e.dir!==t&&this.gaugeInstance.setDirection(this.getDirection(t)),this.trigger("render",{sender:this})}}componentWillUnmount(){this.themeUnsubscriber();const e=this.gaugeInstance&&this.gaugeInstance.surfaceElement;e&&e.parentNode&&e.parentNode.removeChild(e),null!==this.gaugeInstance&&(this.gaugeInstance.destroy(),this.gaugeInstance=null),window.removeEventListener("resize",this.onWindowResize)}render(){const{style:e={},className:t,children:s}=this.props,r={...e,position:"relative"};return l.createElement(f.Provider,{value:this.contextValue},l.createElement("div",{style:r,ref:e=>{this._element=e},className:t},s,this.showLicenseWatermark&&l.createElement(n.WatermarkOverlay,{message:this.licenseMessage})))}instantiateCoreGauge(){const{dir:e,gaugeConstructor:t}=this.props,s=this.getGaugeOptions();this.gaugeInstance=new t(this.element,s,this.themeStore.getState(),{rtl:this.getDirection(e),intlService:r.provideIntlService(this),sender:this})}refresh(){if(null!==this.gaugeInstance){const e=this.themeStore.getState(),t=this.getGaugeOptions();this.gaugeInstance.setOptions(t,e)}}refreshValue(e){this.gaugeInstance.value(e)}refreshAllValues(e){this.gaugeInstance.allValues(e)}getDirection(e){return"rtl"===(void 0!==e?e:n.canUseDOM&&window.getComputedStyle(this.element).direction||"ltr")}getGaugeOptions(){const{renderAs:e,transitions:t,deriveOptionsFromParent:s}=this.props;let r={renderAs:e,transitions:t};return s&&(r=s(r)),r}trigger(e,t){const s=this.observersStore.getState();for(let r=0;r<s.length;r++)s[r].trigger(e,t)}};b.propTypes={dir:s.string,renderAs:s.oneOf(["svg","canvas"])},b.defaultProps={renderAs:"svg"};let v=b;r.registerForIntl(v);const I=class extends l.Component{constructor(e){super(e),this.state={arcCenterStyles:null,arcCenterValue:{value:0,color:""}},this._element=null,this.gaugeObserver=new a.InstanceObserver(this,{render:"onRender"})}componentDidMount(){var e;null==(e=this.context)||e.observersStore.dispatch({type:"add",payload:this.gaugeObserver})}render(){const{render:e}=this.props,{arcCenterStyles:t,arcCenterValue:s}=this.state,r=t||{zIndex:-1};let n=null;return e&&(n=l.createElement("div",{className:"k-arcgauge-label",ref:e=>{this._element=e},style:r},e(s.value,s.color))),n}onRender(e){if(!this._element)return;const t=e.sender.gaugeInstance,s=this._element.offsetWidth,r=this._element.offsetHeight,n=t.centerLabelPosition(s,r);this.setState({arcCenterStyles:{left:n.left,top:n.top},arcCenterValue:{value:t.value(),color:t.currentColor()}})}};I.contextType=f;let G=I;const O=(e,t)=>{if(!(e=>"string"==typeof e&&(e.startsWith("--")||e.startsWith("var(")&&e.endsWith(")")))(e))return e;const s=t||document.documentElement,r=getComputedStyle(s);let n;if(e.startsWith("var(")&&e.endsWith(")")){n=e.slice(4,-1).trim();const t=n.indexOf(",");t>-1&&(n=n.substring(0,t).trim())}else{if(!e.startsWith("--"))return e;n=e}return r.getPropertyValue(n).trim()||e},k=(e,t)=>Array.isArray(e)?e.map(e=>((e,t)=>{if(!e||"object"!=typeof e)return e;const s={...e};return"string"==typeof e.color&&(s.color=O(e.color,t)),s})(e,t)):e,T=(e,t)=>{if(!e||"object"!=typeof e)return e;const s={...e};return"string"==typeof e.color&&(s.color=O(e.color,t)),s},C=(e,t)=>{if(!e||"object"!=typeof e)return e;const s={...e};return"string"==typeof e.color&&(s.color=O(e.color,t)),Array.isArray(e.colors)&&(s.colors=k(e.colors,t)),e.pointer&&(s.pointer=((e,t)=>e&&(Array.isArray(e)?e.map(e=>T(e,t)):T(e,t)))(e.pointer,t)),e.scale&&"object"==typeof e.scale&&(s.scale={...e.scale},Array.isArray(e.scale.ranges)&&(s.scale.ranges=k(e.scale.ranges,t)),e.scale.labels&&"object"==typeof e.scale.labels&&(s.scale.labels={...e.scale.labels},"string"==typeof e.scale.labels.color&&(s.scale.labels.color=O(e.scale.labels.color,t))),e.scale.majorTicks&&"object"==typeof e.scale.majorTicks&&(s.scale.majorTicks={...e.scale.majorTicks},"string"==typeof e.scale.majorTicks.color&&(s.scale.majorTicks.color=O(e.scale.majorTicks.color,t))),e.scale.minorTicks&&"object"==typeof e.scale.minorTicks&&(s.scale.minorTicks={...e.scale.minorTicks},"string"==typeof e.scale.minorTicks.color&&(s.scale.minorTicks.color=O(e.scale.minorTicks.color,t)))),s};class _ extends l.Component{constructor(){super(...arguments),this._baseGauge=null,this.gaugeType=a.ArcGauge,this.getTarget=()=>this,this.deriveOptionsFromParent=e=>{const{value:t,color:s,colors:r,opacity:n,scale:a}=this.props,i={...e,value:t,color:s,colors:r,opacity:n,scale:a};return this.element?C(i,this.element):i}}get gaugeInstance(){return this._baseGauge?this._baseGauge.gaugeInstance:null}get surface(){return this._baseGauge?this._baseGauge.surface:null}get element(){return this._baseGauge?this._baseGauge.element:null}render(){const{children:e,arcCenterRender:t,centerRender:s,className:r,...a}=this.props;return l.createElement(v,{...a,deriveOptionsFromParent:this.deriveOptionsFromParent,ref:e=>{this._baseGauge=e},gaugeConstructor:this.gaugeType,getTarget:this.getTarget,className:n.classNames("k-gauge k-arcgauge",r)},e,l.createElement(G,{render:s||t}))}exportVisual(e){return null!==this.gaugeInstance&&this.element?i.drawDOM(this.element,e):Promise.resolve(new i.Group)}}let w=class extends l.Component{constructor(){super(...arguments),this._baseGauge=null,this.getTarget=()=>this,this.deriveOptionsFromParent=e=>{const{pointer:t,scale:s}=this.props,r={...e,pointer:t,scale:s};return this.element?C(r,this.element):r}}get gaugeInstance(){return null!==this._baseGauge?this._baseGauge.gaugeInstance:null}get surface(){return null!==this._baseGauge?this._baseGauge.surface:null}get element(){return null!==this._baseGauge?this._baseGauge.element:null}render(){const{children:e,className:t,...s}=this.props;return l.createElement(v,{...s,deriveOptionsFromParent:this.deriveOptionsFromParent,ref:e=>{this._baseGauge=e},gaugeConstructor:a.LinearGauge,getTarget:this.getTarget,className:n.classNames("k-gauge",t)},e)}exportVisual(e){return null!==this.gaugeInstance?Promise.resolve(this.gaugeInstance.exportVisual(e)):Promise.resolve(new i.Group)}};class S extends l.Component{constructor(){super(...arguments),this._baseGauge=null,this.getTarget=()=>this,this.deriveOptionsFromParent=e=>{const{pointer:t,scale:s}=this.props,r={...e,pointer:t,scale:s};return this.element?C(r,this.element):r}}get gaugeInstance(){return null!==this._baseGauge?this._baseGauge.gaugeInstance:null}get surface(){return null!==this._baseGauge?this._baseGauge.surface:null}get element(){return null!==this._baseGauge?this._baseGauge.element:null}render(){const{children:e,className:t,...s}=this.props;return l.createElement(v,{...s,deriveOptionsFromParent:this.deriveOptionsFromParent,ref:e=>{this._baseGauge=e},gaugeConstructor:a.RadialGauge,getTarget:this.getTarget,className:n.classNames("k-gauge",t)},e)}exportVisual(e){return null!==this.gaugeInstance?Promise.resolve(this.gaugeInstance.exportVisual(e)):Promise.resolve(new i.Group)}}e.ArcGauge=_,e.CircularGauge=class extends _{constructor(){super(...arguments),this.gaugeType=a.CircularGauge}},e.LinearGauge=w,e.RadialGauge=S});
|
|
15
|
+
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("prop-types"),require("@progress/kendo-react-intl"),require("@progress/kendo-react-common"),require("@progress/kendo-charts"),require("@progress/kendo-drawing")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","@progress/kendo-react-intl","@progress/kendo-react-common","@progress/kendo-charts","@progress/kendo-drawing"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactGauges={},e.React,e.PropTypes,e.KendoReactIntl,e.KendoReactCommon,e.KendoCharts,e.KendoDrawing)}(this,function(e,t,s,r,n,a,i){"use strict";function o(e){var t=Object.create(null);return e&&Object.keys(e).forEach(function(s){if("default"!==s){var r=Object.getOwnPropertyDescriptor(e,s);Object.defineProperty(t,s,r.get?r:{enumerable:!0,get:function(){return e[s]}})}}),t.default=e,Object.freeze(t)}var l=o(t);const c=1e3/60,u=e=>{let t,s,r=[];const a=a=>{t=e(t,a),n.canUseDOM&&(window.clearTimeout(s),s=window.setTimeout(()=>r.forEach(e=>e()),c))};return a({}),{getState:()=>t,dispatch:a,subscribe:e=>(r.push(e),()=>r=r.filter(t=>t!==e))}},g=(e,t)=>{if(!t.type)return{};switch(t.type){case"set":return p.themeItem(e,t);case"push":return{...e,...t.payload};default:return e}},h=(e,t)=>{if(!t.type)return[];switch(t.type){case"add":return[...e,t.payload];case"remove":return e.filter(e=>e!==t.payload);default:return e}},p={configurationItem:(e,t)=>({...e,[t.gaugeKey]:t.payload}),collectionConfigurationItem(e,t){let s=!1;const[r,n]=t.gaugeCollectionIdxKey.split("_"),a=e[r].map((e,r)=>parseInt(n,10)===r?(s=!0,t.payload):e);return!1===s&&a.splice(parseInt(n,10),0,t.payload),{...e,[r]:a}},themeItem(e,t){let s={};const r={...s,...e},{field:n,value:a}=t.payload,i=n.split(".");let o=i.shift();for(;i.length>0;)s=s[o]=s[o]||{},o=i.shift();return s[o]=a,r}},d=e=>"object"==typeof e,m=(e,t)=>{if(Object.keys(e).length!==Object.keys(t).length)return!0;for(const s in e)if("value"!==s&&e.hasOwnProperty(s)){const r=e[s],n=t[s];if(d(r)&&d(n)?m(r,n):r!==n)return!0}return!1},f=l.createContext(null);f.displayName="GaugeContext";const y=Object.freeze({name:"@progress/kendo-react-gauges",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate:0,version:"15.0.1-develop.2",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"}),b=class extends l.Component{constructor(e){super(e),this.gaugeInstance=null,this.surface=null,this._element=null,this.themeStore={},this.themeUnsubscriber=Function.prototype,this.observersStore={},this.showLicenseWatermark=!1,this.onWindowResize=()=>{null!==this.gaugeInstance&&(this.gaugeInstance.resize(),this.trigger("render",{sender:this}))},this.showLicenseWatermark=!n.validatePackage(y,{component:"Gauge"}),this.licenseMessage=n.getLicenseMessage(y),this.themeStore=u(g),this.observersStore=u(h),this.contextValue={observersStore:this.observersStore}}get element(){return this._element}componentDidMount(){this.element&&(this.themeStore.dispatch({type:"push",payload:a.gaugeTheme(this.element)}),this.instantiateCoreGauge()),this.themeUnsubscriber=this.themeStore.subscribe(this.refresh.bind(this)),window.addEventListener("resize",this.onWindowResize),this.trigger("render",{sender:this})}componentDidUpdate(e){const{dir:t,children:s,deriveOptionsFromParent:n,getTarget:a,gaugeConstructor:i,className:o,renderAs:l,...c}=this.props,{dir:u,children:g,deriveOptionsFromParent:h,getTarget:p,gaugeConstructor:d,className:f,renderAs:y,...b}=e;if(null!==this.gaugeInstance){const s=r.provideIntlService(this),n=this.gaugeInstance.contextService,a=s.locale!==n._intlService.locale,i=((e,t)=>{if(!e||!t||(e=[].concat(e),t=[].concat(t),e.length!==t.length))return!0;for(let s=0;s<e.length;s++)if(m(e[s],t[s]))return!0;return!1})(b,c),o=c;a&&(this.gaugeInstance.contextService._intlService=s,this.gaugeInstance.contextService.format._intlService=s,i||this.gaugeInstance.noTransitionsRedraw()),i||(l||"svg")!==(y||"svg")?this.refresh():Object.keys(c).indexOf("pointer")>-1?Array.isArray(o.pointer)?this.refreshAllValues(o.pointer.map(e=>e.value)):this.refreshValue((o.pointer||{}).value):this.refreshValue(o.value),e.dir!==t&&this.gaugeInstance.setDirection(this.getDirection(t)),this.trigger("render",{sender:this})}}componentWillUnmount(){this.themeUnsubscriber();const e=this.gaugeInstance&&this.gaugeInstance.surfaceElement;e&&e.parentNode&&e.parentNode.removeChild(e),null!==this.gaugeInstance&&(this.gaugeInstance.destroy(),this.gaugeInstance=null),window.removeEventListener("resize",this.onWindowResize)}render(){const{style:e={},className:t,children:s}=this.props,r={...e,position:"relative"};return l.createElement(f.Provider,{value:this.contextValue},l.createElement("div",{style:r,ref:e=>{this._element=e},className:t},s,this.showLicenseWatermark&&l.createElement(n.WatermarkOverlay,{message:this.licenseMessage})))}instantiateCoreGauge(){const{dir:e,gaugeConstructor:t}=this.props,s=this.getGaugeOptions();this.gaugeInstance=new t(this.element,s,this.themeStore.getState(),{rtl:this.getDirection(e),intlService:r.provideIntlService(this),sender:this})}refresh(){if(null!==this.gaugeInstance){const e=this.themeStore.getState(),t=this.getGaugeOptions();this.gaugeInstance.setOptions(t,e)}}refreshValue(e){this.gaugeInstance.value(e)}refreshAllValues(e){this.gaugeInstance.allValues(e)}getDirection(e){return"rtl"===(void 0!==e?e:n.canUseDOM&&window.getComputedStyle(this.element).direction||"ltr")}getGaugeOptions(){const{renderAs:e,transitions:t,deriveOptionsFromParent:s}=this.props;let r={renderAs:e,transitions:t};return s&&(r=s(r)),r}trigger(e,t){const s=this.observersStore.getState();for(let r=0;r<s.length;r++)s[r].trigger(e,t)}};b.propTypes={dir:s.string,renderAs:s.oneOf(["svg","canvas"])},b.defaultProps={renderAs:"svg"};let v=b;r.registerForIntl(v);const I=class extends l.Component{constructor(e){super(e),this.state={arcCenterStyles:null,arcCenterValue:{value:0,color:""}},this._element=null,this._gaugeInstance=null,this.gaugeObserver=new a.InstanceObserver(this,{render:"onRender"})}componentDidMount(){var e;null==(e=this.context)||e.observersStore.dispatch({type:"add",payload:this.gaugeObserver})}render(){const{render:e}=this.props,{arcCenterStyles:t,arcCenterValue:s}=this.state,r=t||{zIndex:-1};let n=null;return e&&(n=l.createElement("div",{className:"k-arcgauge-label",ref:e=>{this._element=e},style:r},e(s.value,s.color))),n}componentDidUpdate(e,t){if(this._element&&this._gaugeInstance&&(t.arcCenterValue.value!==this.state.arcCenterValue.value||t.arcCenterValue.color!==this.state.arcCenterValue.color)){const e=this._element.offsetWidth,t=this._element.offsetHeight,s=this._gaugeInstance.centerLabelPosition(e,t);this.setState({arcCenterStyles:{left:s.left,top:s.top}})}}onRender(e){if(!this._element)return;const t=e.sender.gaugeInstance;this._gaugeInstance=t;const s=this._element.offsetWidth,r=this._element.offsetHeight,n=t.centerLabelPosition(s,r);this.setState({arcCenterStyles:{left:n.left,top:n.top},arcCenterValue:{value:t.value(),color:t.currentColor()}})}};I.contextType=f;let G=I;const _=(e,t)=>{if(!(e=>"string"==typeof e&&(e.startsWith("--")||e.startsWith("var(")&&e.endsWith(")")))(e))return e;const s=t||document.documentElement,r=getComputedStyle(s);let n;if(e.startsWith("var(")&&e.endsWith(")")){n=e.slice(4,-1).trim();const t=n.indexOf(",");t>-1&&(n=n.substring(0,t).trim())}else{if(!e.startsWith("--"))return e;n=e}return r.getPropertyValue(n).trim()||e},C=(e,t)=>Array.isArray(e)?e.map(e=>((e,t)=>{if(!e||"object"!=typeof e)return e;const s={...e};return"string"==typeof e.color&&(s.color=_(e.color,t)),s})(e,t)):e,O=(e,t)=>{if(!e||"object"!=typeof e)return e;const s={...e};return"string"==typeof e.color&&(s.color=_(e.color,t)),s},k=(e,t)=>{if(!e||"object"!=typeof e)return e;const s={...e};return"string"==typeof e.color&&(s.color=_(e.color,t)),Array.isArray(e.colors)&&(s.colors=C(e.colors,t)),e.pointer&&(s.pointer=((e,t)=>e&&(Array.isArray(e)?e.map(e=>O(e,t)):O(e,t)))(e.pointer,t)),e.scale&&"object"==typeof e.scale&&(s.scale={...e.scale},Array.isArray(e.scale.ranges)&&(s.scale.ranges=C(e.scale.ranges,t)),e.scale.labels&&"object"==typeof e.scale.labels&&(s.scale.labels={...e.scale.labels},"string"==typeof e.scale.labels.color&&(s.scale.labels.color=_(e.scale.labels.color,t))),e.scale.majorTicks&&"object"==typeof e.scale.majorTicks&&(s.scale.majorTicks={...e.scale.majorTicks},"string"==typeof e.scale.majorTicks.color&&(s.scale.majorTicks.color=_(e.scale.majorTicks.color,t))),e.scale.minorTicks&&"object"==typeof e.scale.minorTicks&&(s.scale.minorTicks={...e.scale.minorTicks},"string"==typeof e.scale.minorTicks.color&&(s.scale.minorTicks.color=_(e.scale.minorTicks.color,t)))),s};class T extends l.Component{constructor(){super(...arguments),this._baseGauge=null,this.gaugeType=a.ArcGauge,this.getTarget=()=>this,this.deriveOptionsFromParent=e=>{const{value:t,color:s,colors:r,opacity:n,scale:a}=this.props,i={...e,value:t,color:s,colors:r,opacity:n,scale:a};return this.element?k(i,this.element):i}}get gaugeInstance(){return this._baseGauge?this._baseGauge.gaugeInstance:null}get surface(){return this._baseGauge?this._baseGauge.surface:null}get element(){return this._baseGauge?this._baseGauge.element:null}render(){const{children:e,arcCenterRender:t,centerRender:s,className:r,...a}=this.props;return l.createElement(v,{...a,deriveOptionsFromParent:this.deriveOptionsFromParent,ref:e=>{this._baseGauge=e},gaugeConstructor:this.gaugeType,getTarget:this.getTarget,className:n.classNames("k-gauge k-arcgauge",r)},e,l.createElement(G,{render:s||t}))}exportVisual(e){return null!==this.gaugeInstance&&this.element?i.drawDOM(this.element,e):Promise.resolve(new i.Group)}}let S=class extends l.Component{constructor(){super(...arguments),this._baseGauge=null,this.getTarget=()=>this,this.deriveOptionsFromParent=e=>{const{pointer:t,scale:s}=this.props,r={...e,pointer:t,scale:s};return this.element?k(r,this.element):r}}get gaugeInstance(){return null!==this._baseGauge?this._baseGauge.gaugeInstance:null}get surface(){return null!==this._baseGauge?this._baseGauge.surface:null}get element(){return null!==this._baseGauge?this._baseGauge.element:null}render(){const{children:e,className:t,...s}=this.props;return l.createElement(v,{...s,deriveOptionsFromParent:this.deriveOptionsFromParent,ref:e=>{this._baseGauge=e},gaugeConstructor:a.LinearGauge,getTarget:this.getTarget,className:n.classNames("k-gauge",t)},e)}exportVisual(e){return null!==this.gaugeInstance?Promise.resolve(this.gaugeInstance.exportVisual(e)):Promise.resolve(new i.Group)}};class w extends l.Component{constructor(){super(...arguments),this._baseGauge=null,this.getTarget=()=>this,this.deriveOptionsFromParent=e=>{const{pointer:t,scale:s}=this.props,r={...e,pointer:t,scale:s};return this.element?k(r,this.element):r}}get gaugeInstance(){return null!==this._baseGauge?this._baseGauge.gaugeInstance:null}get surface(){return null!==this._baseGauge?this._baseGauge.surface:null}get element(){return null!==this._baseGauge?this._baseGauge.element:null}render(){const{children:e,className:t,...s}=this.props;return l.createElement(v,{...s,deriveOptionsFromParent:this.deriveOptionsFromParent,ref:e=>{this._baseGauge=e},gaugeConstructor:a.RadialGauge,getTarget:this.getTarget,className:n.classNames("k-gauge",t)},e)}exportVisual(e){return null!==this.gaugeInstance?Promise.resolve(this.gaugeInstance.exportVisual(e)):Promise.resolve(new i.Group)}}e.ArcGauge=T,e.CircularGauge=class extends T{constructor(){super(...arguments),this.gaugeType=a.CircularGauge}},e.LinearGauge=S,e.RadialGauge=w});
|
package/package-metadata.js
CHANGED
|
@@ -5,4 +5,4 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=Object.freeze({name:"@progress/kendo-react-gauges",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate:
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=Object.freeze({name:"@progress/kendo-react-gauges",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate: 1779865724,version:"15.0.1-develop.2",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"});exports.packageMetadata=e;
|
package/package-metadata.mjs
CHANGED
|
@@ -7,7 +7,7 @@ export const packageMetadata = Object.freeze({
|
|
|
7
7
|
productName: 'KendoReact',
|
|
8
8
|
productCode: 'KENDOUIREACT',
|
|
9
9
|
productCodes: ['KENDOUIREACT'],
|
|
10
|
-
publishDate:
|
|
11
|
-
version: '15.0.
|
|
10
|
+
publishDate: 1779865724,
|
|
11
|
+
version: '15.0.1-develop.2',
|
|
12
12
|
licensingDocsUrl: 'https://www.telerik.com/kendo-react-ui/components/my-license/'
|
|
13
13
|
});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@progress/kendo-react-gauges",
|
|
3
|
-
"version": "15.0.
|
|
3
|
+
"version": "15.0.1-develop.2",
|
|
4
4
|
"description": "React Gauges provide a set of React components for building beautiful and customizable gauges. KendoReact Gauges package",
|
|
5
5
|
"author": "Progress",
|
|
6
6
|
"license": "SEE LICENSE IN LICENSE.md",
|
|
@@ -27,8 +27,8 @@
|
|
|
27
27
|
"peerDependencies": {
|
|
28
28
|
"@progress/kendo-drawing": "^1.21.2",
|
|
29
29
|
"@progress/kendo-licensing": "^1.7.2",
|
|
30
|
-
"@progress/kendo-react-common": "15.0.
|
|
31
|
-
"@progress/kendo-react-intl": "15.0.
|
|
30
|
+
"@progress/kendo-react-common": "15.0.1-develop.2",
|
|
31
|
+
"@progress/kendo-react-intl": "15.0.1-develop.2",
|
|
32
32
|
"react": "^18.0.0 || ^19.0.0",
|
|
33
33
|
"react-dom": "^18.0.0 || ^19.0.0"
|
|
34
34
|
},
|
|
@@ -59,7 +59,7 @@
|
|
|
59
59
|
"package": {
|
|
60
60
|
"productName": "KendoReact",
|
|
61
61
|
"productCode": "KENDOUIREACT",
|
|
62
|
-
"publishDate":
|
|
62
|
+
"publishDate": 1779865724,
|
|
63
63
|
"licensingDocsUrl": "https://www.telerik.com/kendo-react-ui/components/my-license/"
|
|
64
64
|
}
|
|
65
65
|
},
|