\n {loadingTexts.map((text: string, i: number) =>\n
\n )\n}\n","import { createStyles } from \"../../styles\";\n\nexport const styles = createStyles({\nslidersContainer: {\n display: 'flex',\n justifyContent: 'space-evenly',\n},\nslider: {\n margin: '8px',\n},\nsliderIcon: {\n height: '35px',\n width: 'auto'\n }\n})","var _defs, _line, _line2, _g;\n\nvar _excluded = [\"title\", \"titleId\"];\n\nfunction _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nfunction SvgVarmeforsyning(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, _excluded);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n id: \"Suncells\",\n xmlns: \"http://www.w3.org/2000/svg\",\n viewBox: \"0 0 66 74\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _defs || (_defs = /*#__PURE__*/React.createElement(\"defs\", null, /*#__PURE__*/React.createElement(\"style\", null, \"\\n .cls-varmeforsyning-1 {\\n fill: #589a8d;\\n }\\n\\n .cls-varmeforsyning-2 {\\n fill: #307265;\\n }\\n\\n .cls-varmeforsyning-3 {\\n fill: #fff;\\n stroke: #307265;\\n stroke-miterlimit: 10;\\n stroke-width: .5px;\\n }\\n \"))), _line || (_line = /*#__PURE__*/React.createElement(\"line\", {\n className: \"cls-varmeforsyning-3\",\n x1: 44.5,\n y1: 35.82,\n x2: 55.5,\n y2: 35.82\n })), _line2 || (_line2 = /*#__PURE__*/React.createElement(\"line\", {\n className: \"cls-varmeforsyning-3\",\n x1: 44.5,\n y1: 44.86,\n x2: 55.5,\n y2: 44.86\n })), _g || (_g = /*#__PURE__*/React.createElement(\"g\", null, /*#__PURE__*/React.createElement(\"g\", null, /*#__PURE__*/React.createElement(\"path\", {\n className: \"cls-varmeforsyning-1\",\n d: \"m7.03,57.75c-.98,0-1.78-.8-1.78-1.78v-31.68c0-.98.8-1.78,1.78-1.78h50.95c.98,0,1.78.8,1.78,1.78v31.68c0,.98-.8,1.78-1.78,1.78H7.03ZM23.97,25.75c-7.86,0-14.25,6.39-14.25,14.25s6.39,14.25,14.25,14.25,14.25-6.39,14.25-14.25-6.39-14.25-14.25-14.25Zm20.28,28h11.5v-26.5h-11.5v26.5Z\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n className: \"cls-varmeforsyning-2\",\n d: \"m57.97,22.76c.84,0,1.53.69,1.53,1.53v31.68c0,.84-.69,1.53-1.53,1.53H7.03c-.84,0-1.53-.69-1.53-1.53v-31.68c0-.84.69-1.53,1.53-1.53h50.95m-34,31.74c8,0,14.5-6.5,14.5-14.5s-6.5-14.5-14.5-14.5-14.5,6.5-14.5,14.5,6.5,14.5,14.5,14.5m20.03-.5h12v-27h-12v27m13.97-31.74H7.03c-1.12,0-2.03.91-2.03,2.03v31.68c0,1.12.91,2.03,2.03,2.03h50.95c1.12,0,2.03-.91,2.03-2.03v-31.68c0-1.12-.91-2.03-2.03-2.03h0Zm-34,31.74c-7.73,0-14-6.27-14-14s6.27-14,14-14,14,6.27,14,14-6.27,14-14,14h0Zm20.53-.5v-26h11v26h-11Z\"\n })), /*#__PURE__*/React.createElement(\"g\", null, /*#__PURE__*/React.createElement(\"path\", {\n className: \"cls-varmeforsyning-1\",\n d: \"m30.38,47.33c-2.4,0-4.42-1.69-6.03-5.03l-.07-.15-.28.02c-.68,0-1.29-.38-1.59-1l-.11-.23-8.38,4.35c-.02-.77.09-2.62,1.34-4.03,1.12-1.26,2.88-1.9,5.24-1.9.57,0,1.18.04,1.82.11l.15.02.09-.12c.33-.48.88-.76,1.46-.76h.25v-9.52c.73.36,2.44,1.38,3.05,3.3.6,1.87.05,4.1-1.63,6.64l-.6-.33.46.78c.17.29.25.59.25.9,0,.27-.07.55-.2.81l-.11.21,8.26,4.84c-.55.37-1.82,1.07-3.34,1.07h0Z\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n className: \"cls-varmeforsyning-2\",\n d: \"m24.5,29.51c.79.45,2.06,1.4,2.57,2.97.56,1.74.06,3.84-1.48,6.24l-1.09-.57v-8.64m0,8.74l.81,1.37c.15.25.22.51.22.78,0,.23-.06.47-.18.7l-.22.42.41.24,7.7,4.52c-.62.36-1.66.82-2.86.82-2.29,0-4.24-1.64-5.8-4.89l-.15-.3-.34.02s-.06,0-.1.01c-.58,0-1.11-.33-1.37-.86l-.23-.46-.45.23-7.78,4.04c.04-.86.26-2.31,1.27-3.45,1.07-1.2,2.76-1.82,5.05-1.82.56,0,1.16.04,1.79.11l.3.03.17-.24c.29-.41.76-.65,1.25-.65h.5v-.61m-.5-9.54v9.66c-.69,0-1.29.34-1.66.87-.66-.08-1.28-.11-1.85-.11-7.63,0-6.8,6.58-6.8,6.58l8.49-4.41c.33.67,1.02,1.14,1.82,1.14.05,0,.09-.01.13-.01,1.97,4.09,4.32,5.17,6.25,5.17,2.16,0,3.8-1.35,3.8-1.35l-8.38-4.92c.14-.28.23-.59.23-.92,0-.38-.11-.73-.29-1.03h0c5.44-8.01-1.75-10.66-1.75-10.66h0Z\"\n })))));\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgVarmeforsyning);\nexport default __webpack_public_path__ + \"static/media/Varmeforsyning.ba202825.svg\";\nexport { ForwardRef as ReactComponent };","var _defs, _path, _path2, _path3, _path4;\n\nvar _excluded = [\"title\", \"titleId\"];\n\nfunction _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nfunction SvgTransport(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, _excluded);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n id: \"Suncells\",\n xmlns: \"http://www.w3.org/2000/svg\",\n viewBox: \"0 0 66 74\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _defs || (_defs = /*#__PURE__*/React.createElement(\"defs\", null, /*#__PURE__*/React.createElement(\"style\", null, \"\\n .cls-transport-1 {\\n fill: #8fc1b5;\\n }\\n\\n .cls-transport-2 {\\n fill: #589a8d;\\n }\\n\\n .cls-transport-3 {\\n fill: none;\\n stroke: #8fc1b5;\\n stroke-miterlimit: 10;\\n stroke-width: 4px;\\n }\\n \"))), _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n className: \"cls-transport-2\",\n d: \"m13.11,52.37s10-2.22,17.77,1.11c7.78,3.33,7.22,6.11,19.44,4.44,0,0,7.22-19.44,7.22-23.88l-24.45-5.04-24.42,5.04s1.67,12.77,4.44,18.33Z\"\n })), _path2 || (_path2 = /*#__PURE__*/React.createElement(\"path\", {\n className: \"cls-transport-1\",\n d: \"m46.71,15.44s-.16-1.57-2.02-1.34l-23.62-.02s-1.57-.3-2.13,1.92l-2.78,13.33s16.63-3.17,16.92-2.97c.29.2,16.4,2.97,16.4,2.97l-2.78-13.88Zm-15.07,7.29h-10.57l.65-5.62h9.92v5.62Zm2.37,0v-5.62h9.62l1.05,5.62h-10.67Z\"\n })), _path3 || (_path3 = /*#__PURE__*/React.createElement(\"path\", {\n className: \"cls-transport-3\",\n d: \"m7,60.15s12.18-8.33,25.53,0c13.35,8.33,24,.83,24,.83\"\n })), _path4 || (_path4 = /*#__PURE__*/React.createElement(\"path\", {\n className: \"cls-transport-2\",\n d: \"m32.14,6h1.37c.85,0,1.54.69,1.54,1.54v4.02h-4.44v-4.01c0-.85.69-1.54,1.54-1.54Z\"\n })));\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgTransport);\nexport default __webpack_public_path__ + \"static/media/Transport.0651ba53.svg\";\nexport { ForwardRef as ReactComponent };","import { DateMode } from \"../dashboard/Dashboard.types\"\n\n\nexport interface ConsumptionSlidersProps {\n onHeatSupplyChanged: (value: number) => void\n onTransportChanged: (value: number) => void\n onPowerToXChanged: (value: number) => void\n onMiscellaneousChanged: (value: number) => void\n dateMode: DateMode,\n forecast: Forecast,\n steps?: number,\n isBigScreen?: boolean\n}\n \nexport interface SliderConf {\n max: number,\n stepSize: number\n}\n\nexport enum Forecast {\n start = \"start\",\n mid = \"mid\",\n end = \"end\"\n}","import { styles } from \"./ConsumptionSliders.style\"\nimport { ReactComponent as PowerToX } from './../../img/Power-to-X.svg'\nimport { ReactComponent as HeatSupply } from './../../img/Varmeforsyning.svg'\nimport { ReactComponent as Transport } from './../../img/Transport.svg'\nimport { useCallback, useEffect, useState } from \"react\"\nimport { HorizontalModeValuePosition, IconSlider, LabelPosition, SliderOrientation } from \"dataviz-lib\"\nimport { Forecast, ConsumptionSlidersProps, SliderConf } from \"./ConsumptionSliders.types\"\nimport { DateMode } from \"../dashboard/Dashboard.types\"\nimport { valueWithDecimalsAndLocale } from \"../../util/format-utils\"\n\n//MWh - fra Sweco analysen\nconst FORECASTS = {\n powerToX: new Map\n \n {text}\n
\n )}\n \n
\n )\n}","var _defs, _g;\n\nvar _excluded = [\"title\", \"titleId\"];\n\nfunction _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nimport * as React from \"react\";\n\nfunction SvgSolcellerNyE(_ref, svgRef) {\n var title = _ref.title,\n titleId = _ref.titleId,\n props = _objectWithoutProperties(_ref, _excluded);\n\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n xmlns: \"http://www.w3.org/2000/svg\",\n width: \"34.991146mm\",\n height: \"18.928291mm\",\n viewBox: \"0 0 34.991146 18.928291\",\n id: \"svg8\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _defs || (_defs = /*#__PURE__*/React.createElement(\"defs\", {\n id: \"defs2\"\n }, /*#__PURE__*/React.createElement(\"style\", {\n id: \"style833\"\n }, \".cls-solceller-1{fill:#589a8d;}.cls-solceller-2{fill:#8fc1b5;}\"), /*#__PURE__*/React.createElement(\"style\", {\n id: \"style960\"\n }, \".cls-solceller-1{stroke:#dff4ee;stroke-miterlimit:10;stroke-width:.25px;}.cls-solceller-1,.cls-solceller-2{fill:#dff4ee;}.cls-solceller-3{fill:#589a8d;}.cls-solceller-4{fill:#8fc1b5;}\"))), _g || (_g = /*#__PURE__*/React.createElement(\"g\", {\n id: \"layer1\",\n transform: \"translate(-32.775261,-57.43764)\"\n }, /*#__PURE__*/React.createElement(\"g\", {\n id: \"g1096\",\n transform: \"matrix(0.26458333,0,0,0.26458333,32.775261,57.43764)\"\n }, /*#__PURE__*/React.createElement(\"g\", {\n id: \"g994\"\n }, /*#__PURE__*/React.createElement(\"g\", {\n id: \"g968\"\n }, /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-3\",\n points: \"89.47,61.12 90.7,58.81 106.89,58.81 105.65,61.12 \",\n id: \"polygon964\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n className: \"cls-solceller-3\",\n d: \"m 106.05,59.31 -0.7,1.3 H 90.3 l 0.7,-1.3 h 15.05 m 1.67,-1 H 90.4 l -1.77,3.3 h 17.32 z\",\n id: \"path966\"\n })), /*#__PURE__*/React.createElement(\"g\", {\n id: \"g974\"\n }, /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-3\",\n points: \"66.38,45.56 71.08,0.5 131.7,0.5 127,45.56 \",\n id: \"polygon970\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n className: \"cls-solceller-3\",\n d: \"m 131.14,1 -4.6,44.06 H 66.93 L 71.53,1 h 59.61 m 1.11,-1 H 70.63 l -4.81,46.06 h 61.62 z\",\n id: \"path972\"\n })), /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-2\",\n points: \"88.41,21.77 70.75,21.77 72.55,3.07 90.21,3.07 \",\n id: \"polygon976\"\n }), /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-2\",\n points: \"86.25,43.18 68.59,43.18 70.39,24.48 88.05,24.48 \",\n id: \"polygon978\"\n }), /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-2\",\n points: \"108.06,21.74 90.4,21.74 92.2,3.04 109.86,3.04 \",\n id: \"polygon980\"\n }), /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-2\",\n points: \"105.9,43.14 88.24,43.14 90.04,24.44 107.7,24.44 \",\n id: \"polygon982\"\n }), /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-2\",\n points: \"127.65,21.74 109.99,21.74 111.79,3.04 129.45,3.04 \",\n id: \"polygon984\"\n }), /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-2\",\n points: \"125.49,43.14 107.83,43.14 109.63,24.44 127.29,24.44 \",\n id: \"polygon986\"\n }), /*#__PURE__*/React.createElement(\"g\", {\n id: \"g992\"\n }, /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-3\",\n points: \"97.63,59.49 97.9,46.56 100.57,46.56 100.3,59.49 \",\n id: \"polygon988\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n className: \"cls-solceller-3\",\n d: \"m 100.06,47.06 -0.25,11.93 h -1.67 l 0.25,-11.93 h 1.67 m 1.02,-1 h -3.67 l -0.29,13.93 h 3.67 z\",\n id: \"path990\"\n }))), /*#__PURE__*/React.createElement(\"g\", {\n id: \"g1026\"\n }, /*#__PURE__*/React.createElement(\"g\", {\n id: \"g1000\"\n }, /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-3\",\n points: \"23.65,61.12 24.88,58.81 41.06,58.81 39.83,61.12 \",\n id: \"polygon996\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n className: \"cls-solceller-3\",\n d: \"m 40.23,59.31 -0.7,1.3 H 24.48 l 0.7,-1.3 h 15.05 m 1.67,-1 H 24.58 l -1.77,3.3 h 17.32 z\",\n id: \"path998\"\n })), /*#__PURE__*/React.createElement(\"g\", {\n id: \"g1006\"\n }, /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-3\",\n points: \"0.55,45.56 5.26,0.5 65.87,0.5 61.17,45.56 \",\n id: \"polygon1002\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n className: \"cls-solceller-3\",\n d: \"m 65.32,1 -4.6,44.06 H 1.11 L 5.71,1 H 65.32 M 66.43,0 H 4.81 L 0,46.06 h 61.62 z\",\n id: \"path1004\"\n })), /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-2\",\n points: \"22.59,21.77 4.93,21.77 6.73,3.07 24.39,3.07 \",\n id: \"polygon1008\"\n }), /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-2\",\n points: \"20.43,43.18 2.77,43.18 4.57,24.48 22.23,24.48 \",\n id: \"polygon1010\"\n }), /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-2\",\n points: \"42.24,21.74 24.58,21.74 26.38,3.04 44.04,3.04 \",\n id: \"polygon1012\"\n }), /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-2\",\n points: \"40.08,43.14 22.42,43.14 24.22,24.44 41.88,24.44 \",\n id: \"polygon1014\"\n }), /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-2\",\n points: \"61.83,21.74 44.17,21.74 45.97,3.04 63.63,3.04 \",\n id: \"polygon1016\"\n }), /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-2\",\n points: \"59.67,43.14 42.01,43.14 43.81,24.44 61.47,24.44 \",\n id: \"polygon1018\"\n }), /*#__PURE__*/React.createElement(\"g\", {\n id: \"g1024\"\n }, /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-3\",\n points: \"31.81,59.49 32.07,46.56 34.75,46.56 34.48,59.49 \",\n id: \"polygon1020\"\n }), /*#__PURE__*/React.createElement(\"path\", {\n className: \"cls-solceller-3\",\n d: \"m 34.24,47.06 -0.25,11.93 h -1.67 l 0.25,-11.93 h 1.67 m 1.02,-1 H 31.59 L 31.3,59.99 h 3.67 z\",\n id: \"path1022\"\n }))), /*#__PURE__*/React.createElement(\"g\", {\n id: \"g1046\"\n }, /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-4\",\n points: \"72.63,71.54 52.49,71.54 54.55,68.06 74.69,68.06 \",\n id: \"polygon1028\"\n }), /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-4\",\n points: \"93.4,55.14 28.45,55.14 33.52,6.6 98.46,6.6 \",\n id: \"polygon1030\"\n }), /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-1\",\n points: \"52.26,29.55 33.64,29.55 35.54,9.84 54.16,9.84 \",\n id: \"polygon1032\"\n }), /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-1\",\n points: \"49.98,52.11 31.37,52.11 33.27,32.4 51.88,32.4 \",\n id: \"polygon1034\"\n }), /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-1\",\n points: \"72.97,29.51 54.35,29.51 56.25,9.8 74.87,9.8 \",\n id: \"polygon1036\"\n }), /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-1\",\n points: \"70.69,52.07 52.08,52.07 53.98,32.36 72.59,32.36 \",\n id: \"polygon1038\"\n }), /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-1\",\n points: \"93.62,29.51 75,29.51 76.9,9.8 95.52,9.8 \",\n id: \"polygon1040\"\n }), /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-1\",\n points: \"91.34,52.07 72.73,52.07 74.63,32.36 93.24,32.36 \",\n id: \"polygon1042\"\n }), /*#__PURE__*/React.createElement(\"polygon\", {\n className: \"cls-solceller-4\",\n points: \"65.31,69.83 61.44,69.83 61.74,55.14 65.61,55.14 \",\n id: \"polygon1044\"\n }))))));\n}\n\nvar ForwardRef = /*#__PURE__*/React.forwardRef(SvgSolcellerNyE);\nexport default __webpack_public_path__ + \"static/media/solceller_ny_e.3431e94e.svg\";\nexport { ForwardRef as ReactComponent };","import { RawDataPointConsumption, RawDataPointProduction } from \"../../api/EnergiDataApi\"\nimport { DataPointProduction, DataPointConsumption } from \"../chart/Chart.types\"\nimport { BundleMode, DateMode, RawDataBundle, SelectedDate } from \"./Dashboard.types\"\nimport sub from 'date-fns/sub'\nimport format from 'date-fns/format'\n\nconst STONE_STORAGE_CAPACITY_HOUR = 10\nconst STONE_STORAGE_CAPACITY_DAY = 200\nconst STONE_STORAGE_CAPACITY_MONTH = 2500\n\nexport const bundleRawData = \n : undefined}\n onChange={(event, value) => {\n setPowerToXValue(value as number)\n onPowerToXChanged(value as number)\n }} />\n
\n \n : undefined}\n onChange={(event, value) => {\n setHeatSupplyValue(value as number)\n onHeatSupplyChanged(value as number)\n }} />\n
\n \n : undefined}\n onChange={(event, value) => {\n setTransportValue(value as number)\n onTransportChanged(value as number)\n }} />\n
\n {/* This should be broken up into the specific sub catagories */}\n {/* \n {\n setMiscellaneousValue(value as number)\n onMiscellaneousChanged(value as number)\n }} />\n
*/}\n \n {textsDa.introduction}\n
\n \n 
\n 
\n
\n \n
\n ))}\n {t.title}
\n\n {t.body}\n
\n\n
\n )\n}","import { createStyles } from \"../../styles\"\n\nexport const styles = createStyles({\n textColor: {\n color: '#444'\n },\n percentageColor: {\n color: 'green'\n }\n})","import { createStyles } from \"../../styles\"\n\nexport const styles = createStyles({\n totalValue: {\n color: '#444'\n }\n})","import { valueWithDecimalsAndLocale } from '../../util/format-utils'\nimport { styles } from './ProductionSurplus.style'\n\ninterface ProductionSurplusProps {\n production: number\n consumption: number\n decimals?: number\n unit?: string\n }\n\nexport const ProductionSurplus = ({ \n production,\n consumption,\n unit = 'MWh',\n decimals = 0\n }: ProductionSurplusProps) => {\n const surplus = (production - consumption)\n const surplusStyle = surplus < 0 ? {color: 'red'} : {color: 'green'}\n const surplusComponent = {isNaN(surplus) ? '-' : valueWithDecimalsAndLocale(surplus, decimals)}\n return (\n \n : undefined}\n onChange={(event, value) => {\n setSunValue(value as number)\n onSunValueChanged(value as number)\n }} />\n
\n \n : undefined}\n onChange={(event, value) => {\n setWindValue(value as number)\n onWindValueChanged(value as number)\n }} />\n
\n \n {`Produktion af grøn strøm: ${valueWithDecimalsAndLocale(production, decimals)} ${unit}`}\n
\n {`Forbrug: ${valueWithDecimalsAndLocale(consumption, decimals) ?? '-'} ${unit}`}\n
\n {`${surplus < 0 ? 'Underskud' : 'Overskud'} af grøn strøm: `} {surplusComponent} {unit}\n
\n )\n}\n","import { valueWithDecimalsAndLocale } from '../../util/format-utils'\nimport { DateMode, SelectedDate } from '../dashboard/Dashboard.types'\nimport { styles } from './ProductionSurplusWithSufficiency.style'\nimport { ProductionSurplus } from \"../productionSurplus/ProductionSurplus\"\n\ninterface ProductionSurplusWithSufficiencyProps {\n periodName: string\n productionSurplus: {\n production: number\n consumption: number\n decimals?: number\n unit?: string\n }\n selfSufficiency: {\n selfSufficciencyHours: number\n period: DateMode\n selectedDate: SelectedDate\n }\n}\n\nexport const ProductionSurplusWithSufficiency = ({\n periodName,\n productionSurplus,\n selfSufficiency\n }: ProductionSurplusWithSufficiencyProps) => {\n\n const getHoursInPeriod = (): number => {\n if(selfSufficiency.period === DateMode.YEAR) {\n const currentDate = new Date()\n\n // Calculate and return the hours between the current date or end of the year and the beginning of the year.\n const toDate = currentDate.getFullYear() === selfSufficiency.selectedDate.year ? currentDate.getTime() : new Date(selfSufficiency.selectedDate.year + 1, 0, 0).getTime()\n return Math.round(Math.abs(toDate - new Date(selfSufficiency.selectedDate.year, 0, 0).getTime()) / 36e5)\n }\n \n if(selfSufficiency.period === DateMode.MONTH) {\n return new Date(selfSufficiency.selectedDate.year, (selfSufficiency.selectedDate.month ?? 0) + 1, 0).getDate() * 24\n }\n \n return 24\n }\n\n const percentageComponent = {\n isNaN(selfSufficiency.selfSufficciencyHours / getHoursInPeriod()) ? \n '-' : \n Number(valueWithDecimalsAndLocale((selfSufficiency.selfSufficciencyHours / getHoursInPeriod()) * 100)) < 1 ? '< 1' : \n valueWithDecimalsAndLocale((selfSufficiency.selfSufficciencyHours / getHoursInPeriod()) * 100, 1)\n }%\n \n return (\n \n {`Forbrug: ${valueWithDecimalsAndLocale(consumption, decimals) ?? '-'} ${unit}`}\n
\n {`${surplus < 0 ? 'Underskud' : 'Overskud'} af grøn strøm: `} {surplusComponent} {unit}\n
\n \n {`Nøgletal om Lollands energisystem (faktiske tal for hele ${periodName}):`}\n \n
\n )\n}\n","import { styles } from \"./Dashboard.style\"\nimport { SlidingDateSelector, IconSlider, LabelPosition, SliderOrientation, HorizontalModeValuePosition } from \"dataviz-lib\"\nimport { Chart } from '../chart/Chart'\nimport { useCallback, useState, useEffect, useMemo } from 'react'\n// import { ReactComponent as Sun } from './../../img/sun.svg'\nimport { ReactComponent as StoneStorage } from './../../img/stenlager_ny_e.svg'\nimport './styles.css';\nimport { Box, CircularProgress, Dialog, IconButton, useMediaQuery, Button as MUIButton } from '@mui/material'\nimport exportImportWindMap from '../../data/animation/Eksport_import_wind_lolland.json'\nimport exportNoWindMap from '../../data/animation/Eksport_minus_wind_lolland.json'\nimport importImportWindMap from '../../data/animation/Import_all_lolland.json'\nimport importNoWindMap from '../../data/animation/Import_minus_wind_lolland.json'\nimport textsDa from '../../data/da.json'\nimport { useLottie } from \"lottie-react\"\nimport { colors } from '../../colors'\nimport { RawDataPointProduction, RawDataPointConsumption, getProductionData, getConsumptionData } from \"../../api/EnergiDataApi\"\nimport productionJson from '../../data/productionmunicipalityhour_300822.json'\nimport consumptionJson from '../../data/consumptionindustry_300822.json'\nimport {Help, Info} from '@mui/icons-material'\nimport { DataPointConsumption, DataPointProduction } from \"../chart/Chart.types\"\n// import hand from './../../img/hand.gif'\nimport { LoadingIndicator } from \"../loadingIndicator/LoadingIndicator\"\nimport { BundleMode, DateMode, DialogData, SelectedDate, Texts } from \"./Dashboard.types\"\nimport { ConsumptionSliders } from \"../consumptionSliders/ConsumptionSliders\"\nimport { Forecast } from \"../consumptionSliders/ConsumptionSliders.types\"\nimport { bundleRawData, getDateMode, calculateStoneStorageValue, rawConsumptionsToDataPoint, rawProductionsToDataPoint, selectedDateToBundleMode, sumRawBundlesToDataPoints, calculateTotal, getInitialDate, getQuickFetchDate, countSelfSufficientHours } from \"./util\"\nimport { InfoDialog } from \"./infoDialog/InfoDialog\"\nimport { ProductionSliders } from \"../productionSliders/ProductionSliders\"\nimport CloseIcon from '@mui/icons-material/Close'\nimport { ProductionSurplusWithSufficiency } from \"../productionSurplusWithSufficiency/ProductionSurplusWithSufficiency\"\nimport ArrowBackIcon from '@mui/icons-material/ArrowBack';\n\ntype DashboardProps = {\n backLink?: string\n}\n\nexport const Dashboard = ({ backLink } : DashboardProps) => {\n const isBigScreen = useMediaQuery('(min-width: 1500px)')\n\n const [dialogOpen, setDialogOpen] = useState(false)\n const [dialogData, setDialogData] = useState{headerText} {\n setDialogData({\n title: headerText,\n sections: infoSections\n })\n setDialogOpen(true)\n }}\n size= {'small'} \n > \n
\n\n\n useEffect(() => {\n const fullDate = \"2021-01-01T00:00\"\n const quickDate = getQuickFetchDate(initialDate) ?? fullDate\n getProductionData(quickDate).then(data => setRawProductionData(data)).finally(() => \n getProductionData(fullDate).then(data => setRawProductionData(data)).catch((err) => {\n console.error('error fetching production data, using offline')\n setRawProductionData(productionJson.result.records)\n }).finally(() => setIsLoadingProductionData(false))\n )\n\n\n getConsumptionData(quickDate).then(data => setRawConsumptionData(data)).finally(() => \n getConsumptionData(fullDate).then(data => setRawConsumptionData(data)).catch((err) => {\n console.error('error fetching consumption data, using offline')\n setRawConsumptionData(consumptionJson.result.records)\n }).finally(() => setIsLoadingConsumptionData(false))\n )\n }, [])\n\n const productionSliders = \n \n \n setInfoDialogOpen(true)}\n size= {'small'} \n >\n \n {backLink !== undefined && \n \n window.location.href = backLink} variant=\"outlined\" startIcon={ \n \n }\n window.location.reload()} style={styles.resetButton}>\n Nulstil alt\n \n
\n\n return (\n \n\n setInfoDialogOpen(false)}\n />\n }\n
\n )\n}\n","export default __webpack_public_path__ + \"static/media/energisystem.6fac5f86.png\";","export default __webpack_public_path__ + \"static/media/ressourcesystem.944d9a5e.png\";","\nimport { createStyles } from '../../styles'\n\nexport const styles = createStyles({\n container: { \n background: 'white',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n height: '100dvh',\n width: '100dvw' \n },\n inner: {\n height: '90dvh',\n },\n buttonContainer: {\n borderRadius: '16px',\n height: '100%'\n },\n link: {\n height: '100%'\n },\n linkImg: {\n height: '100%'\n }\n})\n","import { Box, ButtonBase, Link } from \"@mui/material\"\nimport LinkEnergy from \"./energisystem.png\"\nimport LinkResource from \"./ressourcesystem.png\"\nimport { styles } from \"./StartPage.style\"\n\nexport const StartPage = () => {\n const energySystemUrl = window.location.href.replace('startPage=true', 'startPage=false')\n const returnUrl = window.location.href\n\n return (\n \n \n
\n\n LOLLANDS ENERGISYSTEM
\n \n \n {map}\n
\n \n \n\n {!isBigScreen &&\n
\n\n {isBigScreen &&\n \n\n
\n }\n\n {isBigScreen &&\n {getSliderHeader(\"PRODUKTION\", getSliderInfoTexts(Texts.PRODUCTION))}
\n {productionSliders}\n\n \n
\n\n {getSliderHeader(\"LAGRING\", getSliderInfoTexts(Texts.STORAGE))}
\n \n '+' + val + ' anlæg', horizontalModePos: HorizontalModeValuePosition.label}} \n value={stoneStorage}\n label={{value:'Stenlager', position: LabelPosition.bottom}}\n orientation = {SliderOrientation.horizontal}\n onChange={(event, newValue) => setStoneStorage(newValue as number)} />\n
\n {getSliderHeader(\"FORBRUG\", getSliderInfoTexts(Texts.CONSUMPTION))}
\n {consumptionSliders}\n \n\n
\n }\n \n
\n\n {getSliderHeader(\"PRODUKTION\", getSliderInfoTexts(Texts.PRODUCTION))}
\n {productionSliders}\n \n
\n\n {getSliderHeader(\"LAGRING\", getSliderInfoTexts(Texts.STORAGE))}
\n \n '+' + val + ' anlæg'}}\n value={stoneStorage}\n label={{value:'Stenlager', position: LabelPosition.bottom}}\n orientation = {SliderOrientation.vertical}\n icon={}\n onChange={(event, newValue) => setStoneStorage(newValue as number)} />\n
\n \n
\n {getSliderHeader(\"FORBRUG\", getSliderInfoTexts(Texts.CONSUMPTION))}
\n {consumptionSliders}\n \n {infoAndReset}\n
\n }\n\n \n \n
\n\n {dialogOpen &&\n \n }\n {infoDialogOpen &&\n \n
\n\n PRODUKTION OG FORBRUG
\n Tryk på grafen for at se mere
\n \n {hasData ?\n
\n\n Ingen data tilgængelig for den valgte periode
\n }\n \n {isLoadingData ?\n
\n\n \n
\n\n {!isBigScreen &&\n infoAndReset\n }\n\n SE DATA FOR
\n \n
\n