blue-chestnut-solar-expert 0.0.31 → 0.0.33
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.map-selector.move-icon.octagon-minus-icon.polygon-buttons.polygon-information.search-icon.settings-icon.settings-modal.solar-expert.solar-system-form.tool-box.undo-icon.entry.cjs.js.map +1 -1
- package/dist/cjs/eraser-icon_16.cjs.entry.js +117 -61
- package/dist/cjs/eraser-icon_16.cjs.entry.js.map +1 -1
- package/dist/collection/components/map-draw/map-draw.js +7 -7
- package/dist/collection/components/map-draw/map-draw.js.map +1 -1
- package/dist/collection/components/solar-expert/solar-expert.js +12 -4
- package/dist/collection/components/solar-expert/solar-expert.js.map +1 -1
- package/dist/collection/components/solar-system-form/solar-system-form.js +35 -25
- package/dist/collection/components/solar-system-form/solar-system-form.js.map +1 -1
- package/dist/collection/config.js +31 -0
- package/dist/collection/config.js.map +1 -1
- package/dist/collection/utils/theme.js +34 -26
- package/dist/collection/utils/theme.js.map +1 -1
- package/dist/components/map-draw.js +1 -1
- package/dist/components/{p-r9wMCtI3.js → p-ClYOM_0b.js} +10 -10
- package/dist/components/{p-r9wMCtI3.js.map → p-ClYOM_0b.js.map} +1 -1
- package/dist/components/{p-ao6bHDbv.js → p-CrzEBN9H.js} +69 -28
- package/dist/components/p-CrzEBN9H.js.map +1 -0
- package/dist/components/solar-expert.js +46 -31
- 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.map-selector.move-icon.octagon-minus-icon.polygon-buttons.polygon-information.search-icon.settings-icon.settings-modal.solar-expert.solar-system-form.tool-box.undo-icon.entry.js.map +1 -1
- package/dist/esm/eraser-icon_16.entry.js +117 -61
- package/dist/esm/eraser-icon_16.entry.js.map +1 -1
- package/dist/stencil-library/eraser-icon.house-icon.icon-selector.map-draw.map-selector.move-icon.octagon-minus-icon.polygon-buttons.polygon-information.search-icon.settings-icon.settings-modal.solar-expert.solar-system-form.tool-box.undo-icon.entry.esm.js.map +1 -1
- package/dist/stencil-library/p-3d7da486.entry.js +2 -0
- package/dist/stencil-library/p-3d7da486.entry.js.map +1 -0
- package/dist/stencil-library/stencil-library.esm.js +1 -1
- package/dist/types/config.d.ts +1 -0
- package/dist/types/utils/theme.d.ts +7 -0
- package/package.json +1 -1
- package/dist/components/p-ao6bHDbv.js.map +0 -1
- package/dist/stencil-library/p-141320bb.entry.js +0 -2
- package/dist/stencil-library/p-141320bb.entry.js.map +0 -1
|
@@ -505,6 +505,37 @@ const DEFAULT_SOLAR_PANEL_TYPE = {
|
|
|
505
505
|
efficiency: 0.224,
|
|
506
506
|
price: 77.68,
|
|
507
507
|
};
|
|
508
|
+
const DEFAULT_COLOR_SCHEME = {
|
|
509
|
+
primary: "hsl(41 51% 90%)",
|
|
510
|
+
primaryForeground: "hsl(0 0% 0%)",
|
|
511
|
+
secondary: "hsl(28 100% 8%)",
|
|
512
|
+
secondaryForeground: "hsl(0 0% 100%)",
|
|
513
|
+
tertiary: "hsl(28 100% 29%)",
|
|
514
|
+
tertiaryForeground: "hsl(0 0% 100%)",
|
|
515
|
+
muted: "hsl(0 0% 100%)",
|
|
516
|
+
mutedForeground: "hsl(0 0% 0%)",
|
|
517
|
+
error: "hsl(0 100% 50%)",
|
|
518
|
+
errorForeground: "hsl(0 0% 100%)",
|
|
519
|
+
// Surface colors
|
|
520
|
+
surface: "hsl(0 0% 88%)", // gray-200
|
|
521
|
+
surfaceHover: "hsl(0 0% 82%)", // gray-300
|
|
522
|
+
surfaceActive: "hsl(0 0% 64%)", // gray-400
|
|
523
|
+
// Text colors
|
|
524
|
+
textMuted: "hsl(0 0% 45%)", // gray-600
|
|
525
|
+
textSecondary: "hsl(0 0% 55%)", // gray-500
|
|
526
|
+
textPlaceholder: "hsl(0 0% 73%)", // gray-400
|
|
527
|
+
// Border colors
|
|
528
|
+
border: "hsl(0 0% 82%)", // gray-300
|
|
529
|
+
borderLight: "hsl(0 0% 93%)", // gray-200
|
|
530
|
+
// Status colors
|
|
531
|
+
success: "hsl(142 76% 36%)", // green-600
|
|
532
|
+
info: "hsl(221 83% 53%)", // blue-500
|
|
533
|
+
// Interactive colors
|
|
534
|
+
hover: "hsl(0 0% 88%)", // gray-200
|
|
535
|
+
hoverDark: "hsl(28 100% 8%)", // darker secondary for hover
|
|
536
|
+
overlay: "rgba(0, 0, 0, 0.24)", // #0000003c
|
|
537
|
+
tooltip: "hsl(0 0% 13%)", // gray-800
|
|
538
|
+
};
|
|
508
539
|
|
|
509
540
|
function getFillColor(selectedPolygon, hoveredPolygon, _id, polygon, config) {
|
|
510
541
|
const isHovered = hoveredPolygon?.type === polygon.type && hoveredPolygon?._id === _id;
|
|
@@ -2237,22 +2268,22 @@ const MapDraw = class {
|
|
|
2237
2268
|
render() {
|
|
2238
2269
|
const t = getLanguageStrings(state.settings.language);
|
|
2239
2270
|
const currentPolygon = this.getCurrentPolygon();
|
|
2240
|
-
return (h("div", { key: '
|
|
2271
|
+
return (h("div", { key: 'ebe7e96014e7ecb78818096b9cb391f07b9d06ec', class: "flex flex-col justify-center items-center w-full h-full gap-4", id: "map-draw" }, this.showInstructions && !state.isMobile && (h("div", { key: '70722b3127cefe195ccc74ab758de6ef8e032fde', class: "w-full rounded-4xl p-4 bg-muted text-muted-foreground" }, t.mapDraw.instructions.parts.roof, " ", h("button", { key: '10761447b11b001d74eb7386bdf0be80d53e091b', class: "inline-flex items-center justify-center p-1 rounded-full hover:bg-surface-hover transition-colors", onClick: () => this.handleToolSelect(roofTool) }, h("icon-selector", { key: '4e5ac604551002d38b1c44b35de01c37412c74e6', name: "house", inline: true })), " ", t.mapDraw.instructions.parts.obstruction, " ", h("button", { key: '9dc52e0b6006a10221834c8a9d83234f9db0d319', class: "inline-flex items-center justify-center p-1 rounded-full hover:bg-surface-hover transition-colors", onClick: () => this.handleToolSelect(obstructionTool) }, h("icon-selector", { key: '39ab111d5647f9981a5f5f91c45d925d46e3283d', name: "octagon-minus", inline: true })), " ", t.mapDraw.instructions.parts.delete, " ", h("button", { key: '8ad5281af91d5ee5597f957f59cd37027fbd505a', class: "inline-flex items-center justify-center p-1 rounded-full hover:bg-surface-hover transition-colors", onClick: () => this.handleToolSelect(deleteTool) }, h("icon-selector", { key: '096b570b0ffa3bda667157d960ed89193a1caa12', name: "eraser", inline: true })), " ", t.mapDraw.instructions.parts.move, " ", h("button", { key: 'f1cbb3cbf71b13be266abdd049c2fd9b89cde715', class: "inline-flex items-center justify-center p-1 rounded-full hover:bg-surface-hover transition-colors", onClick: () => this.handleToolSelect(moveTool) }, h("icon-selector", { key: 'd9c6ba2268ab4a175ec15260f22bb03b19b8255a', name: "move", inline: true })), " ", t.mapDraw.instructions.parts.end)), h("div", { key: '10ac3758660b337a60934def1c9f2f35f36e60c5', class: "w-full flex flex-row justify-between items-center" }, !state.isMobile && (this.showInstructions
|
|
2241
2272
|
? (h("button", { class: "px-4 py-2 rounded-4xl hover:bg-surface-hover transition-colors duration-200 bg-muted p-4 text-muted-foreground", onClick: () => this.showInstructions = false }, t.mapDraw.instructions.hide))
|
|
2242
|
-
: (h("button", { class: "px-4 py-2 rounded-4xl hover:bg-surface-hover transition-colors duration-200 bg-muted p-4 text-muted-foreground", onClick: () => this.showInstructions = true }, t.mapDraw.instructions.show))), h("button", { key: '
|
|
2243
|
-
this.loadingState === "loading") && (h("div", { key: '
|
|
2273
|
+
: (h("button", { class: "px-4 py-2 rounded-4xl hover:bg-surface-hover transition-colors duration-200 bg-muted p-4 text-muted-foreground", onClick: () => this.showInstructions = true }, t.mapDraw.instructions.show))), h("button", { key: 'e88a3957add7e0c36222962266913148020a2dee', class: "flex items-center gap-2 bg-muted p-2 rounded-4xl hover:bg-surface-hover text-muted-foreground", onClick: this.handleSettingsClick }, h("settings-icon", { key: '31df69629e4309e8d95e939a04c2dbba1fbc03ed' }))), h("div", { key: 'f724a52fefacbe5b60bd165de16f56ed345dfd11', class: "w-full" }, !state.isMobile && (h("tool-box", { key: 'd2477fcbd40d1a446f65bc2b42157006dde73acb', currentTool: this.currentTool, onToolSelect: (tool) => this.handleToolSelect(tool), undoCallback: () => this.undo() }))), this.loadingState === "empty" && (h("div", { key: '964f8012fae92090fad9b52f7dd664a7359e4365', class: "w-full" }, h("p", { key: '6adde4c4f3e24ed586f43d3f162f60fa5612bcce', class: "text-muted text-center flex items-center justify-center rounded-4xl p-4 w-full bg-text-secondary" }, t.mapDraw.noAddressSelected))), (state.latitude && state.longitude &&
|
|
2274
|
+
this.loadingState === "loading") && (h("div", { key: 'c0dfd656c2633f0c49a2ecb26d15550eba64ffb5', class: "flex items-center justify-center w-full bg-opacity-75 z-20 pt-7 rounded-4xl" }, h("div", { key: 'abe70b554757acd75988d439c6877af09f198d29', class: "animate-spin rounded-full h-16 w-16 border-t-2 border-b-2 border-secondary" }))), h("div", { key: '624e94cb3969d04ee6026353616ca39e772d1129', class: "flex items-start justify-center h-full w-full bg-primary rounded-4xl" }, h("div", { key: '43d96ad059a8b085f0d3b1a1fa6e1521da87410c', class: "relative h-full flex items-center justify-center w-full rounded-4xl bg-secondary", style: {
|
|
2244
2275
|
aspectRatio: this.rgbTiff
|
|
2245
2276
|
? `${this.rgbTiff.width}/${this.rgbTiff.height}`
|
|
2246
2277
|
: "1/1",
|
|
2247
|
-
} }, h("canvas", { key: '
|
|
2278
|
+
} }, h("canvas", { key: '4b67bc938bcb9b25b4a52dd163fdba1a70324e63', ref: (el) => this.canvasElement = el, class: "absolute top-0 left-0 w-full h-full rounded-4xl", id: "map-draw-canvas", style: {
|
|
2248
2279
|
cursor: this.currentTool.cursor,
|
|
2249
|
-
} }), h("canvas", { key: '
|
|
2280
|
+
} }), h("canvas", { key: '2d549095d5a3af42a109ce043fd357d14309e311', ref: (el) => this.polygonCanvas = el, class: "absolute top-0 left-0 w-full h-full rounded-4xl", style: {
|
|
2250
2281
|
cursor: this.currentTool.cursor,
|
|
2251
|
-
} }))), currentPolygon?.closed && (h("div", { key: '
|
|
2282
|
+
} }))), currentPolygon?.closed && (h("div", { key: '8519b6421d6ef36672504f7d120bf170d7dbd6f0', class: "w-full" }, h("polygon-buttons", { key: '21e7b96ddb3d2a6add87d41a314a89d702a4dd42', currentTool: this.currentTool.name, calculateSolarPanels: () => this.calculateSolarPanels(), selectEdgeTool: () => this.handleToolSelect(markRoofEdgeTool) }))), !state.isMobile && (h("div", { key: '265211ded512cbe17a9aed997b439011b4d0b982', class: "w-full" }, h("polygon-information", { key: '923dd819af422124d5171a1199a2e852a466f54e', currentPolygon: currentPolygon, positionedPanels: currentPolygon
|
|
2252
2283
|
? this
|
|
2253
2284
|
.roofPolygonsSolarPanels[currentPolygon._id]
|
|
2254
2285
|
?.positionedPanels
|
|
2255
|
-
: undefined, handleAzimuthChange: (event) => this.handleAzimuthChange(event), handlePitchChange: (event) => this.handlePitchChange(event), calculateSolarPanels: () => this.calculateSolarPanels() }))), h("div", { key: '
|
|
2286
|
+
: undefined, handleAzimuthChange: (event) => this.handleAzimuthChange(event), handlePitchChange: (event) => this.handlePitchChange(event), calculateSolarPanels: () => this.calculateSolarPanels() }))), h("div", { key: 'bb8d6f3fb719403814fba5871a9fcdc923ee9255', class: "w-full" }, h("solar-system-form", { key: 'eb6423fd823816992fe10a9a457018afe08fb0ca', systemConfigs: this.roofPolygonsSolarPanels, roofPolygons: this.roofPolygons, obstructionPolygons: this.obstructionPolygons })), this.showSettings && (h("settings-modal", { key: 'f00648d12379fb6738168706ac8326587b613c8f', settings: state.settings, onClose: this.handleSettingsClose, onSave: this.handleSettingsSave }))));
|
|
2256
2287
|
}
|
|
2257
2288
|
static get watchers() { return {
|
|
2258
2289
|
"rgbTiff": ["drawMap"],
|
|
@@ -2592,84 +2623,92 @@ SettingsModal.style = outputCss$4;
|
|
|
2592
2623
|
* @param colorScheme - The color scheme object containing theme colors
|
|
2593
2624
|
*/
|
|
2594
2625
|
function applyThemeGlobally(colorScheme) {
|
|
2595
|
-
|
|
2596
|
-
|
|
2626
|
+
applyThemeToElement(document.documentElement, colorScheme);
|
|
2627
|
+
}
|
|
2628
|
+
/**
|
|
2629
|
+
* Applies a color scheme theme to a specific element (useful for Shadow DOM).
|
|
2630
|
+
*
|
|
2631
|
+
* @param element - The element to apply the theme to (e.g., Shadow DOM host)
|
|
2632
|
+
* @param colorScheme - The color scheme object containing theme colors
|
|
2633
|
+
*/
|
|
2634
|
+
function applyThemeToElement(element, colorScheme) {
|
|
2635
|
+
// Set CSS custom properties on the specified element
|
|
2597
2636
|
if (colorScheme.primary) {
|
|
2598
|
-
|
|
2637
|
+
element.style.setProperty('--color-primary', colorScheme.primary);
|
|
2599
2638
|
}
|
|
2600
2639
|
if (colorScheme.primaryForeground) {
|
|
2601
|
-
|
|
2640
|
+
element.style.setProperty('--color-primary-foreground', colorScheme.primaryForeground);
|
|
2602
2641
|
}
|
|
2603
2642
|
if (colorScheme.secondary) {
|
|
2604
|
-
|
|
2643
|
+
element.style.setProperty('--color-secondary', colorScheme.secondary);
|
|
2605
2644
|
}
|
|
2606
2645
|
if (colorScheme.secondaryForeground) {
|
|
2607
|
-
|
|
2646
|
+
element.style.setProperty('--color-secondary-foreground', colorScheme.secondaryForeground);
|
|
2608
2647
|
}
|
|
2609
2648
|
if (colorScheme.tertiary) {
|
|
2610
|
-
|
|
2649
|
+
element.style.setProperty('--color-tertiary', colorScheme.tertiary);
|
|
2611
2650
|
}
|
|
2612
2651
|
if (colorScheme.tertiaryForeground) {
|
|
2613
|
-
|
|
2652
|
+
element.style.setProperty('--color-tertiary-foreground', colorScheme.tertiaryForeground);
|
|
2614
2653
|
}
|
|
2615
2654
|
if (colorScheme.muted) {
|
|
2616
|
-
|
|
2655
|
+
element.style.setProperty('--color-muted', colorScheme.muted);
|
|
2617
2656
|
}
|
|
2618
2657
|
if (colorScheme.mutedForeground) {
|
|
2619
|
-
|
|
2658
|
+
element.style.setProperty('--color-muted-foreground', colorScheme.mutedForeground);
|
|
2620
2659
|
}
|
|
2621
2660
|
if (colorScheme.error) {
|
|
2622
|
-
|
|
2661
|
+
element.style.setProperty('--color-error', colorScheme.error);
|
|
2623
2662
|
}
|
|
2624
2663
|
if (colorScheme.errorForeground) {
|
|
2625
|
-
|
|
2664
|
+
element.style.setProperty('--color-error-foreground', colorScheme.errorForeground);
|
|
2626
2665
|
}
|
|
2627
2666
|
// Surface colors
|
|
2628
2667
|
if (colorScheme.surface) {
|
|
2629
|
-
|
|
2668
|
+
element.style.setProperty('--color-surface', colorScheme.surface);
|
|
2630
2669
|
}
|
|
2631
2670
|
if (colorScheme.surfaceHover) {
|
|
2632
|
-
|
|
2671
|
+
element.style.setProperty('--color-surface-hover', colorScheme.surfaceHover);
|
|
2633
2672
|
}
|
|
2634
2673
|
if (colorScheme.surfaceActive) {
|
|
2635
|
-
|
|
2674
|
+
element.style.setProperty('--color-surface-active', colorScheme.surfaceActive);
|
|
2636
2675
|
}
|
|
2637
2676
|
// Text colors
|
|
2638
2677
|
if (colorScheme.textMuted) {
|
|
2639
|
-
|
|
2678
|
+
element.style.setProperty('--color-text-muted', colorScheme.textMuted);
|
|
2640
2679
|
}
|
|
2641
2680
|
if (colorScheme.textSecondary) {
|
|
2642
|
-
|
|
2681
|
+
element.style.setProperty('--color-text-secondary', colorScheme.textSecondary);
|
|
2643
2682
|
}
|
|
2644
2683
|
if (colorScheme.textPlaceholder) {
|
|
2645
|
-
|
|
2684
|
+
element.style.setProperty('--color-text-placeholder', colorScheme.textPlaceholder);
|
|
2646
2685
|
}
|
|
2647
2686
|
// Border colors
|
|
2648
2687
|
if (colorScheme.border) {
|
|
2649
|
-
|
|
2688
|
+
element.style.setProperty('--color-border', colorScheme.border);
|
|
2650
2689
|
}
|
|
2651
2690
|
if (colorScheme.borderLight) {
|
|
2652
|
-
|
|
2691
|
+
element.style.setProperty('--color-border-light', colorScheme.borderLight);
|
|
2653
2692
|
}
|
|
2654
2693
|
// Status colors
|
|
2655
2694
|
if (colorScheme.success) {
|
|
2656
|
-
|
|
2695
|
+
element.style.setProperty('--color-success', colorScheme.success);
|
|
2657
2696
|
}
|
|
2658
2697
|
if (colorScheme.info) {
|
|
2659
|
-
|
|
2698
|
+
element.style.setProperty('--color-info', colorScheme.info);
|
|
2660
2699
|
}
|
|
2661
2700
|
// Interactive colors
|
|
2662
2701
|
if (colorScheme.hover) {
|
|
2663
|
-
|
|
2702
|
+
element.style.setProperty('--color-hover', colorScheme.hover);
|
|
2664
2703
|
}
|
|
2665
2704
|
if (colorScheme.hoverDark) {
|
|
2666
|
-
|
|
2705
|
+
element.style.setProperty('--color-hover-dark', colorScheme.hoverDark);
|
|
2667
2706
|
}
|
|
2668
2707
|
if (colorScheme.overlay) {
|
|
2669
|
-
|
|
2708
|
+
element.style.setProperty('--color-overlay', colorScheme.overlay);
|
|
2670
2709
|
}
|
|
2671
2710
|
if (colorScheme.tooltip) {
|
|
2672
|
-
|
|
2711
|
+
element.style.setProperty('--color-tooltip', colorScheme.tooltip);
|
|
2673
2712
|
}
|
|
2674
2713
|
}
|
|
2675
2714
|
|
|
@@ -2738,7 +2777,11 @@ const SolarExpert = class {
|
|
|
2738
2777
|
state.settings.language = this.language;
|
|
2739
2778
|
const isIPhone = navigator.userAgent.indexOf("iPhone") != -1;
|
|
2740
2779
|
const isMac = navigator.userAgent.indexOf("Mac OS") != -1;
|
|
2741
|
-
state.isIOS = isIPhone || isMac;
|
|
2780
|
+
state.isIOS = isIPhone || isMac || true;
|
|
2781
|
+
if (!this.colorScheme) {
|
|
2782
|
+
applyThemeToElement(this.el, DEFAULT_COLOR_SCHEME);
|
|
2783
|
+
applyThemeGlobally(DEFAULT_COLOR_SCHEME);
|
|
2784
|
+
}
|
|
2742
2785
|
this.applyTheme();
|
|
2743
2786
|
}
|
|
2744
2787
|
colorSchemeChanged() {
|
|
@@ -2746,7 +2789,10 @@ const SolarExpert = class {
|
|
|
2746
2789
|
}
|
|
2747
2790
|
applyTheme() {
|
|
2748
2791
|
if (this.colorScheme) {
|
|
2792
|
+
// Apply theme globally for non-shadow components
|
|
2749
2793
|
applyThemeGlobally(this.colorScheme);
|
|
2794
|
+
// Apply theme to this component's Shadow DOM host element
|
|
2795
|
+
applyThemeToElement(this.el, this.colorScheme);
|
|
2750
2796
|
}
|
|
2751
2797
|
}
|
|
2752
2798
|
async loadGoogleMapsScript() {
|
|
@@ -2795,9 +2841,9 @@ const SolarExpert = class {
|
|
|
2795
2841
|
}
|
|
2796
2842
|
render() {
|
|
2797
2843
|
const t = getLanguageStrings(this.language);
|
|
2798
|
-
return (h("div", { key: '
|
|
2844
|
+
return (h("div", { key: '8b0622ee8ebeea53897b0dac8a0bdd12950d1d72', class: "flex flex-col w-full h-full p-3 m-auto", id: "solar-calculator" }, this.showMapSelector
|
|
2799
2845
|
? (h("map-selector", { "api-key": this.apiKey, language: this.language }))
|
|
2800
|
-
: (h(h.Fragment, null, h("div", { class: "pb-3 flex flex-row gap-4 items-stretch w-full
|
|
2846
|
+
: (h(h.Fragment, null, h("div", { class: "pb-3 flex flex-row gap-4 items-stretch w-full" }, h("div", { class: "relative flex-3" }, h("div", { class: "absolute left-3 top-0 h-full flex items-center text-muted-foreground pointer-events-none" }, h("search-icon", null)), h("input", { ref: (el) => this.inputElement = el, type: "text", placeholder: t.solarExpert
|
|
2801
2847
|
.searchPlaceholder, class: "w-full pl-10 pr-4 py-2 border border-border rounded-4xl focus:ring-secondary bg-muted text-muted-foreground h-full" })), h("button", { onClick: () => this.handleChooseOnMap(), class: "flex-1 pl-4 pr-4 py-2 border border-border bg-muted rounded-4xl focus:ring-secondary hover:bg-secondary hover:text-muted" }, t.mapSelector.chooseOnMap)), h("map-draw", { apiKey: this.apiKey })))));
|
|
2802
2848
|
}
|
|
2803
2849
|
static get watchers() { return {
|
|
@@ -3120,17 +3166,19 @@ const SolarSystemForm = class {
|
|
|
3120
3166
|
"mostly_at_home" }, t.solarSystemForm.consumptionProfiles
|
|
3121
3167
|
.mostlyAtHome), h("option", { key: 'a713af601a9a122e83a7610df91dc87046c32684', value: "mostly_away", selected: this.consumptionProfile ===
|
|
3122
3168
|
"mostly_away" }, t.solarSystemForm.consumptionProfiles
|
|
3123
|
-
.mostlyAway))))), h("div", { key: 'e22302c5432e13704827226a9348eb5135fbd168', class: "space-y-4" }, h("h2", { key: '22ff557a03b832de10382cbd9e2934f1e40f48c1', class: "text-lg font-semibold text-secondary" }, t.solarSystemForm.additionalComponents.title), h("div", { key: '8dc84f2bee4d59e5a9024b252a990a6d86729bfa', class: "flex flex-col gap-4" }, h("div", { key: 'dfa92f5717a77e1f1d2bb6549ae38ce02aaccb7c', class: "flex flex-col bg-muted rounded-4xl p-4 gap-4" }, h("div", { key: '70a5a4390c42cd96d5ea7238842bc9a30e387d24', class: "flex items-center justify-between" }, h("div", { key: 'c6454e366f5086e6ca7964b2d41561a4f422ed1a', class: "flex items-center gap-2" }, h("input", { key: '
|
|
3169
|
+
.mostlyAway))))), h("div", { key: 'e22302c5432e13704827226a9348eb5135fbd168', class: "space-y-4" }, h("h2", { key: '22ff557a03b832de10382cbd9e2934f1e40f48c1', class: "text-lg font-semibold text-secondary" }, t.solarSystemForm.additionalComponents.title), h("div", { key: '8dc84f2bee4d59e5a9024b252a990a6d86729bfa', class: "flex flex-col gap-4" }, h("div", { key: 'dfa92f5717a77e1f1d2bb6549ae38ce02aaccb7c', class: "flex flex-col bg-muted rounded-4xl p-4 gap-4" }, h("div", { key: '70a5a4390c42cd96d5ea7238842bc9a30e387d24', class: "flex items-center justify-between" }, h("div", { key: 'c6454e366f5086e6ca7964b2d41561a4f422ed1a', class: "flex items-center gap-2" }, h("input", { key: '2e1d3ebd2908ded2959392bee1a08c268e34d612', type: "checkbox", id: "heatPump", class: "w-4 h-4 accent-tertiary border-border rounded-full focus:ring-tertiary focus:ring-offset-0 focus:ring-2", checked: this.heatPump > 0, onChange: (e) => {
|
|
3124
3170
|
this.heatPump =
|
|
3125
3171
|
e.target
|
|
3126
3172
|
.checked
|
|
3127
3173
|
? 100
|
|
3128
3174
|
: 0;
|
|
3129
3175
|
this.recalculate();
|
|
3130
|
-
} }), h("label", { key: '
|
|
3176
|
+
} }), h("label", { key: '11a45cadaf1bc2c8661da788eca3c7d0e2560e13', htmlFor: "heatPump", class: "text-text-muted" }, t.solarSystemForm
|
|
3131
3177
|
.additionalComponents
|
|
3132
|
-
.heatPump)), (this.heatPump > 0 && !this.isIOS()) && (h("span", { key: '
|
|
3133
|
-
? (h("div", { class: "flex items-center gap-2" }, h("input", { type: "number", min: "10", max: "300", step: "10", class: "flex-1 px-4 py-2 rounded-4xl border border-
|
|
3178
|
+
.heatPump)), (this.heatPump > 0 && !this.isIOS()) && (h("span", { key: '1f8bd12df9d5e0357afd755c83d1cf592b6b5384', class: "text-text-muted" }, this.heatPump, " m\u00B2"))), this.heatPump > 0 && (h("div", { key: '1fdd01ffe44f75daf94e5c9b716519d1636f6e3a', class: "flex flex-col gap-2" }, this.isIOS()
|
|
3179
|
+
? (h("div", { class: "flex items-center gap-2" }, h("input", { type: "number", min: "10", max: "300", step: "10", class: "flex-1 px-4 py-2 rounded-4xl border border-border focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted", style: {
|
|
3180
|
+
border: "1px solid var(--color-border)",
|
|
3181
|
+
}, value: this.heatPump, onInput: (e) => {
|
|
3134
3182
|
const value = parseInt(e.target
|
|
3135
3183
|
.value);
|
|
3136
3184
|
if (value >= 10 &&
|
|
@@ -3145,38 +3193,42 @@ const SolarSystemForm = class {
|
|
|
3145
3193
|
parseInt(e.target
|
|
3146
3194
|
.value);
|
|
3147
3195
|
this.recalculate();
|
|
3148
|
-
} }))))), h("div", { key: '
|
|
3196
|
+
} }))))), h("div", { key: '94b4d3e5d6bea8994012b3500160780796338202', class: "flex flex-col bg-muted rounded-4xl p-4 gap-4" }, h("div", { key: '880a456c5d9916a467be761ffb6d48a0ac702095', class: "flex items-center justify-between" }, h("div", { key: '7ee0b35d4b616af184dd94ec11e2e5cba538aacd', class: "flex items-center gap-2" }, h("input", { key: 'cebabbd261270049b52c3e471e8a02588c41af5f', type: "checkbox", id: "electricCar", class: "w-4 h-4 accent-tertiary border-border rounded focus:ring-tertiary focus:ring-offset-0 focus:ring-2", checked: this.electricCar, onChange: (e) => {
|
|
3149
3197
|
this.electricCar =
|
|
3150
3198
|
e.target
|
|
3151
3199
|
.checked;
|
|
3152
3200
|
this.recalculate();
|
|
3153
|
-
} }), h("label", { key: '
|
|
3201
|
+
} }), h("label", { key: 'a922eeb0abc8731c0410c308a3ea55d93961dfaf', htmlFor: "electricCar", class: "text-text-muted" }, t.solarSystemForm
|
|
3154
3202
|
.additionalComponents
|
|
3155
|
-
.electricCar))), this.electricCar && (h("div", { key: '
|
|
3203
|
+
.electricCar))), this.electricCar && (h("div", { key: '0c78c7f3176a0f6ab9c41c9876cf1a035877c798', class: "flex flex-col gap-2" }, h("div", { key: '722f0f8c09f037d75c7721c0bd7141da781f3c0c', class: "grid grid-cols-2 gap-4" }, h("label", { key: '258ee50ded063df8322520e2fdc7c7891b673c66', class: "text-sm text-text-muted" }, t.solarSystemForm
|
|
3156
3204
|
.additionalComponents
|
|
3157
|
-
.chargingTime), h("label", { key: '
|
|
3205
|
+
.chargingTime), h("label", { key: '7ae9cfa77cd8ced89d1598ef09fcc4772133695e', class: "text-sm text-text-muted" }, t.solarSystemForm
|
|
3158
3206
|
.additionalComponents
|
|
3159
|
-
.kilometersPerYear)), h("div", { key: '
|
|
3207
|
+
.kilometersPerYear)), h("div", { key: '1f9244bd861b20278eec8cbca21cf611a7b923f6', class: "grid grid-cols-2 gap-4" }, h("select", { key: '39022b4df361b6efb4f57057b27dc5419cc533be', class: "w-full px-4 py-2 rounded-4xl border border-border focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted", onChange: (e) => {
|
|
3160
3208
|
this.electricCarChargingTime =
|
|
3161
3209
|
e.target
|
|
3162
3210
|
.value;
|
|
3163
3211
|
this.recalculate();
|
|
3164
|
-
}
|
|
3212
|
+
}, style: {
|
|
3213
|
+
border: "1px solid var(--color-border)",
|
|
3214
|
+
} }, h("option", { key: '3ac38d888755fe1ff1bbcdee4ac2ecbfbd51b8a6', value: "day", selected: this
|
|
3165
3215
|
.electricCarChargingTime ===
|
|
3166
3216
|
"day" }, t.solarSystemForm
|
|
3167
3217
|
.additionalComponents
|
|
3168
|
-
.chargingTimeDay), h("option", { key: '
|
|
3218
|
+
.chargingTimeDay), h("option", { key: 'a6a8cca9b5f127aa4331cc412ea56da2ddfa480e', value: "night", selected: this
|
|
3169
3219
|
.electricCarChargingTime ===
|
|
3170
3220
|
"night" }, t.solarSystemForm
|
|
3171
3221
|
.additionalComponents
|
|
3172
|
-
.chargingTimeNight)), h("input", { key: '
|
|
3222
|
+
.chargingTimeNight)), h("input", { key: 'd44e83a3e68f29ffbcc8c21132c3c357f4025eba', type: "number", min: "1000", max: "50000", step: "1000", class: "w-full px-4 py-2 rounded-4xl border border-border focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted", value: this.kmDrivenPerYear, onInput: (e) => {
|
|
3173
3223
|
this.kmDrivenPerYear =
|
|
3174
3224
|
parseInt(e.target
|
|
3175
3225
|
.value);
|
|
3176
3226
|
this.recalculate();
|
|
3177
|
-
}
|
|
3178
|
-
|
|
3179
|
-
|
|
3227
|
+
}, style: {
|
|
3228
|
+
border: "1px solid var(--color-border)",
|
|
3229
|
+
} }))))), h("div", { key: '78887c816adeaeecd3503953e6079678ea5ffa8a', class: "flex flex-col bg-muted rounded-4xl p-4 gap-4" }, h("div", { key: '0f4e2b348c0e7e7789c7a2badfbddfbb668e4842', class: "flex items-center justify-between" }, h("label", { key: '5eaa71f1ae5a7c08bdbd3ee1b8ea18767738b9f0', class: "text-text-muted" }, t.solarSystemForm.additionalComponents
|
|
3230
|
+
.battery), !this.isIOS() && (h("span", { key: 'f627ed9f5b6004bedfc99fed880701783e1f6b8c', class: "text-text-muted" }, this.battery, " kWh"))), h("div", { key: 'ae29676644ea5884897912332204f8df2edcc913', class: "flex flex-col gap-2" }, this.isIOS()
|
|
3231
|
+
? (h("div", { class: "flex items-center gap-2" }, h("input", { type: "number", min: "0", max: "20", step: "1", class: "flex-1 px-4 py-2 rounded-4xl border border-border focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted", value: this.battery, onInput: (e) => {
|
|
3180
3232
|
const value = parseInt(e.target
|
|
3181
3233
|
.value);
|
|
3182
3234
|
if (value >= 0 &&
|
|
@@ -3185,42 +3237,46 @@ const SolarSystemForm = class {
|
|
|
3185
3237
|
value;
|
|
3186
3238
|
this.recalculate();
|
|
3187
3239
|
}
|
|
3188
|
-
}, placeholder: "Battery capacity"
|
|
3240
|
+
}, placeholder: "Battery capacity", style: {
|
|
3241
|
+
border: "1px solid var(--color-border)",
|
|
3242
|
+
} }), h("span", { class: "text-sm text-text-muted" }, "kWh")))
|
|
3189
3243
|
: (h("input", { type: "range", min: "0", max: "20", step: "1", class: "input-slider w-full custom-range appearance-none rounded-full bg-transparent [&::-webkit-slider-runnable-track]:rounded-full [&::-webkit-slider-runnable-track]:bg-black/25 [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:h-[10px] [&::-webkit-slider-thumb]:w-[10px] [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:bg-muted", value: this.battery, onInput: (e) => {
|
|
3190
3244
|
this.battery = parseInt(e.target
|
|
3191
3245
|
.value);
|
|
3192
3246
|
this.recalculate();
|
|
3193
|
-
} })))))), h("div", { key: '
|
|
3247
|
+
} })))))), h("div", { key: '3ff4f76e3998594832541e7c29b62fd066eb6b93', class: "space-y-4" }, h("h2", { key: '0d699ce4651eafa967464bd2d514e33e7d7594f5', class: "text-lg font-semibold text-secondary" }, t.solarSystemForm.electricityCostsTitle), h("div", { key: '2fbf7001ef764bbdfcebb68aee462b9015740e42', class: "grid grid-rows-2 gap-0" }, h("div", { key: '822c1a7ebde43a0e82d8e85a738f7c6d71d59312', class: "grid grid-cols-3 gap-4" }, h("label", { key: '7037f5005c69ca0fc06706190b2a14b0e65d0bab', class: "block text-sm font-medium text-text-muted mb-1" }, t.solarSystemForm.electricityPrice), h("label", { key: 'c57af75b004add729b4ddddc118534b2fdb783bf', class: "block text-sm font-medium text-text-muted mb-1" }, t.solarSystemForm.compensationRate), h("label", { key: 'd28f0391fc0e52f6a6bbe454302afd54493be80b', class: "block text-sm font-medium text-text-muted mb-1" }, t.solarSystemForm.annualPriceIncrease)), h("div", { key: '237e6d85d909b1b08d00cdc3ce3c340513c9ffd8', class: "grid grid-cols-3 gap-4 text-primary-foreground" }, h("input", { key: '59ac48fca752b9fb654342ec2bde43599a8451b4', type: "number", step: "0.01", class: "w-full px-4 py-2 rounded-4xl border border-border focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted", value: this.electricityPrice.toFixed(2), onInput: (e) => {
|
|
3194
3248
|
this.electricityPrice = parseFloat(e.target
|
|
3195
3249
|
.value);
|
|
3196
3250
|
this.recalculate();
|
|
3197
|
-
} }), h("input", { key: '
|
|
3251
|
+
} }), h("input", { key: '3644ceacd7733d2f74ffc5891522d4dd1ab67851', type: "number", step: "0.01", class: "w-full px-4 py-2 rounded-4xl border border-border focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted", value: this.compensationRate.toFixed(2), onInput: (e) => {
|
|
3198
3252
|
this.compensationRate = parseFloat(e.target
|
|
3199
3253
|
.value);
|
|
3200
3254
|
this.recalculate();
|
|
3201
|
-
} }), h("input", { key: '
|
|
3255
|
+
} }), h("input", { key: '8e453b5b7665c51a5bb8160132bbcc8da5bf5159', type: "number", step: "0.1", class: "w-full px-4 py-2 rounded-4xl border border-border focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted", value: this.annualPriceIncrease.toFixed(1), onInput: (e) => {
|
|
3202
3256
|
this.annualPriceIncrease = parseFloat(e.target
|
|
3203
3257
|
.value);
|
|
3204
3258
|
this.recalculate();
|
|
3205
|
-
} })))), h("div", { key: '
|
|
3259
|
+
} })))), h("div", { key: '4282852c39dde81bdf5b54ad8ea4e0a8aefaaf18', class: "space-y-4 p-4 border border-border rounded-4xl", style: {
|
|
3260
|
+
border: "1px solid var(--color-border)",
|
|
3261
|
+
} }, h("h2", { key: '7fcfd93db114602d3c1250c0b9ad5c106e2118d0', class: "text-lg font-semibold text-secondary" }, t.solarSystemForm.resultsTitle), h("div", { key: 'aa0da43f3ef2daf8f9b3bb83e15493300dd3d795', class: "bg-muted rounded-4xl p-4" }, h("div", { key: '82b9f95d27582a7e6fabc92b5f8c4f94a7760773', class: "flex items-center justify-between" }, h("span", { key: 'ac3a20954389eafb4222de55a9c380c6e6911822', class: "text-text-muted" }, t.solarSystemForm.autonomy), h("span", { key: '42573f1d642adc6e7d81c2205d64659fd5690ec6', class: "text-xl font-bold text-secondary" }, this.autonomy > 100
|
|
3206
3262
|
? "100"
|
|
3207
|
-
: this.autonomy.toFixed(1), "%")), h("div", { key: '
|
|
3208
|
-
.savingsDisclaimer))), h("span", { key: '
|
|
3209
|
-
.solarSystemForm.year)), h("div", { key: '
|
|
3263
|
+
: this.autonomy.toFixed(1), "%")), h("div", { key: '7b7ca03f694682ada5f3156e065ffbebfe8a162e', class: "flex items-center justify-between mt-4" }, h("div", { key: '39f1d25e85ab1f3ff1ab9f06874cb1e3178f1707', class: "flex items-center gap-2" }, h("span", { key: '0c62c76a68fa8532240fe28333c1ce592ddc6787', class: "text-text-muted" }, t.solarSystemForm.costSavings), h("div", { key: 'fc6baa108a6fc38d70562d147488085c17b3376b', class: "relative group" }, h("svg", { key: 'd6806679a14d75f3e9ef72bd3ac352855f8b30ae', 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: '9033bbf13fa59641816338bca9ea3c2272b5dcc0', "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: '1fad5e3281d00c91bdb0a112e98279d5107ed76c', class: "absolute bottom-full left-1/2 transform -translate-x-1/2 mb-2 w-64 p-2 bg-gray-800 text-muted text-sm rounded-lg opacity-0 group-hover:opacity-100 transition-opacity duration-200 pointer-events-none" }, t.solarSystemForm
|
|
3264
|
+
.savingsDisclaimer))), h("span", { key: 'a99bd5d3f22f39fbfce522e6e8b9fa65d1fc1785', class: "text-xl font-bold text-success" }, this.costSavings.toFixed(2), "\u20AC/", t
|
|
3265
|
+
.solarSystemForm.year)), h("div", { key: '8aeb935408cfa36788a5396dd8a0719e93216721', class: "flex items-center justify-between mt-4" }, h("div", { key: 'aa778aabdfe02aeea72ef37a0087cfb03adbef3d', class: "flex items-center gap-2" }, h("span", { key: '4bc1dd985b07e229c3293db4c4f3be74bd885cec', class: "text-text-muted" }, "Einspeiseverg\u00FCtung 25 Jahre")), h("span", { key: '4eb548881579db3bdffcf5c0bcd0630c19b6961e', class: "text-xl font-bold text-success" }, this.compensation25Years.toFixed(2), "\u20AC")), h("div", { key: '00d848e65e0a13d7278ca1cef2a8a6c0810cef08', class: "flex items-center justify-between mt-4" }, h("div", { key: 'e33274627fa4a5d71b35bbc030212810cd1ecc15', class: "flex items-center gap-2" }, h("span", { key: '45fb735ec260bbea7ad6101f7aacac4e7a1f3313', class: "text-text-muted" }, "Geldwerter Vorteil 25 Jahre")), h("span", { key: '2d7bc5f25a4491e00a1985c9bf255abdaef729dd', class: "text-xl font-bold text-success" }, this.savedCosts25Years.toFixed(2), "\u20AC")))), h("div", { key: '603eafb9e819e4a2da8f919c2de5a7e7ed7b6ac9', class: "space-y-4 pt-4" }, h("h2", { key: '50de58cd408c63518a3a1aeebc2168e603f8f537', class: "text-lg font-semibold text-secondary" }, t.solarSystemForm.requestOffer), h("div", { key: 'cc85f1661fba68643d3f043ff51b1c2070e5d32a', class: "grid gap-4" }, h("div", { key: '54040b2ac5cb46fc2bbdabdfb78f1d25fa521b2d', class: "grid grid-cols-2 gap-4" }, h("label", { key: '9404270bfbd58d022fafff6646ff1dbf68352617', class: "block text-sm font-medium text-text-muted mb-1" }, t.solarSystemForm.name), h("label", { key: 'ee3bb80e18b29446630d10f49e94d3ce8e8e3f46', class: "block text-sm font-medium text-text-muted mb-1" }, t.solarSystemForm.email)), h("div", { key: '298da00d7046b6437b175f3eb8859281392d75dd', class: "grid grid-cols-2 gap-4" }, h("div", { key: '31b01646d5370285c8dc0d5470643cd679f1eaee' }, h("input", { key: '27764cb15c5150f8ddd5c50b7559fe807014d021', type: "text", class: `w-full px-4 py-2 rounded-4xl border ${this.nameError
|
|
3210
3266
|
? "border-error"
|
|
3211
3267
|
: "border-border"} focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted text-muted-foreground`, value: this.name, onInput: (e) => {
|
|
3212
3268
|
this.name =
|
|
3213
3269
|
e.target
|
|
3214
3270
|
.value;
|
|
3215
3271
|
this.validateForm();
|
|
3216
|
-
}, placeholder: "Your name" }), this.nameError && (h("p", { key: '
|
|
3272
|
+
}, placeholder: "Your name" }), this.nameError && (h("p", { key: 'fa62eac9fc7f58f4b0505dc8398ae7447524ac4f', class: "text-error text-sm mt-1" }, this.nameError))), h("div", { key: '936b2091fc5f889f7c98f3bbe9c783ebfcf97030' }, h("input", { key: 'd7f4bf93bee30c5dc47c14143c527be562ccdbfd', type: "email", class: `w-full px-4 py-2 rounded-4xl border ${this.emailError
|
|
3217
3273
|
? "border-error"
|
|
3218
3274
|
: "border-border"} focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted text-muted-foreground`, value: this.email, onInput: (e) => {
|
|
3219
3275
|
this.email =
|
|
3220
3276
|
e.target
|
|
3221
3277
|
.value;
|
|
3222
3278
|
this.validateForm();
|
|
3223
|
-
}, placeholder: "your.email@example.com" }), this.emailError && (h("p", { key: '
|
|
3279
|
+
}, placeholder: "your.email@example.com" }), this.emailError && (h("p", { key: '32c8ca2e1de772c5c2072f52827393e0aad287f2', class: "text-error text-sm mt-1" }, this.emailError))))), h("div", { key: '5ac2456b1e783e86d21405db8b34ee22ad5e88f3', class: "flex justify-center" }, h("button", { key: 'f4b4e6d7490e01a29e4065747fe64dec7ca06f37', onClick: () => this.handleRequestOffer(), disabled: !this.name.trim() ||
|
|
3224
3280
|
!this.email.trim() || !!this.nameError ||
|
|
3225
3281
|
!!this.emailError, class: "px-4 py-2 bg-secondary rounded-4xl hover:bg-tertiary transition-colors duration-200 text-muted" }, t.solarSystemForm.requestOfferButton))))));
|
|
3226
3282
|
}
|