cl-react-graph/docs/component---src-pages-grid-tsx-66d8309e86bc2bdccc06.js

React D3 Charts

"use strict";(self.webpackChunkdocs2=self.webpackChunkdocs2||[]).push([[853],{5039:function(e,t,n){n.r(t);var r=n(7294),i=n(7345),l=n(912),a=n(6759),s=n(1358),h=n(953);t.default=function(){var e=(0,i.z8)("90%"),t=e[0],n=e[1];return r.createElement(a.A,null,r.createElement("h2",null,"Grid"),r.createElement("p",null,"A grid must be placed inside a Base component."),r.createElement(s.V,null,r.createElement("div",{ref:t},r.createElement(i.XY,{width:n,height:200,title:"Grid example"},r.createElement(i.rj,{left:0,height:200,svgProps:{stroke:h.r.grey400,strokeOpacity:.2,strokeWidth:1},lines:{vertical:5,horizontal:3},width:n}))),r.createElement(l.U,{exampleCode:"import {\n  Base, \n  Grid,\n} from 'cl-react-graph;\n\nconst MyComponent = () => {\n  const [ref, width] = useWidth('90%');\n  return(\n    <Base\n    width={width}\n    height={200}\n    title=\"Grid example\"\n  >\n    <Grid\n      left={0}\n      height={200}\n      svgProps={{\n        'stroke': theme.grey400,\n        'strokeOpacity': 0.2,\n        'strokeWidth': 1,\n      }}\n      lines={{\n        vertical: 5,\n        horizontal: 3,\n      }}\n      width={width} />\n  </Base>\n  )\n}\n"})))}}}]);
//# sourceMappingURL=component---src-pages-grid-tsx-66d8309e86bc2bdccc06.js.map