mirror of
https://github.com/anomalyco/opencode.git
synced 2026-05-01 14:00:30 +00:00
Revert "fix(app): startup efficiency"
This commit is contained in:
Adam
parent
53d0b58ebf
commit
898456a25c
40 changed files with 695 additions and 1121 deletions
|
|
@ -1,3 +0,0 @@
|
|||
<svg width="24" height="24" viewBox="0 0 40 40" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M37.9998 23.021C33.7998 25.2889 29.5698 27.3649 24.8614 28.3069C23.8114 28.5154 22.6474 28.5154 21.5809 28.3714C20.5639 28.2439 20.0554 27.3484 20.4169 26.4064C20.7619 25.5289 21.2209 24.635 21.8119 23.9C23.0899 22.3025 24.5329 20.849 25.8289 19.268C26.6203 18.2991 27.3335 17.2689 27.9618 16.187C28.4208 15.4205 28.2078 14.4935 27.4038 14.111C26.0584 13.4556 24.6154 12.9936 23.1889 12.4986C23.0239 12.4341 22.7779 12.6096 22.4509 12.7221C22.8604 13.0881 23.1559 13.3596 23.5654 13.727C19.3339 14.447 15.3305 15.467 11.4455 16.874C11.4275 16.9535 11.396 17.0165 11.411 17.0495C11.9855 17.927 11.723 18.5975 10.886 19.1405C10.5611 19.3531 10.2732 19.6176 10.034 19.9235C12.593 20.6735 14.873 20.243 17.0539 18.821C16.9234 18.6305 16.7914 18.455 16.6609 18.263C17.4799 18.407 17.9719 18.854 18.0379 19.556C18.0544 19.7165 17.9569 19.8755 17.9074 20.036C17.7919 19.907 17.6449 19.781 17.5474 19.6355C17.4799 19.5395 17.4634 19.4285 17.4154 19.268C14.8235 20.993 12.035 21.425 8.96751 20.531C8.96751 21.137 8.93451 21.6485 8.98401 22.1435C9.01701 22.574 8.83701 22.766 8.44401 22.9895C7.55752 23.5325 6.63803 24.092 5.90003 24.8105C5.01504 25.6879 5.34354 26.7589 6.54053 27.2059C7.90102 27.7159 9.329 27.7309 10.7555 27.5569C12.4445 27.3484 14.1005 27.0769 15.9394 26.8219C13.79 27.8269 11.6735 28.5319 9.4445 28.8169C7.88452 29.0269 6.32753 29.1379 4.78554 28.6909C2.57156 28.0684 1.58607 26.4394 2.16057 24.251C2.70206 22.2065 4.01455 20.5775 5.42454 19.076C10.133 14.078 16.0864 11.5401 22.9744 11.0286C24.5824 10.9176 26.2069 11.1246 27.7143 11.7951C29.8308 12.7536 30.7173 14.78 29.6838 16.826C29.0118 18.1835 28.0758 19.4285 27.1413 20.6585C26.2234 21.872 25.1899 22.9895 24.2224 24.155C23.9434 24.506 23.6809 24.875 23.4679 25.2724C23.0569 26.0224 23.3359 26.5174 24.2059 26.4394C26.0254 26.2624 27.8808 26.1199 29.6358 25.6729C32.2098 25.0174 34.7193 24.092 37.2618 23.2775C37.5243 23.213 37.7703 23.117 37.9998 23.0225V23.021Z" fill="currentColor"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 2 KiB |
|
|
@ -1,3 +0,0 @@
|
|||
<svg width="24" height="24" viewBox="0 0 40 40" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M37.9998 23.021C33.7998 25.2889 29.5698 27.3649 24.8614 28.3069C23.8114 28.5154 22.6474 28.5154 21.5809 28.3714C20.5639 28.2439 20.0554 27.3484 20.4169 26.4064C20.7619 25.5289 21.2209 24.635 21.8119 23.9C23.0899 22.3025 24.5329 20.849 25.8289 19.268C26.6203 18.2991 27.3335 17.2689 27.9618 16.187C28.4208 15.4205 28.2078 14.4935 27.4038 14.111C26.0584 13.4556 24.6154 12.9936 23.1889 12.4986C23.0239 12.4341 22.7779 12.6096 22.4509 12.7221C22.8604 13.0881 23.1559 13.3596 23.5654 13.727C19.3339 14.447 15.3305 15.467 11.4455 16.874C11.4275 16.9535 11.396 17.0165 11.411 17.0495C11.9855 17.927 11.723 18.5975 10.886 19.1405C10.5611 19.3531 10.2732 19.6176 10.034 19.9235C12.593 20.6735 14.873 20.243 17.0539 18.821C16.9234 18.6305 16.7914 18.455 16.6609 18.263C17.4799 18.407 17.9719 18.854 18.0379 19.556C18.0544 19.7165 17.9569 19.8755 17.9074 20.036C17.7919 19.907 17.6449 19.781 17.5474 19.6355C17.4799 19.5395 17.4634 19.4285 17.4154 19.268C14.8235 20.993 12.035 21.425 8.96751 20.531C8.96751 21.137 8.93451 21.6485 8.98401 22.1435C9.01701 22.574 8.83701 22.766 8.44401 22.9895C7.55752 23.5325 6.63803 24.092 5.90003 24.8105C5.01504 25.6879 5.34354 26.7589 6.54053 27.2059C7.90102 27.7159 9.329 27.7309 10.7555 27.5569C12.4445 27.3484 14.1005 27.0769 15.9394 26.8219C13.79 27.8269 11.6735 28.5319 9.4445 28.8169C7.88452 29.0269 6.32753 29.1379 4.78554 28.6909C2.57156 28.0684 1.58607 26.4394 2.16057 24.251C2.70206 22.2065 4.01455 20.5775 5.42454 19.076C10.133 14.078 16.0864 11.5401 22.9744 11.0286C24.5824 10.9176 26.2069 11.1246 27.7143 11.7951C29.8308 12.7536 30.7173 14.78 29.6838 16.826C29.0118 18.1835 28.0758 19.4285 27.1413 20.6585C26.2234 21.872 25.1899 22.9895 24.2224 24.155C23.9434 24.506 23.6809 24.875 23.4679 25.2724C23.0569 26.0224 23.3359 26.5174 24.2059 26.4394C26.0254 26.2624 27.8808 26.1199 29.6358 25.6729C32.2098 25.0174 34.7193 24.092 37.2618 23.2775C37.5243 23.213 37.7703 23.117 37.9998 23.0225V23.021Z" fill="currentColor"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 2 KiB |
|
|
@ -1,24 +0,0 @@
|
|||
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
shape-rendering="geometricPrecision"
|
||||
d="M9.8132 15.9038L9 18.75L8.1868 15.9038C7.75968 14.4089 6.59112 13.2403 5.09619 12.8132L2.25 12L5.09619 11.1868C6.59113 10.7597 7.75968 9.59112 8.1868 8.09619L9 5.25L9.8132 8.09619C10.2403 9.59113 11.4089 10.7597 12.9038 11.1868L15.75 12L12.9038 12.8132C11.4089 13.2403 10.2403 14.4089 9.8132 15.9038Z"
|
||||
stroke="currentColor"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
/>
|
||||
<path
|
||||
d="M18.2589 8.71454L18 9.75L17.7411 8.71454C17.4388 7.50533 16.4947 6.56117 15.2855 6.25887L14.25 6L15.2855 5.74113C16.4947 5.43883 17.4388 4.49467 17.7411 3.28546L18 2.25L18.2589 3.28546C18.5612 4.49467 19.5053 5.43883 20.7145 5.74113L21.75 6L20.7145 6.25887C19.5053 6.56117 18.5612 7.50533 18.2589 8.71454Z"
|
||||
stroke="currentColor"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
/>
|
||||
<path
|
||||
d="M16.8942 20.5673L16.5 21.75L16.1058 20.5673C15.8818 19.8954 15.3546 19.3682 14.6827 19.1442L13.5 18.75L14.6827 18.3558C15.3546 18.1318 15.8818 17.6046 16.1058 16.9327L16.5 15.75L16.8942 16.9327C17.1182 17.6046 17.6454 18.1318 18.3173 18.3558L19.5 18.75L18.3173 19.1442C17.6454 19.3682 17.1182 19.8954 16.8942 20.5673Z"
|
||||
stroke="currentColor"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.4 KiB |
|
|
@ -1 +0,0 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-terminal h-5 w-5 text-primary"><path d="m4 17 6-6-6-6M12 19h8"/></svg>
|
||||
|
Before Width: | Height: | Size: 253 B |
|
|
@ -1,8 +0,0 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 400">
|
||||
<path fill="currentColor" d="M394.3,154.15v19.4c6.2-3.8,12.7-6.8,19.7-9.1,8.8-2.7,17.8-4.1,27.1-4.1h3.3v42.4h-3.3c-12.9,0-24,4.6-33.1,13.7-9.1,9.1-13.7,20.2-13.7,33.1v80.4h-42.4V154.15h42.4Z"/>
|
||||
<path fill="currentColor" d="M464.5,264.65c-.3-2.9-.5-5.7-.5-8.4v-101.7h41.3v102.2c0,1.1,.1,2.3,.3,3.4,.1,1,.3,2.2,.5,3.4,1,4.5,2.9,8.5,5.7,12,2.6,3.5,5.9,6.5,9.9,8.7,3.5,2.1,7.4,3.4,11.5,3.9,4,.6,8,.4,12-.5,2.7-.7,5.3-1.7,7.7-2.9,2.4-1.3,4.6-2.8,6.5-4.6,2.4-2.1,4.4-4.5,6-7.2,1.6-2.6,2.8-5.4,3.6-8.2v-110.2h42.8v175.1h-42.9v-6.7c-1.5,.8-3,1.5-4.6,2.1-3.2,1.3-6.5,2.2-9.8,2.9-7.8,1.8-15.6,2.4-23.5,1.7-7.9-.7-15.5-2.6-22.8-5.8-10.7-4.7-19.8-11.5-27.3-20.4-7.4-8.9-12.5-19-15.1-30.4-.5-2.8-1-5.6-1.3-8.4Z"/>
|
||||
<path fill="currentColor" d="M228,149.85v33.9c-5.5-3.3-11.3-6-17.5-8.1-7.8-2.4-15.8-3.6-24.2-3.6-22,0-40.6,7.7-56.1,23.2-15.5,15.5-23.3,34.3-23.3,56.2s7.8,40.6,23.3,56.1c15.4,15.5,34.1,23.3,56.1,23.3,8.3,0,16.4-1.3,24.2-3.8,6.2-1.9,12-4.6,17.5-8.1v10.6h37.7V119.95l-37.7,29.9Zm-.5,91.2l-3.7,30.2-17.9,13.5-19.6,14.7-19.8-14.8-18-13.4-3.6-30.2-1.8-16.5,21.9-9.5,21.2-9.2,25.7,11.2,17.6,7.5-2,16.5Z"/>
|
||||
<path fill="currentColor" d="M792,329.95h-45v-107.2c0-11.9-4.3-31.9-33.4-31.9-12.3,0-32.8,4.1-32.8,31.3v107.8h-45v-107.8c0-23.3,8.2-42.9,23.6-56.9,13.9-12.5,33.1-19.4,54.2-19.4,46.1,0,78.4,31.6,78.4,76.9v107.2Z"/>
|
||||
<rect fill="currentColor" x="293.59" y="293.67" width="29.3" height="29.3" transform="translate(-127.73 308.26) rotate(-45)"/>
|
||||
<polygon fill="currentColor" points="229.7 89.95 226.4 137.75 264.7 108.85 270.4 62.55 229.7 89.95"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.6 KiB |
|
|
@ -1,3 +0,0 @@
|
|||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M17.2642 2.8689L12.042 8.0961M17.2642 2.8689V8.0961H12.042M17.2642 2.8689V4.30027M12.042 8.0961L6.81809 2.8689V8.0961H12.042ZM12.042 8.0961L17.2642 13.3225V20.8159L12.042 15.5887M12.042 8.0961V15.5887M12.042 8.0961L6.81892 13.3225M12.0296 2.1V21.9M12.042 15.5887L6.81892 20.8159V13.3225M6.81892 13.3225L6.81809 15.559H4.57739V8.09527H12.0412L6.81892 13.3225ZM11.9859 8.09527L17.2081 13.3225V15.559H19.4497V8.09527H11.9859Z" stroke="currentColor" stroke-width="0.825" stroke-miterlimit="10"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 604 B |
|
|
@ -1,5 +0,0 @@
|
|||
<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M20.0483 17.1416C19.6945 17.4914 18.987 18.0161 17.7488 18.0161C17.2182 18.0161 16.5991 18.0161 16.3338 18.0161C15.98 18.0161 13.3268 18.0161 10.143 18.0161C12.4424 15.8298 14.3881 13.9932 14.565 13.8183C14.7419 13.6434 15.1841 13.2061 15.6263 12.8563C16.5107 12.0692 17.2182 11.9817 17.8373 11.9817C18.7217 11.9817 19.4292 12.3316 20.0483 12.8563C21.2864 13.9932 21.2864 16.0047 20.0483 17.1416ZM21.5518 11.457C20.6674 10.495 19.3408 9.88281 17.9257 9.88281C16.6875 9.88281 15.6263 10.3201 14.6534 11.0197C14.2997 11.3695 13.769 11.7194 13.3268 12.2441C12.9731 12.5939 5.36719 19.9401 5.36719 19.9401C5.80939 20.0276 6.34003 20.0276 6.78223 20.0276C7.22443 20.0276 16.0685 20.0276 16.4222 20.0276C17.1298 20.0276 17.6604 20.0276 18.191 19.9401C19.3408 19.8527 20.4905 19.4154 21.4633 18.5409C23.4975 16.6168 23.4975 13.381 21.5518 11.457Z" fill="currentColor"/>
|
||||
<path d="M9.1701 10.9323C8.19726 10.2326 7.22442 9.88281 6.07469 9.88281C4.65965 9.88281 3.33304 10.495 2.44864 11.457C0.502952 13.4685 0.502952 16.6168 2.53708 18.6283C3.42148 19.4154 4.30589 19.8527 5.36717 19.9401L7.4013 18.0161C7.04754 18.0161 6.60533 18.0161 6.25157 18.0161C5.10185 17.9287 4.39433 17.5789 3.95212 17.1416C2.71396 15.9172 2.71396 13.9932 3.86368 12.7688C4.48277 12.1566 5.19029 11.8943 6.07469 11.8943C6.60533 11.8943 7.4013 11.9817 8.19726 12.7688C8.55102 13.1186 9.52386 13.8183 9.87763 14.1681H9.96607L11.2927 12.8563V12.7688C10.6736 12.1566 9.70075 11.3695 9.1701 10.9323Z" fill="currentColor"/>
|
||||
<path d="M18.4564 8.74536C17.4836 6.12171 14.9188 4.28516 12.0003 4.28516C8.5511 4.28516 5.80945 6.82135 5.27881 9.96973C5.54413 9.96973 5.80945 9.88228 6.16321 9.88228C6.51697 9.88228 6.95917 9.96973 7.31294 9.96973C7.75514 7.78336 9.70082 6.20917 12.0003 6.20917C13.946 6.20917 15.6263 7.34608 16.4223 9.00773C16.4223 9.00773 16.5107 9.09518 16.5107 9.00773C17.1298 8.92027 17.8373 8.74536 18.4564 8.74536C18.4564 8.83282 18.4564 8.83282 18.4564 8.74536Z" fill="currentColor"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 2 KiB |
|
|
@ -1,4 +1,3 @@
|
|||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="20" height="20" rx="10" fill="#F5F5F5" style="fill:#F5F5F5;fill:color(display-p3 0.9608 0.9608 0.9608);fill-opacity:1;"/>
|
||||
<path d="M9.64258 3.10608C10.3684 3.07819 11.8376 3.17404 13.0127 4.22913C13.9766 5.09463 14.3086 6.69977 14.084 7.94397C13.878 9.08427 13.3929 10.0176 13.583 10.8815C13.7731 11.7453 14.2566 12.1713 14.668 12.3502C15.0654 12.523 15.4501 12.4711 15.377 12.7994C15.3038 13.1277 14.8062 13.2487 14.4434 13.2487C14.2442 13.2486 13.6431 13.1967 13.376 13.024C13.0604 12.8199 12.9892 12.637 12.8691 12.4899C12.8488 12.465 12.8135 12.4824 12.8184 12.5143C12.8731 12.8762 13.0238 13.4901 13.2686 13.8707C13.4666 14.1789 13.5483 14.4037 14.002 14.7838C14.4558 15.164 14.6678 15.5098 14.2266 15.7545C13.8344 15.9715 12.9824 15.5262 12.4814 14.9762C12.0305 14.481 11.716 13.8706 11.5918 13.4733C11.5254 13.2608 11.459 12.8953 11.3926 12.5963C11.3839 12.5572 11.3306 12.5633 11.3291 12.6031C11.3071 13.364 11.1875 14.0908 11.0127 14.8698C10.8868 15.4305 10.5811 16.1142 10.3047 16.5289C9.96759 17.0346 9.46673 17.1925 9.09473 17.0543C8.79714 16.9437 9.00832 16.5673 9.09473 16.2418C9.18116 15.9162 9.35337 15.2355 9.46973 14.4899C9.57509 13.8147 9.60356 13.1466 9.55664 12.5133C9.55378 12.4747 9.49448 12.4687 9.48242 12.5055C9.38545 12.8025 9.20269 13.2949 9.06934 13.5944C8.79123 14.2188 8.58485 14.4924 8.01465 15.149C7.50186 15.7395 6.02756 16.5749 5.83789 15.7545C5.78606 15.5299 6.05719 15.4313 6.30762 15.236C6.68411 14.9422 6.99955 14.4212 7.29785 13.7848C7.56564 13.2134 7.70176 12.6602 7.72266 12.3073C7.72466 12.2733 7.68135 12.2598 7.66211 12.2877C7.53811 12.4696 7.35541 12.7164 7.1543 12.9205C6.81843 13.2615 6.44565 13.6129 6.01367 13.7848C5.31916 14.061 4.6105 13.8706 4.66211 13.3698C4.7054 12.9512 5.17315 13.0376 5.75488 12.403C6.32511 11.7809 6.51524 11.297 6.5498 10.7614C6.57745 10.3328 6.15844 9.31505 5.94531 8.85999C5.60552 8.13397 5.35407 6.07467 6.37695 4.74768C7.65531 3.08929 9.19275 3.12331 9.64258 3.10608ZM8.37988 6.00745C7.90409 6.00745 7.66602 6.37241 7.66602 6.82288C7.6661 7.27324 7.9306 7.63831 8.37988 7.63831C8.8289 7.63807 9.09269 7.2731 9.09277 6.82288C9.09277 6.37255 8.85538 6.00767 8.37988 6.00745ZM11.5244 6.00745C11.0486 6.00745 10.8105 6.37241 10.8105 6.82288C10.8106 7.27324 11.0751 7.63831 11.5244 7.63831C11.9734 7.63807 12.2372 7.2731 12.2373 6.82288C12.2373 6.37255 11.9999 6.00767 11.5244 6.00745Z" fill="black" style="fill:black;fill-opacity:1;"/>
|
||||
<svg width="24" height="24" viewBox="0 0 40 40" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M19.2587 5.29983C20.814 5.24008 23.9615 5.44575 26.4795 7.70668C28.5451 9.56134 29.2567 12.9997 28.7754 15.6659C28.3341 18.1098 27.2944 20.1094 27.7016 21.9609C28.1088 23.8124 29.1453 24.7252 30.027 25.1086C30.8787 25.4787 31.7019 25.3677 31.5452 26.0712C31.3884 26.7747 30.3233 27.0341 29.5455 27.0341C29.1191 27.0341 27.8294 26.9228 27.2572 26.5525C26.581 26.1149 26.4303 25.7228 26.1729 25.4075C26.1292 25.354 26.0521 25.3913 26.0624 25.4595C26.1797 26.2351 26.503 27.551 27.0276 28.3672C27.4521 29.0274 27.6275 29.5089 28.6 30.3236C29.5726 31.1381 30.0268 31.8787 29.0813 32.4033C28.2412 32.8691 26.4152 31.9159 25.3414 30.737C24.3749 29.6759 23.7019 28.367 23.4358 27.5154C23.2935 27.0601 23.151 26.2768 23.0087 25.6362C22.99 25.5519 22.8746 25.5655 22.8721 25.6518C22.8249 27.2822 22.5686 28.8393 22.1939 30.5087C21.9241 31.7105 21.2681 33.1747 20.6756 34.0635C19.9532 35.1471 18.8808 35.4853 18.0836 35.1891C17.446 34.952 17.8985 34.1463 18.0836 33.4487C18.2687 32.7513 18.6391 31.2923 18.8886 29.694C19.1144 28.2472 19.1741 26.8151 19.0735 25.4582C19.0673 25.3754 18.9402 25.3627 18.9144 25.4416C18.7066 26.078 18.3149 27.133 18.0292 27.7747C17.4332 29.1128 16.9922 29.7001 15.7702 31.1073C14.6712 32.3727 11.5105 34.1622 11.1045 32.4033C10.9935 31.922 11.5755 31.7112 12.1122 31.2923C12.9191 30.6629 13.5933 29.5459 14.2325 28.1819C14.8065 26.9571 15.0983 25.7724 15.1429 25.016C15.1472 24.943 15.0556 24.9155 15.0145 24.9758C14.7488 25.3656 14.3575 25.893 13.9266 26.3303C13.2067 27.0611 12.4083 27.8134 11.4824 28.1819C9.99368 28.7744 8.47556 28.367 8.58655 27.2934C8.67931 26.3963 9.68069 26.582 10.9272 25.222C12.1492 23.889 12.5564 22.8519 12.6305 21.704C12.6896 20.7857 11.7912 18.606 11.3345 17.6309C10.6063 16.0756 10.0681 11.6617 12.2603 8.81785C15.0004 5.26311 18.2959 5.33684 19.2587 5.29983ZM14.9842 11.5161C13.9647 11.5161 13.4549 12.2987 13.4549 13.2639C13.4549 14.2292 14.0213 15.0117 14.9842 15.0117C15.9471 15.0117 16.5135 14.2292 16.5135 13.2639C16.5135 12.2987 16.0038 11.5161 14.9842 11.5161Z" fill="currentColor"/>
|
||||
</svg>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 2.5 KiB After Width: | Height: | Size: 2.1 KiB |
|
|
@ -1,9 +1,121 @@
|
|||
import { Link, Style } from "@solidjs/meta"
|
||||
import { Show } from "solid-js"
|
||||
import { Style, Link } from "@solidjs/meta"
|
||||
import inter from "../assets/fonts/inter.woff2"
|
||||
import ibmPlexMonoBold from "../assets/fonts/ibm-plex-mono-bold.woff2"
|
||||
import ibmPlexMonoMedium from "../assets/fonts/ibm-plex-mono-medium.woff2"
|
||||
import ibmPlexMonoRegular from "../assets/fonts/ibm-plex-mono.woff2"
|
||||
import ibmPlexMonoMedium from "../assets/fonts/ibm-plex-mono-medium.woff2"
|
||||
import ibmPlexMonoBold from "../assets/fonts/ibm-plex-mono-bold.woff2"
|
||||
|
||||
import cascadiaCode from "../assets/fonts/cascadia-code-nerd-font.woff2"
|
||||
import cascadiaCodeBold from "../assets/fonts/cascadia-code-nerd-font-bold.woff2"
|
||||
import firaCode from "../assets/fonts/fira-code-nerd-font.woff2"
|
||||
import firaCodeBold from "../assets/fonts/fira-code-nerd-font-bold.woff2"
|
||||
import hack from "../assets/fonts/hack-nerd-font.woff2"
|
||||
import hackBold from "../assets/fonts/hack-nerd-font-bold.woff2"
|
||||
import inconsolata from "../assets/fonts/inconsolata-nerd-font.woff2"
|
||||
import inconsolataBold from "../assets/fonts/inconsolata-nerd-font-bold.woff2"
|
||||
import intelOneMono from "../assets/fonts/intel-one-mono-nerd-font.woff2"
|
||||
import intelOneMonoBold from "../assets/fonts/intel-one-mono-nerd-font-bold.woff2"
|
||||
import jetbrainsMono from "../assets/fonts/jetbrains-mono-nerd-font.woff2"
|
||||
import jetbrainsMonoBold from "../assets/fonts/jetbrains-mono-nerd-font-bold.woff2"
|
||||
import mesloLgs from "../assets/fonts/meslo-lgs-nerd-font.woff2"
|
||||
import mesloLgsBold from "../assets/fonts/meslo-lgs-nerd-font-bold.woff2"
|
||||
import robotoMono from "../assets/fonts/roboto-mono-nerd-font.woff2"
|
||||
import robotoMonoBold from "../assets/fonts/roboto-mono-nerd-font-bold.woff2"
|
||||
import sourceCodePro from "../assets/fonts/source-code-pro-nerd-font.woff2"
|
||||
import sourceCodeProBold from "../assets/fonts/source-code-pro-nerd-font-bold.woff2"
|
||||
import ubuntuMono from "../assets/fonts/ubuntu-mono-nerd-font.woff2"
|
||||
import ubuntuMonoBold from "../assets/fonts/ubuntu-mono-nerd-font-bold.woff2"
|
||||
import iosevka from "../assets/fonts/iosevka-nerd-font.woff2"
|
||||
import iosevkaBold from "../assets/fonts/iosevka-nerd-font-bold.woff2"
|
||||
import geistMono from "../assets/fonts/GeistMonoNerdFontMono-Regular.woff2"
|
||||
import geistMonoBold from "../assets/fonts/GeistMonoNerdFontMono-Bold.woff2"
|
||||
|
||||
type MonoFont = {
|
||||
family: string
|
||||
regular: string
|
||||
bold: string
|
||||
}
|
||||
|
||||
export const MONO_NERD_FONTS = [
|
||||
{
|
||||
family: "JetBrains Mono Nerd Font",
|
||||
regular: jetbrainsMono,
|
||||
bold: jetbrainsMonoBold,
|
||||
},
|
||||
{
|
||||
family: "Fira Code Nerd Font",
|
||||
regular: firaCode,
|
||||
bold: firaCodeBold,
|
||||
},
|
||||
{
|
||||
family: "Cascadia Code Nerd Font",
|
||||
regular: cascadiaCode,
|
||||
bold: cascadiaCodeBold,
|
||||
},
|
||||
{
|
||||
family: "Hack Nerd Font",
|
||||
regular: hack,
|
||||
bold: hackBold,
|
||||
},
|
||||
{
|
||||
family: "Source Code Pro Nerd Font",
|
||||
regular: sourceCodePro,
|
||||
bold: sourceCodeProBold,
|
||||
},
|
||||
{
|
||||
family: "Inconsolata Nerd Font",
|
||||
regular: inconsolata,
|
||||
bold: inconsolataBold,
|
||||
},
|
||||
{
|
||||
family: "Roboto Mono Nerd Font",
|
||||
regular: robotoMono,
|
||||
bold: robotoMonoBold,
|
||||
},
|
||||
{
|
||||
family: "Ubuntu Mono Nerd Font",
|
||||
regular: ubuntuMono,
|
||||
bold: ubuntuMonoBold,
|
||||
},
|
||||
{
|
||||
family: "Intel One Mono Nerd Font",
|
||||
regular: intelOneMono,
|
||||
bold: intelOneMonoBold,
|
||||
},
|
||||
{
|
||||
family: "Meslo LGS Nerd Font",
|
||||
regular: mesloLgs,
|
||||
bold: mesloLgsBold,
|
||||
},
|
||||
{
|
||||
family: "Iosevka Nerd Font",
|
||||
regular: iosevka,
|
||||
bold: iosevkaBold,
|
||||
},
|
||||
{
|
||||
family: "GeistMono Nerd Font",
|
||||
regular: geistMono,
|
||||
bold: geistMonoBold,
|
||||
},
|
||||
] satisfies MonoFont[]
|
||||
|
||||
const monoNerdCss = MONO_NERD_FONTS.map(
|
||||
(font) => `
|
||||
@font-face {
|
||||
font-family: "${font.family}";
|
||||
src: url("${font.regular}") format("woff2");
|
||||
font-display: swap;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
}
|
||||
@font-face {
|
||||
font-family: "${font.family}";
|
||||
src: url("${font.bold}") format("woff2");
|
||||
font-display: swap;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
}`,
|
||||
).join("")
|
||||
|
||||
export const Font = () => {
|
||||
return (
|
||||
|
|
@ -53,6 +165,7 @@ export const Font = () => {
|
|||
descent-override: 25%;
|
||||
line-gap-override: 1%;
|
||||
}
|
||||
${monoNerdCss}
|
||||
`}</Style>
|
||||
<Show when={typeof location === "undefined" || location.protocol !== "file:"}>
|
||||
<Link rel="preload" href={inter} as="font" type="font/woff2" crossorigin="anonymous" />
|
||||
|
|
|
|||
|
|
@ -1,133 +0,0 @@
|
|||
type MonoFont = {
|
||||
id: string
|
||||
family: string
|
||||
regular: string
|
||||
bold: string
|
||||
}
|
||||
|
||||
let files: Record<string, () => Promise<string>> | undefined
|
||||
|
||||
function getFiles() {
|
||||
if (files) return files
|
||||
files = import.meta.glob("./assets/fonts/*.woff2", { import: "default" }) as Record<string, () => Promise<string>>
|
||||
return files
|
||||
}
|
||||
|
||||
export const MONO_NERD_FONTS = [
|
||||
{
|
||||
id: "jetbrains-mono",
|
||||
family: "JetBrains Mono Nerd Font",
|
||||
regular: "./assets/fonts/jetbrains-mono-nerd-font.woff2",
|
||||
bold: "./assets/fonts/jetbrains-mono-nerd-font-bold.woff2",
|
||||
},
|
||||
{
|
||||
id: "fira-code",
|
||||
family: "Fira Code Nerd Font",
|
||||
regular: "./assets/fonts/fira-code-nerd-font.woff2",
|
||||
bold: "./assets/fonts/fira-code-nerd-font-bold.woff2",
|
||||
},
|
||||
{
|
||||
id: "cascadia-code",
|
||||
family: "Cascadia Code Nerd Font",
|
||||
regular: "./assets/fonts/cascadia-code-nerd-font.woff2",
|
||||
bold: "./assets/fonts/cascadia-code-nerd-font-bold.woff2",
|
||||
},
|
||||
{
|
||||
id: "hack",
|
||||
family: "Hack Nerd Font",
|
||||
regular: "./assets/fonts/hack-nerd-font.woff2",
|
||||
bold: "./assets/fonts/hack-nerd-font-bold.woff2",
|
||||
},
|
||||
{
|
||||
id: "source-code-pro",
|
||||
family: "Source Code Pro Nerd Font",
|
||||
regular: "./assets/fonts/source-code-pro-nerd-font.woff2",
|
||||
bold: "./assets/fonts/source-code-pro-nerd-font-bold.woff2",
|
||||
},
|
||||
{
|
||||
id: "inconsolata",
|
||||
family: "Inconsolata Nerd Font",
|
||||
regular: "./assets/fonts/inconsolata-nerd-font.woff2",
|
||||
bold: "./assets/fonts/inconsolata-nerd-font-bold.woff2",
|
||||
},
|
||||
{
|
||||
id: "roboto-mono",
|
||||
family: "Roboto Mono Nerd Font",
|
||||
regular: "./assets/fonts/roboto-mono-nerd-font.woff2",
|
||||
bold: "./assets/fonts/roboto-mono-nerd-font-bold.woff2",
|
||||
},
|
||||
{
|
||||
id: "ubuntu-mono",
|
||||
family: "Ubuntu Mono Nerd Font",
|
||||
regular: "./assets/fonts/ubuntu-mono-nerd-font.woff2",
|
||||
bold: "./assets/fonts/ubuntu-mono-nerd-font-bold.woff2",
|
||||
},
|
||||
{
|
||||
id: "intel-one-mono",
|
||||
family: "Intel One Mono Nerd Font",
|
||||
regular: "./assets/fonts/intel-one-mono-nerd-font.woff2",
|
||||
bold: "./assets/fonts/intel-one-mono-nerd-font-bold.woff2",
|
||||
},
|
||||
{
|
||||
id: "meslo-lgs",
|
||||
family: "Meslo LGS Nerd Font",
|
||||
regular: "./assets/fonts/meslo-lgs-nerd-font.woff2",
|
||||
bold: "./assets/fonts/meslo-lgs-nerd-font-bold.woff2",
|
||||
},
|
||||
{
|
||||
id: "iosevka",
|
||||
family: "Iosevka Nerd Font",
|
||||
regular: "./assets/fonts/iosevka-nerd-font.woff2",
|
||||
bold: "./assets/fonts/iosevka-nerd-font-bold.woff2",
|
||||
},
|
||||
{
|
||||
id: "geist-mono",
|
||||
family: "GeistMono Nerd Font",
|
||||
regular: "./assets/fonts/GeistMonoNerdFontMono-Regular.woff2",
|
||||
bold: "./assets/fonts/GeistMonoNerdFontMono-Bold.woff2",
|
||||
},
|
||||
] satisfies MonoFont[]
|
||||
|
||||
const mono = Object.fromEntries(MONO_NERD_FONTS.map((font) => [font.id, font])) as Record<string, MonoFont>
|
||||
const loads = new Map<string, Promise<void>>()
|
||||
|
||||
function css(font: { family: string; regular: string; bold: string }) {
|
||||
return `
|
||||
@font-face {
|
||||
font-family: "${font.family}";
|
||||
src: url("${font.regular}") format("woff2");
|
||||
font-display: swap;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
}
|
||||
@font-face {
|
||||
font-family: "${font.family}";
|
||||
src: url("${font.bold}") format("woff2");
|
||||
font-display: swap;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
}
|
||||
`
|
||||
}
|
||||
|
||||
export function ensureMonoFont(id: string | undefined) {
|
||||
if (!id || id === "ibm-plex-mono") return Promise.resolve()
|
||||
if (typeof document !== "object") return Promise.resolve()
|
||||
const font = mono[id]
|
||||
if (!font) return Promise.resolve()
|
||||
const styleId = `oc-font-${font.id}`
|
||||
if (document.getElementById(styleId)) return Promise.resolve()
|
||||
const hit = loads.get(font.id)
|
||||
if (hit) return hit
|
||||
const files = getFiles()
|
||||
const load = Promise.all([files[font.regular]?.(), files[font.bold]?.()]).then(([regular, bold]) => {
|
||||
if (!regular || !bold) return
|
||||
if (document.getElementById(styleId)) return
|
||||
const style = document.createElement("style")
|
||||
style.id = styleId
|
||||
style.textContent = css({ family: font.family, regular, bold })
|
||||
document.head.appendChild(style)
|
||||
})
|
||||
loads.set(font.id, load)
|
||||
return load
|
||||
}
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
import { createEffect, onCleanup, onMount } from "solid-js"
|
||||
import { createStore } from "solid-js/store"
|
||||
import { createSimpleContext } from "../context/helper"
|
||||
import oc2ThemeJson from "./themes/oc-2.json"
|
||||
import { DEFAULT_THEMES } from "./default-themes"
|
||||
import { resolveThemeVariant, themeToCss } from "./resolve"
|
||||
import type { DesktopTheme } from "./types"
|
||||
|
||||
|
|
@ -15,101 +15,14 @@ const STORAGE_KEYS = {
|
|||
} as const
|
||||
|
||||
const THEME_STYLE_ID = "oc-theme"
|
||||
let files: Record<string, () => Promise<{ default: DesktopTheme }>> | undefined
|
||||
let ids: string[] | undefined
|
||||
let known: Set<string> | undefined
|
||||
|
||||
function getFiles() {
|
||||
if (files) return files
|
||||
files = import.meta.glob<{ default: DesktopTheme }>("./themes/*.json")
|
||||
return files
|
||||
}
|
||||
|
||||
function themeIDs() {
|
||||
if (ids) return ids
|
||||
ids = Object.keys(getFiles())
|
||||
.map((path) => path.slice("./themes/".length, -".json".length))
|
||||
.sort()
|
||||
return ids
|
||||
}
|
||||
|
||||
function knownThemes() {
|
||||
if (known) return known
|
||||
known = new Set(themeIDs())
|
||||
return known
|
||||
}
|
||||
|
||||
const names: Record<string, string> = {
|
||||
"oc-2": "OC-2",
|
||||
amoled: "AMOLED",
|
||||
aura: "Aura",
|
||||
ayu: "Ayu",
|
||||
carbonfox: "Carbonfox",
|
||||
catppuccin: "Catppuccin",
|
||||
"catppuccin-frappe": "Catppuccin Frappe",
|
||||
"catppuccin-macchiato": "Catppuccin Macchiato",
|
||||
cobalt2: "Cobalt2",
|
||||
cursor: "Cursor",
|
||||
dracula: "Dracula",
|
||||
everforest: "Everforest",
|
||||
flexoki: "Flexoki",
|
||||
github: "GitHub",
|
||||
gruvbox: "Gruvbox",
|
||||
kanagawa: "Kanagawa",
|
||||
"lucent-orng": "Lucent Orng",
|
||||
material: "Material",
|
||||
matrix: "Matrix",
|
||||
mercury: "Mercury",
|
||||
monokai: "Monokai",
|
||||
nightowl: "Night Owl",
|
||||
nord: "Nord",
|
||||
"one-dark": "One Dark",
|
||||
onedarkpro: "One Dark Pro",
|
||||
opencode: "OpenCode",
|
||||
orng: "Orng",
|
||||
"osaka-jade": "Osaka Jade",
|
||||
palenight: "Palenight",
|
||||
rosepine: "Rose Pine",
|
||||
shadesofpurple: "Shades of Purple",
|
||||
solarized: "Solarized",
|
||||
synthwave84: "Synthwave '84",
|
||||
tokyonight: "Tokyonight",
|
||||
vercel: "Vercel",
|
||||
vesper: "Vesper",
|
||||
zenburn: "Zenburn",
|
||||
}
|
||||
const oc2Theme = oc2ThemeJson as DesktopTheme
|
||||
|
||||
function normalize(id: string | null | undefined) {
|
||||
return id === "oc-1" ? "oc-2" : id
|
||||
}
|
||||
|
||||
function read(key: string) {
|
||||
if (typeof localStorage !== "object") return null
|
||||
try {
|
||||
return localStorage.getItem(key)
|
||||
} catch {
|
||||
return null
|
||||
}
|
||||
}
|
||||
|
||||
function write(key: string, value: string) {
|
||||
if (typeof localStorage !== "object") return
|
||||
try {
|
||||
localStorage.setItem(key, value)
|
||||
} catch {}
|
||||
}
|
||||
|
||||
function drop(key: string) {
|
||||
if (typeof localStorage !== "object") return
|
||||
try {
|
||||
localStorage.removeItem(key)
|
||||
} catch {}
|
||||
}
|
||||
|
||||
function clear() {
|
||||
drop(STORAGE_KEYS.THEME_CSS_LIGHT)
|
||||
drop(STORAGE_KEYS.THEME_CSS_DARK)
|
||||
localStorage.removeItem(STORAGE_KEYS.THEME_CSS_LIGHT)
|
||||
localStorage.removeItem(STORAGE_KEYS.THEME_CSS_DARK)
|
||||
}
|
||||
|
||||
function ensureThemeStyleElement(): HTMLStyleElement {
|
||||
|
|
@ -122,7 +35,6 @@ function ensureThemeStyleElement(): HTMLStyleElement {
|
|||
}
|
||||
|
||||
function getSystemMode(): "light" | "dark" {
|
||||
if (typeof window !== "object") return "light"
|
||||
return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light"
|
||||
}
|
||||
|
||||
|
|
@ -133,7 +45,9 @@ function applyThemeCss(theme: DesktopTheme, themeId: string, mode: "light" | "da
|
|||
const css = themeToCss(tokens)
|
||||
|
||||
if (themeId !== "oc-2") {
|
||||
write(isDark ? STORAGE_KEYS.THEME_CSS_DARK : STORAGE_KEYS.THEME_CSS_LIGHT, css)
|
||||
try {
|
||||
localStorage.setItem(isDark ? STORAGE_KEYS.THEME_CSS_DARK : STORAGE_KEYS.THEME_CSS_LIGHT, css)
|
||||
} catch {}
|
||||
}
|
||||
|
||||
const fullCss = `:root {
|
||||
|
|
@ -155,122 +69,74 @@ function cacheThemeVariants(theme: DesktopTheme, themeId: string) {
|
|||
const variant = isDark ? theme.dark : theme.light
|
||||
const tokens = resolveThemeVariant(variant, isDark)
|
||||
const css = themeToCss(tokens)
|
||||
write(isDark ? STORAGE_KEYS.THEME_CSS_DARK : STORAGE_KEYS.THEME_CSS_LIGHT, css)
|
||||
try {
|
||||
localStorage.setItem(isDark ? STORAGE_KEYS.THEME_CSS_DARK : STORAGE_KEYS.THEME_CSS_LIGHT, css)
|
||||
} catch {}
|
||||
}
|
||||
}
|
||||
|
||||
export const { use: useTheme, provider: ThemeProvider } = createSimpleContext({
|
||||
name: "Theme",
|
||||
init: (props: { defaultTheme?: string; onThemeApplied?: (theme: DesktopTheme, mode: "light" | "dark") => void }) => {
|
||||
const themeId = normalize(read(STORAGE_KEYS.THEME_ID) ?? props.defaultTheme) ?? "oc-2"
|
||||
const colorScheme = (read(STORAGE_KEYS.COLOR_SCHEME) as ColorScheme | null) ?? "system"
|
||||
const mode = colorScheme === "system" ? getSystemMode() : colorScheme
|
||||
const [store, setStore] = createStore({
|
||||
themes: {
|
||||
"oc-2": oc2Theme,
|
||||
} as Record<string, DesktopTheme>,
|
||||
themeId,
|
||||
colorScheme,
|
||||
mode,
|
||||
themes: DEFAULT_THEMES as Record<string, DesktopTheme>,
|
||||
themeId: normalize(props.defaultTheme) ?? "oc-2",
|
||||
colorScheme: "system" as ColorScheme,
|
||||
mode: getSystemMode(),
|
||||
previewThemeId: null as string | null,
|
||||
previewScheme: null as ColorScheme | null,
|
||||
})
|
||||
|
||||
const loads = new Map<string, Promise<DesktopTheme | undefined>>()
|
||||
window.addEventListener("storage", (e) => {
|
||||
if (e.key === STORAGE_KEYS.THEME_ID && e.newValue) setStore("themeId", e.newValue)
|
||||
if (e.key === STORAGE_KEYS.COLOR_SCHEME && e.newValue) {
|
||||
setStore("colorScheme", e.newValue as ColorScheme)
|
||||
setStore("mode", e.newValue === "system" ? getSystemMode() : (e.newValue as any))
|
||||
}
|
||||
})
|
||||
|
||||
const load = (id: string) => {
|
||||
const next = normalize(id)
|
||||
if (!next) return Promise.resolve(undefined)
|
||||
const hit = store.themes[next]
|
||||
if (hit) return Promise.resolve(hit)
|
||||
const pending = loads.get(next)
|
||||
if (pending) return pending
|
||||
const file = getFiles()[`./themes/${next}.json`]
|
||||
if (!file) return Promise.resolve(undefined)
|
||||
const task = file()
|
||||
.then((mod) => {
|
||||
const theme = mod.default
|
||||
setStore("themes", next, theme)
|
||||
return theme
|
||||
})
|
||||
.finally(() => {
|
||||
loads.delete(next)
|
||||
})
|
||||
loads.set(next, task)
|
||||
return task
|
||||
}
|
||||
onMount(() => {
|
||||
const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)")
|
||||
const handler = () => {
|
||||
if (store.colorScheme === "system") {
|
||||
setStore("mode", getSystemMode())
|
||||
}
|
||||
}
|
||||
mediaQuery.addEventListener("change", handler)
|
||||
onCleanup(() => mediaQuery.removeEventListener("change", handler))
|
||||
|
||||
const savedTheme = localStorage.getItem(STORAGE_KEYS.THEME_ID)
|
||||
const themeId = normalize(savedTheme)
|
||||
const savedScheme = localStorage.getItem(STORAGE_KEYS.COLOR_SCHEME) as ColorScheme | null
|
||||
if (themeId && store.themes[themeId]) {
|
||||
setStore("themeId", themeId)
|
||||
}
|
||||
if (savedTheme && themeId && savedTheme !== themeId) {
|
||||
localStorage.setItem(STORAGE_KEYS.THEME_ID, themeId)
|
||||
clear()
|
||||
}
|
||||
if (savedScheme) {
|
||||
setStore("colorScheme", savedScheme)
|
||||
if (savedScheme !== "system") {
|
||||
setStore("mode", savedScheme)
|
||||
}
|
||||
}
|
||||
const currentTheme = store.themes[store.themeId]
|
||||
if (currentTheme) {
|
||||
cacheThemeVariants(currentTheme, store.themeId)
|
||||
}
|
||||
})
|
||||
|
||||
const applyTheme = (theme: DesktopTheme, themeId: string, mode: "light" | "dark") => {
|
||||
applyThemeCss(theme, themeId, mode)
|
||||
props.onThemeApplied?.(theme, mode)
|
||||
}
|
||||
|
||||
const ids = () => {
|
||||
const extra = Object.keys(store.themes)
|
||||
.filter((id) => !knownThemes().has(id))
|
||||
.sort()
|
||||
const all = themeIDs()
|
||||
if (extra.length === 0) return all
|
||||
return [...all, ...extra]
|
||||
}
|
||||
|
||||
const loadThemes = () => Promise.all(themeIDs().map(load)).then(() => store.themes)
|
||||
|
||||
const onStorage = (e: StorageEvent) => {
|
||||
if (e.key === STORAGE_KEYS.THEME_ID && e.newValue) {
|
||||
const next = normalize(e.newValue)
|
||||
if (!next) return
|
||||
if (next !== "oc-2" && !knownThemes().has(next) && !store.themes[next]) return
|
||||
setStore("themeId", next)
|
||||
if (next === "oc-2") {
|
||||
clear()
|
||||
return
|
||||
}
|
||||
void load(next).then((theme) => {
|
||||
if (!theme || store.themeId !== next) return
|
||||
cacheThemeVariants(theme, next)
|
||||
})
|
||||
}
|
||||
if (e.key === STORAGE_KEYS.COLOR_SCHEME && e.newValue) {
|
||||
setStore("colorScheme", e.newValue as ColorScheme)
|
||||
setStore("mode", e.newValue === "system" ? getSystemMode() : (e.newValue as "light" | "dark"))
|
||||
}
|
||||
}
|
||||
|
||||
if (typeof window === "object") {
|
||||
window.addEventListener("storage", onStorage)
|
||||
onCleanup(() => window.removeEventListener("storage", onStorage))
|
||||
}
|
||||
|
||||
onMount(() => {
|
||||
const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)")
|
||||
const onMedia = () => {
|
||||
if (store.colorScheme !== "system") return
|
||||
setStore("mode", getSystemMode())
|
||||
}
|
||||
mediaQuery.addEventListener("change", onMedia)
|
||||
onCleanup(() => mediaQuery.removeEventListener("change", onMedia))
|
||||
|
||||
const rawTheme = read(STORAGE_KEYS.THEME_ID)
|
||||
const savedTheme = normalize(rawTheme ?? props.defaultTheme) ?? "oc-2"
|
||||
const savedScheme = (read(STORAGE_KEYS.COLOR_SCHEME) as ColorScheme | null) ?? "system"
|
||||
if (rawTheme && rawTheme !== savedTheme) {
|
||||
write(STORAGE_KEYS.THEME_ID, savedTheme)
|
||||
clear()
|
||||
}
|
||||
if (savedTheme !== store.themeId) setStore("themeId", savedTheme)
|
||||
if (savedScheme !== store.colorScheme) setStore("colorScheme", savedScheme)
|
||||
setStore("mode", savedScheme === "system" ? getSystemMode() : savedScheme)
|
||||
void load(savedTheme).then((theme) => {
|
||||
if (!theme || store.themeId !== savedTheme) return
|
||||
cacheThemeVariants(theme, savedTheme)
|
||||
})
|
||||
})
|
||||
|
||||
createEffect(() => {
|
||||
const theme = store.themes[store.themeId]
|
||||
if (!theme) return
|
||||
applyTheme(theme, store.themeId, store.mode)
|
||||
if (theme) {
|
||||
applyTheme(theme, store.themeId, store.mode)
|
||||
}
|
||||
})
|
||||
|
||||
const setTheme = (id: string) => {
|
||||
|
|
@ -279,26 +145,23 @@ export const { use: useTheme, provider: ThemeProvider } = createSimpleContext({
|
|||
console.warn(`Theme "${id}" not found`)
|
||||
return
|
||||
}
|
||||
if (next !== "oc-2" && !knownThemes().has(next) && !store.themes[next]) {
|
||||
const theme = store.themes[next]
|
||||
if (!theme) {
|
||||
console.warn(`Theme "${id}" not found`)
|
||||
return
|
||||
}
|
||||
setStore("themeId", next)
|
||||
localStorage.setItem(STORAGE_KEYS.THEME_ID, next)
|
||||
if (next === "oc-2") {
|
||||
write(STORAGE_KEYS.THEME_ID, next)
|
||||
clear()
|
||||
return
|
||||
}
|
||||
void load(next).then((theme) => {
|
||||
if (!theme || store.themeId !== next) return
|
||||
cacheThemeVariants(theme, next)
|
||||
write(STORAGE_KEYS.THEME_ID, next)
|
||||
})
|
||||
cacheThemeVariants(theme, next)
|
||||
}
|
||||
|
||||
const setColorScheme = (scheme: ColorScheme) => {
|
||||
setStore("colorScheme", scheme)
|
||||
write(STORAGE_KEYS.COLOR_SCHEME, scheme)
|
||||
localStorage.setItem(STORAGE_KEYS.COLOR_SCHEME, scheme)
|
||||
setStore("mode", scheme === "system" ? getSystemMode() : scheme)
|
||||
}
|
||||
|
||||
|
|
@ -306,9 +169,6 @@ export const { use: useTheme, provider: ThemeProvider } = createSimpleContext({
|
|||
themeId: () => store.themeId,
|
||||
colorScheme: () => store.colorScheme,
|
||||
mode: () => store.mode,
|
||||
ids,
|
||||
name: (id: string) => store.themes[id]?.name ?? names[id] ?? id,
|
||||
loadThemes,
|
||||
themes: () => store.themes,
|
||||
setTheme,
|
||||
setColorScheme,
|
||||
|
|
@ -316,28 +176,24 @@ export const { use: useTheme, provider: ThemeProvider } = createSimpleContext({
|
|||
previewTheme: (id: string) => {
|
||||
const next = normalize(id)
|
||||
if (!next) return
|
||||
if (next !== "oc-2" && !knownThemes().has(next) && !store.themes[next]) return
|
||||
const theme = store.themes[next]
|
||||
if (!theme) return
|
||||
setStore("previewThemeId", next)
|
||||
void load(next).then((theme) => {
|
||||
if (!theme || store.previewThemeId !== next) return
|
||||
const mode = store.previewScheme
|
||||
? store.previewScheme === "system"
|
||||
? getSystemMode()
|
||||
: store.previewScheme
|
||||
: store.mode
|
||||
applyTheme(theme, next, mode)
|
||||
})
|
||||
const previewMode = store.previewScheme
|
||||
? store.previewScheme === "system"
|
||||
? getSystemMode()
|
||||
: store.previewScheme
|
||||
: store.mode
|
||||
applyTheme(theme, next, previewMode)
|
||||
},
|
||||
previewColorScheme: (scheme: ColorScheme) => {
|
||||
setStore("previewScheme", scheme)
|
||||
const mode = scheme === "system" ? getSystemMode() : scheme
|
||||
const previewMode = scheme === "system" ? getSystemMode() : scheme
|
||||
const id = store.previewThemeId ?? store.themeId
|
||||
void load(id).then((theme) => {
|
||||
if (!theme) return
|
||||
if ((store.previewThemeId ?? store.themeId) !== id) return
|
||||
if (store.previewScheme !== scheme) return
|
||||
applyTheme(theme, id, mode)
|
||||
})
|
||||
const theme = store.themes[id]
|
||||
if (theme) {
|
||||
applyTheme(theme, id, previewMode)
|
||||
}
|
||||
},
|
||||
commitPreview: () => {
|
||||
if (store.previewThemeId) {
|
||||
|
|
@ -352,10 +208,10 @@ export const { use: useTheme, provider: ThemeProvider } = createSimpleContext({
|
|||
cancelPreview: () => {
|
||||
setStore("previewThemeId", null)
|
||||
setStore("previewScheme", null)
|
||||
void load(store.themeId).then((theme) => {
|
||||
if (!theme) return
|
||||
const theme = store.themes[store.themeId]
|
||||
if (theme) {
|
||||
applyTheme(theme, store.themeId, store.mode)
|
||||
})
|
||||
}
|
||||
},
|
||||
}
|
||||
},
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue