@screenly/edge-apps 0.0.1 → 0.0.3

package/dist/assets/images/icons/chancesleet.svg

@@ -0,0 +1,4 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M38.6202 23.2384C38.6202 20.4784 36.4002 18.3184 33.7002 18.3184C33.1002 18.3184 32.5602 18.4384 32.0202 18.6184C31.8402 16.5784 30.1602 14.8984 28.0602 14.8984C25.8402 14.8984 24.0402 16.6984 24.0402 18.9184C24.0402 19.3984 24.1602 19.8784 24.2802 20.2984C24.1002 20.2384 23.8602 20.2384 23.6802 20.2384C21.4602 20.2384 19.6602 22.0384 19.6602 24.2584C19.6602 26.4184 21.4002 28.2184 23.5602 28.2784H33.8802C36.5202 27.9784 38.6202 25.8784 38.6202 23.2384Z" fill="white" stroke="white" stroke-width="0.72" stroke-linejoin="round"/>
+<path d="M47.7001 34.4C47.7001 29.8 44.0001 26.2 39.5001 26.2C38.5001 26.2 37.6001 26.4 36.7001 26.7C36.4001 23.3 33.6001 20.5 30.1001 20.5C26.4001 20.5 23.4001 23.5 23.4001 27.2C23.4001 28 23.6001 28.8 23.8001 29.5C23.5001 29.4 23.1001 29.4 22.8001 29.4C19.1001 29.4 16.1001 32.4 16.1001 36.1C16.1001 39.7 19.0001 42.7 22.6001 42.8H39.8001C44.2001 42.3 47.7001 38.8 47.7001 34.4Z" fill="white" stroke="white" stroke-width="1.2" stroke-linejoin="round"/>
+</svg>

package/dist/assets/images/icons/clear-night.svg

@@ -0,0 +1,5 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M23.3 21.5L24 22.7L25.2 23.3L24 24L23.3 25.2L22.7 24L21.5 23.3L22.7 22.7L23.3 21.5Z" fill="#FFA500"/>
+<path d="M43.3 31.5L44 32.7L45.2 33.3L44 34L43.3 35.2L42.7 34L41.5 33.3L42.7 32.7L43.3 31.5Z" fill="#FFA500"/>
+<path d="M34.5 33.1992C34.5 29.4992 36.5 26.2992 39.5 24.4992C38 23.5992 36.3 23.1992 34.5 23.1992C29 23.1992 24.5 27.6992 24.5 33.1992C24.5 38.6992 29 43.1992 34.5 43.1992C36.3 43.1992 38 42.6992 39.5 41.8992C36.5 40.1992 34.5 36.8992 34.5 33.1992Z" fill="#FFA500" stroke="#FFA500" stroke-width="2" stroke-linejoin="round"/>
+</svg>

package/dist/assets/images/icons/clear.svg

@@ -0,0 +1,11 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M32 41V44" stroke="#FFA500" stroke-width="2" stroke-linecap="round"/>
+<path d="M25.636 38.3633L23.5147 40.4846" stroke="#FFA500" stroke-width="2" stroke-linecap="round"/>
+<path d="M23 32H20" stroke="#FFA500" stroke-width="2" stroke-linecap="round"/>
+<path d="M25.636 25.6367L23.5147 23.5154" stroke="#FFA500" stroke-width="2" stroke-linecap="round"/>
+<path d="M32 23V20" stroke="#FFA500" stroke-width="2" stroke-linecap="round"/>
+<path d="M38.364 25.6367L40.4853 23.5154" stroke="#FFA500" stroke-width="2" stroke-linecap="round"/>
+<path d="M41 32H44" stroke="#FFA500" stroke-width="2" stroke-linecap="round"/>
+<path d="M38.364 38.3633L40.4853 40.4846" stroke="#FFA500" stroke-width="2" stroke-linecap="round"/>
+<path d="M32 37C34.7614 37 37 34.7614 37 32C37 29.2386 34.7614 27 32 27C29.2386 27 27 29.2386 27 32C27 34.7614 29.2386 37 32 37Z" fill="#FFA500" stroke="#FFA500" stroke-width="2"/>
+</svg>

package/dist/assets/images/icons/cloudy.svg

@@ -0,0 +1,4 @@
+<svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M77.2403 46.4798C77.2403 40.9598 72.8003 36.6398 67.4003 36.6398C66.2003 36.6398 65.1203 36.8798 64.0403 37.2398C63.6803 33.1598 60.3203 29.7998 56.1203 29.7998C51.6803 29.7998 48.0803 33.3998 48.0803 37.8398C48.0803 38.7998 48.3203 39.7598 48.5603 40.5998C48.2003 40.4798 47.7203 40.4798 47.3603 40.4798C42.9203 40.4798 39.3203 44.0798 39.3203 48.5198C39.3203 52.8398 42.8003 56.4398 47.1203 56.5598H67.7603C73.0403 55.9598 77.2403 51.7598 77.2403 46.4798Z" fill="white" stroke="white" stroke-width="1.44" stroke-linejoin="round"/>
+<path d="M95.4002 68.8C95.4002 59.6 88.0002 52.4 79.0002 52.4C77.0002 52.4 75.2002 52.8 73.4002 53.4C72.8002 46.6 67.2002 41 60.2002 41C52.8002 41 46.8002 47 46.8002 54.4C46.8002 56 47.2002 57.6 47.6002 59C47.0002 58.8 46.2002 58.8 45.6002 58.8C38.2002 58.8 32.2002 64.8 32.2002 72.2C32.2002 79.4 38.0002 85.4 45.2002 85.6H79.6002C88.4002 84.6 95.4002 77.6 95.4002 68.8Z" fill="white" stroke="white" stroke-width="2.4" stroke-linejoin="round"/>
+</svg>

package/dist/assets/images/icons/drizzle.svg

@@ -0,0 +1,5 @@
+<svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M95.4002 68.8C95.4002 59.6 88.0002 52.4 79.0002 52.4C77.0002 52.4 75.2002 52.8 73.4002 53.4C72.8002 46.6 67.2002 41 60.2002 41C52.8002 41 46.8002 47 46.8002 54.4C46.8002 56 47.2002 57.6 47.6002 59C47.0002 58.8 46.2002 58.8 45.6002 58.8C38.2002 58.8 32.2002 64.8 32.2002 72.2C32.2002 79.4 38.0002 85.4 45.2002 85.6H79.6002C88.4002 84.6 95.4002 77.6 95.4002 68.8Z" fill="white" stroke="white" stroke-width="2.4" stroke-linejoin="round"/>
+<path d="M55.8359 91.8867L53.0576 107.644" stroke="white" stroke-width="4" stroke-linecap="round" stroke-dasharray="8 14"/>
+<path d="M68.3477 90.0312L65.5693 105.788" stroke="white" stroke-width="4" stroke-linecap="round" stroke-dasharray="8 14"/>
+</svg>

package/dist/assets/images/icons/fewdrops.svg

