blue-chestnut-solar-expert 0.0.9 → 0.0.12

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.
Files changed (130) hide show
  1. package/dist/cjs/eraser-icon.house-icon.icon-selector.map-draw.move-icon.octagon-minus-icon.search-icon.solar-expert.solar-system-form.entry.cjs.js.map +1 -1
  2. package/dist/cjs/eraser-icon_9.cjs.entry.js +388 -15110
  3. package/dist/cjs/eraser-icon_9.cjs.entry.js.map +1 -1
  4. package/dist/cjs/{index-BFx4q5Ui.js → index-GZ-kuJi4.js} +8 -28
  5. package/dist/{esm/index-D0YnIAAN.js.map → cjs/index-GZ-kuJi4.js.map} +1 -1
  6. package/dist/cjs/loader.cjs.js +2 -2
  7. package/dist/cjs/loading-widget.cjs.entry.js +20 -0
  8. package/dist/cjs/loading-widget.cjs.entry.js.map +1 -0
  9. package/dist/cjs/loading-widget.entry.cjs.js.map +1 -0
  10. package/dist/cjs/solar-calculator.cjs.entry.js +3 -3
  11. package/dist/cjs/solar-calculator.cjs.entry.js.map +1 -1
  12. package/dist/cjs/solar-calculator.entry.cjs.js.map +1 -1
  13. package/dist/cjs/stencil-library.cjs.js +2 -2
  14. package/dist/collection/collection-manifest.json +2 -1
  15. package/dist/collection/components/icons/eraser.js +26 -1
  16. package/dist/collection/components/icons/eraser.js.map +1 -1
  17. package/dist/collection/components/icons/house.js +26 -1
  18. package/dist/collection/components/icons/house.js.map +1 -1
  19. package/dist/collection/components/icons/icon.js +27 -6
  20. package/dist/collection/components/icons/icon.js.map +1 -1
  21. package/dist/collection/components/icons/move.js +26 -1
  22. package/dist/collection/components/icons/move.js.map +1 -1
  23. package/dist/collection/components/icons/octagonMinus.js +26 -1
  24. package/dist/collection/components/icons/octagonMinus.js.map +1 -1
  25. package/dist/collection/components/icons/search.js +26 -1
  26. package/dist/collection/components/icons/search.js.map +1 -1
  27. package/dist/collection/components/map-draw/map-draw.js +133 -31
  28. package/dist/collection/components/map-draw/map-draw.js.map +1 -1
  29. package/dist/collection/components/solar-calculator/solar-calculator.js +1 -1
  30. package/dist/collection/components/solar-expert/solar-expert.js +3 -3
  31. package/dist/collection/components/solar-expert/solar-expert.js.map +1 -1
  32. package/dist/collection/components/solar-system-form/solar-system-form.js +86 -84
  33. package/dist/collection/components/solar-system-form/solar-system-form.js.map +1 -1
  34. package/dist/collection/components/widgets/loading-widget.js +18 -0
  35. package/dist/collection/components/widgets/loading-widget.js.map +1 -0
  36. package/dist/collection/output.css +284 -0
  37. package/dist/collection/utils/geometry/gridMatch.js +0 -1
  38. package/dist/collection/utils/geometry/gridMatch.js.map +1 -1
  39. package/dist/collection/utils/lang/english.js +1 -1
  40. package/dist/collection/utils/lang/english.js.map +1 -1
  41. package/dist/collection/utils/lang/german.js +3 -3
  42. package/dist/collection/utils/lang/german.js.map +1 -1
  43. package/dist/collection/utils/lang/spanish.js +1 -1
  44. package/dist/collection/utils/lang/spanish.js.map +1 -1
  45. package/dist/components/eraser-icon.js +1 -1
  46. package/dist/components/house-icon.js +1 -1
  47. package/dist/components/icon-selector.js +1 -1
  48. package/dist/components/index.js +7 -22
  49. package/dist/components/index.js.map +1 -1
  50. package/dist/components/loading-widget.d.ts +11 -0
  51. package/dist/components/loading-widget.js +36 -0
  52. package/dist/components/loading-widget.js.map +1 -0
  53. package/dist/components/map-draw.js +1 -1
  54. package/dist/components/move-icon.js +1 -1
  55. package/dist/components/octagon-minus-icon.js +1 -1
  56. package/dist/components/p-BGspvo5S.js +36 -0
  57. package/dist/components/p-BGspvo5S.js.map +1 -0
  58. package/dist/components/p-C46bD4Bg.js +36 -0
  59. package/dist/components/p-C46bD4Bg.js.map +1 -0
  60. package/dist/components/p-CB8h41UZ.js +36 -0
  61. package/dist/components/p-CB8h41UZ.js.map +1 -0
  62. package/dist/components/p-CHsmfSJD.js +36 -0
  63. package/dist/components/p-CHsmfSJD.js.map +1 -0
  64. package/dist/components/p-Cg3h6HF4.js +83 -0
  65. package/dist/components/p-Cg3h6HF4.js.map +1 -0
  66. package/dist/components/p-D6cs3r7j.js +621 -0
  67. package/dist/components/p-D6cs3r7j.js.map +1 -0
  68. package/dist/components/{p-CtPeF0hC.js → p-DEfwuR25.js} +143 -42
  69. package/dist/components/p-DEfwuR25.js.map +1 -0
  70. package/dist/components/p-DP1y5q1K.js +36 -0
  71. package/dist/components/p-DP1y5q1K.js.map +1 -0
  72. package/dist/components/search-icon.js +1 -1
  73. package/dist/components/solar-calculator.js +2 -2
  74. package/dist/components/solar-calculator.js.map +1 -1
  75. package/dist/components/solar-expert.js +12 -12
  76. package/dist/components/solar-expert.js.map +1 -1
  77. package/dist/components/solar-system-form.js +1 -1
  78. package/dist/esm/eraser-icon.house-icon.icon-selector.map-draw.move-icon.octagon-minus-icon.search-icon.solar-expert.solar-system-form.entry.js.map +1 -1
  79. package/dist/esm/eraser-icon_9.entry.js +370 -15092
  80. package/dist/esm/eraser-icon_9.entry.js.map +1 -1
  81. package/dist/esm/{index-D0YnIAAN.js → index-CnQR_-WL.js} +8 -28
  82. package/dist/{cjs/index-BFx4q5Ui.js.map → esm/index-CnQR_-WL.js.map} +1 -1
  83. package/dist/esm/loader.js +3 -3
  84. package/dist/esm/loading-widget.entry.js +18 -0
  85. package/dist/esm/loading-widget.entry.js.map +1 -0
  86. package/dist/esm/solar-calculator.entry.js +3 -3
  87. package/dist/esm/solar-calculator.entry.js.map +1 -1
  88. package/dist/esm/stencil-library.js +3 -3
  89. package/dist/stencil-library/eraser-icon.house-icon.icon-selector.map-draw.move-icon.octagon-minus-icon.search-icon.solar-expert.solar-system-form.entry.esm.js.map +1 -1
  90. package/dist/stencil-library/loading-widget.entry.esm.js.map +1 -0
  91. package/dist/stencil-library/p-25e04c7a.entry.js +2 -0
  92. package/dist/stencil-library/p-25e04c7a.entry.js.map +1 -0
  93. package/dist/stencil-library/p-642b4ce9.entry.js +32 -0
  94. package/dist/stencil-library/{p-ded21f18.entry.js.map → p-642b4ce9.entry.js.map} +1 -1
  95. package/dist/stencil-library/p-CnQR_-WL.js +3 -0
  96. package/dist/stencil-library/{p-D0YnIAAN.js.map → p-CnQR_-WL.js.map} +1 -1
  97. package/dist/stencil-library/p-a8d15c85.entry.js +2 -0
  98. package/dist/stencil-library/p-a8d15c85.entry.js.map +1 -0
  99. package/dist/stencil-library/solar-calculator.entry.esm.js.map +1 -1
  100. package/dist/stencil-library/stencil-library.esm.js +1 -1
  101. package/dist/types/components/icons/eraser.d.ts +1 -0
  102. package/dist/types/components/icons/house.d.ts +1 -0
  103. package/dist/types/components/icons/icon.d.ts +1 -0
  104. package/dist/types/components/icons/move.d.ts +1 -0
  105. package/dist/types/components/icons/octagonMinus.d.ts +1 -0
  106. package/dist/types/components/icons/search.d.ts +1 -0
  107. package/dist/types/components/map-draw/map-draw.d.ts +2 -0
  108. package/dist/types/components/solar-system-form/solar-system-form.d.ts +3 -2
  109. package/dist/types/components/widgets/loading-widget.d.ts +3 -0
  110. package/dist/types/components.d.ts +25 -0
  111. package/package.json +1 -1
  112. package/dist/components/p-BL_DlPdu.js +0 -33
  113. package/dist/components/p-BL_DlPdu.js.map +0 -1
  114. package/dist/components/p-BcT1n-3A.js +0 -15447
  115. package/dist/components/p-BcT1n-3A.js.map +0 -1
  116. package/dist/components/p-CC3tp0bK.js +0 -33
  117. package/dist/components/p-CC3tp0bK.js.map +0 -1
  118. package/dist/components/p-CtPeF0hC.js.map +0 -1
  119. package/dist/components/p-D064AshY.js +0 -33
  120. package/dist/components/p-D064AshY.js.map +0 -1
  121. package/dist/components/p-DQwOnYzQ.js +0 -33
  122. package/dist/components/p-DQwOnYzQ.js.map +0 -1
  123. package/dist/components/p-DbEU_5GR.js +0 -33
  124. package/dist/components/p-DbEU_5GR.js.map +0 -1
  125. package/dist/components/p-Dv86mKXd.js +0 -81
  126. package/dist/components/p-Dv86mKXd.js.map +0 -1
  127. package/dist/stencil-library/p-7512b392.entry.js +0 -20
  128. package/dist/stencil-library/p-7512b392.entry.js.map +0 -1
  129. package/dist/stencil-library/p-D0YnIAAN.js +0 -3
  130. package/dist/stencil-library/p-ded21f18.entry.js +0 -32
