@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 w=require("react"),m=require("prop-types"),l=require("@progress/kendo-react-intl"),v=require("./store/store.js"),f=require("./store/reducer.js"),k=require("./utils/common.js"),u=require("@progress/kendo-react-common"),A=require("./GaugeContext.js"),P=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 r=Object.getOwnPropertyDescriptor(n,t);Object.defineProperty(e,t,r.get?r:{enumerable:!0,get:()=>n[t]})}}return e.default=n,Object.freeze(e)}const o=R(w),c=class c extends o.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=!u.validatePackage(P.packageMetadata,{component:"Gauge"}),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:r,deriveOptionsFromParent:s,getTarget:d,gaugeConstructor:q,className:x,renderAs:S,...h}=this.props,{dir:W,children:T,deriveOptionsFromParent:j,getTarget:F,gaugeConstructor:G,className:V,renderAs:O,...b}=e;if(this.gaugeInstance!==null){const g=l.provideIntlService(this),I=this.gaugeInstance.contextService,y=g.locale!==I._intlService.locale,p=k.isOptionsChanged(b,h),i=h;y&&(this.gaugeInstance.contextService._intlService=g,this.gaugeInstance.contextService.format._intlService=g,p||this.gaugeInstance.noTransitionsRedraw()),p||(S||"svg")!==(O||"svg")?this.refresh():Object.keys(h).indexOf("pointer")>-1?Array.isArray(i.pointer)?this.refreshAllValues(i.pointer.map(C=>C.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:r}=this.props,s=Object.assign({},e,{position:"relative"});return o.createElement(A.GaugeContext.Provider,{value:this.contextValue},o.createElement("div",{style:s,ref:d=>this._element=d,className:t},r,this.showLicenseWatermark&&o.createElement(u.WatermarkOverlay,null)))}instantiateCoreGauge(){const{dir:e,gaugeConstructor:t}=this.props,r=this.getGaugeOptions();this.gaugeInstance=new t(this.element,r,this.themeStore.getState(),{rtl:this.getDirection(e),intlService:l.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:u.canUseDOM&&window.getComputedStyle(this.element).direction||"ltr")==="rtl"}getGaugeOptions(){const{renderAs:e,transitions:t,deriveOptionsFromParent:r}=this.props;let s=Object.assign({renderAs:e,transitions:t});return r&&(s=r(s)),s}trigger(e,t){const r=this.observersStore.getState();for(let s=0;s<r.length;s++)r[s].trigger(e,t)}};c.propTypes={dir:m.string,renderAs:m.oneOf(["svg","canvas"])},c.defaultProps={renderAs:"svg"};let a=c;l.registerForIntl(a);exports.BaseGauge=a;