blue-chestnut-solar-expert 0.0.3 → 0.0.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/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 -0
- package/dist/cjs/{map-draw_3.cjs.entry.js → eraser-icon_9.cjs.entry.js} +147 -43
- package/dist/cjs/eraser-icon_9.cjs.entry.js.map +1 -0
- package/dist/cjs/{index-BFx4q5Ui.js → index-C_q90Wl2.js} +3 -3
- package/dist/cjs/{index-BFx4q5Ui.js.map → index-C_q90Wl2.js.map} +1 -1
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/solar-calculator.cjs.entry.js +4 -4
- package/dist/cjs/solar-calculator.cjs.entry.js.map +1 -1
- package/dist/cjs/solar-calculator.entry.cjs.js.map +1 -1
- package/dist/cjs/stencil-library.cjs.js +2 -2
- package/dist/collection/collection-manifest.json +6 -0
- package/dist/collection/components/icons/eraser.js +18 -0
- package/dist/collection/components/icons/eraser.js.map +1 -0
- package/dist/collection/components/icons/house.js +18 -0
- package/dist/collection/components/icons/house.js.map +1 -0
- package/dist/collection/components/icons/icon.js +57 -0
- package/dist/collection/components/icons/icon.js.map +1 -0
- package/dist/collection/components/icons/move.js +18 -0
- package/dist/collection/components/icons/move.js.map +1 -0
- package/dist/collection/components/icons/octagonMinus.js +18 -0
- package/dist/collection/components/icons/octagonMinus.js.map +1 -0
- package/dist/collection/components/icons/search.js +18 -0
- package/dist/collection/components/icons/search.js.map +1 -0
- package/dist/collection/components/map-draw/map-draw.js +9 -9
- package/dist/collection/components/map-draw/map-draw.js.map +1 -1
- package/dist/collection/components/solar-calculator/solar-calculator.js +2 -2
- package/dist/collection/components/solar-calculator/solar-calculator.js.map +1 -1
- package/dist/collection/components/solar-expert/solar-expert.js +23 -13
- package/dist/collection/components/solar-expert/solar-expert.js.map +1 -1
- package/dist/collection/components/solar-system-form/solar-system-form.js +14 -14
- package/dist/collection/components/solar-system-form/solar-system-form.js.map +1 -1
- package/dist/collection/output.css +12 -0
- package/dist/components/eraser-icon.d.ts +11 -0
- package/dist/components/eraser-icon.js +9 -0
- package/dist/components/eraser-icon.js.map +1 -0
- package/dist/components/house-icon.d.ts +11 -0
- package/dist/components/house-icon.js +9 -0
- package/dist/components/house-icon.js.map +1 -0
- package/dist/components/icon-selector.d.ts +11 -0
- package/dist/components/icon-selector.js +9 -0
- package/dist/components/icon-selector.js.map +1 -0
- package/dist/components/index.js +1 -1
- package/dist/components/index.js.map +1 -1
- package/dist/components/map-draw.js +1 -1
- package/dist/components/move-icon.d.ts +11 -0
- package/dist/components/move-icon.js +9 -0
- package/dist/components/move-icon.js.map +1 -0
- package/dist/components/octagon-minus-icon.d.ts +11 -0
- package/dist/components/octagon-minus-icon.js +9 -0
- package/dist/components/octagon-minus-icon.js.map +1 -0
- package/dist/components/p-C1W188Ni.js +81 -0
- package/dist/components/p-C1W188Ni.js.map +1 -0
- package/dist/components/p-CPzvPKKZ.js +33 -0
- package/dist/components/p-CPzvPKKZ.js.map +1 -0
- package/dist/components/p-Ca4aCGPQ.js +33 -0
- package/dist/components/p-Ca4aCGPQ.js.map +1 -0
- package/dist/components/{p-C6zdkCkY.js → p-CzP6SYTZ.js} +17 -17
- package/dist/components/{p-C6zdkCkY.js.map → p-CzP6SYTZ.js.map} +1 -1
- package/dist/components/p-DFkHeRrz.js +33 -0
- package/dist/components/p-DFkHeRrz.js.map +1 -0
- package/dist/components/{p-CXGY4i5A.js → p-DRNQUQ1y.js} +50 -14
- package/dist/components/p-DRNQUQ1y.js.map +1 -0
- package/dist/components/p-Dpqxsv0f.js +33 -0
- package/dist/components/p-Dpqxsv0f.js.map +1 -0
- package/dist/components/p-KbJZx_Vg.js +33 -0
- package/dist/components/p-KbJZx_Vg.js.map +1 -0
- package/dist/components/search-icon.d.ts +11 -0
- package/dist/components/search-icon.js +9 -0
- package/dist/components/search-icon.js.map +1 -0
- package/dist/components/solar-calculator.js +3 -3
- package/dist/components/solar-calculator.js.map +1 -1
- package/dist/components/solar-expert.js +64 -18
- package/dist/components/solar-expert.js.map +1 -1
- package/dist/components/solar-system-form.js +1 -1
- 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 -0
- package/dist/esm/{map-draw_3.entry.js → eraser-icon_9.entry.js} +143 -45
- package/dist/esm/eraser-icon_9.entry.js.map +1 -0
- package/dist/esm/{index-D0YnIAAN.js → index-aHOvta3L.js} +3 -3
- package/dist/esm/{index-D0YnIAAN.js.map → index-aHOvta3L.js.map} +1 -1
- package/dist/esm/loader.js +3 -3
- package/dist/esm/solar-calculator.entry.js +4 -4
- package/dist/esm/solar-calculator.entry.js.map +1 -1
- package/dist/esm/stencil-library.js +3 -3
- 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 -0
- package/dist/stencil-library/p-3342721a.entry.js +44 -0
- package/dist/stencil-library/p-3342721a.entry.js.map +1 -0
- package/dist/stencil-library/{p-D0YnIAAN.js → p-aHOvta3L.js} +3 -3
- package/dist/stencil-library/{p-D0YnIAAN.js.map → p-aHOvta3L.js.map} +1 -1
- package/dist/stencil-library/p-f22828b8.entry.js +2 -0
- package/dist/stencil-library/p-f22828b8.entry.js.map +1 -0
- package/dist/stencil-library/solar-calculator.entry.esm.js.map +1 -1
- package/dist/stencil-library/stencil-library.esm.js +1 -1
- package/dist/types/components/icons/eraser.d.ts +3 -0
- package/dist/types/components/icons/house.d.ts +3 -0
- package/dist/types/components/icons/icon.d.ts +4 -0
- package/dist/types/components/icons/move.d.ts +3 -0
- package/dist/types/components/icons/octagonMinus.d.ts +3 -0
- package/dist/types/components/icons/search.d.ts +3 -0
- package/dist/types/components/solar-expert/solar-expert.d.ts +0 -1
- package/dist/types/components.d.ts +80 -0
- package/package.json +1 -1
- package/dist/cjs/map-draw.solar-expert.solar-system-form.entry.cjs.js.map +0 -1
- package/dist/cjs/map-draw_3.cjs.entry.js.map +0 -1
- package/dist/components/p-CXGY4i5A.js.map +0 -1
- package/dist/esm/map-draw.solar-expert.solar-system-form.entry.js.map +0 -1
- package/dist/esm/map-draw_3.entry.js.map +0 -1
- package/dist/stencil-library/map-draw.solar-expert.solar-system-form.entry.esm.js.map +0 -1
- package/dist/stencil-library/p-dc4824e6.entry.js +0 -44
- package/dist/stencil-library/p-dc4824e6.entry.js.map +0 -1
- package/dist/stencil-library/p-de9a8d56.entry.js +0 -2
- package/dist/stencil-library/p-de9a8d56.entry.js.map +0 -1
|
@@ -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;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,YAAY,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAC;AAEhF,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;
|
|
1
|
+
{"version":3,"file":"solar-expert.js","sourceRoot":"","sources":["../../../src/components/solar-expert/solar-expert.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Env, h, Prop, State } from \"@stencil/core\";\r\nimport { Loader } from \"@googlemaps/js-api-loader\";\r\nimport { createIcons, Eraser, House, Move, OctagonMinus, Search } from \"lucide\";\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 createIcons({\r\n icons: {\r\n Search,\r\n OctagonMinus,\r\n Eraser,\r\n House,\r\n Move,\r\n },\r\n nameAttr: \"data-lucide\",\r\n });\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 // componentDidLoad() {\r\n // createIcons({\r\n // icons: {\r\n // Search,\r\n // OctagonMinus,\r\n // Eraser,\r\n // House,\r\n // Move,\r\n // },\r\n // nameAttr: \"data-lucide\",\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\">\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"]}
|
|
@@ -234,7 +234,7 @@ export class SolarSystemForm {
|
|
|
234
234
|
return;
|
|
235
235
|
}
|
|
236
236
|
// Here you can implement the logic to handle the offer request
|
|
237
|
-
console.log("Requesting offer for:", {
|
|
237
|
+
console.log("Requesting offer for: ", {
|
|
238
238
|
name: this.name,
|
|
239
239
|
email: this.email,
|
|
240
240
|
systemConfig: this.systemConfigs,
|
|
@@ -247,53 +247,53 @@ export class SolarSystemForm {
|
|
|
247
247
|
}
|
|
248
248
|
render() {
|
|
249
249
|
const t = getLanguageStrings(this.language);
|
|
250
|
-
return (h("div", { key: '
|
|
250
|
+
return (h("div", { key: '85f0ec10f34015604a1acefcef02299b50466b6b', class: "flex flex-col justify-center items-center w-full h-full gap-4 p-4", style: {
|
|
251
251
|
display: (Object.keys(this.systemConfigs).length === 0)
|
|
252
252
|
? "none"
|
|
253
253
|
: "flex",
|
|
254
|
-
} }, h("h1", { key: '
|
|
255
|
-
this.numberOfPanels).toFixed(1), " kW")))), h("div", { key: '
|
|
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) => {
|
|
256
256
|
this.householdConsumption = parseInt(e.target
|
|
257
257
|
.value);
|
|
258
258
|
this.recalculate();
|
|
259
259
|
this.updateChart();
|
|
260
|
-
} })), h("div", { key: '
|
|
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) => {
|
|
261
261
|
this.consumptionProfile =
|
|
262
262
|
e.target
|
|
263
263
|
.value;
|
|
264
264
|
this.recalculate();
|
|
265
265
|
this.updateChart();
|
|
266
|
-
} }, h("option", { key: '
|
|
266
|
+
} }, h("option", { key: 'c763ff9d4bdf3c60c5067e105d00936bf32ffbd5', value: "mostly_at_home", selected: this.consumptionProfile ===
|
|
267
267
|
"mostly_at_home" }, t.solarSystemForm.consumptionProfiles
|
|
268
|
-
.mostlyAtHome), h("option", { key: '
|
|
268
|
+
.mostlyAtHome), h("option", { key: 'df7e8cf24b1680575fcceab59a1ba7c79da39009', value: "mostly_away", selected: this.consumptionProfile ===
|
|
269
269
|
"mostly_away" }, t.solarSystemForm.consumptionProfiles
|
|
270
|
-
.mostlyAway)))), h("div", { key: '
|
|
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) => {
|
|
271
271
|
this.electricityPrice = parseFloat(e.target
|
|
272
272
|
.value);
|
|
273
273
|
this.recalculate();
|
|
274
274
|
this.updateChart();
|
|
275
|
-
} })), h("div", { key: '
|
|
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) => {
|
|
276
276
|
this.compensationRate = parseFloat(e.target
|
|
277
277
|
.value);
|
|
278
278
|
this.recalculate();
|
|
279
279
|
this.updateChart();
|
|
280
|
-
} })))), h("div", { key: '
|
|
281
|
-
.savingsDisclaimer))), h("span", { key: '
|
|
282
|
-
.solarSystemForm.year)))), h("div", { key: '
|
|
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
|
|
283
283
|
? "border-red-500"
|
|
284
284
|
: "border-gray-300"} focus:ring-2 focus:ring-[#964500] focus:border-transparent`, 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: '
|
|
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
|
|
290
290
|
? "border-red-500"
|
|
291
291
|
: "border-gray-300"} focus:ring-2 focus:ring-[#964500] focus:border-transparent`, 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: '
|
|
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: '539e892fdace00dd5c59dc14b0f85754e22ee111', 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] text-white rounded-4xl hover:bg-[#964500] transition-colors duration-200" }, t.solarSystemForm.requestOfferButton))))));
|
|
299
299
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"solar-system-form.js","sourceRoot":"","sources":["../../../src/components/solar-system-form/solar-system-form.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACjE,OAAO,KAAK,MAAM,eAAe,CAAC;AAClC,OAAO,EAAE,wBAAwB,EAAE,MAAM,cAAc,CAAC;AAExD,OAAO,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAI9D,MAAM,eAAe,GAAG;IACpB,CAAC;IACD,CAAC;IACD,CAAC;IACD,CAAC;IACD,CAAC;IACD,CAAC,EAAE,oBAAoB;IACvB,CAAC;IACD,GAAG;IACH,GAAG,EAAE,IAAI;IACT,GAAG;IACH,GAAG;IACH,CAAC,EAAE,qBAAqB;IACxB,CAAC;IACD,CAAC;IACD,CAAC;IACD,GAAG;IACH,GAAG;IACH,GAAG,EAAE,qBAAqB;IAC1B,IAAI;IACJ,IAAI;IACJ,CAAC;IACD,CAAC;IACD,CAAC;IACD,CAAC,EAAE,qBAAqB;CAC3B,CAAC;AACF,MAAM,oBAAoB,GAAG;IACzB,cAAc,EAAE;QACZ,GAAG;QACH,GAAG;QACH,GAAG;QACH,GAAG;QACH,GAAG;QACH,IAAI,EAAE,oBAAoB;QAC1B,IAAI;QACJ,IAAI;QACJ,IAAI;QACJ,IAAI;QACJ,IAAI;QACJ,IAAI,EAAE,qBAAqB;QAC3B,IAAI;QACJ,IAAI;QACJ,IAAI;QACJ,IAAI;QACJ,KAAK;QACL,GAAG,EAAE,qBAAqB;QAC1B,IAAI;QACJ,IAAI;QACJ,IAAI;QACJ,IAAI;QACJ,IAAI;QACJ,GAAG,EAAE,qBAAqB;KAC7B;IACD,WAAW,EAAE;QACT,GAAG;QACH,GAAG;QACH,GAAG;QACH,GAAG;QACH,GAAG;QACH,IAAI,EAAE,oBAAoB;QAC1B,IAAI;QACJ,IAAI;QACJ,IAAI;QACJ,IAAI;QACJ,IAAI;QACJ,IAAI,EAAE,qBAAqB;QAC3B,IAAI;QACJ,IAAI;QACJ,IAAI;QACJ,IAAI;QACJ,KAAK;QACL,CAAC,EAAE,qBAAqB;QACxB,IAAI;QACJ,IAAI;QACJ,IAAI;QACJ,IAAI;QACJ,IAAI;QACJ,GAAG,EAAE,qBAAqB;KAC7B;CACJ,CAAC;AAOF,MAAM,OAAO,eAAe;IAExB,aAAa,GAA2C,EAAE,CAAC;IAE3D,QAAQ,GAAa,IAAI,CAAC;IAE1B,YAAY,GAA8B,EAAE,CAAC;IAE7C,mBAAmB,GAA8B,EAAE,CAAC;IAGpD,oBAAoB,GAAW,IAAI,CAAC;IAEpC,kBAAkB,GAAqC,gBAAgB,CAAC;IAExE,gBAAgB,GAAW,GAAG,CAAC;IAE/B,gBAAgB,GAAW,IAAI,CAAC;IAEhC,QAAQ,GAAW,CAAC,CAAC;IAErB,WAAW,GAAW,CAAC,CAAC;IAExB,cAAc,GAAW,CAAC,CAAC;IAE3B,cAAc,GAAW,GAAG,CAAC,CAAC,eAAe;IAE7C,IAAI,GAAW,EAAE,CAAC;IAElB,KAAK,GAAW,EAAE,CAAC;IAEnB,SAAS,GAAW,EAAE,CAAC;IAEvB,UAAU,GAAW,EAAE,CAAC;IAEhB,KAAK,GAAiB,IAAI,CAAC;IAC3B,QAAQ,GAA6B,IAAI,CAAC;IAGlD,mBAAmB;QACf,IAAI,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;YAC/C,IAAI,CAAC,cAAc,GAAG,CAAC,CAAC;YACxB,OAAO;QACX,CAAC;QACD,IAAI,CAAC,cAAc,GAAG,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,MAAM,CACxD,CAAC,GAAG,EAAE,IAAI,EAAE,EAAE,CACV,GAAG,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC,gBAAgB,CAAC,MAAM,EAC1D,CAAC,CACJ,CAAC;QAEF,IAAI,CAAC,cAAc;YACf,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,KAAK;iBAC7D,SAAS,CAAC;QAEnB,IAAI,CAAC,WAAW,EAAE,CAAC;QACnB,IAAI,CAAC,WAAW,EAAE,CAAC;IACvB,CAAC;IAEO,WAAW;QACf,MAAM,IAAI,GAAG,oBAAoB,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;QAC3D,MAAM,IAAI,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,IAAI,EAAE,EAAE,CAAC,GAAG,GAAG,IAAI,EAAE,CAAC,CAAC,CAAC;QAEvD,MAAM,OAAO,GAAG,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,cAAc,CAAC;QAC1D,MAAM,UAAU,GAAG,eAAe,CAAC,GAAG,CAAC,CAAC,SAAS,EAAE,EAAE,CACjD,SAAS,GAAG,OAAO,CACtB,CAAC;QACF,IAAI,uBAAuB,GAAG,CAAC,CAAC;QAEhC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;YACnC,IAAI,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,oBAAoB,GAAG,IAAI,GAAG,GAAG,CAAC;YAC3D,IAAI,IAAI,CAAC,CAAC,CAAC,IAAI,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC;gBAC3B,uBAAuB,IAAI,IAAI,CAAC,CAAC,CAAC,CAAC;YACvC,CAAC;iBAAM,IAAI,IAAI,CAAC,CAAC,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC;gBACjC,uBAAuB,IAAI,UAAU,CAAC,CAAC,CAAC,CAAC;YAC7C,CAAC;QACL,CAAC;QACD,MAAM,gBAAgB,GAAG,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;QAC/D,MAAM,UAAU,GAAG,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,MAAM,CAC5D,CAAC,GAAG,EAAE,IAAI,EAAE,EAAE,CAAC,GAAG,GAAG,IAAI,EACzB,CAAC,CACJ,CAAC;QACF,6BAA6B;QAC7B,IAAI,CAAC,WAAW,GAAG,UAAU,GAAG,IAAI,CAAC,gBAAgB,GAAG,GAAG;YACvD,uBAAuB,GAAG,GAAG,GAAG,IAAI,CAAC,gBAAgB,CAAC;QAE1D,IAAI,CAAC,QAAQ;YACT,CAAC,uBAAuB,GAAG,CAAC,IAAI,CAAC,oBAAoB,GAAG,GAAG,CAAC,CAAC;gBAC7D,GAAG,CAAC;IACZ,CAAC;IAEO,WAAW;QACf,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE,OAAO;QAE3B,MAAM,GAAG,GAAG,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;QAC3C,IAAI,CAAC,GAAG;YAAE,OAAO;QAEjB,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YACb,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,CAAC;QACzB,CAAC;QAED,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;QAC9D,MAAM,IAAI,GAAG,oBAAoB,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;QAC3D,MAAM,IAAI,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,IAAI,EAAE,EAAE,CAAC,GAAG,GAAG,IAAI,EAAE,CAAC,CAAC,CAAC;QAEvD,MAAM,OAAO,GAAG,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,cAAc,CAAC;QAC1D,MAAM,UAAU,GAAG,eAAe,CAAC,GAAG,CAAC,CAAC,SAAS,EAAE,EAAE,CACjD,SAAS,GAAG,OAAO,CACtB,CAAC;QAEF,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;YACnC,IAAI,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,oBAAoB,GAAG,IAAI,GAAG,GAAG,CAAC;QAC/D,CAAC;QAED,IAAI,QAAQ,GAAG,CAAC;gBACZ,KAAK,EAAE,oBAAoB;gBAC3B,IAAI,EAAE,IAAI;gBACV,WAAW,EAAE,SAAS;gBACtB,eAAe,EAAE,uBAAuB;gBACxC,IAAI,EAAE,IAAI;gBACV,OAAO,EAAE,GAAG;aACf,EAAE;gBACC,KAAK,EAAE,mBAAmB;gBAC1B,IAAI,EAAE,UAAU;gBAChB,WAAW,EAAE,SAAS;gBACtB,eAAe,EAAE,oBAAoB;gBACrC,IAAI,EAAE,IAAI;aACb,CAAC,CAAC;QAEH,IAAI,CAAC,KAAK,GAAG,IAAI,KAAK,CAAC,GAAG,EAAE;YACxB,IAAI,EAAE,MAAM;YACZ,IAAI,EAAE;gBACF,MAAM,EAAE,KAAK;gBACb,QAAQ,EAAE,QAAQ;aACrB;YACD,OAAO,EAAE;gBACL,UAAU,EAAE,IAAI;gBAChB,OAAO,EAAE;oBACL,KAAK,EAAE;wBACH,OAAO,EAAE,IAAI;wBACb,IAAI,EAAE,2BAA2B;qBACpC;iBACJ;gBACD,MAAM,EAAE;oBACJ,CAAC,EAAE;wBACC,WAAW,EAAE,IAAI;wBACjB,KAAK,EAAE;4BACH,OAAO,EAAE,IAAI;4BACb,IAAI,EAAE,sBAAsB;yBAC/B;qBACJ;oBACD,CAAC,EAAE;wBACC,KAAK,EAAE;4BACH,OAAO,EAAE,IAAI;4BACb,IAAI,EAAE,aAAa;yBACtB;qBACJ;iBACJ;aACJ;SACJ,CAAC,CAAC;IACP,CAAC;IAED,iBAAiB;QACb,IAAI,CAAC,mBAAmB,EAAE,CAAC;IAC/B,CAAC;IAEO,YAAY;QAChB,IAAI,OAAO,GAAG,IAAI,CAAC;QACnB,MAAM,CAAC,GAAG,kBAAkB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QAE5C,gBAAgB;QAChB,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,CAAC;YACpB,IAAI,CAAC,SAAS,GAAG,CAAC,CAAC,eAAe,CAAC,SAAS,CAAC;YAC7C,OAAO,GAAG,KAAK,CAAC;QACpB,CAAC;aAAM,CAAC;YACJ,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;QACxB,CAAC;QAED,iBAAiB;QACjB,MAAM,UAAU,GAAG,4BAA4B,CAAC;QAChD,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,EAAE,CAAC;YACrB,IAAI,CAAC,UAAU,GAAG,CAAC,CAAC,eAAe,CAAC,UAAU,CAAC;YAC/C,OAAO,GAAG,KAAK,CAAC;QACpB,CAAC;aAAM,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC;YACtC,IAAI,CAAC,UAAU,GAAG,CAAC,CAAC,eAAe,CAAC,eAAe,CAAC;YACpD,OAAO,GAAG,KAAK,CAAC;QACpB,CAAC;aAAM,CAAC;YACJ,IAAI,CAAC,UAAU,GAAG,EAAE,CAAC;QACzB,CAAC;QAED,OAAO,OAAO,CAAC;IACnB,CAAC;IAEO,kBAAkB;QACtB,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE,EAAE,CAAC;YACvB,OAAO;QACX,CAAC;QACD,+DAA+D;QAC/D,OAAO,CAAC,GAAG,CAAC,uBAAuB,EAAE;YACjC,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,KAAK,EAAE,IAAI,CAAC,KAAK;YACjB,YAAY,EAAE,IAAI,CAAC,aAAa;YAChC,WAAW,EAAE,IAAI,CAAC,oBAAoB;YACtC,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,WAAW,EAAE,IAAI,CAAC,WAAW;YAC7B,YAAY,EAAE,IAAI,CAAC,YAAY;YAC/B,mBAAmB,EAAE,IAAI,CAAC,mBAAmB;SAChD,CAAC,CAAC;IACP,CAAC;IAED,MAAM;QACF,MAAM,CAAC,GAAG,kBAAkB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QAC5C,OAAO,CACH,4DACI,KAAK,EAAC,mEAAmE,EACzE,KAAK,EAAE;gBACH,OAAO,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC;oBACnD,CAAC,CAAC,MAAM;oBACR,CAAC,CAAC,MAAM;aACf;YAED,2DAAI,KAAK,EAAC,wCAAwC,IAC7C,CAAC,CAAC,eAAe,CAAC,KAAK,CACvB;YAEL,4DAAK,KAAK,EAAC,yDAAyD;gBAEhE,4DAAK,KAAK,EAAC,WAAW;oBAClB,2DAAI,KAAK,EAAC,sCAAsC,IAC3C,CAAC,CAAC,eAAe,CAAC,iBAAiB,CACnC;oBACL,4DAAK,KAAK,EAAC,wBAAwB;wBAC/B;4BACI,8DAAO,KAAK,EAAC,8CAA8C,IACtD,CAAC,CAAC,eAAe,CAAC,cAAc,CAC7B;4BACR,8DACI,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,gHAAgH,EACtH,KAAK,EAAE,IAAI,CAAC,cAAc,EAC1B,QAAQ,SACV,CACA;wBACN;4BACI,8DAAO,KAAK,EAAC,8CAA8C,IACtD,CAAC,CAAC,eAAe,CAAC,cAAc,CAC7B;4BACR,8DACI,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,gHAAgH,EACtH,KAAK,EAAE,IAAI,CAAC,cAAc,EAC1B,QAAQ,SACV,CACA,CACJ;oBACN,4DAAK,KAAK,EAAC,0BAA0B;wBACjC,4DAAK,KAAK,EAAC,mCAAmC;4BAC1C,6DAAM,KAAK,EAAC,eAAe,IACtB,CAAC,CAAC,eAAe,CAAC,oBAAoB,CACpC;4BACP,6DAAM,KAAK,EAAC,kCAAkC;gCACzC,CAAC,wBAAwB,CAAC,SAAS;oCAChC,IAAI,CAAC,cAAc,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC;sCAChC,CACL,CACJ,CACJ;gBAEN,4DAAK,KAAK,EAAC,WAAW;oBAClB,2DAAI,KAAK,EAAC,sCAAsC,IAC3C,CAAC,CAAC,eAAe,CAAC,yBAAyB,CAC3C;oBACL,4DAAK,KAAK,EAAC,wBAAwB;wBAC/B;4BACI,8DAAO,KAAK,EAAC,8CAA8C,IACtD,CAAC,CAAC,eAAe,CAAC,iBAAiB,CAChC;4BACR,8DACI,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,gHAAgH,EACtH,KAAK,EAAE,IAAI,CAAC,oBAAoB,EAChC,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;oCACX,IAAI,CAAC,oBAAoB,GAAG,QAAQ,CAC/B,CAAC,CAAC,MAA2B;yCACzB,KAAK,CACb,CAAC;oCACF,IAAI,CAAC,WAAW,EAAE,CAAC;oCACnB,IAAI,CAAC,WAAW,EAAE,CAAC;gCACvB,CAAC,GACH,CACA;wBACN;4BACI,8DAAO,KAAK,EAAC,8CAA8C,IACtD,CAAC,CAAC,eAAe,CAAC,uBAAuB,CACtC;4BACR,+DACI,KAAK,EAAC,gHAAgH,EACtH,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;oCACZ,IAAI,CAAC,kBAAkB;wCAClB,CAAC,CAAC,MAA4B;6CAC1B,KAEkB,CAAC;oCAC5B,IAAI,CAAC,WAAW,EAAE,CAAC;oCACnB,IAAI,CAAC,WAAW,EAAE,CAAC;gCACvB,CAAC;gCAED,+DACI,KAAK,EAAC,gBAAgB,EACtB,QAAQ,EAAE,IAAI,CAAC,kBAAkB;wCAC7B,gBAAgB,IAEnB,CAAC,CAAC,eAAe,CAAC,mBAAmB;qCACjC,YAAY,CACZ;gCACT,+DACI,KAAK,EAAC,aAAa,EACnB,QAAQ,EAAE,IAAI,CAAC,kBAAkB;wCAC7B,aAAa,IAEhB,CAAC,CAAC,eAAe,CAAC,mBAAmB;qCACjC,UAAU,CACV,CACJ,CACP,CACJ;oBACN,4DAAK,KAAK,EAAC,WAAW;wBAClB,+DAAQ,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,IAAI,CAAC,QAAQ,GAAG,EAAE,GAAW,CAChD,CACJ;gBAGN,4DAAK,KAAK,EAAC,WAAW;oBAClB,2DAAI,KAAK,EAAC,sCAAsC,IAC3C,CAAC,CAAC,eAAe,CAAC,qBAAqB,CACvC;oBACL,4DAAK,KAAK,EAAC,wBAAwB;wBAC/B;4BACI,8DAAO,KAAK,EAAC,8CAA8C,IACtD,CAAC,CAAC,eAAe,CAAC,gBAAgB,CAC/B;4BACR,8DACI,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,gHAAgH,EACtH,KAAK,EAAE,IAAI,CAAC,gBAAgB,EAC5B,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;oCACX,IAAI,CAAC,gBAAgB,GAAG,UAAU,CAC7B,CAAC,CAAC,MAA2B;yCACzB,KAAK,CACb,CAAC;oCACF,IAAI,CAAC,WAAW,EAAE,CAAC;oCACnB,IAAI,CAAC,WAAW,EAAE,CAAC;gCACvB,CAAC,GACH,CACA;wBACN;4BACI,8DAAO,KAAK,EAAC,8CAA8C,IACtD,CAAC,CAAC,eAAe,CAAC,gBAAgB,CAC/B;4BACR,8DACI,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,gHAAgH,EACtH,KAAK,EAAE,IAAI,CAAC,gBAAgB,EAC5B,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;oCACX,IAAI,CAAC,gBAAgB,GAAG,UAAU,CAC7B,CAAC,CAAC,MAA2B;yCACzB,KAAK,CACb,CAAC;oCACF,IAAI,CAAC,WAAW,EAAE,CAAC;oCACnB,IAAI,CAAC,WAAW,EAAE,CAAC;gCACvB,CAAC,GACH,CACA,CACJ,CACJ;gBAGN,4DAAK,KAAK,EAAC,yCAAyC;oBAChD,2DAAI,KAAK,EAAC,sCAAsC,IAC3C,CAAC,CAAC,eAAe,CAAC,YAAY,CAC9B;oBACL,4DAAK,KAAK,EAAC,0BAA0B;wBACjC,4DAAK,KAAK,EAAC,mCAAmC;4BAC1C,6DAAM,KAAK,EAAC,eAAe,IACtB,CAAC,CAAC,eAAe,CAAC,QAAQ,CACxB;4BACP,6DAAM,KAAK,EAAC,kCAAkC;gCACzC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC;oCACtB,CACL;wBACN,4DAAK,KAAK,EAAC,wCAAwC;4BAC/C,4DAAK,KAAK,EAAC,yBAAyB;gCAChC,6DAAM,KAAK,EAAC,eAAe,IACtB,CAAC,CAAC,eAAe,CAAC,WAAW,CAC3B;gCACP,4DAAK,KAAK,EAAC,gBAAgB;oCACvB,4DACI,KAAK,EAAC,4BAA4B,EAClC,KAAK,EAAC,mCAAmC,EACzC,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,cAAc;wCAEnB,0EACc,SAAS,EACnB,CAAC,EAAC,wLAAwL,eAChL,SAAS,GACrB,CACA;oCACN,4DAAK,KAAK,EAAC,wMAAwM,IAC9M,CAAC,CAAC,eAAe;yCACb,iBAAiB,CACpB,CACJ,CACJ;4BACN,6DAAM,KAAK,EAAC,kCAAkC;gCACzC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC,CAAC;;gCAAI,CAAC;qCAC5B,eAAe,CAAC,IAAI,CACtB,CACL,CACJ,CACJ;gBAGN,4DAAK,KAAK,EAAC,yCAAyC;oBAChD,2DAAI,KAAK,EAAC,sCAAsC,IAC3C,CAAC,CAAC,eAAe,CAAC,YAAY,CAC9B;oBACL,4DAAK,KAAK,EAAC,wBAAwB;wBAC/B;4BACI,8DAAO,KAAK,EAAC,8CAA8C,IACtD,CAAC,CAAC,eAAe,CAAC,IAAI,CACnB;4BACR,8DACI,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,uCACH,IAAI,CAAC,SAAS;oCACV,CAAC,CAAC,gBAAgB;oCAClB,CAAC,CAAC,iBACV,6DAA6D,EAC7D,KAAK,EAAE,IAAI,CAAC,IAAI,EAChB,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;oCACX,IAAI,CAAC,IAAI;wCACJ,CAAC,CAAC,MAA2B;6CACzB,KAAK,CAAC;oCACf,IAAI,CAAC,YAAY,EAAE,CAAC;gCACxB,CAAC,EACD,WAAW,EAAC,WAAW,GACzB;4BACD,IAAI,CAAC,SAAS,IAAI,CACf,0DAAG,KAAK,EAAC,2BAA2B,IAC/B,IAAI,CAAC,SAAS,CACf,CACP,CACC;wBACN;4BACI,8DAAO,KAAK,EAAC,8CAA8C,IACtD,CAAC,CAAC,eAAe,CAAC,KAAK,CACpB;4BACR,8DACI,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,uCACH,IAAI,CAAC,UAAU;oCACX,CAAC,CAAC,gBAAgB;oCAClB,CAAC,CAAC,iBACV,6DAA6D,EAC7D,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;oCACX,IAAI,CAAC,KAAK;wCACL,CAAC,CAAC,MAA2B;6CACzB,KAAK,CAAC;oCACf,IAAI,CAAC,YAAY,EAAE,CAAC;gCACxB,CAAC,EACD,WAAW,EAAC,wBAAwB,GACtC;4BACD,IAAI,CAAC,UAAU,IAAI,CAChB,0DAAG,KAAK,EAAC,2BAA2B,IAC/B,IAAI,CAAC,UAAU,CAChB,CACP,CACC,CACJ;oBACN,4DAAK,KAAK,EAAC,qBAAqB;wBAC5B,+DACI,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,kBAAkB,EAAE,EACxC,QAAQ,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;gCACvB,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC,IAAI,CAAC,SAAS;gCACtC,CAAC,CAAC,IAAI,CAAC,UAAU,EACrB,KAAK,EAAC,iGAAiG,IAEtG,CAAC,CAAC,eAAe,CAAC,kBAAkB,CAChC,CACP,CACJ,CACJ,CACJ,CACT,CAAC;IACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","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] text-white rounded-4xl hover:bg-[#964500] transition-colors duration-200\"\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\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] text-white rounded-4xl hover:bg-[#964500] transition-colors duration-200\"\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"]}
|
|
@@ -327,12 +327,18 @@
|
|
|
327
327
|
.w-16 {
|
|
328
328
|
width: calc(var(--spacing) * 16);
|
|
329
329
|
}
|
|
330
|
+
.w-32 {
|
|
331
|
+
width: calc(var(--spacing) * 32);
|
|
332
|
+
}
|
|
330
333
|
.w-52 {
|
|
331
334
|
width: calc(var(--spacing) * 52);
|
|
332
335
|
}
|
|
333
336
|
.w-64 {
|
|
334
337
|
width: calc(var(--spacing) * 64);
|
|
335
338
|
}
|
|
339
|
+
.w-128 {
|
|
340
|
+
width: calc(var(--spacing) * 128);
|
|
341
|
+
}
|
|
336
342
|
.w-full {
|
|
337
343
|
width: 100%;
|
|
338
344
|
}
|
|
@@ -580,6 +586,9 @@
|
|
|
580
586
|
.pt-7 {
|
|
581
587
|
padding-top: calc(var(--spacing) * 7);
|
|
582
588
|
}
|
|
589
|
+
.pr-3 {
|
|
590
|
+
padding-right: calc(var(--spacing) * 3);
|
|
591
|
+
}
|
|
583
592
|
.pr-4 {
|
|
584
593
|
padding-right: calc(var(--spacing) * 4);
|
|
585
594
|
}
|
|
@@ -592,6 +601,9 @@
|
|
|
592
601
|
.pb-7 {
|
|
593
602
|
padding-bottom: calc(var(--spacing) * 7);
|
|
594
603
|
}
|
|
604
|
+
.pl-3 {
|
|
605
|
+
padding-left: calc(var(--spacing) * 3);
|
|
606
|
+
}
|
|
595
607
|
.pl-10 {
|
|
596
608
|
padding-left: calc(var(--spacing) * 10);
|
|
597
609
|
}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { Components, JSX } from "../types/components";
|
|
2
|
+
|
|
3
|
+
interface EraserIcon extends Components.EraserIcon, HTMLElement {}
|
|
4
|
+
export const EraserIcon: {
|
|
5
|
+
prototype: EraserIcon;
|
|
6
|
+
new (): EraserIcon;
|
|
7
|
+
};
|
|
8
|
+
/**
|
|
9
|
+
* Used to define this component and all nested components recursively.
|
|
10
|
+
*/
|
|
11
|
+
export const defineCustomElement: () => void;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { E as EraserIcon$1, d as defineCustomElement$1 } from './p-Ca4aCGPQ.js';
|
|
2
|
+
|
|
3
|
+
const EraserIcon = EraserIcon$1;
|
|
4
|
+
const defineCustomElement = defineCustomElement$1;
|
|
5
|
+
|
|
6
|
+
export { EraserIcon, defineCustomElement };
|
|
7
|
+
//# sourceMappingURL=eraser-icon.js.map
|
|
8
|
+
|
|
9
|
+
//# sourceMappingURL=eraser-icon.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"eraser-icon.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { Components, JSX } from "../types/components";
|
|
2
|
+
|
|
3
|
+
interface HouseIcon extends Components.HouseIcon, HTMLElement {}
|
|
4
|
+
export const HouseIcon: {
|
|
5
|
+
prototype: HouseIcon;
|
|
6
|
+
new (): HouseIcon;
|
|
7
|
+
};
|
|
8
|
+
/**
|
|
9
|
+
* Used to define this component and all nested components recursively.
|
|
10
|
+
*/
|
|
11
|
+
export const defineCustomElement: () => void;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { H as HouseIcon$1, d as defineCustomElement$1 } from './p-Dpqxsv0f.js';
|
|
2
|
+
|
|
3
|
+
const HouseIcon = HouseIcon$1;
|
|
4
|
+
const defineCustomElement = defineCustomElement$1;
|
|
5
|
+
|
|
6
|
+
export { HouseIcon, defineCustomElement };
|
|
7
|
+
//# sourceMappingURL=house-icon.js.map
|
|
8
|
+
|
|
9
|
+
//# sourceMappingURL=house-icon.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"house-icon.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { Components, JSX } from "../types/components";
|
|
2
|
+
|
|
3
|
+
interface IconSelector extends Components.IconSelector, HTMLElement {}
|
|
4
|
+
export const IconSelector: {
|
|
5
|
+
prototype: IconSelector;
|
|
6
|
+
new (): IconSelector;
|
|
7
|
+
};
|
|
8
|
+
/**
|
|
9
|
+
* Used to define this component and all nested components recursively.
|
|
10
|
+
*/
|
|
11
|
+
export const defineCustomElement: () => void;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { I as Icon, d as defineCustomElement$1 } from './p-C1W188Ni.js';
|
|
2
|
+
|
|
3
|
+
const IconSelector = Icon;
|
|
4
|
+
const defineCustomElement = defineCustomElement$1;
|
|
5
|
+
|
|
6
|
+
export { IconSelector, defineCustomElement };
|
|
7
|
+
//# sourceMappingURL=icon-selector.js.map
|
|
8
|
+
|
|
9
|
+
//# sourceMappingURL=icon-selector.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"icon-selector.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}
|
package/dist/components/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
const NAMESPACE = 'stencil-library';
|
|
2
2
|
const BUILD = /* stencil-library */ { hydratedSelectorName: "hydrated", lazyLoad: false, updatable: true};
|
|
3
|
-
const Env = /* stencil-library */ {"GOOGLE_MAPS_API_KEY":"
|
|
3
|
+
const Env = /* stencil-library */ {"GOOGLE_MAPS_API_KEY":"AIzaSyAsIE9iVB_aEaZARMW13SRcnwoVuTIYMNQ"};
|
|
4
4
|
|
|
5
5
|
/*
|
|
6
6
|
Stencil Client Platform v4.31.0 | MIT Licensed | https://stenciljs.com
|