@@ -1 +1 @@
1
- {"version":3,"file":"solar-expert.js","sourceRoot":"","sources":["../../../src/components/solar-expert/solar-expert.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACxE,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AAEnD,OAAO,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAO9D,MAAM,OAAO,WAAW;IAEpB,EAAE,CAAe;IAGjB,MAAM,GAAW,GAAG,CAAC,mBAAmB,CAAC;IAEzC,QAAQ,GAAa,IAAI,CAAC;IAG1B,QAAQ,GAAkB,IAAI,CAAC;IAE/B,SAAS,GAAkB,IAAI,CAAC;IAEhC,QAAQ,GAAY,KAAK,CAAC;IAE1B,YAAY,GAA2C,IAAI,CAAC;IAE5D,KAAK,GAA0C,IAAI,CAAC;IAE5C,YAAY,CAAoB;IAExC,iBAAiB;QACb,IAAI,CAAC,oBAAoB,EAAE,CAAC;IAChC,CAAC;IAEO,KAAK,CAAC,oBAAoB;QAC9B,IAAI,CAAC;YACD,MAAM,MAAM,GAAG,IAAI,MAAM,CAAC;gBACtB,MAAM,EAAE,IAAI,CAAC,MAAM;gBACnB,SAAS,EAAE,CAAC,QAAQ,CAAC;aACxB,CAAC,CAAC;YAEH,MAAM,MAAM,GAAG,MAAM,MAAM,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;YACpD,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;YACrB,IAAI,CAAC,sBAAsB,CAAC,MAAM,CAAC,CAAC;QACxC,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACb,OAAO,CAAC,KAAK,CAAC,6BAA6B,EAAE,KAAK,CAAC,CAAC;QACxD,CAAC;IACL,CAAC;IAEO,sBAAsB,CAC1B,MAAiC;QAEjC,IAAI,CAAC,IAAI,CAAC,YAAY,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE,OAAO;QACjD,IAAI,CAAC,YAAY,GAAG,IAAI,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;QAE/D,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,eAAe,EAAE,GAAG,EAAE;YAChD,MAAM,KAAK,GAAG,IAAI,CAAC,YAAY,EAAE,QAAQ,EAAE,CAAC;YAC5C,IAAI,CAAC,QAAQ,GAAG,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,EAAE,IAAI,CAAC,CAAC;YACtD,IAAI,CAAC,SAAS,GAAG,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,EAAE,IAAI,CAAC,CAAC;QAC3D,CAAC,CAAC,CAAC;IACP,CAAC;IAED,MAAM;QACF,MAAM,CAAC,GAAG,kBAAkB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QAC5C,OAAO,CACH,4DAAK,KAAK,EAAC,0CAA0C;YACjD,4DAAK,KAAK,EAAC,MAAM;gBACb,4DAAK,KAAK,EAAC,UAAU;oBACjB,4DAAK,KAAK,EAAC,oDAAoD;wBAC3D,qEAAe,CACb;oBACN,8DACI,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,IAAI,CAAC,YAAY,GAAG,EAAE,EACnC,IAAI,EAAC,MAAM,EACX,WAAW,EAAE,CAAC,CAAC,WAAW,CAAC,iBAAiB,EAC5C,KAAK,EAAC,wHAAwH,GAChI,CACA,CACJ;YACN,iEACI,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ,GACzB,CACA,CACT,CAAC;IACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Element, Env, h, Prop, State } from \"@stencil/core\";\r\nimport { Loader } from \"@googlemaps/js-api-loader\";\r\nimport { Language } from \"../../types/lang\";\r\nimport { getLanguageStrings } from \"../../utils/lang/general\";\r\n\r\n@Component({\r\n tag: \"solar-expert\",\r\n shadow: false,\r\n styleUrl: \"../../output.css\",\r\n})\r\nexport class SolarExpert {\r\n @Element()\r\n el!: HTMLElement;\r\n\r\n @Prop()\r\n apiKey: string = Env.GOOGLE_MAPS_API_KEY;\r\n @Prop()\r\n language: Language = \"en\";\r\n\r\n @State()\r\n latitude: number | null = null;\r\n @State()\r\n longitude: number | null = null;\r\n @State()\r\n isLoaded: boolean = false;\r\n @State()\r\n autocomplete: google.maps.places.Autocomplete | null = null;\r\n @State()\r\n place: google.maps.places.PlaceResult | null = null;\r\n\r\n private inputElement?: HTMLInputElement;\r\n\r\n componentWillLoad() {\r\n this.loadGoogleMapsScript();\r\n }\r\n\r\n private async loadGoogleMapsScript() {\r\n try {\r\n const loader = new Loader({\r\n apiKey: this.apiKey,\r\n libraries: [\"places\"],\r\n });\r\n\r\n const places = await loader.importLibrary(\"places\");\r\n this.isLoaded = true;\r\n this.initializeAutocomplete(places);\r\n } catch (error) {\r\n console.error(\"Error loading Google Maps: \", error);\r\n }\r\n }\r\n\r\n private initializeAutocomplete(\r\n places: google.maps.PlacesLibrary,\r\n ) {\r\n if (!this.inputElement || !this.isLoaded) return;\r\n this.autocomplete = new places.Autocomplete(this.inputElement);\r\n\r\n this.autocomplete.addListener(\"place_changed\", () => {\r\n const place = this.autocomplete?.getPlace();\r\n this.latitude = place?.geometry?.location?.lat() ?? 0;\r\n this.longitude = place?.geometry?.location?.lng() ?? 0;\r\n });\r\n }\r\n\r\n render() {\r\n const t = getLanguageStrings(this.language);\r\n return (\r\n <div class=\"flex flex-col w-full h-full p-3 bg-white\">\r\n <div class=\"pb-3\">\r\n <div class=\"relative\">\r\n <div class=\"absolute left-3 top-1/2 transform -translate-y-1/2\">\r\n <search-icon />\r\n </div>\r\n <input\r\n ref={(el) => this.inputElement = el}\r\n type=\"text\"\r\n placeholder={t.solarExpert.searchPlaceholder}\r\n class=\"w-full pl-10 pr-4 py-2 border border-gray-300 rounded-4xl focus:outline-none focus:ring-2 focus:ring-blue-500 bg-white\"\r\n />\r\n </div>\r\n </div>\r\n <map-draw\r\n latitude={this.latitude}\r\n longitude={this.longitude}\r\n apiKey={this.apiKey}\r\n language={this.language}\r\n />\r\n </div>\r\n );\r\n }\r\n}\r\n"]}
1
+ {"version":3,"file":"solar-expert.js","sourceRoot":"","sources":["../../../src/components/solar-expert/solar-expert.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACxE,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AAEnD,OAAO,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAO9D,MAAM,OAAO,WAAW;IAEpB,EAAE,CAAe;IAGjB,MAAM,GAAW,GAAG,CAAC,mBAAmB,CAAC;IAEzC,QAAQ,GAAa,IAAI,CAAC;IAG1B,QAAQ,GAAkB,iBAAiB,CAAC;IAE5C,SAAS,GAAkB,iBAAiB,CAAC;IAE7C,QAAQ,GAAY,KAAK,CAAC;IAE1B,YAAY,GAA2C,IAAI,CAAC;IAE5D,KAAK,GAA0C,IAAI,CAAC;IAE5C,YAAY,CAAoB;IAExC,iBAAiB;QACb,IAAI,CAAC,oBAAoB,EAAE,CAAC;IAChC,CAAC;IAEO,KAAK,CAAC,oBAAoB;QAC9B,IAAI,CAAC;YACD,MAAM,MAAM,GAAG,IAAI,MAAM,CAAC;gBACtB,MAAM,EAAE,IAAI,CAAC,MAAM;gBACnB,SAAS,EAAE,CAAC,QAAQ,CAAC;aACxB,CAAC,CAAC;YAEH,MAAM,MAAM,GAAG,MAAM,MAAM,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;YACpD,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;YACrB,IAAI,CAAC,sBAAsB,CAAC,MAAM,CAAC,CAAC;QACxC,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACb,OAAO,CAAC,KAAK,CAAC,6BAA6B,EAAE,KAAK,CAAC,CAAC;QACxD,CAAC;IACL,CAAC;IAEO,sBAAsB,CAC1B,MAAiC;QAEjC,IAAI,CAAC,IAAI,CAAC,YAAY,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE,OAAO;QACjD,IAAI,CAAC,YAAY,GAAG,IAAI,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;QAE/D,IAAI,CAAC,YAAY,CAAC,WAAW,CAAC,eAAe,EAAE,GAAG,EAAE;YAChD,MAAM,KAAK,GAAG,IAAI,CAAC,YAAY,EAAE,QAAQ,EAAE,CAAC;YAC5C,IAAI,CAAC,QAAQ,GAAG,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,EAAE,IAAI,CAAC,CAAC;YACtD,IAAI,CAAC,SAAS,GAAG,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,EAAE,IAAI,CAAC,CAAC;QAC3D,CAAC,CAAC,CAAC;IACP,CAAC;IAED,MAAM;QACF,MAAM,CAAC,GAAG,kBAAkB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QAC5C,OAAO,CACH,4DAAK,KAAK,EAAC,kDAAkD;YACzD,4DAAK,KAAK,EAAC,MAAM;gBACb,4DAAK,KAAK,EAAC,UAAU;oBACjB,4DAAK,KAAK,EAAC,oDAAoD;wBAC3D,qEAAe,CACb;oBACN,8DACI,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,IAAI,CAAC,YAAY,GAAG,EAAE,EACnC,IAAI,EAAC,MAAM,EACX,WAAW,EAAE,CAAC,CAAC,WAAW,CAAC,iBAAiB,EAC5C,KAAK,EAAC,wHAAwH,GAChI,CACA,CACJ;YACN,iEACI,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ,GACzB,CACA,CACT,CAAC;IACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Element, Env, h, Prop, State } from \"@stencil/core\";\r\nimport { Loader } from \"@googlemaps/js-api-loader\";\r\nimport { Language } from \"../../types/lang\";\r\nimport { getLanguageStrings } from \"../../utils/lang/general\";\r\n\r\n@Component({\r\n tag: \"solar-expert\",\r\n shadow: false,\r\n styleUrl: \"../../output.css\",\r\n})\r\nexport class SolarExpert {\r\n @Element()\r\n el!: HTMLElement;\r\n\r\n @Prop()\r\n apiKey: string = Env.GOOGLE_MAPS_API_KEY;\r\n @Prop()\r\n language: Language = \"en\";\r\n\r\n @State()\r\n latitude: number | null = 49.40004754661986;\r\n @State()\r\n longitude: number | null = 8.695138526494068;\r\n @State()\r\n isLoaded: boolean = false;\r\n @State()\r\n autocomplete: google.maps.places.Autocomplete | null = null;\r\n @State()\r\n place: google.maps.places.PlaceResult | null = null;\r\n\r\n private inputElement?: HTMLInputElement;\r\n\r\n componentWillLoad() {\r\n this.loadGoogleMapsScript();\r\n }\r\n\r\n private async loadGoogleMapsScript() {\r\n try {\r\n const loader = new Loader({\r\n apiKey: this.apiKey,\r\n libraries: [\"places\"],\r\n });\r\n\r\n const places = await loader.importLibrary(\"places\");\r\n this.isLoaded = true;\r\n this.initializeAutocomplete(places);\r\n } catch (error) {\r\n console.error(\"Error loading Google Maps: \", error);\r\n }\r\n }\r\n\r\n private initializeAutocomplete(\r\n places: google.maps.PlacesLibrary,\r\n ) {\r\n if (!this.inputElement || !this.isLoaded) return;\r\n this.autocomplete = new places.Autocomplete(this.inputElement);\r\n\r\n this.autocomplete.addListener(\"place_changed\", () => {\r\n const place = this.autocomplete?.getPlace();\r\n this.latitude = place?.geometry?.location?.lat() ?? 0;\r\n this.longitude = place?.geometry?.location?.lng() ?? 0;\r\n });\r\n }\r\n\r\n render() {\r\n const t = getLanguageStrings(this.language);\r\n return (\r\n <div class=\"flex flex-col w-full h-full p-3 max-w-2xl m-auto\">\r\n <div class=\"pb-3\">\r\n <div class=\"relative\">\r\n <div class=\"absolute left-3 top-1/2 transform -translate-y-1/2\">\r\n <search-icon />\r\n </div>\r\n <input\r\n ref={(el) => this.inputElement = el}\r\n type=\"text\"\r\n placeholder={t.solarExpert.searchPlaceholder}\r\n class=\"w-full pl-10 pr-4 py-2 border border-gray-300 rounded-4xl focus:outline-none focus:ring-2 focus:ring-blue-500 bg-white\"\r\n />\r\n </div>\r\n </div>\r\n <map-draw\r\n latitude={this.latitude}\r\n longitude={this.longitude}\r\n apiKey={this.apiKey}\r\n language={this.language}\r\n />\r\n </div>\r\n );\r\n }\r\n}\r\n"]}
@@ -1,5 +1,5 @@
1
1
  import { h } from "@stencil/core";
2
- import Chart from "chart.js/auto";
2
+ // import Chart from "chart.js/auto";
3
3
  import { DEFAULT_SOLAR_PANEL_TYPE } from "../../config";
4
4
  import { getLanguageStrings } from "../../utils/lang/general";
