scrivito-piechart
Version:
A piechart React component/Scrivito widget for the Scrivito CMS.
1 lines • 3.01 kB
JavaScript
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("scrivito"),require("react"),require("recharts")):"function"==typeof define&&define.amd?define(["scrivito","react","recharts"],t):"object"==typeof exports?exports["scrivito-piechart"]=t(require("scrivito"),require("react"),require("recharts")):e["scrivito-piechart"]=t(e.scrivito,e.react,e.recharts)}(window,(function(e,t,i){return function(e){var t={};function i(r){if(t[r])return t[r].exports;var n=t[r]={i:r,l:!1,exports:{}};return e[r].call(n.exports,n,n.exports,i),n.l=!0,n.exports}return i.m=e,i.c=t,i.d=function(e,t,r){i.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},i.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(e,t){if(1&t&&(e=i(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(i.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)i.d(r,n,function(t){return e[t]}.bind(null,n));return r},i.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(t,"a",t),t},i.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},i.p="",i(i.s=3)}([function(t,i){t.exports=e},function(e,i){e.exports=t},function(e,t){e.exports=i},function(e,t,i){"use strict";i.r(t);var r=i(0);r.provideWidgetClass("PieChartWidget",{attributes:{animatePiechart:["enum",{values:["Yes","No"]}],innerRadius:"integer",outerRadius:"integer",fillColor:"string",items:["widgetlist",{only:"PieChartItemWidget"}]}});r.provideEditingConfig("PieChartWidget",{title:"Pie Chart",attributes:{items:{title:"Piechart Values"},fillColor:{title:"Fill color",description:"Please enter a hex value e.g. #dfd343"}},properties:["animatePiechart","innerRadius","outerRadius","fillColor","items"],initialContent:{animatePichart:"Yes",fillColor:"#3367d6",outerRadius:"150",innerRadius:"50"}});var n=i(1),o=i(2);r.provideComponent("PieChartWidget",(function(e){var t=e.widget,i=t.get("items"),a="Yes"===t.get("animatePiechart"),u=t.get("innerRadius"),l=t.get("outerRadius"),s=t.get("fillColor"),c=2*l,d=i.map((function(e){return{name:e.get("name"),value:e.get("value")}}));return console.log(d),!i.length&&r.isInPlaceEditingActive()?n.createElement("h4",{className:"text-center"},"Provide the piechart values in the widget properties."):n.createElement(o.ResponsiveContainer,{width:"100%",height:c},n.createElement(o.PieChart,null,n.createElement(o.Pie,{dataKey:"value",nameKey:"name",data:d,isAnimationActive:a,innerRadius:u,outerRadius:l,fill:s,label:!0}),n.createElement(o.Tooltip,null)))})),r.provideEditingConfig("PieChartItemWidget",{title:"Pie values",attributes:{name:{title:"Name"},value:{title:"Value"}},properties:["name","value"]});r.provideWidgetClass("PieChartItemWidget",{onlyInside:"PieChartWidget",attributes:{name:"string",value:"integer"}})}])}));