@@ -0,0 +1,4 @@
+<svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M95.4002 68.8C95.4002 59.6 88.0002 52.4 79.0002 52.4C77.0002 52.4 75.2002 52.8 73.4002 53.4C72.8002 46.6 67.2002 41 60.2002 41C52.8002 41 46.8002 47 46.8002 54.4C46.8002 56 47.2002 57.6 47.6002 59C47.0002 58.8 46.2002 58.8 45.6002 58.8C38.2002 58.8 32.2002 64.8 32.2002 72.2C32.2002 79.4 38.0002 85.4 45.2002 85.6H79.6002C88.4002 84.6 95.4002 77.6 95.4002 68.8Z" fill="white" stroke="white" stroke-width="2.4" stroke-linejoin="round"/>
+<path d="M61.835 89.8857L59.0566 105.643" stroke="white" stroke-width="4" stroke-linecap="round" stroke-dasharray="8 14"/>
+</svg>

package/dist/assets/images/icons/fog.svg

@@ -0,0 +1,6 @@
+<svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M95.2 59.8C95.2 50.6 87.8 43.4 78.8 43.4C76.8 43.4 75 43.8 73.2 44.4C72.6 37.6 67 32 60 32C52.6 32 46.6 38 46.6 45.4C46.6 47 47 48.6 47.4 50C46.8 49.8 46 49.8 45.4 49.8C38 49.8 32 55.8 32 63.2C32 70.4 37.8 76.4 45 76.6H79.4C88.2 75.6 95.2 68.6 95.2 59.8Z" fill="white" stroke="white" stroke-width="2.4" stroke-linejoin="round"/>
+<path d="M34 84C53 84.0032 81 83.9987 91 84.0013" stroke="white" stroke-width="3" stroke-linecap="round"/>
+<path d="M34 92C44.6667 92.0032 60.386 91.9987 66 92.0013" stroke="white" stroke-width="3" stroke-linecap="round"/>
+<path d="M34 100C44.6667 100.003 60.386 99.9987 66 100.001" stroke="white" stroke-width="3" stroke-linecap="round"/>
+</svg>

package/dist/assets/images/icons/haze.svg

@@ -0,0 +1,6 @@
+<svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M95.2 59.8C95.2 50.6 87.8 43.4 78.8 43.4C76.8 43.4 75 43.8 73.2 44.4C72.6 37.6 67 32 60 32C52.6 32 46.6 38 46.6 45.4C46.6 47 47 48.6 47.4 50C46.8 49.8 46 49.8 45.4 49.8C38 49.8 32 55.8 32 63.2C32 70.4 37.8 76.4 45 76.6H79.4C88.2 75.6 95.2 68.6 95.2 59.8Z" fill="white" stroke="white" stroke-width="2.4" stroke-linejoin="round"/>
+<path d="M34 84C53 84.0032 81 83.9987 91 84.0013" stroke="white" stroke-width="3" stroke-linecap="round"/>
+<path d="M34 92C44.6667 92.0032 60.386 91.9987 66 92.0013" stroke="white" stroke-width="3" stroke-linecap="round"/>
+<path d="M34 100C44.6667 100.003 60.386 99.9987 66 100.001" stroke="white" stroke-width="3" stroke-linecap="round"/>
+</svg>

package/dist/assets/images/icons/mostly-cloudy-night.svg

@@ -0,0 +1,7 @@
+<svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M77.2804 30.4004L78.4004 32.3204L80.3204 33.2804L78.4004 34.4004L77.2804 36.3204L76.3204 34.4004L74.4004 33.2804L76.3204 32.3204L77.2804 30.4004Z" fill="#FFA500"/>
+<path d="M109.28 46.4004L110.4 48.3204L112.32 49.2804L110.4 50.4004L109.28 52.3204L108.32 50.4004L106.4 49.2804L108.32 48.3204L109.28 46.4004Z" fill="#FFA500"/>
+<path d="M95.2002 49.1211C95.2002 43.2011 98.4002 38.0811 103.2 35.2011C100.8 33.7611 98.0802 33.1211 95.2002 33.1211C86.4002 33.1211 79.2002 40.3211 79.2002 49.1211C79.2002 57.9211 86.4002 65.1211 95.2002 65.1211C98.0802 65.1211 100.8 64.3211 103.2 63.0411C98.4002 60.3211 95.2002 55.0411 95.2002 49.1211Z" fill="#FFA500" stroke="#FFA500" stroke-width="3.2" stroke-linejoin="round"/>
+<path d="M89.3453 49.9481C89.3453 43.3472 84.0359 38.1813 77.5785 38.1813C76.1435 38.1813 74.852 38.4683 73.5605 38.8988C73.13 34.0199 69.1121 30.002 64.0897 30.002C58.7803 30.002 54.4753 34.3069 54.4753 39.6163C54.4753 40.7643 54.7623 41.9123 55.0493 42.9168C54.6188 42.7733 54.0448 42.7733 53.6143 42.7733C48.3049 42.7733 44 47.0782 44 52.3876C44 57.5535 48.1614 61.8585 53.3274 62.002H78.009C84.3229 61.2845 89.3453 56.262 89.3453 49.9481Z" fill="white" stroke="white" stroke-width="1.72197" stroke-linejoin="round"/>
+<path d="M95.4002 68.802C95.4002 59.602 88.0002 52.402 79.0002 52.402C77.0002 52.402 75.2002 52.802 73.4002 53.402C72.8002 46.602 67.2002 41.002 60.2002 41.002C52.8002 41.002 46.8002 47.002 46.8002 54.402C46.8002 56.002 47.2002 57.602 47.6002 59.002C47.0002 58.802 46.2002 58.802 45.6002 58.802C38.2002 58.802 32.2002 64.802 32.2002 72.202C32.2002 79.402 38.0002 85.402 45.2002 85.602H79.6002C88.4002 84.602 95.4002 77.602 95.4002 68.802Z" fill="white" stroke="white" stroke-width="2.4" stroke-linejoin="round"/>
+</svg>

package/dist/assets/images/icons/mostly-cloudy.svg