5
5
  const SOLAR_RADIATION = [
@@ -99,8 +99,11 @@ export class SolarSystemForm {
99
99
  email = "";
100
100
  nameError = "";
101
101
  emailError = "";
102
- chart = null;
103
- chartRef = null;
102
+ electricCar = false;
103
+ heatPump = 0;
104
+ battery = 0;
105
+ // private chart: Chart | null = null;
106
+ // private chartRef: HTMLCanvasElement | null = null;
104
107
  updateSystemConfigs() {
105
108
  if (Object.keys(this.systemConfigs).length === 0) {
106
109
  this.numberOfPanels = 0;
@@ -138,67 +141,67 @@ export class SolarSystemForm {
138
141
  100;
139
142
  }
140
143
  updateChart() {
141
- if (!this.chartRef)
142
- return;
143
- const ctx = this.chartRef.getContext("2d");
144
- if (!ctx)
145
- return;
146
- if (this.chart) {
147
- this.chart.destroy();
148
- }
149
- const hours = Array.from({ length: 24 }, (_, i) => `${i}:00`);
150
- const data = CONSUMPTION_PROFILES[this.consumptionProfile];
151
- const norm = data.reduce((acc, curr) => acc + curr, 0);
152
- const peakKwh = this.numberOfPanels * this.panelPeakPower;
153
- const production = SOLAR_RADIATION.map((radiation) => radiation * peakKwh);
154
- for (let i = 0; i < data.length; i++) {
155
- data[i] = data[i] * this.householdConsumption / norm / 365;
156
- }
157
- let datasets = [{
158
- label: "Energy Consumption",
159
- data: data,
160
- borderColor: "#964500",
161
- backgroundColor: "rgba(150, 69, 0, 0.1)",
162
- fill: true,
163
- tension: 0.4,
164
- }, {
165
- label: "Energy Production",
166
- data: production,
167
- borderColor: "#000000",
168
- backgroundColor: "rgba(0, 0, 0, 0.1)",
169
- fill: true,
170
- }];
171
- this.chart = new Chart(ctx, {
172
- type: "line",
173
- data: {
174
- labels: hours,
175
- datasets: datasets,
176
- },
177
- options: {
178
- responsive: true,
179
- plugins: {
180
- title: {
181
- display: true,
182
- text: "Daily Consumption Profile",
183
- },
184
- },
185
- scales: {
186
- y: {
187
- beginAtZero: true,
188
- title: {
189
- display: true,
190
- text: "Relative Consumption",
191
- },
192
- },
193
- x: {
194
- title: {
195
- display: true,
196
- text: "Hour of Day",
197
- },
198
- },
199
- },
200
- },
201
- });
144
+ // if (!this.chartRef) return;
145
+ // const ctx = this.chartRef.getContext("2d");
146
+ // if (!ctx) return;
147
+ // if (this.chart) {
148
+ // this.chart.destroy();
149
+ // }
150
+ // const hours = Array.from({ length: 24 }, (_, i) => `${i}:00`);
151
+ // const data = CONSUMPTION_PROFILES[this.consumptionProfile];
152
+ // const norm = data.reduce((acc, curr) => acc + curr, 0);
153
+ // const peakKwh = this.numberOfPanels * this.panelPeakPower;
154
+ // const production = SOLAR_RADIATION.map((radiation) =>
155
+ // radiation * peakKwh
156
+ // );
157
+ // for (let i = 0; i < data.length; i++) {
158
+ // data[i] = data[i] * this.householdConsumption / norm / 365;
159
+ // }
160
+ // let datasets = [{
161
+ // label: "Energy Consumption",
162
+ // data: data,
163
+ // borderColor: "#964500",
164
+ // backgroundColor: "rgba(150, 69, 0, 0.1)",
165
+ // fill: true,
166
+ // tension: 0.4,
167
+ // }, {
168
+ // label: "Energy Production",
169
+ // data: production,
170
+ // borderColor: "#000000",
171
+ // backgroundColor: "rgba(0, 0, 0, 0.1)",
172
+ // fill: true,
173
+ // }];
174
+ // this.chart = new Chart(ctx, {
175
+ // type: "line",
176
+ // data: {
177
+ // labels: hours,
178
+ // datasets: datasets,
179
+ // },
180
+ // options: {
181
+ // responsive: true,
182
+ // plugins: {
183
+ // title: {
184
+ // display: true,
185
+ // text: "Daily Consumption Profile",
186
+ // },
187
+ // },
188
+ // scales: {
189
+ // y: {
190
+ // beginAtZero: true,
191
+ // title: {
192
+ // display: true,
193
+ // text: "Relative Consumption",
194
+ // },
195
+ // },
196
+ // x: {
197
+ // title: {
198
+ // display: true,
199
+ // text: "Hour of Day",
200
+ // },
201
+ // },
202
+ // },
203
+ // },
204
+ // });
202
205
  }
203
206
  componentWillLoad() {
204
207
  this.updateSystemConfigs();
@@ -247,58 +250,54 @@ export class SolarSystemForm {
247
250
  }
248
251
  render() {
249
252
  const t = getLanguageStrings(this.language);
250
- return (h("div", { key: '85f0ec10f34015604a1acefcef02299b50466b6b', class: "flex flex-col justify-center items-center w-full h-full gap-4 p-4", style: {
251
- display: (Object.keys(this.systemConfigs).length === 0)
252
- ? "none"
253
- : "flex",
254
- } }, h("h1", { key: 'bf5f2adee5fb32b7a4b6ed215164799f834cb19d', class: "text-2xl font-bold text-[#271200] mb-4" }, t.solarSystemForm.title), h("div", { key: 'be9b94e078403ad753219dede42a9150f59fa9c2', class: "w-full max-w-2xl bg-[#f3ebda] rounded-4xl p-6 space-y-6" }, h("div", { key: 'aee08edb3ae4839d0d563a16c1dedddc20cda0ca', class: "space-y-4" }, h("h2", { key: 'a26a8f0a04be453a66e93d682fe32f886793c863', class: "text-lg font-semibold text-[#271200]" }, t.solarSystemForm.systemInformation), h("div", { key: '2b260f44574aecf9068c4dddff21f1dfcea1869f', class: "grid grid-cols-2 gap-4" }, h("div", { key: 'ba75503bcca9fbe04c99c0feac99eb7c7f064455' }, h("label", { key: '5ffaad1ceab5def87c9208f236b45597f539d574', class: "block text-sm font-medium text-gray-600 mb-1" }, t.solarSystemForm.numberOfPanels), h("input", { key: 'e984ed36d139ba29ea648122686cd71e9a01511f', type: "number", class: "w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent", value: this.numberOfPanels, readOnly: true })), h("div", { key: '6d60596af443dceaccbf71738b6e161678452053' }, h("label", { key: '593fb87663cab979e4409a15199d28cd716bfa33', class: "block text-sm font-medium text-gray-600 mb-1" }, t.solarSystemForm.panelPeakPower), h("input", { key: '71436a23b315fd713988d8d23f0056a5b8a378ac', type: "number", class: "w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent", value: this.panelPeakPower, readonly: true }))), h("div", { key: 'd8ea7e83738283446eef7c166d05692b9cff8f30', class: "bg-white rounded-4xl p-4" }, h("div", { key: '3ef0039db7abdc783a9fe2d8a5c6a5044d76b383', class: "flex items-center justify-between" }, h("span", { key: '8532b97fb829f69b338e5fba682cc5f5f68b8e2f', class: "text-gray-600" }, t.solarSystemForm.totalSystemPeakPower), h("span", { key: 'fa3835b2d2670cbd2fa11f57af60deab2cdc7142', class: "text-xl font-bold text-[#271200]" }, (DEFAULT_SOLAR_PANEL_TYPE.kWattPeak *
255
- this.numberOfPanels).toFixed(1), " kW")))), h("div", { key: '357c15507bbb1374c4d386360b3ba313fe12c71e', class: "space-y-4" }, h("h2", { key: 'd87a246f2765a91490067d8c0449741e75bf3e71', class: "text-lg font-semibold text-[#271200]" }, t.solarSystemForm.householdConsumptionTitle), h("div", { key: '0ba31368f5fbb4909f2858a5b325976aa6fa103f', class: "grid grid-cols-2 gap-4" }, h("div", { key: '051bd4afd32d202664e13df6dfaf92d6f2c881ea' }, h("label", { key: '56ed4f26cdc9d0c0001f0a0a602fcdd9c4e514f2', class: "block text-sm font-medium text-gray-600 mb-1" }, t.solarSystemForm.annualConsumption), h("input", { key: 'fe3a1e54b09104fa8829c3d8eb1337a8665aea55', type: "number", class: "w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent", value: this.householdConsumption, onInput: (e) => {
253
+ return (h("div", { key: '8d6f829e542b2c5c181e09341b308c57cf600b9c', class: "flex flex-col justify-center items-center w-full h-full pt-4" // style={{
254
+ }, h("h1", { key: 'ab4006f6fbaf7ec27d97866750c1379b61eda6af', class: "text-2xl font-bold text-[#271200] mb-4 w-full" }, t.solarSystemForm.title), h("div", { key: '146e4c669d1df07359804ed38ed848ad3352837a', class: "w-full bg-[#f3ebda] rounded-4xl p-6 space-y-6" }, h("div", { key: '057ed2bbd8aeae409547a7bc6b1511ac4d1d8ed7', class: "space-y-4" }, h("h2", { key: 'f305926a4e3a15edc39a11085d6de49a4f1f5219', class: "text-lg font-semibold text-[#271200]" }, t.solarSystemForm.systemInformation), h("div", { key: 'ca356100529b595f5e09659af63a954402358049', class: "grid grid-rows-2 gap-0" }, h("div", { key: '82928f8746710de68a488e0354868e0535fbe233', class: "grid grid-cols-2 gap-4" }, h("label", { key: '27d40999038574b81663e718496997d7d47ced14', class: "block text-sm font-medium text-gray-600 mb-1" }, t.solarSystemForm.numberOfPanels), h("label", { key: 'c61daf5bbc25b15e42cc6238fbc43c68fa0aea32', class: "block text-sm font-medium text-gray-600 mb-1" }, t.solarSystemForm.panelPeakPower)), h("div", { key: '7ba4968d89ec6c9bde572faeb19838b2d301e29c', class: "grid grid-cols-2 gap-4" }, h("input", { key: 'c7e1e79c1151ad393b547edbef3f11e7f157f83a', type: "number", class: "w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent bg-white", value: this.numberOfPanels, readOnly: true }), h("input", { key: 'dfa15518c359c0efc12aa72043b465ad10a88412', type: "number", class: "w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent bg-white", value: this.panelPeakPower, readonly: true }))), h("div", { key: 'fe237482225d4007359614a196dc9c33a9859ef4', class: "bg-white rounded-4xl p-4" }, h("div", { key: '91f8b46c8feb1d4ed1eb5b1fcb02388bd1ba9687', class: "flex items-center justify-between" }, h("span", { key: 'f340e45aecae6bb63784389cac444cb54a18e684', class: "text-gray-600" }, t.solarSystemForm.totalSystemPeakPower), h("span", { key: '475c3c7508474fe3612d28fac781a51361135aba', class: "text-xl font-bold text-[#271200]" }, (DEFAULT_SOLAR_PANEL_TYPE.kWattPeak *
255
+ this.numberOfPanels).toFixed(1), " kW")))), h("div", { key: '4c0245a98b3166da5cdc50c2c975489146456b80', class: "space-y-4" }, h("h2", { key: 'b950d4ccf23e48c72a085cc875ac9a96a7a87816', class: "text-lg font-semibold text-[#271200]" }, t.solarSystemForm.householdConsumptionTitle), h("div", { key: 'c805531e81121d87c33b5191ae8f9494c9fa89e6', class: "grid grid-rows-2 gap-0" }, h("div", { key: '54ba5238e1663018f2e82f991e58288816c8dfeb', class: "grid grid-cols-2 gap-4" }, h("label", { key: '20afa3d0bdfdf57c4e21cb3939fca79d904935d1', class: "block text-sm font-medium text-gray-600" }, t.solarSystemForm.annualConsumption), h("label", { key: '37c9f06e2f32ec8d9d42483da0f0a3292c1d1616', class: "block text-sm font-medium text-gray-600" }, t.solarSystemForm.consumptionProfileTitle)), h("div", { key: '6b5ce305001442946aac00b51b3afb20625cda25', class: "grid grid-cols-2 gap-4" }, h("input", { key: 'a3677da2c99e917b832c3ec9b7627e23fd080064', type: "number", class: "w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent bg-white", value: this.householdConsumption, onInput: (e) => {
256
256
  this.householdConsumption = parseInt(e.target
257
257
  .value);
258
258
  this.recalculate();
259
259
  this.updateChart();
260
- } })), h("div", { key: 'c33aaab13fa367d60842d9b378a8045aeee946cc' }, h("label", { key: '3bb5d0271fad3ac4d5bf45a76d62a1d31efbec06', class: "block text-sm font-medium text-gray-600 mb-1" }, t.solarSystemForm.consumptionProfileTitle), h("select", { key: '061a6746a1fde4aa95d39c48c772de24ca80dda6', class: "w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent", onChange: (e) => {
260
+ } }), h("select", { key: '776ab2c001ea82845136a8d5f72e75edc69817dc', class: "w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent bg-white", onChange: (e) => {
261
261
  this.consumptionProfile =
262
262
  e.target
263
263
  .value;
264
264
  this.recalculate();
265
265
  this.updateChart();
266
- } }, h("option", { key: 'c763ff9d4bdf3c60c5067e105d00936bf32ffbd5', value: "mostly_at_home", selected: this.consumptionProfile ===
266
+ } }, h("option", { key: 'b3165b60537890a35e5686ee1920fb2f95c51ac4', value: "mostly_at_home", selected: this.consumptionProfile ===
267
267
  "mostly_at_home" }, t.solarSystemForm.consumptionProfiles
268
- .mostlyAtHome), h("option", { key: 'df7e8cf24b1680575fcceab59a1ba7c79da39009', value: "mostly_away", selected: this.consumptionProfile ===
268
+ .mostlyAtHome), h("option", { key: 'eb39ea402951c308dce688da043a630818e88219', value: "mostly_away", selected: this.consumptionProfile ===
269
269
  "mostly_away" }, t.solarSystemForm.consumptionProfiles
270
- .mostlyAway)))), h("div", { key: '61df552d9e00d3acd2419071187703a8e808abd5', class: "mt-4 h-48" }, h("canvas", { key: 'fad304a8b3b6390c9ccd79dfa37cec5ec0b2bda0', ref: (el) => this.chartRef = el }))), h("div", { key: 'd7d8e5c36d883d5dcdc51cd9a2ec44092e5cb26b', class: "space-y-4" }, h("h2", { key: 'e18131dfdc84c8e0105a9ca4640d196c006e3095', class: "text-lg font-semibold text-[#271200]" }, t.solarSystemForm.electricityCostsTitle), h("div", { key: '1cd7f7d3d59149e79b30b9832ef7a42e2082e00d', class: "grid grid-cols-2 gap-4" }, h("div", { key: '53bead211d686cf6acc883474baa7d9135365afc' }, h("label", { key: 'c04f6d3880e9590f9d51649df7bd124073746e5b', class: "block text-sm font-medium text-gray-600 mb-1" }, t.solarSystemForm.electricityPrice), h("input", { key: '68e226adfe557355b89745efc3aeee88528b6710', type: "number", step: "0.01", class: "w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent", value: this.electricityPrice, onInput: (e) => {
270
+ .mostlyAway))))), h("div", { key: '6d9b59896053431448ef4773526d55b248b94cf2', class: "space-y-4" }, h("h2", { key: 'e8408f003e0de554be8ad3eabbca0050e4f75155', class: "text-lg font-semibold text-[#271200]" }, "Additional Components"), h("div", { key: '5505fba56da71bae25767d053170dfabf8a610fe', class: "grid grid-rows-2 gap-4" })), h("div", { key: '3f727f45fea480257c41d779eb980839200209dd', class: "space-y-4" }, h("h2", { key: '9565045eb4262ad5708f0802ac9161ddb50405c9', class: "text-lg font-semibold text-[#271200]" }, t.solarSystemForm.electricityCostsTitle), h("div", { key: '422102ce3fbe1aca445d10c26506a50e3e5b5dcb', class: "grid grid-rows-2 gap-0" }, h("div", { key: 'e72dce6ec3f8abcc7ffc12114c669ef16ae2d1e4', class: "grid grid-cols-2 gap-4" }, h("label", { key: '1dae32e95c18b673a0dd876c4c645c0232d3bf3c', class: "block text-sm font-medium text-gray-600 mb-1" }, t.solarSystemForm.electricityPrice), h("label", { key: 'c6167205fc4bbf3b81e12d5e7a4b812d3cb7d7e4', class: "block text-sm font-medium text-gray-600 mb-1" }, t.solarSystemForm.compensationRate)), h("div", { key: '97f5a91c39a59e51e27f69227178dc7615e323da', class: "grid grid-cols-2 gap-4" }, h("input", { key: '9a6c81ab930a1db918a8b978d5a26318ad359979', type: "number", step: "0.01", class: "w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent bg-white", value: this.electricityPrice.toFixed(2), onInput: (e) => {
271
271
  this.electricityPrice = parseFloat(e.target
272
272
  .value);
273
273
  this.recalculate();
274
274
  this.updateChart();
275
- } })), h("div", { key: '3264cda47cb1f7f90259fc13116601ae9e636238' }, h("label", { key: '1580f49c9f24ec02fcfe5ec174e5c8087c040f4e', class: "block text-sm font-medium text-gray-600 mb-1" }, t.solarSystemForm.compensationRate), h("input", { key: 'f87e99c2b852da74267351cb630453f2d7cadd6f', type: "number", step: "0.01", class: "w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent", value: this.compensationRate, onInput: (e) => {
275
+ } }), h("input", { key: '5052bb2f4a1cae0c1a3eae47a358be65150b07f3', type: "number", step: "0.01", class: "w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent bg-white", value: this.compensationRate.toFixed(2), onInput: (e) => {
276
276
  this.compensationRate = parseFloat(e.target
277
277
  .value);
278
278
  this.recalculate();
279
279
  this.updateChart();
280
- } })))), h("div", { key: 'cccd456f9ec53c92069d10a8e6d784846bf5f781', class: "space-y-4 pt-4 border-t border-gray-200" }, h("h2", { key: '3c78d0c1acc807cc98b9d9dbc3da4a4fb6cc2a8e', class: "text-lg font-semibold text-[#271200]" }, t.solarSystemForm.resultsTitle), h("div", { key: '91312264cd67e83a97de15523cbc6d9f82299ed4', class: "bg-white rounded-4xl p-4" }, h("div", { key: '1e85cd1784830413d0b1c004b6d8c3351190b8f3', class: "flex items-center justify-between" }, h("span", { key: '014465ba43e1c65df0ec912c5a8f7852e8606752', class: "text-gray-600" }, t.solarSystemForm.autonomy), h("span", { key: '16f0e0cec4193c35413790f24f60a96ec698271b', class: "text-xl font-bold text-[#271200]" }, this.autonomy.toFixed(1), "%")), h("div", { key: '03a768dc16689bdefe3da494e3647703f2efd975', class: "flex items-center justify-between mt-4" }, h("div", { key: '903e120975d517ddf5969f89b6abab03d25f2f0b', class: "flex items-center gap-2" }, h("span", { key: '6c1de0b96b625c0fc7bc5b376156e0e8b33c2f1b', class: "text-gray-600" }, t.solarSystemForm.costSavings), h("div", { key: 'c70b1d80322d64ccf07b9f40ca300ed4aba9da2f', class: "relative group" }, h("svg", { key: '7f8567254e065d1dd8b6da090b12305db89bb83c', xmlns: "http://www.w3.org/2000/svg", class: "h-5 w-5 text-gray-400 cursor-help", viewBox: "0 0 20 20", fill: "currentColor" }, h("path", { key: 'd374484901dcffbc35e1ff5c1d1039526ea65978', "fill-rule": "evenodd", d: "M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-3a1 1 0 00-.867.5 1 1 0 11-1.731-1A3 3 0 0113 8a3.001 3.001 0 01-2 2.83V11a1 1 0 11-2 0v-1a1 1 0 011-1 1 1 0 100-2zm0 8a1 1 0 100-2 1 1 0 000 2z", "clip-rule": "evenodd" })), h("div", { key: '0f59e908dfa91226ee1648d6d4739f9e9bc54ca5', class: "absolute bottom-full left-1/2 transform -translate-x-1/2 mb-2 w-64 p-2 bg-gray-800 text-white text-sm rounded-lg opacity-0 group-hover:opacity-100 transition-opacity duration-200 pointer-events-none" }, t.solarSystemForm
281
- .savingsDisclaimer))), h("span", { key: 'bf1d7bd08a93274615b88d35e2bd359187ca085b', class: "text-xl font-bold text-green-600" }, this.costSavings.toFixed(2), "\u20AC/", t
282
- .solarSystemForm.year)))), h("div", { key: 'ca60e696392cb3ef2cb66603489997869e0f51cb', class: "space-y-4 pt-4 border-t border-gray-200" }, h("h2", { key: '4f44b5774a022e8925738abc25894fdf8b6fc8fa', class: "text-lg font-semibold text-[#271200]" }, t.solarSystemForm.requestOffer), h("div", { key: 'fe32a47f43e742d81424980fd41631d328358695', class: "grid grid-cols-2 gap-4" }, h("div", { key: 'a2ce707a5f4b4568eabb02a08022d8f1c74137e2' }, h("label", { key: 'b38ec2029a9d9cfe29c4e2d415a03b046acba319', class: "block text-sm font-medium text-gray-600 mb-1" }, t.solarSystemForm.name), h("input", { key: '8f94467b24e2a11f898f258c6d4aa9ee0de34dc1', type: "text", class: `w-full px-4 py-2 rounded-4xl border ${this.nameError
280
+ } })))), h("div", { key: '963fc95e0bad78a83683c4f67fc650a109ab2690', class: "space-y-4 pt-4 border-t border-gray-200" }, h("h2", { key: '95aa13e5cacdb63899460cf7dedb76c4461ee791', class: "text-lg font-semibold text-[#271200]" }, t.solarSystemForm.resultsTitle), h("div", { key: '4430f65734b775429b20f6ff0416b9786b0930c7', class: "bg-white rounded-4xl p-4" }, h("div", { key: 'ad1a2599bac396857ed68f896f43de0b44de5a48', class: "flex items-center justify-between" }, h("span", { key: '978c49b1770bb649c26d7b9d23d28a7a174afc96', class: "text-gray-600" }, t.solarSystemForm.autonomy), h("span", { key: 'cc7b0dae2d4db46ca284446988767207762c2bbe', class: "text-xl font-bold text-[#271200]" }, this.autonomy.toFixed(1), "%")), h("div", { key: '8bc803b6f2fb01e5a7c5a44d0054ff0096bb1f51', class: "flex items-center justify-between mt-4" }, h("div", { key: 'bf8cec65c5d32dbb32a1fd00d8b2897789d2dc37', class: "flex items-center gap-2" }, h("span", { key: 'fe123d39da7f209d13f441082f21de2474a27364', class: "text-gray-600" }, t.solarSystemForm.costSavings), h("div", { key: '00a33ff21329f0aa105696a4ab214188e25773d6', class: "relative group" }, h("svg", { key: '6f8e03c873fc28343bd515fdf8b0f47761c7ea3d', xmlns: "http://www.w3.org/2000/svg", class: "h-5 w-5 text-gray-400 cursor-help", viewBox: "0 0 20 20", fill: "currentColor" }, h("path", { key: '358ba8282f5e12629d5cbb0809ddd20c0a894fbc', "fill-rule": "evenodd", d: "M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-3a1 1 0 00-.867.5 1 1 0 11-1.731-1A3 3 0 0113 8a3.001 3.001 0 01-2 2.83V11a1 1 0 11-2 0v-1a1 1 0 011-1 1 1 0 100-2zm0 8a1 1 0 100-2 1 1 0 000 2z", "clip-rule": "evenodd" })), h("div", { key: '7c10aeaf6d2e58523f747cf4b1ce0d9d21aaaa49', class: "absolute bottom-full left-1/2 transform -translate-x-1/2 mb-2 w-64 p-2 bg-gray-800 text-white text-sm rounded-lg opacity-0 group-hover:opacity-100 transition-opacity duration-200 pointer-events-none" }, t.solarSystemForm
281
+ .savingsDisclaimer))), h("span", { key: 'e4faed1b8f1d57d0ebbb36084f9e4f0eed602014', class: "text-xl font-bold text-green-600" }, this.costSavings.toFixed(2), "\u20AC/", t
282
+ .solarSystemForm.year)))), h("div", { key: '57859b85dbf1bcee0cedb6c81e8ab9beffd51738', class: "space-y-4 pt-4 border-t border-gray-200" }, h("h2", { key: 'c8bda51815a9977304a3bca1a28a63d563375177', class: "text-lg font-semibold text-[#271200]" }, t.solarSystemForm.requestOffer), h("div", { key: 'a58139ae6c1714267b61b98f8bcbaa78f80c5e3e', class: "grid grid-rows-2 gap-0" }, h("div", { key: '30e18db38d9f2a2bd37d34d0e364b2477ec7e30e', class: "grid grid-cols-2 gap-4" }, h("label", { key: '15dd0d8714cc9a9548a0d478dc5825a55c9a249c', class: "block text-sm font-medium text-gray-600 mb-1" }, t.solarSystemForm.name), h("label", { key: 'e300aa1d93c95220e8cacc2903d5198a864d177f', class: "block text-sm font-medium text-gray-600 mb-1" }, t.solarSystemForm.email)), h("div", { key: 'ce9010d081c9c962c09ef8094899a3ea539b8fa8', class: "grid grid-cols-2 gap-4" }, h("input", { key: 'dd6317ee394798ec4ae897e0fc1aabc4a1fda935', type: "text", class: `w-full px-4 py-2 rounded-4xl border ${this.nameError
283
283
  ? "border-red-500"
284
- : "border-gray-300"} focus:ring-2 focus:ring-[#964500] focus:border-transparent`, value: this.name, onInput: (e) => {
284
+ : "border-gray-300"} focus:ring-2 focus:ring-[#964500] focus:border-transparent bg-white`, value: this.name, onInput: (e) => {
285
285
  this.name =
286
286
  e.target
287
287
  .value;
288
288
  this.validateForm();
289
- }, placeholder: "Your name" }), this.nameError && (h("p", { key: 'e539561f556cf7914a3d888d20450e2d09b72fa2', class: "text-red-500 text-sm mt-1" }, this.nameError))), h("div", { key: '6ab0ef38a62847304aa131d41902d4eeeebd2fc9' }, h("label", { key: '336f9d727f4c556397bef6a080d969015d730036', class: "block text-sm font-medium text-gray-600 mb-1" }, t.solarSystemForm.email), h("input", { key: '783fe2c3552a444e300a3d36f784aa13af9cfc79', type: "email", class: `w-full px-4 py-2 rounded-4xl border ${this.emailError
289
+ }, placeholder: "Your name" }), this.nameError && (h("p", { key: 'b101b6a18db1fd0c528393ae19beec13099fdd80', class: "text-red-500 text-sm mt-1" }, this.nameError)), h("input", { key: '361b641612c986ed2859da069488007601d66594', type: "email", class: `w-full px-4 py-2 rounded-4xl border ${this.emailError
290
290
  ? "border-red-500"
291
- : "border-gray-300"} focus:ring-2 focus:ring-[#964500] focus:border-transparent`, value: this.email, onInput: (e) => {
291
+ : "border-gray-300"} focus:ring-2 focus:ring-[#964500] focus:border-transparent bg-white`, value: this.email, onInput: (e) => {
292
292
  this.email =
293
293
  e.target
294
294
  .value;
295
295
  this.validateForm();
296
- }, placeholder: "your.email@example.com" }), this.emailError && (h("p", { key: '5e67155bb99c051e1a1a6d5957826ef328daa362', class: "text-red-500 text-sm mt-1" }, this.emailError)))), h("div", { key: 'd4a4ded8adfab4ef284f888556e9ad4847f0de2e', class: "flex justify-center" }, h("button", { key: 'b4eb433e4ce1e0c9128fc7c3b89670091e137c8b', onClick: () => this.handleRequestOffer(), disabled: !this.name.trim() ||
296
+ }, placeholder: "your.email@example.com" }), this.emailError && (h("p", { key: '504d32bba31775ba3e0ce650ee8840ea904e1877', class: "text-red-500 text-sm mt-1" }, this.emailError)))), h("div", { key: 'ade7fa72c0be4974ad6dc6d82f98cb2d11994c6f', class: "flex justify-center" }, h("button", { key: 'b2a2fdbbf4cffadc0c3d7b40027533cbfaa7943c', onClick: () => this.handleRequestOffer(), disabled: !this.name.trim() ||
297
297
  !this.email.trim() || !!this.nameError ||
298
298
  !!this.emailError, class: "px-4 py-2 bg-[#271200] rounded-4xl hover:bg-[#964500] transition-colors duration-200", style: { color: "white" } }, t.solarSystemForm.requestOfferButton))))));
299
299
  }
300
300
  static get is() { return "solar-system-form"; }
301
- static get encapsulation() { return "shadow"; }
302
301
  static get originalStyleUrls() {
303
302
  return {
304
303
  "$": ["../../output.css"]
@@ -427,7 +426,10 @@ export class SolarSystemForm {
427
426
  "name": {},
428
427
  "email": {},
429
428
  "nameError": {},
430
- "emailError": {}
429
+ "emailError": {},
430
+ "electricCar": {},
431
+ "heatPump": {},
432
+ "battery": {}
431
433
  };
432
434
  }
433
435
  static get watchers() {
@@ -1 +1 @@
1
- {"version":3,"file":"solar-system-form.js","sourceRoot":"","sources":["../../../src/components/solar-system-form/solar-system-form.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, State, Watch } from \"@stencil/core\";\r\nimport Chart from \"chart.js/auto\";\r\nimport { DEFAULT_SOLAR_PANEL_TYPE } from \"../../config\";\r\nimport { SolarPanelSystemPart } from \"../../utils/geometry/fitting\";\r\nimport { getLanguageStrings } from \"../../utils/lang/general\";\r\nimport { Language } from \"../../types/lang\";\r\nimport { Polygon } from \"../../types/shapes\";\r\n\r\nconst SOLAR_RADIATION = [\r\n 0,\r\n 0,\r\n 0,\r\n 0,\r\n 0,\r\n 0, // 00:00 - 05:00 - 6\r\n 0,\r\n 0.1,\r\n 0.2, // 8\r\n 0.4,\r\n 0.8,\r\n 1, // 06:00 - 11:00 - 12\r\n 1,\r\n 1,\r\n 1,\r\n 0.7,\r\n 0.5,\r\n 0.3, // 12:00 - 17:00 - 18\r\n 0.16,\r\n 0.02,\r\n 0,\r\n 0,\r\n 0,\r\n 0, // 18:00 - 23:00 - 24\r\n];\r\nconst CONSUMPTION_PROFILES = {\r\n mostly_at_home: [\r\n 0.1,\r\n 0.1,\r\n 0.1,\r\n 0.1,\r\n 0.1,\r\n 0.15, // 00:00 - 05:00 - 6\r\n 0.23,\r\n 0.26,\r\n 0.16,\r\n 0.16,\r\n 0.15,\r\n 0.19, // 06:00 - 11:00 - 12\r\n 0.23,\r\n 0.24,\r\n 0.35,\r\n 0.28,\r\n 0.275,\r\n 0.8, // 12:00 - 17:00 - 18\r\n 0.78,\r\n 0.74,\r\n 0.75,\r\n 0.73,\r\n 0.26,\r\n 0.1, // 18:00 - 23:00 - 24\r\n ],\r\n mostly_away: [\r\n 0.1,\r\n 0.1,\r\n 0.1,\r\n 0.1,\r\n 0.1,\r\n 0.15, // 00:00 - 05:00 - 6\r\n 0.29,\r\n 0.32,\r\n 0.25,\r\n 0.15,\r\n 0.12,\r\n 0.14, // 06:00 - 11:00 - 12\r\n 0.15,\r\n 0.12,\r\n 0.16,\r\n 0.21,\r\n 0.285,\r\n 1, // 12:00 - 17:00 - 18\r\n 0.81,\r\n 0.77,\r\n 0.79,\r\n 0.73,\r\n 0.26,\r\n 0.1, // 18:00 - 23:00 - 24\r\n ],\r\n};\r\n\r\n@Component({\r\n tag: \"solar-system-form\",\r\n styleUrl: \"../../output.css\",\r\n shadow: true,\r\n})\r\nexport class SolarSystemForm {\r\n @Prop()\r\n systemConfigs: { [id: string]: SolarPanelSystemPart } = {};\r\n @Prop()\r\n language: Language = \"en\";\r\n @Prop()\r\n roofPolygons: { [id: string]: Polygon } = {};\r\n @Prop()\r\n obstructionPolygons: { [id: string]: Polygon } = {};\r\n\r\n @State()\r\n householdConsumption: number = 3500;\r\n @State()\r\n consumptionProfile: \"mostly_at_home\" | \"mostly_away\" = \"mostly_at_home\";\r\n @State()\r\n electricityPrice: number = 0.3;\r\n @State()\r\n compensationRate: number = 0.07;\r\n @State()\r\n autonomy: number = 0;\r\n @State()\r\n costSavings: number = 0;\r\n @State()\r\n numberOfPanels: number = 5;\r\n @State()\r\n panelPeakPower: number = 0.4; // kW per panel\r\n @State()\r\n name: string = \"\";\r\n @State()\r\n email: string = \"\";\r\n @State()\r\n nameError: string = \"\";\r\n @State()\r\n emailError: string = \"\";\r\n\r\n private chart: Chart | null = null;\r\n private chartRef: HTMLCanvasElement | null = null;\r\n\r\n @Watch(\"systemConfigs\")\r\n updateSystemConfigs() {\r\n if (Object.keys(this.systemConfigs).length === 0) {\r\n this.numberOfPanels = 0;\r\n return;\r\n }\r\n this.numberOfPanels = Object.keys(this.systemConfigs).reduce(\r\n (acc, curr) =>\r\n acc + this.systemConfigs[curr].positionedPanels.length,\r\n 0,\r\n );\r\n\r\n this.panelPeakPower =\r\n Object.entries(this.systemConfigs)[0][1].positionedPanels[0].panel\r\n .kWattPeak;\r\n\r\n this.recalculate();\r\n this.updateChart();\r\n }\r\n\r\n private recalculate() {\r\n const data = CONSUMPTION_PROFILES[this.consumptionProfile];\r\n const norm = data.reduce((acc, curr) => acc + curr, 0);\r\n\r\n const peakKwh = this.numberOfPanels * this.panelPeakPower;\r\n const production = SOLAR_RADIATION.map((radiation) =>\r\n radiation * peakKwh\r\n );\r\n let energyUsageOfProduction = 0;\r\n\r\n for (let i = 0; i < data.length; i++) {\r\n data[i] = data[i] * this.householdConsumption / norm / 365;\r\n if (data[i] <= production[i]) {\r\n energyUsageOfProduction += data[i];\r\n } else if (data[i] > production[i]) {\r\n energyUsageOfProduction += production[i];\r\n }\r\n }\r\n const energyDifference = production.map((p, i) => data[i] - p);\r\n const soldEnergy = -energyDifference.filter((e) => e < 0).reduce(\r\n (acc, curr) => acc + curr,\r\n 0,\r\n );\r\n // Calculate the cost savings\r\n this.costSavings = soldEnergy * this.compensationRate * 365 +\r\n energyUsageOfProduction * 365 * this.electricityPrice;\r\n\r\n this.autonomy =\r\n (energyUsageOfProduction / (this.householdConsumption / 365)) *\r\n 100;\r\n }\r\n\r\n private updateChart() {\r\n if (!this.chartRef) return;\r\n\r\n const ctx = this.chartRef.getContext(\"2d\");\r\n if (!ctx) return;\r\n\r\n if (this.chart) {\r\n this.chart.destroy();\r\n }\r\n\r\n const hours = Array.from({ length: 24 }, (_, i) => `${i}:00`);\r\n const data = CONSUMPTION_PROFILES[this.consumptionProfile];\r\n const norm = data.reduce((acc, curr) => acc + curr, 0);\r\n\r\n const peakKwh = this.numberOfPanels * this.panelPeakPower;\r\n const production = SOLAR_RADIATION.map((radiation) =>\r\n radiation * peakKwh\r\n );\r\n\r\n for (let i = 0; i < data.length; i++) {\r\n data[i] = data[i] * this.householdConsumption / norm / 365;\r\n }\r\n\r\n let datasets = [{\r\n label: \"Energy Consumption\",\r\n data: data,\r\n borderColor: \"#964500\",\r\n backgroundColor: \"rgba(150, 69, 0, 0.1)\",\r\n fill: true,\r\n tension: 0.4,\r\n }, {\r\n label: \"Energy Production\",\r\n data: production,\r\n borderColor: \"#000000\",\r\n backgroundColor: \"rgba(0, 0, 0, 0.1)\",\r\n fill: true,\r\n }];\r\n\r\n this.chart = new Chart(ctx, {\r\n type: \"line\",\r\n data: {\r\n labels: hours,\r\n datasets: datasets,\r\n },\r\n options: {\r\n responsive: true,\r\n plugins: {\r\n title: {\r\n display: true,\r\n text: \"Daily Consumption Profile\",\r\n },\r\n },\r\n scales: {\r\n y: {\r\n beginAtZero: true,\r\n title: {\r\n display: true,\r\n text: \"Relative Consumption\",\r\n },\r\n },\r\n x: {\r\n title: {\r\n display: true,\r\n text: \"Hour of Day\",\r\n },\r\n },\r\n },\r\n },\r\n });\r\n }\r\n\r\n componentWillLoad() {\r\n this.updateSystemConfigs();\r\n }\r\n\r\n private validateForm(): boolean {\r\n let isValid = true;\r\n const t = getLanguageStrings(this.language);\r\n\r\n // Validate name\r\n if (!this.name.trim()) {\r\n this.nameError = t.solarSystemForm.nameError;\r\n isValid = false;\r\n } else {\r\n this.nameError = \"\";\r\n }\r\n\r\n // Validate email\r\n const emailRegex = /^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/;\r\n if (!this.email.trim()) {\r\n this.emailError = t.solarSystemForm.emailError;\r\n isValid = false;\r\n } else if (!emailRegex.test(this.email)) {\r\n this.emailError = t.solarSystemForm.validEmailError;\r\n isValid = false;\r\n } else {\r\n this.emailError = \"\";\r\n }\r\n\r\n return isValid;\r\n }\r\n\r\n private handleRequestOffer() {\r\n if (!this.validateForm()) {\r\n return;\r\n }\r\n // Here you can implement the logic to handle the offer request\r\n console.log(\"Requesting offer for: \", {\r\n name: this.name,\r\n email: this.email,\r\n systemConfig: this.systemConfigs,\r\n consumption: this.householdConsumption,\r\n autonomy: this.autonomy,\r\n costSavings: this.costSavings,\r\n roofPolygons: this.roofPolygons,\r\n obstructionPolygons: this.obstructionPolygons,\r\n });\r\n }\r\n\r\n render() {\r\n const t = getLanguageStrings(this.language);\r\n return (\r\n <div\r\n class=\"flex flex-col justify-center items-center w-full h-full gap-4 p-4\"\r\n style={{\r\n display: (Object.keys(this.systemConfigs).length === 0)\r\n ? \"none\"\r\n : \"flex\",\r\n }}\r\n >\r\n <h1 class=\"text-2xl font-bold text-[#271200] mb-4\">\r\n {t.solarSystemForm.title}\r\n </h1>\r\n\r\n <div class=\"w-full max-w-2xl bg-[#f3ebda] rounded-4xl p-6 space-y-6\">\r\n {/* System Info Section */}\r\n <div class=\"space-y-4\">\r\n <h2 class=\"text-lg font-semibold text-[#271200]\">\r\n {t.solarSystemForm.systemInformation}\r\n </h2>\r\n <div class=\"grid grid-cols-2 gap-4\">\r\n <div>\r\n <label class=\"block text-sm font-medium text-gray-600 mb-1\">\r\n {t.solarSystemForm.numberOfPanels}\r\n </label>\r\n <input\r\n type=\"number\"\r\n class=\"w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent\"\r\n value={this.numberOfPanels}\r\n readOnly\r\n />\r\n </div>\r\n <div>\r\n <label class=\"block text-sm font-medium text-gray-600 mb-1\">\r\n {t.solarSystemForm.panelPeakPower}\r\n </label>\r\n <input\r\n type=\"number\"\r\n class=\"w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent\"\r\n value={this.panelPeakPower}\r\n readonly\r\n />\r\n </div>\r\n </div>\r\n <div class=\"bg-white rounded-4xl p-4\">\r\n <div class=\"flex items-center justify-between\">\r\n <span class=\"text-gray-600\">\r\n {t.solarSystemForm.totalSystemPeakPower}\r\n </span>\r\n <span class=\"text-xl font-bold text-[#271200]\">\r\n {(DEFAULT_SOLAR_PANEL_TYPE.kWattPeak *\r\n this.numberOfPanels).toFixed(1)} kW\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n {/* Household Consumption Section */}\r\n <div class=\"space-y-4\">\r\n <h2 class=\"text-lg font-semibold text-[#271200]\">\r\n {t.solarSystemForm.householdConsumptionTitle}\r\n </h2>\r\n <div class=\"grid grid-cols-2 gap-4\">\r\n <div>\r\n <label class=\"block text-sm font-medium text-gray-600 mb-1\">\r\n {t.solarSystemForm.annualConsumption}\r\n </label>\r\n <input\r\n type=\"number\"\r\n class=\"w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent\"\r\n value={this.householdConsumption}\r\n onInput={(e) => {\r\n this.householdConsumption = parseInt(\r\n (e.target as HTMLInputElement)\r\n .value,\r\n );\r\n this.recalculate();\r\n this.updateChart();\r\n }}\r\n />\r\n </div>\r\n <div>\r\n <label class=\"block text-sm font-medium text-gray-600 mb-1\">\r\n {t.solarSystemForm.consumptionProfileTitle}\r\n </label>\r\n <select\r\n class=\"w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent\"\r\n onChange={(e) => {\r\n this.consumptionProfile =\r\n (e.target as HTMLSelectElement)\r\n .value as\r\n | \"mostly_at_home\"\r\n | \"mostly_away\";\r\n this.recalculate();\r\n this.updateChart();\r\n }}\r\n >\r\n <option\r\n value=\"mostly_at_home\"\r\n selected={this.consumptionProfile ===\r\n \"mostly_at_home\"}\r\n >\r\n {t.solarSystemForm.consumptionProfiles\r\n .mostlyAtHome}\r\n </option>\r\n <option\r\n value=\"mostly_away\"\r\n selected={this.consumptionProfile ===\r\n \"mostly_away\"}\r\n >\r\n {t.solarSystemForm.consumptionProfiles\r\n .mostlyAway}\r\n </option>\r\n </select>\r\n </div>\r\n </div>\r\n <div class=\"mt-4 h-48\">\r\n <canvas ref={(el) => this.chartRef = el}></canvas>\r\n </div>\r\n </div>\r\n\r\n {/* Electricity Price and Compensation Section */}\r\n <div class=\"space-y-4\">\r\n <h2 class=\"text-lg font-semibold text-[#271200]\">\r\n {t.solarSystemForm.electricityCostsTitle}\r\n </h2>\r\n <div class=\"grid grid-cols-2 gap-4\">\r\n <div>\r\n <label class=\"block text-sm font-medium text-gray-600 mb-1\">\r\n {t.solarSystemForm.electricityPrice}\r\n </label>\r\n <input\r\n type=\"number\"\r\n step=\"0.01\"\r\n class=\"w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent\"\r\n value={this.electricityPrice}\r\n onInput={(e) => {\r\n this.electricityPrice = parseFloat(\r\n (e.target as HTMLInputElement)\r\n .value,\r\n );\r\n this.recalculate();\r\n this.updateChart();\r\n }}\r\n />\r\n </div>\r\n <div>\r\n <label class=\"block text-sm font-medium text-gray-600 mb-1\">\r\n {t.solarSystemForm.compensationRate}\r\n </label>\r\n <input\r\n type=\"number\"\r\n step=\"0.01\"\r\n class=\"w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent\"\r\n value={this.compensationRate}\r\n onInput={(e) => {\r\n this.compensationRate = parseFloat(\r\n (e.target as HTMLInputElement)\r\n .value,\r\n );\r\n this.recalculate();\r\n this.updateChart();\r\n }}\r\n />\r\n </div>\r\n </div>\r\n </div>\r\n\r\n {/* Results Section */}\r\n <div class=\"space-y-4 pt-4 border-t border-gray-200\">\r\n <h2 class=\"text-lg font-semibold text-[#271200]\">\r\n {t.solarSystemForm.resultsTitle}\r\n </h2>\r\n <div class=\"bg-white rounded-4xl p-4\">\r\n <div class=\"flex items-center justify-between\">\r\n <span class=\"text-gray-600\">\r\n {t.solarSystemForm.autonomy}\r\n </span>\r\n <span class=\"text-xl font-bold text-[#271200]\">\r\n {this.autonomy.toFixed(1)}%\r\n </span>\r\n </div>\r\n <div class=\"flex items-center justify-between mt-4\">\r\n <div class=\"flex items-center gap-2\">\r\n <span class=\"text-gray-600\">\r\n {t.solarSystemForm.costSavings}\r\n </span>\r\n <div class=\"relative group\">\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n class=\"h-5 w-5 text-gray-400 cursor-help\"\r\n viewBox=\"0 0 20 20\"\r\n fill=\"currentColor\"\r\n >\r\n <path\r\n fill-rule=\"evenodd\"\r\n d=\"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-3a1 1 0 00-.867.5 1 1 0 11-1.731-1A3 3 0 0113 8a3.001 3.001 0 01-2 2.83V11a1 1 0 11-2 0v-1a1 1 0 011-1 1 1 0 100-2zm0 8a1 1 0 100-2 1 1 0 000 2z\"\r\n clip-rule=\"evenodd\"\r\n />\r\n </svg>\r\n <div class=\"absolute bottom-full left-1/2 transform -translate-x-1/2 mb-2 w-64 p-2 bg-gray-800 text-white text-sm rounded-lg opacity-0 group-hover:opacity-100 transition-opacity duration-200 pointer-events-none\">\r\n {t.solarSystemForm\r\n .savingsDisclaimer}\r\n </div>\r\n </div>\r\n </div>\r\n <span class=\"text-xl font-bold text-green-600\">\r\n {this.costSavings.toFixed(2)}€/{t\r\n .solarSystemForm.year}\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n {/* Contact Information Section */}\r\n <div class=\"space-y-4 pt-4 border-t border-gray-200\">\r\n <h2 class=\"text-lg font-semibold text-[#271200]\">\r\n {t.solarSystemForm.requestOffer}\r\n </h2>\r\n <div class=\"grid grid-cols-2 gap-4\">\r\n <div>\r\n <label class=\"block text-sm font-medium text-gray-600 mb-1\">\r\n {t.solarSystemForm.name}\r\n </label>\r\n <input\r\n type=\"text\"\r\n class={`w-full px-4 py-2 rounded-4xl border ${\r\n this.nameError\r\n ? \"border-red-500\"\r\n : \"border-gray-300\"\r\n } focus:ring-2 focus:ring-[#964500] focus:border-transparent`}\r\n value={this.name}\r\n onInput={(e) => {\r\n this.name =\r\n (e.target as HTMLInputElement)\r\n .value;\r\n this.validateForm();\r\n }}\r\n placeholder=\"Your name\"\r\n />\r\n {this.nameError && (\r\n <p class=\"text-red-500 text-sm mt-1\">\r\n {this.nameError}\r\n </p>\r\n )}\r\n </div>\r\n <div>\r\n <label class=\"block text-sm font-medium text-gray-600 mb-1\">\r\n {t.solarSystemForm.email}\r\n </label>\r\n <input\r\n type=\"email\"\r\n class={`w-full px-4 py-2 rounded-4xl border ${\r\n this.emailError\r\n ? \"border-red-500\"\r\n : \"border-gray-300\"\r\n } focus:ring-2 focus:ring-[#964500] focus:border-transparent`}\r\n value={this.email}\r\n onInput={(e) => {\r\n this.email =\r\n (e.target as HTMLInputElement)\r\n .value;\r\n this.validateForm();\r\n }}\r\n placeholder=\"your.email@example.com\"\r\n />\r\n {this.emailError && (\r\n <p class=\"text-red-500 text-sm mt-1\">\r\n {this.emailError}\r\n </p>\r\n )}\r\n </div>\r\n </div>\r\n <div class=\"flex justify-center\">\r\n <button\r\n onClick={() => this.handleRequestOffer()}\r\n disabled={!this.name.trim() ||\r\n !this.email.trim() || !!this.nameError ||\r\n !!this.emailError}\r\n class=\"px-4 py-2 bg-[#271200] rounded-4xl hover:bg-[#964500] transition-colors duration-200\"\r\n style={{ color: \"white\" }}\r\n >\r\n {t.solarSystemForm.requestOfferButton}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n }\r\n}\r\n"]}
1
+ {"version":3,"file":"solar-system-form.js","sourceRoot":"","sources":["../../../src/components/solar-system-form/solar-system-form.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, State, Watch } from \"@stencil/core\";\r\n// import Chart from \"chart.js/auto\";\r\nimport { DEFAULT_SOLAR_PANEL_TYPE } from \"../../config\";\r\nimport { SolarPanelSystemPart } from \"../../utils/geometry/fitting\";\r\nimport { getLanguageStrings } from \"../../utils/lang/general\";\r\nimport { Language } from \"../../types/lang\";\r\nimport { Polygon } from \"../../types/shapes\";\r\n\r\nconst SOLAR_RADIATION = [\r\n 0,\r\n 0,\r\n 0,\r\n 0,\r\n 0,\r\n 0, // 00:00 - 05:00 - 6\r\n 0,\r\n 0.1,\r\n 0.2, // 8\r\n 0.4,\r\n 0.8,\r\n 1, // 06:00 - 11:00 - 12\r\n 1,\r\n 1,\r\n 1,\r\n 0.7,\r\n 0.5,\r\n 0.3, // 12:00 - 17:00 - 18\r\n 0.16,\r\n 0.02,\r\n 0,\r\n 0,\r\n 0,\r\n 0, // 18:00 - 23:00 - 24\r\n];\r\nconst CONSUMPTION_PROFILES = {\r\n mostly_at_home: [\r\n 0.1,\r\n 0.1,\r\n 0.1,\r\n 0.1,\r\n 0.1,\r\n 0.15, // 00:00 - 05:00 - 6\r\n 0.23,\r\n 0.26,\r\n 0.16,\r\n 0.16,\r\n 0.15,\r\n 0.19, // 06:00 - 11:00 - 12\r\n 0.23,\r\n 0.24,\r\n 0.35,\r\n 0.28,\r\n 0.275,\r\n 0.8, // 12:00 - 17:00 - 18\r\n 0.78,\r\n 0.74,\r\n 0.75,\r\n 0.73,\r\n 0.26,\r\n 0.1, // 18:00 - 23:00 - 24\r\n ],\r\n mostly_away: [\r\n 0.1,\r\n 0.1,\r\n 0.1,\r\n 0.1,\r\n 0.1,\r\n 0.15, // 00:00 - 05:00 - 6\r\n 0.29,\r\n 0.32,\r\n 0.25,\r\n 0.15,\r\n 0.12,\r\n 0.14, // 06:00 - 11:00 - 12\r\n 0.15,\r\n 0.12,\r\n 0.16,\r\n 0.21,\r\n 0.285,\r\n 1, // 12:00 - 17:00 - 18\r\n 0.81,\r\n 0.77,\r\n 0.79,\r\n 0.73,\r\n 0.26,\r\n 0.1, // 18:00 - 23:00 - 24\r\n ],\r\n};\r\n\r\n@Component({\r\n tag: \"solar-system-form\",\r\n styleUrl: \"../../output.css\",\r\n shadow: false,\r\n})\r\nexport class SolarSystemForm {\r\n @Prop()\r\n systemConfigs: { [id: string]: SolarPanelSystemPart } = {};\r\n @Prop()\r\n language: Language = \"en\";\r\n @Prop()\r\n roofPolygons: { [id: string]: Polygon } = {};\r\n @Prop()\r\n obstructionPolygons: { [id: string]: Polygon } = {};\r\n\r\n @State()\r\n householdConsumption: number = 3500;\r\n @State()\r\n consumptionProfile: \"mostly_at_home\" | \"mostly_away\" = \"mostly_at_home\";\r\n @State()\r\n electricityPrice: number = 0.3;\r\n @State()\r\n compensationRate: number = 0.07;\r\n @State()\r\n autonomy: number = 0;\r\n @State()\r\n costSavings: number = 0;\r\n @State()\r\n numberOfPanels: number = 5;\r\n @State()\r\n panelPeakPower: number = 0.4; // kW per panel\r\n @State()\r\n name: string = \"\";\r\n @State()\r\n email: string = \"\";\r\n @State()\r\n nameError: string = \"\";\r\n @State()\r\n emailError: string = \"\";\r\n @State()\r\n electricCar: boolean = false;\r\n @State()\r\n heatPump: number = 0;\r\n @State()\r\n battery: number = 0;\r\n\r\n // private chart: Chart | null = null;\r\n // private chartRef: HTMLCanvasElement | null = null;\r\n\r\n @Watch(\"systemConfigs\")\r\n updateSystemConfigs() {\r\n if (Object.keys(this.systemConfigs).length === 0) {\r\n this.numberOfPanels = 0;\r\n return;\r\n }\r\n this.numberOfPanels = Object.keys(this.systemConfigs).reduce(\r\n (acc, curr) =>\r\n acc + this.systemConfigs[curr].positionedPanels.length,\r\n 0,\r\n );\r\n\r\n this.panelPeakPower =\r\n Object.entries(this.systemConfigs)[0][1].positionedPanels[0].panel\r\n .kWattPeak;\r\n\r\n this.recalculate();\r\n this.updateChart();\r\n }\r\n\r\n private recalculate() {\r\n const data = CONSUMPTION_PROFILES[this.consumptionProfile];\r\n const norm = data.reduce((acc, curr) => acc + curr, 0);\r\n\r\n const peakKwh = this.numberOfPanels * this.panelPeakPower;\r\n const production = SOLAR_RADIATION.map((radiation) =>\r\n radiation * peakKwh\r\n );\r\n let energyUsageOfProduction = 0;\r\n\r\n for (let i = 0; i < data.length; i++) {\r\n data[i] = data[i] * this.householdConsumption / norm / 365;\r\n if (data[i] <= production[i]) {\r\n energyUsageOfProduction += data[i];\r\n } else if (data[i] > production[i]) {\r\n energyUsageOfProduction += production[i];\r\n }\r\n }\r\n const energyDifference = production.map((p, i) => data[i] - p);\r\n const soldEnergy = -energyDifference.filter((e) => e < 0).reduce(\r\n (acc, curr) => acc + curr,\r\n 0,\r\n );\r\n // Calculate the cost savings\r\n this.costSavings = soldEnergy * this.compensationRate * 365 +\r\n energyUsageOfProduction * 365 * this.electricityPrice;\r\n\r\n this.autonomy =\r\n (energyUsageOfProduction / (this.householdConsumption / 365)) *\r\n 100;\r\n }\r\n\r\n private updateChart() {\r\n // if (!this.chartRef) return;\r\n\r\n // const ctx = this.chartRef.getContext(\"2d\");\r\n // if (!ctx) return;\r\n\r\n // if (this.chart) {\r\n // this.chart.destroy();\r\n // }\r\n\r\n // const hours = Array.from({ length: 24 }, (_, i) => `${i}:00`);\r\n // const data = CONSUMPTION_PROFILES[this.consumptionProfile];\r\n // const norm = data.reduce((acc, curr) => acc + curr, 0);\r\n\r\n // const peakKwh = this.numberOfPanels * this.panelPeakPower;\r\n // const production = SOLAR_RADIATION.map((radiation) =>\r\n // radiation * peakKwh\r\n // );\r\n\r\n // for (let i = 0; i < data.length; i++) {\r\n // data[i] = data[i] * this.householdConsumption / norm / 365;\r\n // }\r\n\r\n // let datasets = [{\r\n // label: \"Energy Consumption\",\r\n // data: data,\r\n // borderColor: \"#964500\",\r\n // backgroundColor: \"rgba(150, 69, 0, 0.1)\",\r\n // fill: true,\r\n // tension: 0.4,\r\n // }, {\r\n // label: \"Energy Production\",\r\n // data: production,\r\n // borderColor: \"#000000\",\r\n // backgroundColor: \"rgba(0, 0, 0, 0.1)\",\r\n // fill: true,\r\n // }];\r\n\r\n // this.chart = new Chart(ctx, {\r\n // type: \"line\",\r\n // data: {\r\n // labels: hours,\r\n // datasets: datasets,\r\n // },\r\n // options: {\r\n // responsive: true,\r\n // plugins: {\r\n // title: {\r\n // display: true,\r\n // text: \"Daily Consumption Profile\",\r\n // },\r\n // },\r\n // scales: {\r\n // y: {\r\n // beginAtZero: true,\r\n // title: {\r\n // display: true,\r\n // text: \"Relative Consumption\",\r\n // },\r\n // },\r\n // x: {\r\n // title: {\r\n // display: true,\r\n // text: \"Hour of Day\",\r\n // },\r\n // },\r\n // },\r\n // },\r\n // });\r\n }\r\n\r\n componentWillLoad() {\r\n this.updateSystemConfigs();\r\n }\r\n\r\n private validateForm(): boolean {\r\n let isValid = true;\r\n const t = getLanguageStrings(this.language);\r\n\r\n // Validate name\r\n if (!this.name.trim()) {\r\n this.nameError = t.solarSystemForm.nameError;\r\n isValid = false;\r\n } else {\r\n this.nameError = \"\";\r\n }\r\n\r\n // Validate email\r\n const emailRegex = /^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/;\r\n if (!this.email.trim()) {\r\n this.emailError = t.solarSystemForm.emailError;\r\n isValid = false;\r\n } else if (!emailRegex.test(this.email)) {\r\n this.emailError = t.solarSystemForm.validEmailError;\r\n isValid = false;\r\n } else {\r\n this.emailError = \"\";\r\n }\r\n\r\n return isValid;\r\n }\r\n\r\n private handleRequestOffer() {\r\n if (!this.validateForm()) {\r\n return;\r\n }\r\n // Here you can implement the logic to handle the offer request\r\n console.log(\"Requesting offer for: \", {\r\n name: this.name,\r\n email: this.email,\r\n systemConfig: this.systemConfigs,\r\n consumption: this.householdConsumption,\r\n autonomy: this.autonomy,\r\n costSavings: this.costSavings,\r\n roofPolygons: this.roofPolygons,\r\n obstructionPolygons: this.obstructionPolygons,\r\n });\r\n }\r\n\r\n render() {\r\n const t = getLanguageStrings(this.language);\r\n return (\r\n <div class=\"flex flex-col justify-center items-center w-full h-full pt-4\" // style={{\r\n // display: (Object.keys(this.systemConfigs).length === 0)\r\n // ? \"none\"\r\n // : \"flex\",\r\n // }}\r\n >\r\n <h1 class=\"text-2xl font-bold text-[#271200] mb-4 w-full\">\r\n {t.solarSystemForm.title}\r\n </h1>\r\n\r\n <div class=\"w-full bg-[#f3ebda] rounded-4xl p-6 space-y-6\">\r\n {/* System Info Section */}\r\n <div class=\"space-y-4\">\r\n <h2 class=\"text-lg font-semibold text-[#271200]\">\r\n {t.solarSystemForm.systemInformation}\r\n </h2>\r\n <div class=\"grid grid-rows-2 gap-0\">\r\n <div class=\"grid grid-cols-2 gap-4\">\r\n <label class=\"block text-sm font-medium text-gray-600 mb-1\">\r\n {t.solarSystemForm.numberOfPanels}\r\n </label>\r\n <label class=\"block text-sm font-medium text-gray-600 mb-1\">\r\n {t.solarSystemForm.panelPeakPower}\r\n </label>\r\n </div>\r\n <div class=\"grid grid-cols-2 gap-4\">\r\n <input\r\n type=\"number\"\r\n class=\"w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent bg-white\"\r\n value={this.numberOfPanels}\r\n readOnly\r\n />\r\n <input\r\n type=\"number\"\r\n class=\"w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent bg-white\"\r\n value={this.panelPeakPower}\r\n readonly\r\n />\r\n </div>\r\n </div>\r\n <div class=\"bg-white rounded-4xl p-4\">\r\n <div class=\"flex items-center justify-between\">\r\n <span class=\"text-gray-600\">\r\n {t.solarSystemForm.totalSystemPeakPower}\r\n </span>\r\n <span class=\"text-xl font-bold text-[#271200]\">\r\n {(DEFAULT_SOLAR_PANEL_TYPE.kWattPeak *\r\n this.numberOfPanels).toFixed(1)} kW\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n {/* Household Consumption Section */}\r\n <div class=\"space-y-4\">\r\n <h2 class=\"text-lg font-semibold text-[#271200]\">\r\n {t.solarSystemForm.householdConsumptionTitle}\r\n </h2>\r\n <div class=\"grid grid-rows-2 gap-0\">\r\n <div class=\"grid grid-cols-2 gap-4\">\r\n <label class=\"block text-sm font-medium text-gray-600\">\r\n {t.solarSystemForm.annualConsumption}\r\n </label>\r\n <label class=\"block text-sm font-medium text-gray-600\">\r\n {t.solarSystemForm.consumptionProfileTitle}\r\n </label>\r\n </div>\r\n <div class=\"grid grid-cols-2 gap-4\">\r\n <input\r\n type=\"number\"\r\n class=\"w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent bg-white\"\r\n value={this.householdConsumption}\r\n onInput={(e) => {\r\n this.householdConsumption = parseInt(\r\n (e.target as HTMLInputElement)\r\n .value,\r\n );\r\n this.recalculate();\r\n this.updateChart();\r\n }}\r\n />\r\n <select\r\n class=\"w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent bg-white\"\r\n onChange={(e) => {\r\n this.consumptionProfile =\r\n (e.target as HTMLSelectElement)\r\n .value as\r\n | \"mostly_at_home\"\r\n | \"mostly_away\";\r\n this.recalculate();\r\n this.updateChart();\r\n }}\r\n >\r\n <option\r\n value=\"mostly_at_home\"\r\n selected={this.consumptionProfile ===\r\n \"mostly_at_home\"}\r\n >\r\n {t.solarSystemForm.consumptionProfiles\r\n .mostlyAtHome}\r\n </option>\r\n <option\r\n value=\"mostly_away\"\r\n selected={this.consumptionProfile ===\r\n \"mostly_away\"}\r\n >\r\n {t.solarSystemForm.consumptionProfiles\r\n .mostlyAway}\r\n </option>\r\n </select>\r\n </div>\r\n </div>\r\n {\r\n /* <div class=\"mt-4 h-48\">\r\n <canvas ref={(el) => this.chartRef = el}></canvas>\r\n </div> */\r\n }\r\n </div>\r\n <div class=\"space-y-4\">\r\n <h2 class=\"text-lg font-semibold text-[#271200]\">\r\n Additional Components\r\n </h2>\r\n <div class=\"grid grid-rows-2 gap-4\">\r\n </div>\r\n </div>\r\n\r\n {/* Heat Pump Section */}\r\n\r\n {/* Battery Section */}\r\n\r\n {/* Electric Car Section */}\r\n\r\n {/* Electricity Price and Compensation Section */}\r\n <div class=\"space-y-4\">\r\n <h2 class=\"text-lg font-semibold text-[#271200]\">\r\n {t.solarSystemForm.electricityCostsTitle}\r\n </h2>\r\n <div class=\"grid grid-rows-2 gap-0\">\r\n <div class=\"grid grid-cols-2 gap-4\">\r\n <label class=\"block text-sm font-medium text-gray-600 mb-1\">\r\n {t.solarSystemForm.electricityPrice}\r\n </label>\r\n <label class=\"block text-sm font-medium text-gray-600 mb-1\">\r\n {t.solarSystemForm.compensationRate}\r\n </label>\r\n </div>\r\n <div class=\"grid grid-cols-2 gap-4\">\r\n <input\r\n type=\"number\"\r\n step=\"0.01\"\r\n class=\"w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent bg-white\"\r\n value={this.electricityPrice.toFixed(2)}\r\n onInput={(e) => {\r\n this.electricityPrice = parseFloat(\r\n (e.target as HTMLInputElement)\r\n .value,\r\n );\r\n this.recalculate();\r\n this.updateChart();\r\n }}\r\n />\r\n <input\r\n type=\"number\"\r\n step=\"0.01\"\r\n class=\"w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent bg-white\"\r\n value={this.compensationRate.toFixed(2)}\r\n onInput={(e) => {\r\n this.compensationRate = parseFloat(\r\n (e.target as HTMLInputElement)\r\n .value,\r\n );\r\n this.recalculate();\r\n this.updateChart();\r\n }}\r\n />\r\n </div>\r\n </div>\r\n </div>\r\n\r\n {/* Results Section */}\r\n <div class=\"space-y-4 pt-4 border-t border-gray-200\">\r\n <h2 class=\"text-lg font-semibold text-[#271200]\">\r\n {t.solarSystemForm.resultsTitle}\r\n </h2>\r\n <div class=\"bg-white rounded-4xl p-4\">\r\n <div class=\"flex items-center justify-between\">\r\n <span class=\"text-gray-600\">\r\n {t.solarSystemForm.autonomy}\r\n </span>\r\n <span class=\"text-xl font-bold text-[#271200]\">\r\n {this.autonomy.toFixed(1)}%\r\n </span>\r\n </div>\r\n <div class=\"flex items-center justify-between mt-4\">\r\n <div class=\"flex items-center gap-2\">\r\n <span class=\"text-gray-600\">\r\n {t.solarSystemForm.costSavings}\r\n </span>\r\n <div class=\"relative group\">\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n class=\"h-5 w-5 text-gray-400 cursor-help\"\r\n viewBox=\"0 0 20 20\"\r\n fill=\"currentColor\"\r\n >\r\n <path\r\n fill-rule=\"evenodd\"\r\n d=\"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-3a1 1 0 00-.867.5 1 1 0 11-1.731-1A3 3 0 0113 8a3.001 3.001 0 01-2 2.83V11a1 1 0 11-2 0v-1a1 1 0 011-1 1 1 0 100-2zm0 8a1 1 0 100-2 1 1 0 000 2z\"\r\n clip-rule=\"evenodd\"\r\n />\r\n </svg>\r\n <div class=\"absolute bottom-full left-1/2 transform -translate-x-1/2 mb-2 w-64 p-2 bg-gray-800 text-white text-sm rounded-lg opacity-0 group-hover:opacity-100 transition-opacity duration-200 pointer-events-none\">\r\n {t.solarSystemForm\r\n .savingsDisclaimer}\r\n </div>\r\n </div>\r\n </div>\r\n <span class=\"text-xl font-bold text-green-600\">\r\n {this.costSavings.toFixed(2)}€/{t\r\n .solarSystemForm.year}\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n {/* Contact Information Section */}\r\n <div class=\"space-y-4 pt-4 border-t border-gray-200\">\r\n <h2 class=\"text-lg font-semibold text-[#271200]\">\r\n {t.solarSystemForm.requestOffer}\r\n </h2>\r\n <div class=\"grid grid-rows-2 gap-0\">\r\n <div class=\"grid grid-cols-2 gap-4\">\r\n <label class=\"block text-sm font-medium text-gray-600 mb-1\">\r\n {t.solarSystemForm.name}\r\n </label>\r\n <label class=\"block text-sm font-medium text-gray-600 mb-1\">\r\n {t.solarSystemForm.email}\r\n </label>\r\n </div>\r\n <div class=\"grid grid-cols-2 gap-4\">\r\n <input\r\n type=\"text\"\r\n class={`w-full px-4 py-2 rounded-4xl border ${\r\n this.nameError\r\n ? \"border-red-500\"\r\n : \"border-gray-300\"\r\n } focus:ring-2 focus:ring-[#964500] focus:border-transparent bg-white`}\r\n value={this.name}\r\n onInput={(e) => {\r\n this.name =\r\n (e.target as HTMLInputElement)\r\n .value;\r\n this.validateForm();\r\n }}\r\n placeholder=\"Your name\"\r\n />\r\n {this.nameError && (\r\n <p class=\"text-red-500 text-sm mt-1\">\r\n {this.nameError}\r\n </p>\r\n )}\r\n <input\r\n type=\"email\"\r\n class={`w-full px-4 py-2 rounded-4xl border ${\r\n this.emailError\r\n ? \"border-red-500\"\r\n : \"border-gray-300\"\r\n } focus:ring-2 focus:ring-[#964500] focus:border-transparent bg-white`}\r\n value={this.email}\r\n onInput={(e) => {\r\n this.email =\r\n (e.target as HTMLInputElement)\r\n .value;\r\n this.validateForm();\r\n }}\r\n placeholder=\"your.email@example.com\"\r\n />\r\n {this.emailError && (\r\n <p class=\"text-red-500 text-sm mt-1\">\r\n {this.emailError}\r\n </p>\r\n )}\r\n </div>\r\n </div>\r\n <div class=\"flex justify-center\">\r\n <button\r\n onClick={() => this.handleRequestOffer()}\r\n disabled={!this.name.trim() ||\r\n !this.email.trim() || !!this.nameError ||\r\n !!this.emailError}\r\n class=\"px-4 py-2 bg-[#271200] rounded-4xl hover:bg-[#964500] transition-colors duration-200\"\r\n style={{ color: \"white\" }}\r\n >\r\n {t.solarSystemForm.requestOfferButton}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n }\r\n}\r\n"]}
@@ -0,0 +1,18 @@
1
+ import { h } from "@stencil/core";
2
+ export class LoadingWidget {
3
+ render() {
4
+ return (h("div", { key: '0217d42753a42b9f04cc18b5f9aa1ff19ba4c32b', class: "absolute flex items-center justify-center bg-white bg-opacity-75 z-20 pt-7 rounded-4xl" }, h("div", { key: '42ae347ebfa33faa78bf6b2b628aa0828a08207e', class: "animate-spin rounded-full h-16 w-16 border-t-2 border-b-2 border-[#271200]" })));
5
+ }
6
+ static get is() { return "loading-widget"; }
7
+ static get originalStyleUrls() {
8
+ return {
9
+ "$": ["../../output.css"]
10
+ };
11
+ }
12
+ static get styleUrls() {
13
+ return {
14
+ "$": ["../../output.css"]
15
+ };
16
+ }
17
+ }
18
+ //# sourceMappingURL=loading-widget.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"loading-widget.js","sourceRoot":"","sources":["../../../src/components/widgets/loading-widget.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAO7C,MAAM,OAAO,aAAa;IACtB,MAAM;QACF,OAAO,CACH,4DAAK,KAAK,EAAC,wFAAwF;YAC/F,4DAAK,KAAK,EAAC,4EAA4E,GACjF,CACJ,CACT,CAAC;IACN,CAAC;;;;;;;;CACJ","sourcesContent":["import { Component, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n tag: \"loading-widget\",\r\n styleUrl: \"../../output.css\",\r\n shadow: false,\r\n})\r\nexport class LoadingWidget {\r\n render() {\r\n return (\r\n <div class=\"absolute flex items-center justify-center bg-white bg-opacity-75 z-20 pt-7 rounded-4xl\">\r\n <div class=\"animate-spin rounded-full h-16 w-16 border-t-2 border-b-2 border-[#271200]\">\r\n </div>\r\n </div>\r\n );\r\n }\r\n}\r\n"]}