@progress/kendo-react-gauges 11.4.0-develop.3 → 11.4.0-develop.5
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/README.md +16 -0
- 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/README.md
CHANGED
|
@@ -51,6 +51,22 @@ Among the many features which the KendoReact Gauges deliver are:
|
|
|
51
51
|
- **Export**—The gauges can be exported to an image, a PDF or a SVG allowing to easily save them locally or on the server.
|
|
52
52
|
- [**Theme support**](https://www.telerik.com/kendo-react-ui/components/styling/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-gauges)—The KendoReact Gauges, as well as all 100+ components in the KendoReact suite, are styled in three polished themes (Bootstrap, Material, and Default) and can be further customized to match your specific design guidelines.
|
|
53
53
|
|
|
54
|
+
## Using for Free vs Commercial License
|
|
55
|
+
|
|
56
|
+
The following table outlines the key resources available with KendoReact and KendoReact Free.
|
|
57
|
+
|
|
58
|
+
| | [KendoReact Free](https://www.telerik.com/kendo-react-ui/components/free) | [KendoReact](https://www.telerik.com/kendo-react-ui) |
|
|
59
|
+
| -------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
60
|
+
| React components | 50+ | 120+ |
|
|
61
|
+
| Four professional themes | <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z" stroke="white" stroke-width="2"/></svg> | <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z" stroke="white" stroke-width="2"/></svg> |
|
|
62
|
+
| Four Figma UI Kits | <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z" stroke="white" stroke-width="2"/></svg> | <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z" stroke="white" stroke-width="2"/></svg> |
|
|
63
|
+
| Page Templates & Building Blocks | 1 template | <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z" stroke="white" stroke-width="2"/></svg> |
|
|
64
|
+
| ThemeBuilder | Free\* | Ultimate |
|
|
65
|
+
| Source code | No | <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z" stroke="white" stroke-width="2"/></svg> |
|
|
66
|
+
| Visual Studio Code extension | 1 starter template | Full functionality |
|
|
67
|
+
| Legendary customer support | No | <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z" stroke="white" stroke-width="2"/></svg> |
|
|
68
|
+
| AI coding assistant | No | <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z" stroke="white" stroke-width="2"/></svg> |
|
|
69
|
+
|
|
54
70
|
## Support Options
|
|
55
71
|
|
|
56
72
|
For any issues you might encounter while working with the KendoReact Gauges, use any of the available support channels:
|
|
@@ -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 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()))),16.666666666666668))};return a({}),{getState:()=>t,dispatch:a,subscribe:e=>(r.push(e),()=>r=r.filter((t=>t!==e)))}},c=(e,t)=>{if(!t.type)return{};switch(t.type){case"set":return h.themeItem(e,t);case"push":return Object.assign(e,t.payload);default:return e}},g=(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}},h={configurationItem:(e,t)=>Object.assign(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),Object.assign(e,{[r]:a})},themeItem(e,t){let s={};const r=Object.assign(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}},p=e=>"object"==typeof e,d=(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(p(r)&&p(n)?d(r,n):r!==n)return!0}return!1},m=(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(d(e[s],t[s]))return!0;return!1},f=l.createContext(null);f.displayName="GaugeContext";const v={name:"@progress/kendo-react-gauges",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate:0,version:"11.4.0-develop.
|
|
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 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()))),16.666666666666668))};return a({}),{getState:()=>t,dispatch:a,subscribe:e=>(r.push(e),()=>r=r.filter((t=>t!==e)))}},c=(e,t)=>{if(!t.type)return{};switch(t.type){case"set":return h.themeItem(e,t);case"push":return Object.assign(e,t.payload);default:return e}},g=(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}},h={configurationItem:(e,t)=>Object.assign(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),Object.assign(e,{[r]:a})},themeItem(e,t){let s={};const r=Object.assign(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}},p=e=>"object"==typeof e,d=(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(p(r)&&p(n)?d(r,n):r!==n)return!0}return!1},m=(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(d(e[s],t[s]))return!0;return!1},f=l.createContext(null);f.displayName="GaugeContext";const v={name:"@progress/kendo-react-gauges",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate:0,version:"11.4.0-develop.5",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(v,{component:"Gauge"}),this.themeStore=u(c),this.observersStore=u(g),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,...u}=this.props,{dir:c,children:g,deriveOptionsFromParent:h,getTarget:p,gaugeConstructor:d,className:f,renderAs:v,...b}=e;if(null!==this.gaugeInstance){const s=r.provideIntlService(this),n=this.gaugeInstance.contextService,a=s.locale!==n._intlService.locale,i=m(b,u),o=u;a&&(this.gaugeInstance.contextService._intlService=s,this.gaugeInstance.contextService.format._intlService=s,i||this.gaugeInstance.noTransitionsRedraw()),i||(l||"svg")!==(v||"svg")?this.refresh():Object.keys(u).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=Object.assign({},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,null)))}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=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)}};b.propTypes={dir:s.string,renderAs:s.oneOf(["svg","canvas"])},b.defaultProps={renderAs:"svg"};let y=b;r.registerForIntl(y);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 O=I;class G 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;return Object.assign({},e,{value:t,color:s,colors:r,opacity:n,scale:a})}}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(y,{...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(O,{render:s||t}))}exportVisual(e){return null!==this.gaugeInstance&&this.element?i.drawDOM(this.element,e):Promise.resolve(new i.Group)}}let _=class extends l.Component{constructor(){super(...arguments),this._baseGauge=null,this.getTarget=()=>this,this.deriveOptionsFromParent=e=>{const{pointer:t,scale:s}=this.props;return Object.assign({},e,{pointer:t,scale:s})}}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(y,{...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 C extends l.Component{constructor(){super(...arguments),this._baseGauge=null,this.getTarget=()=>this,this.deriveOptionsFromParent=e=>{const{pointer:t,scale:s}=this.props;return Object.assign({},e,{pointer:t,scale:s})}}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(y,{...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=G,e.CircularGauge=class extends G{constructor(){super(...arguments),this.gaugeType=a.CircularGauge}},e.LinearGauge=_,e.RadialGauge=C}));
|
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={name:"@progress/kendo-react-gauges",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate:
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={name:"@progress/kendo-react-gauges",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate: 1754053249,version:"11.4.0-develop.5",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"};exports.packageMetadata=e;
|
package/package-metadata.mjs
CHANGED
|
@@ -10,8 +10,8 @@ const e = {
|
|
|
10
10
|
productName: "KendoReact",
|
|
11
11
|
productCode: "KENDOUIREACT",
|
|
12
12
|
productCodes: ["KENDOUIREACT"],
|
|
13
|
-
publishDate:
|
|
14
|
-
version: "11.4.0-develop.
|
|
13
|
+
publishDate: 1754053249,
|
|
14
|
+
version: "11.4.0-develop.5",
|
|
15
15
|
licensingDocsUrl: "https://www.telerik.com/kendo-react-ui/components/my-license/"
|
|
16
16
|
};
|
|
17
17
|
export {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@progress/kendo-react-gauges",
|
|
3
|
-
"version": "11.4.0-develop.
|
|
3
|
+
"version": "11.4.0-develop.5",
|
|
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.6.0",
|
|
30
|
-
"@progress/kendo-react-common": "11.4.0-develop.
|
|
31
|
-
"@progress/kendo-react-intl": "11.4.0-develop.
|
|
30
|
+
"@progress/kendo-react-common": "11.4.0-develop.5",
|
|
31
|
+
"@progress/kendo-react-intl": "11.4.0-develop.5",
|
|
32
32
|
"react": "^16.8.2 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc",
|
|
33
33
|
"react-dom": "^16.8.2 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc"
|
|
34
34
|
},
|
|
@@ -59,7 +59,7 @@
|
|
|
59
59
|
"package": {
|
|
60
60
|
"productName": "KendoReact",
|
|
61
61
|
"productCode": "KENDOUIREACT",
|
|
62
|
-
"publishDate":
|
|
62
|
+
"publishDate": 1754053249,
|
|
63
63
|
"licensingDocsUrl": "https://www.telerik.com/kendo-react-ui/components/my-license/"
|
|
64
64
|
}
|
|
65
65
|
},
|