@@ -0,0 +1,13 @@
+<svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M48 74V80" stroke="#FFA500" stroke-width="4" stroke-linecap="round"/>
+<path d="M35.2725 68.7285L31.0298 72.9712" stroke="#FFA500" stroke-width="4" stroke-linecap="round"/>
+<path d="M30 56H24" stroke="#FFA500" stroke-width="4" stroke-linecap="round"/>
+<path d="M35.2725 43.2715L31.0298 39.0288" stroke="#FFA500" stroke-width="4" stroke-linecap="round"/>
+<path d="M48 38V32" stroke="#FFA500" stroke-width="4" stroke-linecap="round"/>
+<path d="M60.7275 43.2715L64.9702 39.0288" stroke="#FFA500" stroke-width="4" stroke-linecap="round"/>
+<path d="M66 56H72" stroke="#FFA500" stroke-width="4" stroke-linecap="round"/>
+<path d="M60.7275 68.7285L64.9702 72.9712" stroke="#FFA500" stroke-width="4" stroke-linecap="round"/>
+<path d="M48 66C53.5228 66 58 61.5228 58 56C58 50.4772 53.5228 46 48 46C42.4772 46 38 50.4772 38 56C38 61.5228 42.4772 66 48 66Z" fill="#FFA500" stroke="#FFA500" stroke-width="4"/>
+<path d="M85.0401 58.68C85.0401 53.16 80.6001 48.84 75.2001 48.84C74.0001 48.84 72.9201 49.08 71.8401 49.44C71.4801 45.36 68.1201 42 63.9201 42C59.4801 42 55.8801 45.6 55.8801 50.04C55.8801 51 56.1201 51.96 56.3601 52.8C56.0001 52.68 55.5201 52.68 55.1601 52.68C50.7201 52.68 47.1201 56.28 47.1201 60.72C47.1201 65.04 50.6001 68.64 54.9201 68.76H75.5601C80.8401 68.16 85.0401 63.96 85.0401 58.68Z" fill="white" stroke="white" stroke-width="1.44" stroke-linejoin="round"/>
+<path d="M103.2 81.0002C103.2 71.8002 95.8 64.6002 86.8 64.6002C84.8 64.6002 83 65.0002 81.2 65.6002C80.6 58.8002 75 53.2002 68 53.2002C60.6 53.2002 54.6 59.2002 54.6 66.6002C54.6 68.2002 55 69.8002 55.4 71.2002C54.8 71.0002 54 71.0002 53.4 71.0002C46 71.0002 40 77.0002 40 84.4002C40 91.6002 45.8 97.6002 53 97.8002H87.4C96.2 96.8002 103.2 89.8002 103.2 81.0002Z" fill="white" stroke="white" stroke-width="2.4" stroke-linejoin="round"/>
+</svg>

package/dist/assets/images/icons/partially-cloudy-night.svg

@@ -0,0 +1,6 @@
+<svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M77.2804 30.4004L78.4004 32.3204L80.3204 33.2804L78.4004 34.4004L77.2804 36.3204L76.3204 34.4004L74.4004 33.2804L76.3204 32.3204L77.2804 30.4004Z" fill="#FFA500"/>
+<path d="M109.28 46.4004L110.4 48.3204L112.32 49.2804L110.4 50.4004L109.28 52.3204L108.32 50.4004L106.4 49.2804L108.32 48.3204L109.28 46.4004Z" fill="#FFA500"/>
+<path d="M95.2002 49.1211C95.2002 43.2011 98.4002 38.0811 103.2 35.2011C100.8 33.7611 98.0802 33.1211 95.2002 33.1211C86.4002 33.1211 79.2002 40.3211 79.2002 49.1211C79.2002 57.9211 86.4002 65.1211 95.2002 65.1211C98.0802 65.1211 100.8 64.3211 103.2 63.0411C98.4002 60.3211 95.2002 55.0411 95.2002 49.1211Z" fill="#FFA500" stroke="#FFA500" stroke-width="3.2" stroke-linejoin="round"/>
+<path d="M95.4002 68.8C95.4002 59.6 88.0002 52.4 79.0002 52.4C77.0002 52.4 75.2002 52.8 73.4002 53.4C72.8002 46.6 67.2002 41 60.2002 41C52.8002 41 46.8002 47 46.8002 54.4C46.8002 56 47.2002 57.6 47.6002 59C47.0002 58.8 46.2002 58.8 45.6002 58.8C38.2002 58.8 32.2002 64.8 32.2002 72.2C32.2002 79.4 38.0002 85.4 45.2002 85.6H79.6002C88.4002 84.6 95.4002 77.6 95.4002 68.8Z" fill="white" stroke="white" stroke-width="2.4" stroke-linejoin="round"/>
+</svg>

package/dist/assets/images/icons/partially-cloudy.svg

@@ -0,0 +1,12 @@
+<svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M40 70V76" stroke="#FFA500" stroke-width="4" stroke-linecap="round"/>
+<path d="M27.2725 64.7285L23.0298 68.9712" stroke="#FFA500" stroke-width="4" stroke-linecap="round"/>
+<path d="M22 52H16" stroke="#FFA500" stroke-width="4" stroke-linecap="round"/>
+<path d="M27.2725 39.2715L23.0298 35.0288" stroke="#FFA500" stroke-width="4" stroke-linecap="round"/>
+<path d="M40 34V28" stroke="#FFA500" stroke-width="4" stroke-linecap="round"/>
+<path d="M52.7275 39.2715L56.9702 35.0288" stroke="#FFA500" stroke-width="4" stroke-linecap="round"/>
+<path d="M58 52H64" stroke="#FFA500" stroke-width="4" stroke-linecap="round"/>
+<path d="M52.7275 64.7285L56.9702 68.9712" stroke="#FFA500" stroke-width="4" stroke-linecap="round"/>
+<path d="M40 62C45.5228 62 50 57.5228 50 52C50 46.4772 45.5228 42 40 42C34.4772 42 30 46.4772 30 52C30 57.5228 34.4772 62 40 62Z" fill="#FFA500" stroke="#FFA500" stroke-width="4"/>
+<path d="M95.4002 68.8C95.4002 59.6 88.0002 52.4 79.0002 52.4C77.0002 52.4 75.2002 52.8 73.4002 53.4C72.8002 46.6 67.2002 41 60.2002 41C52.8002 41 46.8002 47 46.8002 54.4C46.8002 56 47.2002 57.6 47.6002 59C47.0002 58.8 46.2002 58.8 45.6002 58.8C38.2002 58.8 32.2002 64.8 32.2002 72.2C32.2002 79.4 38.0002 85.4 45.2002 85.6H79.6002C88.4002 84.6 95.4002 77.6 95.4002 68.8Z" fill="white" stroke="white" stroke-width="2.4" stroke-linejoin="round"/>
+</svg>

package/dist/assets/images/icons/partlysunny.svg

@@ -0,0 +1,6 @@
+<svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M77.2804 30.4004L78.4004 32.3204L80.3204 33.2804L78.4004 34.4004L77.2804 36.3204L76.3204 34.4004L74.4004 33.2804L76.3204 32.3204L77.2804 30.4004Z" fill="#FFA500"/>
+<path d="M109.28 46.4004L110.4 48.3204L112.32 49.2804L110.4 50.4004L109.28 52.3204L108.32 50.4004L106.4 49.2804L108.32 48.3204L109.28 46.4004Z" fill="#FFA500"/>
+<path d="M95.2002 49.1211C95.2002 43.2011 98.4002 38.0811 103.2 35.2011C100.8 33.7611 98.0802 33.1211 95.2002 33.1211C86.4002 33.1211 79.2002 40.3211 79.2002 49.1211C79.2002 57.9211 86.4002 65.1211 95.2002 65.1211C98.0802 65.1211 100.8 64.3211 103.2 63.0411C98.4002 60.3211 95.2002 55.0411 95.2002 49.1211Z" fill="#FFA500" stroke="#FFA500" stroke-width="3.2" stroke-linejoin="round"/>
+<path d="M95.4002 68.8C95.4002 59.6 88.0002 52.4 79.0002 52.4C77.0002 52.4 75.2002 52.8 73.4002 53.4C72.8002 46.6 67.2002 41 60.2002 41C52.8002 41 46.8002 47 46.8002 54.4C46.8002 56 47.2002 57.6 47.6002 59C47.0002 58.8 46.2002 58.8 45.6002 58.8C38.2002 58.8 32.2002 64.8 32.2002 72.2C32.2002 79.4 38.0002 85.4 45.2002 85.6H79.6002C88.4002 84.6 95.4002 77.6 95.4002 68.8Z" fill="white" stroke="white" stroke-width="2.4" stroke-linejoin="round"/>
+</svg>

