@progress/kendo-react-gauges/BaseGauge.js

React Gauges provide a set of React components for building beautiful and customizable gauges. KendoReact Gauges package

/**
 * @license
 *-------------------------------------------------------------------------------------------
 * Copyright © 2025 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the package root for more information
 *-------------------------------------------------------------------------------------------
 */
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const k=require("react"),m=require("prop-types"),u=require("@progress/kendo-react-intl"),v=require("./store/store.js"),f=require("./store/reducer.js"),A=require("./utils/common.js"),o=require("@progress/kendo-react-common"),P=require("./GaugeContext.js"),S=require("./package-metadata.js"),D=require("@progress/kendo-charts");function R(n){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const t in n)if(t!=="default"){const s=Object.getOwnPropertyDescriptor(n,t);Object.defineProperty(e,t,s.get?s:{enumerable:!0,get:()=>n[t]})}}return e.default=n,Object.freeze(e)}const a=R(k),g=class g extends a.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=()=>{this.gaugeInstance!==null&&(this.gaugeInstance.resize(),this.trigger("render",{sender:this}))},this.showLicenseWatermark=!o.validatePackage(S.packageMetadata,{component:"Gauge"}),this.licenseMessage=o.getLicenseMessage(S.packageMetadata),this.themeStore=v.createStore(f.themeReducer),this.observersStore=v.createStore(f.observersReducer),this.contextValue={observersStore:this.observersStore}}get element(){return this._element}componentDidMount(){this.element&&(this.themeStore.dispatch({type:"push",payload:D.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:r,getTarget:d,gaugeConstructor:q,className:x,renderAs:O,...h}=this.props,{dir:M,children:W,deriveOptionsFromParent:T,getTarget:j,gaugeConstructor:F,className:G,renderAs:b,...I}=e;if(this.gaugeInstance!==null){const l=u.provideIntlService(this),y=this.gaugeInstance.contextService,C=l.locale!==y._intlService.locale,p=A.isOptionsChanged(I,h),i=h;C&&(this.gaugeInstance.contextService._intlService=l,this.gaugeInstance.contextService.format._intlService=l,p||this.gaugeInstance.noTransitionsRedraw()),p||(O||"svg")!==(b||"svg")?this.refresh():Object.keys(h).indexOf("pointer")>-1?Array.isArray(i.pointer)?this.refreshAllValues(i.pointer.map(w=>w.value)):this.refreshValue((i.pointer||{}).value):this.refreshValue(i.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),this.gaugeInstance!==null&&(this.gaugeInstance.destroy(),this.gaugeInstance=null),window.removeEventListener("resize",this.onWindowResize)}render(){const{style:e={},className:t,children:s}=this.props,r=Object.assign({},e,{position:"relative"});return a.createElement(P.GaugeContext.Provider,{value:this.contextValue},a.createElement("div",{style:r,ref:d=>{this._element=d},className:t},s,this.showLicenseWatermark&&a.createElement(o.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:u.provideIntlService(this),sender:this})}refresh(){if(this.gaugeInstance!==null){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(e!==void 0?e:o.canUseDOM&&window.getComputedStyle(this.element).direction||"ltr")==="rtl"}getGaugeOptions(){const{renderAs:e,transitions:t,deriveOptionsFromParent:s}=this.props;let r=Object.assign({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)}};g.propTypes={dir:m.string,renderAs:m.oneOf(["svg","canvas"])},g.defaultProps={renderAs:"svg"};let c=g;u.registerForIntl(c);exports.BaseGauge=c;