package/dist/assets/images/icons/rain-night.svg

@@ -0,0 +1,8 @@
+<svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M77.2804 30.3999L78.4004 32.3199L80.3204 33.2799L78.4004 34.3999L77.2804 36.3199L76.3204 34.3999L74.4004 33.2799L76.3204 32.3199L77.2804 30.3999Z" fill="#FFA500"/>
+<path d="M109.28 46.3999L110.4 48.3199L112.32 49.2799L110.4 50.3999L109.28 52.3199L108.32 50.3999L106.4 49.2799L108.32 48.3199L109.28 46.3999Z" fill="#FFA500"/>
+<path d="M95.2002 49.1201C95.2002 43.2001 98.4002 38.0801 103.2 35.2001C100.8 33.7601 98.0802 33.1201 95.2002 33.1201C86.4002 33.1201 79.2002 40.3201 79.2002 49.1201C79.2002 57.9201 86.4002 65.1201 95.2002 65.1201C98.0802 65.1201 100.8 64.3201 103.2 63.0401C98.4002 60.3201 95.2002 55.0401 95.2002 49.1201Z" fill="#FFA500" stroke="#FFA500" stroke-width="3.2" stroke-linejoin="round"/>
+<path d="M95.4002 68.8C95.4002 59.6 88.0002 52.4 79.0002 52.4C77.0002 52.4 75.2002 52.8 73.4002 53.4C72.8002 46.6 67.2002 41 60.2002 41C52.8002 41 46.8002 47 46.8002 54.4C46.8002 56 47.2002 57.6 47.6002 59C47.0002 58.8 46.2002 58.8 45.6002 58.8C38.2002 58.8 32.2002 64.8 32.2002 72.2C32.2002 79.4 38.0002 85.4 45.2002 85.6H79.6002C88.4002 84.6 95.4002 77.6 95.4002 68.8Z" fill="white" stroke="white" stroke-width="2.4" stroke-linejoin="round"/>
+<path d="M56.7783 91.9395L53.9999 107.696" stroke="white" stroke-width="4" stroke-linecap="round" stroke-dasharray="8 14"/>
+<path d="M69.29 90.084L66.5117 105.841" stroke="white" stroke-width="4" stroke-linecap="round" stroke-dasharray="8 14"/>
+</svg>

package/dist/assets/images/icons/rainy.svg

@@ -0,0 +1,6 @@
+<svg width="112" height="112" viewBox="0 0 112 112" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M87.4002 49.0002C87.4002 39.8002 80.0002 32.6002 71.0002 32.6002C69.0002 32.6002 67.2002 33.0002 65.4002 33.6002C64.8002 26.8002 59.2002 21.2002 52.2002 21.2002C44.8002 21.2002 38.8002 27.2002 38.8002 34.6002C38.8002 36.2002 39.2002 37.8002 39.6002 39.2002C39.0002 39.0002 38.2002 39.0002 37.6002 39.0002C30.2002 39.0002 24.2002 45.0002 24.2002 52.4002C24.2002 59.6002 30.0002 65.6002 37.2002 65.8002H71.6002C80.4002 64.8002 87.4002 57.8002 87.4002 49.0002Z" fill="white" stroke="white" stroke-width="2.4" stroke-linejoin="round"/>
+<path d="M45.7744 72.7803L42.996 88.5372" stroke="white" stroke-width="4" stroke-linecap="round" stroke-dasharray="8 8"/>
+<path d="M54.3477 70.2305L51.5693 85.9874" stroke="white" stroke-width="4" stroke-linecap="round" stroke-dasharray="8 8"/>
+<path d="M61.8779 73.5889L59.0996 89.3458" stroke="white" stroke-width="4" stroke-linecap="round" stroke-dasharray="8 8"/>
+</svg>

package/dist/assets/images/icons/sleet-night.svg

@@ -0,0 +1,14 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M34.54 15L35.1 15.96L36.06 16.44L35.1 17L34.54 17.96L34.06 17L33.1 16.44L34.06 15.96L34.54 15Z" fill="#FFA500"/>
+<path d="M50.54 23L51.1 23.96L52.06 24.44L51.1 25L50.54 25.96L50.06 25L49.1 24.44L50.06 23.96L50.54 23Z" fill="#FFA500"/>
+<path d="M43.5 24.36C43.5 21.4 45.1 18.84 47.5 17.4C46.3 16.68 44.94 16.36 43.5 16.36C39.1 16.36 35.5 19.96 35.5 24.36C35.5 28.76 39.1 32.36 43.5 32.36C44.94 32.36 46.3 31.96 47.5 31.32C45.1 29.96 43.5 27.32 43.5 24.36Z" fill="#FFA500" stroke="#FFA500" stroke-width="1.6" stroke-linejoin="round"/>
+<path d="M42.6 33.9C42.6 29.3 38.9 25.7 34.4 25.7C33.4 25.7 32.5 25.9 31.6 26.2C31.3 22.8 28.5 20 25 20C21.3 20 18.3 23 18.3 26.7C18.3 27.5 18.5 28.3 18.7 29C18.4 28.9 18 28.9 17.7 28.9C14 28.9 11 31.9 11 35.6C11 39.2 13.9 42.2 17.5 42.3H34.7C39.1 41.8 42.6 38.3 42.6 33.9Z" fill="white" stroke="white" stroke-width="1.2" stroke-linejoin="round"/>
+<path d="M21.9 44V49" stroke="white" stroke-width="1.2" stroke-linecap="round"/>
+<path d="M23.6678 44.7322L20.1323 48.2678" stroke="white" stroke-linecap="round"/>
+<path d="M24.4 46.5H19.4" stroke="white" stroke-linecap="round"/>
+<path d="M23.6678 48.2678L20.1323 44.7322" stroke="white" stroke-linecap="round"/>
+<path d="M30.9 44V49" stroke="white" stroke-width="1.2" stroke-linecap="round"/>
+<path d="M32.6678 44.7322L29.1323 48.2678" stroke="white" stroke-linecap="round"/>
+<path d="M33.4 46.5H28.4" stroke="white" stroke-linecap="round"/>
+<path d="M32.6678 48.2678L29.1323 44.7322" stroke="white" stroke-linecap="round"/>
+</svg>

package/dist/assets/images/icons/sleet.svg

@@ -0,0 +1,4 @@
+<svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M95.4002 68.8C95.4002 59.6 88.0002 52.4 79.0002 52.4C77.0002 52.4 75.2002 52.8 73.4002 53.4C72.8002 46.6 67.2002 41 60.2002 41C52.8002 41 46.8002 47 46.8002 54.4C46.8002 56 47.2002 57.6 47.6002 59C47.0002 58.8 46.2002 58.8 45.6002 58.8C38.2002 58.8 32.2002 64.8 32.2002 72.2C32.2002 79.4 38.0002 85.4 45.2002 85.6H79.6002C88.4002 84.6 95.4002 77.6 95.4002 68.8Z" fill="white" stroke="white" stroke-width="2.4" stroke-linejoin="round"/>
+<path d="M61.835 89.8857L59.0566 105.643" stroke="white" stroke-width="4" stroke-linecap="round" stroke-dasharray="8 14"/>
+</svg>

package/dist/assets/images/icons/snow.svg

@@ -0,0 +1,19 @@
+<svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M95.2 53.8C95.2 44.6 87.8 37.4 78.8 37.4C76.8 37.4 75 37.8 73.2 38.4C72.6 31.6 67 26 60 26C52.6 26 46.6 32 46.6 39.4C46.6 41 47 42.6 47.4 44C46.8 43.8 46 43.8 45.4 43.8C38 43.8 32 49.8 32 57.2C32 64.4 37.8 70.4 45 70.6H79.4C88.2 69.6 95.2 62.6 95.2 53.8Z" fill="white" stroke="white" stroke-width="2.4" stroke-linejoin="round"/>
+<path d="M61.7998 74V84" stroke="white" stroke-width="2.4" stroke-linecap="round"/>
+<path d="M65.335 75.4644L58.2639 82.5354" stroke="white" stroke-width="2" stroke-linecap="round"/>
+<path d="M66.7998 79H56.7998" stroke="white" stroke-width="2" stroke-linecap="round"/>
+<path d="M65.335 82.5356L58.2639 75.4646" stroke="white" stroke-width="2" stroke-linecap="round"/>
+<path d="M80.7998 83V93" stroke="white" stroke-width="2.4" stroke-linecap="round"/>
+<path d="M84.335 84.4644L77.2639 91.5354" stroke="white" stroke-width="2" stroke-linecap="round"/>
+<path d="M85.7998 88H75.7998" stroke="white" stroke-width="2" stroke-linecap="round"/>
+<path d="M84.335 91.5356L77.2639 84.4646" stroke="white" stroke-width="2" stroke-linecap="round"/>
+<path d="M56.7998 93V103" stroke="white" stroke-width="2.4" stroke-linecap="round"/>
+<path d="M60.335 94.4644L53.2639 101.535" stroke="white" stroke-width="2" stroke-linecap="round"/>
+<path d="M61.7998 98H51.7998" stroke="white" stroke-width="2" stroke-linecap="round"/>
+<path d="M60.335 101.536L53.2639 94.4646" stroke="white" stroke-width="2" stroke-linecap="round"/>
+<path d="M40.7998 77V87" stroke="white" stroke-width="2.4" stroke-linecap="round"/>
+<path d="M44.335 78.4644L37.2639 85.5354" stroke="white" stroke-width="2" stroke-linecap="round"/>
+<path d="M45.7998 82H35.7998" stroke="white" stroke-width="2" stroke-linecap="round"/>
+<path d="M44.335 85.5356L37.2639 78.4646" stroke="white" stroke-width="2" stroke-linecap="round"/>
+</svg>

package/dist/assets/images/icons/thunderstorm-night.svg

@@ -0,0 +1,9 @@
+<svg width="64" height="82" viewBox="0 0 64 82" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M22.3545 10.4052L24.2845 11.508L26.4272 11.3794L25.3245 13.3093L25.3145 15.5321L23.5231 14.3493L21.3004 14.3394L22.4831 12.548L22.3545 10.4052Z" fill="#FFA500"/>
+<path d="M58.0674 8.26166L59.9973 9.36443L62.1401 9.23581L61.0373 11.1658L61.0274 13.3885L59.236 12.2058L57.0132 12.1958L58.196 10.4044L58.0674 8.26166Z" fill="#FFA500"/>
+<path d="M47.2334 17.6572C44.2734 12.5303 44.4846 6.49627 47.2016 1.60211C44.4031 1.55504 41.7275 2.36078 39.2334 3.80078C31.6123 8.20078 28.977 18.0362 33.377 25.6572C37.777 33.2782 47.6123 35.9136 55.2334 31.5136C57.7275 30.0736 59.6831 28.0208 61.1216 25.7123C55.6046 25.7567 50.1934 22.7841 47.2334 17.6572Z" fill="#FFA500" stroke="#FFA500" stroke-width="3.2" stroke-linejoin="round"/>
+<path d="M57.0135 38.479C57.0135 31.053 51.0404 25.2413 43.7758 25.2413C42.1614 25.2413 40.7085 25.5642 39.2556 26.0485C38.7713 20.5597 34.2511 16.0396 28.6009 16.0396C22.6278 16.0396 17.7848 20.8826 17.7848 26.8557C17.7848 28.1472 18.1076 29.4387 18.4305 30.5687C17.9462 30.4073 17.3004 30.4073 16.8161 30.4073C10.843 30.4073 6 35.2503 6 41.2234C6 47.0351 10.6816 51.8781 16.4933 52.0396H44.2601C51.3632 51.2324 57.0135 45.5822 57.0135 38.479Z" fill="white" stroke="white" stroke-width="2.4" stroke-linejoin="round"/>
+<path d="M24.1277 46.0396H36L28.1489 60.0281H35.617L18.766 80.0396L25.2766 65.0796H18L24.1277 46.0396Z" fill="#FFA500" stroke="white" stroke-width="2.4"/>
+<path d="M10.7783 60.0396L7.99995 75.7965" stroke="white" stroke-width="4" stroke-linecap="round" stroke-dasharray="8 14"/>
+<path d="M44.7783 62.0396L41.9999 77.7965" stroke="white" stroke-width="4" stroke-linecap="round" stroke-dasharray="8 14"/>
+</svg>

package/dist/assets/images/icons/thunderstorm.svg

@@ -0,0 +1,7 @@
+<svg width="66" height="79" viewBox="0 0 66 79" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M46.2403 17.4002C46.2403 11.8802 41.8003 7.56022 36.4003 7.56022C35.2003 7.56022 34.1203 7.80022 33.0403 8.16022C32.6803 4.08022 29.3203 0.720215 25.1203 0.720215C20.6803 0.720215 17.0803 4.32022 17.0803 8.76021C17.0803 9.72021 17.3203 10.6802 17.5603 11.5202C17.2003 11.4002 16.7203 11.4002 16.3603 11.4002C11.9203 11.4002 8.32031 15.0002 8.32031 19.4402C8.32031 23.7602 11.8003 27.3602 16.1203 27.4802H36.7603C42.0403 26.8802 46.2403 22.6802 46.2403 17.4002Z" fill="white" stroke="white" stroke-width="1.44" stroke-linejoin="round"/>
+<path d="M64.4002 35.7204C64.4002 26.5204 57.0002 19.3204 48.0002 19.3204C46.0002 19.3204 44.2002 19.7204 42.4002 20.3204C41.8002 13.5204 36.2002 7.92041 29.2002 7.92041C21.8002 7.92041 15.8002 13.9204 15.8002 21.3204C15.8002 22.9204 16.2002 24.5204 16.6002 25.9204C16.0002 25.7204 15.2002 25.7204 14.6002 25.7204C7.20019 25.7204 1.2002 31.7204 1.2002 39.1204C1.2002 46.3204 7.0002 52.3204 14.2002 52.5204H48.6002C57.4002 51.5204 64.4002 44.5204 64.4002 35.7204Z" fill="white" stroke="white" stroke-width="2.4" stroke-linejoin="round"/>
+<path d="M25.3206 35.9604H40.2006L30.3606 53.2404H39.7206L18.6006 77.9604L26.7606 59.4804H17.6406L25.3206 35.9604Z" fill="#FFA500" stroke="white" stroke-width="2.4"/>
+<path d="M11.9785 56.7202L9.20014 72.4771" stroke="white" stroke-width="4" stroke-linecap="round" stroke-dasharray="8 14"/>
+<path d="M45.9785 58.7202L43.2001 74.4771" stroke="white" stroke-width="4" stroke-linecap="round" stroke-dasharray="8 14"/>
+</svg>

package/dist/assets/images/icons/windy.svg

@@ -0,0 +1,6 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M47.6 29.9C47.6 25.3 43.9 21.7 39.4 21.7C38.4 21.7 37.5 21.9 36.6 22.2C36.3 18.8 33.5 16 30 16C26.3 16 23.3 19 23.3 22.7C23.3 23.5 23.5 24.3 23.7 25C23.4 24.9 23 24.9 22.7 24.9C19 24.9 16 27.9 16 31.6C16 35.2 18.9 38.2 22.5 38.3H39.7C44.1 37.8 47.6 34.3 47.6 29.9Z" fill="white" stroke="white" stroke-width="1.2" stroke-linejoin="round"/>
+<path d="M17 42C26.5 42.0016 40.5 41.9994 45.5 42.0006" stroke="white" stroke-width="1.5" stroke-linecap="round"/>
+<path d="M17 46C22.3333 46.0016 30.193 45.9994 33 46.0006" stroke="white" stroke-width="1.5" stroke-linecap="round"/>
+<path d="M17 50C22.3333 50.0016 30.193 49.9994 33 50.0006" stroke="white" stroke-width="1.5" stroke-linecap="round"/>
+</svg>

package/dist/assets/images/screenly.svg

@@ -0,0 +1,10 @@
+<svg width="218" height="300" viewBox="0 0 218 300" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M48.2146 202.146L8.53003 179.242L8.50701 179.219C3.44286 176.456 -0.125059 170.264 0.0130545 164.487V117.045C-0.447323 98.077 11.3153 77.7052 27.958 68.6127C29.9237 68.1678 45.2193 59.0352 64.4221 47.5699C99.8619 26.4099 148.609 -2.69586 151.431 0.200466C155.717 -1.23375 183.89 15.6449 202.182 26.604C208.09 30.1436 212.968 33.0657 215.676 34.5538C210.233 32.1068 203.935 32.4708 198.781 35.4425L84.6534 101.369C55.1042 118.07 55.8577 147.905 56.5916 176.961C56.765 183.826 56.9373 190.648 56.7085 197.243C56.7085 199.199 55.6957 201.11 53.8772 202.146C52.0587 203.204 49.9179 203.112 48.2146 202.146ZM217.403 35.4425C217.01 35.2676 216.426 34.9656 215.676 34.5538C216.263 34.8173 216.839 35.1135 217.403 35.4425ZM214.204 96.697C216.022 95.6382 217.035 93.7506 217.035 91.794V51.6029C217.242 44.9505 209.301 40.3467 203.661 43.8686L160.363 68.8902C161.435 69.0871 167 72.4851 174.177 76.8674C189.651 86.3149 212.616 100.337 214.204 96.72V96.697ZM163.128 243.483C126.984 265.244 71.8906 298.413 70.888 291.598L70.865 291.621C65.2732 289.39 65.8139 275.005 66.335 261.14C66.7599 249.835 67.1718 238.876 64.2355 235.133C68.6164 231.965 78.0259 226.841 89.1904 220.762L89.1908 220.762L89.191 220.762C114.691 206.878 149.344 188.009 154.147 176.066C161.353 165.753 160.813 144.582 160.379 127.567C160.218 121.263 160.072 115.529 160.339 111.13C161.999 101.727 169.438 106.309 174.832 109.631L174.832 109.631C175.724 110.181 176.56 110.695 177.304 111.107L208.932 129.361C213.766 131.985 217.173 137.878 217.035 143.379V185.665C217.035 193.768 214.894 201.755 210.843 208.776C206.814 215.797 200.968 221.644 193.947 225.695C192.881 225.57 180.091 233.27 163.128 243.483L163.128 243.483ZM66.0311 300.001L9.35868 267.269V267.246C3.37378 263.793 0.0360436 257.555 0.0360436 251.109V216.535C-0.194145 212.368 5.03114 209.376 8.53 211.632C10.0029 212.754 14.8471 215.425 20.8738 218.747L20.874 218.747C34.2497 226.121 53.4498 236.706 54.5447 240.705C57.3777 244.223 56.9897 259.761 56.6978 271.455C56.558 277.054 56.4402 281.771 56.7085 283.865C56.7085 290.31 60.0692 296.549 66.0311 300.001Z" fill="url(#paint0_linear_1531_294)"/>
+<defs>
+<linearGradient id="paint0_linear_1531_294" x1="93.5733" y1="1.4598" x2="150.197" y2="293.428" gradientUnits="userSpaceOnUse">
+<stop stop-color="#7D2BD1"/>
+<stop offset="0.1875" stop-color="#752FD1"/>
+<stop offset="1" stop-color="#454AD1"/>
+</linearGradient>
+</defs>
+</svg>

package/dist/components/app-header/app-header.d.ts

@@ -0,0 +1,43 @@
+/**
+ * AppHeader Web Component
+ * A flexible header component with branding and time display
+ *
+ * Usage:
+ * ```html
+ * <app-header></app-header>
+ * ```
+ *
+ * Attributes:
+ * - `show-logo` (optional): Show brand logo (default: true)
+ * - `show-time` (optional): Show time display (default: true)
+ * - `show-date` (optional): Show date display (default: false)
+ * - `time-format` (optional): Time format - "12h" or "24h" (default: auto-detect)
+ */
+export declare class AppHeader extends HTMLElement {
+    private _showLogo;
+    private _showTime;
+    private _showDate;
+    private _timeFormat?;
+    private timezone;
+    private locale;
+    private updateInterval?;
+    static get observedAttributes(): string[];
+    constructor();
+    connectedCallback(): Promise<void>;
+    disconnectedCallback(): void;
+    attributeChangedCallback(): void;
+    private upgradeProperty;
+    private loadAttributes;
+    private updateCssProperties;
+    private updateTime;
+    private render;
+    get showLogo(): boolean;
+    set showLogo(value: boolean);
+    get showTime(): boolean;
+    set showTime(value: boolean);
+    get showDate(): boolean;
+    set showDate(value: boolean);
+    get timeFormat(): '12h' | '24h' | undefined;
+    set timeFormat(value: '12h' | '24h' | undefined);
+}
+//# sourceMappingURL=app-header.d.ts.map

package/dist/components/app-header/app-header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-header.d.ts","sourceRoot":"","sources":["../../../src/components/app-header/app-header.ts"],"names":[],"mappings":"AA4EA;;;;;;;;;;;;;;GAcG;AACH,qBAAa,SAAU,SAAQ,WAAW;IACxC,OAAO,CAAC,SAAS,CAAgB;IACjC,OAAO,CAAC,SAAS,CAAgB;IACjC,OAAO,CAAC,SAAS,CAAiB;IAClC,OAAO,CAAC,WAAW,CAAC,CAAe;IACnC,OAAO,CAAC,QAAQ,CAAgB;IAChC,OAAO,CAAC,MAAM,CAAe;IAC7B,OAAO,CAAC,cAAc,CAAC,CAAQ;IAE/B,MAAM,KAAK,kBAAkB,aAE5B;;IAOK,iBAAiB;IA2BvB,oBAAoB;IAMpB,wBAAwB;IAKxB,OAAO,CAAC,eAAe;IAUvB,OAAO,CAAC,cAAc;IAWtB,OAAO,CAAC,mBAAmB;IAM3B,OAAO,CAAC,UAAU;IA0ClB,OAAO,CAAC,MAAM;IAoBd,IAAI,QAAQ,IAAI,OAAO,CAEtB;IAED,IAAI,QAAQ,CAAC,KAAK,EAAE,OAAO,EAG1B;IAED,IAAI,QAAQ,IAAI,OAAO,CAEtB;IAED,IAAI,QAAQ,CAAC,KAAK,EAAE,OAAO,EAE1B;IAED,IAAI,QAAQ,IAAI,OAAO,CAEtB;IAED,IAAI,QAAQ,CAAC,KAAK,EAAE,OAAO,EAM1B;IAED,IAAI,UAAU,IAAI,KAAK,GAAG,KAAK,GAAG,SAAS,CAE1C;IAED,IAAI,UAAU,CAAC,KAAK,EAAE,KAAK,GAAG,KAAK,GAAG,SAAS,EAM9C;CACF"}

package/dist/components/app-header/app-header.js

@@ -0,0 +1,244 @@
+import { formatTime, formatLocalizedDate, getTimeZone, getLocale, } from '../../utils/index.js';
+const htmlTemplate = `
+<div class="header-left">
+  <brand-logo show-name></brand-logo>
+</div>
+<div class="header-right">
+  <span class="header-date"></span>
+  <span class="header-time"></span>
+  <slot name="actions"></slot>
+</div>
+`;
+const cssTemplate = `
+:host {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  border-radius: 16px;
+  border: 1px solid rgba(255, 255, 255, 0.10);
+  background: linear-gradient(93deg, rgba(0, 0, 0, 0.09) 2.78%, rgba(0, 0, 0, 0.01) 99.63%);
+  backdrop-filter: blur(30px);
+  padding: 8px 16px;
+  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.25);
+  width: 100%;
+}
+
+:host([hidden]) {
+  display: none;
+}
+
+.header-left {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+}
+
+.header-right {
+  display: flex;
+  align-items: center;
+  gap: 16px;
+}
+
+.header-time {
+  font-size: 18px;
+  font-weight: 300;
+  opacity: 0.9;
+  display: var(--show-time, block);
+}
+
+.header-date {
+  font-size: 18px;
+  opacity: 0.8;
+  display: var(--show-date, none);
+}
+
+brand-logo {
+  display: var(--show-logo, inline-flex);
+}
+
+@media (orientation: portrait) {
+  .header-date {
+    font-size: 24px;
+  }
+  
+  .header-time {
+    font-size: 24px;
+  }
+}
+`;
+/**
+ * AppHeader Web Component
+ * A flexible header component with branding and time display
+ *
+ * Usage:
+ * ```html
+ * <app-header></app-header>
+ * ```
+ *
+ * Attributes:
+ * - `show-logo` (optional): Show brand logo (default: true)
+ * - `show-time` (optional): Show time display (default: true)
+ * - `show-date` (optional): Show date display (default: false)
+ * - `time-format` (optional): Time format - "12h" or "24h" (default: auto-detect)
+ */
+export class AppHeader extends HTMLElement {
+    _showLogo = true;
+    _showTime = true;
+    _showDate = false;
+    _timeFormat;
+    timezone = 'UTC';
+    locale = 'en';
+    updateInterval;
+    static get observedAttributes() {
+        return ['show-logo', 'show-time', 'show-date', 'time-format'];
+    }
+    constructor() {
+        super();
+        this.attachShadow({ mode: 'open' });
+    }
+    async connectedCallback() {
+        this.upgradeProperty('showLogo');
+        this.upgradeProperty('showTime');
+        this.upgradeProperty('showDate');
+        this.upgradeProperty('timeFormat');
+        this.loadAttributes();
+        // Initialize timezone and locale
+        try {
+            this.timezone = await getTimeZone();
+            this.locale = await getLocale();
+        }
+        catch (error) {
+            console.warn('Failed to get timezone/locale:', error);
+        }
+        this.render();
+        this.updateTime();
+        // Update time every second
+        if (this.showTime || this.showDate) {
+            this.updateInterval = window.setInterval(() => {
+                this.updateTime();
+            }, 1000);
+        }
+    }
+    disconnectedCallback() {
+        if (this.updateInterval) {
+            clearInterval(this.updateInterval);
+        }
+    }
+    attributeChangedCallback() {
+        this.loadAttributes();
+        this.render();
+    }
+    upgradeProperty(prop) {
+        if (Object.prototype.hasOwnProperty.call(this, prop)) {
+            const element = this;
+            const value = element[prop];
+            delete element[prop];
+            element[prop] = value;
+        }
+    }
+    loadAttributes() {
+        this._showLogo = this.getAttribute('show-logo') !== 'false';
+        this._showTime = this.getAttribute('show-time') !== 'false';
+        this._showDate = this.hasAttribute('show-date');
+        const format = this.getAttribute('time-format');
+        if (format === '12h' || format === '24h') {
+            this._timeFormat = format;
+        }
+        this.updateCssProperties();
+    }
+    updateCssProperties() {
+        this.style.setProperty('--show-logo', this._showLogo ? 'block' : 'none');
+        this.style.setProperty('--show-time', this._showTime ? 'block' : 'none');
+        this.style.setProperty('--show-date', this._showDate ? 'block' : 'none');
+    }
+    updateTime() {
+        if (!this._showTime && !this._showDate)
+            return;
+        const now = new Date();
+        const timeEl = this.shadowRoot.querySelector('.header-time');
+        const dateEl = this.shadowRoot.querySelector('.header-date');
+        if (this._showTime && timeEl) {
+            const timeData = formatTime(now, this.locale, this.timezone, {
+                hour12: this._timeFormat === '12h' ||
+                    (this._timeFormat !== '24h' && undefined),
+            });
+            // Format time as "HH:MM" or "HH:MM AM/PM"
+            const formattedTime = timeData.dayPeriod
+                ? `${timeData.hour}:${timeData.minute} ${timeData.dayPeriod}`
+                : `${timeData.hour}:${timeData.minute}`;
+            timeEl.textContent = formattedTime;
+            timeEl.style.display = 'block';
+        }
+        else if (timeEl) {
+            timeEl.style.display = 'none';
+        }
+        if (this._showDate && dateEl) {
+            const dateStr = formatLocalizedDate(now, this.locale, {
+                weekday: 'short',
+                day: 'numeric',
+                month: 'short',
+                year: undefined,
+                timeZone: this.timezone,
+            });
+            dateEl.textContent = dateStr;
+            dateEl.style.display = 'block';
+        }
+        else if (dateEl) {
+            dateEl.style.display = 'none';
+        }
+    }
+    render() {
+        const style = this.shadowRoot.querySelector('style');
+        if (!style) {
+            // First render
+            this.shadowRoot.innerHTML = `
+        <style>${cssTemplate}</style>
+        ${htmlTemplate}
+      `;
+            // Re-initialize time after render
+            if (this._showTime || this._showDate) {
+                setTimeout(() => this.updateTime(), 0);
+            }
+        }
+    }
+    // Public properties reflecting to attributes (primitive data)
+    get showLogo() {
+        return this._showLogo;
+    }
+    set showLogo(value) {
+        // Reflect to attribute; attributeChangedCallback handles side effects
+        this.setAttribute('show-logo', value ? 'true' : 'false');
+    }
+    get showTime() {
+        return this._showTime;
+    }
+    set showTime(value) {
+        this.setAttribute('show-time', value ? 'true' : 'false');
+    }
+    get showDate() {
+        return this._showDate;
+    }
+    set showDate(value) {
+        if (value) {
+            this.setAttribute('show-date', '');
+        }
+        else {
+            this.removeAttribute('show-date');
+        }
+    }
+    get timeFormat() {
+        return this._timeFormat;
+    }
+    set timeFormat(value) {
+        if (value === '12h' || value === '24h') {
+            this.setAttribute('time-format', value);
+        }
+        else {
+            this.removeAttribute('time-format');
+        }
+    }
+}
+// Register the custom element
+if (typeof window !== 'undefined' && !customElements.get('app-header')) {
+    customElements.define('app-header', AppHeader);
+}

package/dist/components/auto-scaler/auto-scaler.d.ts

@@ -0,0 +1,65 @@
+/**
+ * <auto-scaler>
+ *
+ * Web component that automatically scales its slotted content from a reference
+ * resolution to the current viewport.
+ *
+ * Usage:
+ * ```html
+ * <auto-scaler
+ *   reference-width="1920"
+ *   reference-height="1080"
+ *   orientation="auto"
+ *   center-content
+ * >
+ *   <!-- Your app content sized for 1920×1080 -->
+ * </auto-scaler>
+ * ```
+ */
+export declare class AutoScalerElement extends HTMLElement {
+    private currentScale;
+    private resizeObserver?;
+    private resizeTimeout?;
+    private boundDebouncedResize;
+    private _referenceWidth?;
+    private _referenceHeight?;
+    private _orientation;
+    private _centerContent;
+    private _padding;
+    private _debounceMs;
+    static get observedAttributes(): string[];
+    constructor();
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    attributeChangedCallback(name: string, _oldValue: string | null, _newValue: string | null): void;
+    /**
+     * Upgrade any properties that were set on the instance before
+     * the custom element definition was loaded.
+     * See: https://web.dev/articles/custom-elements-best-practices
+     */
+    private upgradeProperty;
+    private loadAttributes;
+    private init;
+    private calculateAndApplyScale;
+    private setupResizeHandling;
+    private debouncedResize;
+    private teardownResizeHandling;
+    private teardown;
+    /**
+     * Public API: get current scale factor
+     */
+    get scale(): number;
+    /**
+     * Manually trigger scale recalculation
+     */
+    recalculate(): void;
+    /**
+     * Properties that reflect to attributes (primitive data).
+     * Keeping them in sync matches platform behavior.
+     */
+    get referenceWidth(): number | undefined;
+    set referenceWidth(value: number | undefined);
+    get referenceHeight(): number | undefined;
+    set referenceHeight(value: number | undefined);
+}
+//# sourceMappingURL=auto-scaler.d.ts.map

package/dist/components/auto-scaler/auto-scaler.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"auto-scaler.d.ts","sourceRoot":"","sources":["../../../src/components/auto-scaler/auto-scaler.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AACH,qBAAa,iBAAkB,SAAQ,WAAW;IAChD,OAAO,CAAC,YAAY,CAAY;IAChC,OAAO,CAAC,cAAc,CAAC,CAAgB;IACvC,OAAO,CAAC,aAAa,CAAC,CAAQ;IAC9B,OAAO,CAAC,oBAAoB,CAA+B;IAG3D,OAAO,CAAC,eAAe,CAAC,CAAQ;IAChC,OAAO,CAAC,gBAAgB,CAAC,CAAQ;IACjC,OAAO,CAAC,YAAY,CAA4C;IAChE,OAAO,CAAC,cAAc,CAAgB;IACtC,OAAO,CAAC,QAAQ,CAAe;IAC/B,OAAO,CAAC,WAAW,CAAc;IAEjC,MAAM,KAAK,kBAAkB,aAS5B;;IA2BD,iBAAiB;IASjB,oBAAoB;IAIpB,wBAAwB,CACtB,IAAI,EAAE,MAAM,EACZ,SAAS,EAAE,MAAM,GAAG,IAAI,EACxB,SAAS,EAAE,MAAM,GAAG,IAAI;IAW1B;;;;OAIG;IACH,OAAO,CAAC,eAAe;IAUvB,OAAO,CAAC,cAAc;IA0CtB,OAAO,CAAC,IAAI;IAqBZ,OAAO,CAAC,sBAAsB;IAyF9B,OAAO,CAAC,mBAAmB;IAc3B,OAAO,CAAC,eAAe;IAUvB,OAAO,CAAC,sBAAsB;IAY9B,OAAO,CAAC,QAAQ;IAIhB;;OAEG;IACH,IAAI,KAAK,IAAI,MAAM,CAElB;IAED;;OAEG;IACI,WAAW,IAAI,IAAI;IAI1B;;;OAGG;IACH,IAAI,cAAc,IAAI,MAAM,GAAG,SAAS,CAEvC;IAED,IAAI,cAAc,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAM3C;IAED,IAAI,eAAe,IAAI,MAAM,GAAG,SAAS,CAExC;IAED,IAAI,eAAe,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAM5C;CACF"}