@gospore/theme 1.0.119 → 1.0.121

package/dist/theme.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue");require("what-input");const a={class:"theme"},h=Object.assign({name:"Theme"},{__name:"Theme",setup($){const t=e.ref({darkMode:window.matchMedia("(prefers-color-scheme: dark)").matches});window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",n);var o=document.createElement("meta");o.name="color-scheme",o.setAttribute("content","light dark"),document.getElementsByTagName("head")[0].appendChild(o),e.watch(t.value,()=>{document.documentElement.setAttribute("dark-mode",t.value.darkMode)},{deep:!0,immediate:!0}),e.onBeforeUnmount(()=>{window.matchMedia("(prefers-color-scheme: dark)").removeEventListener("change",n)});function n(s){s&&(t.value.darkMode=s.matches)}return e.provide("theme",t),(s,x)=>(e.openBlock(),e.createElementBlock("div",a,[e.renderSlot(s.$slots,"default")]))}}),l="hsl(225, 90%, 16%)",m="#061f80",c="hsl(225, 94%, 35%)",d="#06c",N="hsl(210, 100%, 50%)",i="hsl(210, 100%, 93%)",u="hsl(225, 100%, 96%)",p="hsl(12, 91%, 46%)",B="hsl(11, 100%, 59%)",f="hsl(40, 100%, 50%)",k="hsl(46, 100%, 50%)",v="hsl(120, 100%, 25%)",y="#36b37e",M="hsl(0, 0%, 0%)",_="hsl(218, 76%, 15%)",g="hsla(0,0%,10%,.9)",w="hsla(0,0%,10%,.6)",b="hsl(218, 20%, 39%)",E="hsl(218, 17%, 44%)",T="hsl(218, 14%, 49%)",G="hsl(218, 14%, 54%)",R="hsl(218, 13%, 59%)",S="hsl(218, 13%, 64%)",Y="hsl(217, 13%, 69%)",j="hsl(223, 12%, 89%)",q="hsl(228, 14%, 93%)",A="hsl(210, 7%, 95%)",L="hsl(220, 16%, 96%)",O="hsl(210, 25%, 98%)",C="hsl(0, 0%, 98%)",r="hsl(0, 0%, 100%)",D=c,P=c,U=r;exports.B100=u;exports.B200=i;exports.B300=N;exports.B400=d;exports.B500=c;exports.B600=m;exports.B900=l;exports.G300=y;exports.G500=v;exports.N0=r;exports.N10=O;exports.N100=G;exports.N1000=M;exports.N20=L;exports.N200=T;exports.N25=A;exports.N30=q;exports.N300=E;exports.N40=j;exports.N400=b;exports.N5=C;exports.N500=w;exports.N70=Y;exports.N80=S;exports.N800=g;exports.N90=R;exports.N900=_;exports.R300=B;exports.R400=p;exports.Theme=h;exports.Y200=k;exports.Y300=f;exports.primary1=D;exports.primary2=P;exports.primary3=U;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue");require("what-input");const f=require("@gospore/dropdown-menu"),M={class:"theme"},b="(prefers-color-scheme: dark)",g="(prefers-reduced-motion: reduce)",E=200,S=Object.assign({name:"Theme"},{__name:"Theme",props:{mode:{type:String,default:"auto",validator:s=>["auto","light","dark"].includes(s)}},setup(s){const d=s,c=window.matchMedia(b),r=window.matchMedia(g),l=e.ref({darkMode:m(d.mode)});c.addEventListener("change",h);var i=document.createElement("meta");i.name="color-scheme",i.setAttribute("content","light dark"),document.getElementsByTagName("head")[0].appendChild(i),e.watch(()=>d.mode,()=>{p()},{immediate:!0}),e.watch(()=>l.value.darkMode,(n,t)=>{if(t===void 0){a(n);return}N(()=>{a(n)})},{immediate:!0}),e.onBeforeUnmount(()=>{c.removeEventListener("change",h)});function p(){l.value.darkMode=m(d.mode)}function m(n){return n==="dark"?!0:n==="light"?!1:c.matches}function h(n){!n||d.mode!=="auto"||(l.value.darkMode=n.matches)}function a(n){document.documentElement.setAttribute("dark-mode",n)}function N(n){if(r.matches){n();return}const t=document.startViewTransition?.bind(document);if(t){t(()=>{n()});return}n();const o=document.documentElement;typeof o.animate=="function"&&window.requestAnimationFrame(()=>{o.animate([{opacity:.85},{opacity:1}],{duration:E,easing:"ease-in-out"})})}return e.provide("theme",l),(n,t)=>(e.openBlock(),e.createElementBlock("div",M,[e.renderSlot(n.$slots,"default")]))}}),_=(s,d)=>{const c=s.__vccOpts||s;for(const[r,l]of d)c[r]=l;return c},w="gospore-theme-mode",B={__name:"ThemeSwitcher",props:{mode:{type:String,default:"auto",validator:s=>["auto","light","dark"].includes(s)}},emits:["update:mode"],setup(s,{emit:d}){const c=[{value:"auto",label:"System"},{value:"light",label:"Light"},{value:"dark",label:"Dark"}],r=c.reduce((t,o)=>(t[o.value]=o.label,t),{}),l=c.map(t=>t.value),i=s,p=d,m=e.ref(!1),h=N()??i.mode,a=e.ref(l.includes(h)?h:"auto");e.computed(()=>r[a.value]??r.auto),e.watch(()=>i.mode,t=>{l.includes(t)&&t!==a.value&&(a.value=t)}),e.watch(a,t=>{if(!l.includes(t)){a.value="auto";return}m.value=!1,p("update:mode",t),n(t)},{immediate:!0});function N(){if(typeof window>"u")return null;const t=window.localStorage.getItem(w);return t&&l.includes(t)?t:null}function n(t){typeof window>"u"||window.localStorage.setItem(w,t)}return(t,o)=>(e.openBlock(),e.createBlock(e.unref(f.DropdownMenu),{open:m.value,"onUpdate:open":o[3]||(o[3]=u=>m.value=u),text:"Theme","aria-label":"Select theme mode"},{default:e.withCtx(()=>[e.createVNode(e.unref(f.DropdownItemGroup),{title:"Theme"},{default:e.withCtx(()=>[e.createVNode(e.unref(f.DropdownItemRadio),{checked:a.value,"onUpdate:checked":o[0]||(o[0]=u=>a.value=u),value:"auto",label:e.unref(r).auto,"aria-label":`${e.unref(r).auto} mode`},null,8,["checked","label","aria-label"]),o[4]||(o[4]=e.createElementVNode("hr",{class:"theme-switcher-divider",role:"separator"},null,-1)),e.createVNode(e.unref(f.DropdownItemRadio),{checked:a.value,"onUpdate:checked":o[1]||(o[1]=u=>a.value=u),value:"light",label:e.unref(r).light,"aria-label":`${e.unref(r).light} mode`},null,8,["checked","label","aria-label"]),e.createVNode(e.unref(f.DropdownItemRadio),{checked:a.value,"onUpdate:checked":o[2]||(o[2]=u=>a.value=u),value:"dark",label:e.unref(r).dark,"aria-label":`${e.unref(r).dark} mode`},null,8,["checked","label","aria-label"])]),_:1})]),_:1},8,["open"]))}},D=_(B,[["__scopeId","data-v-441a2d2e"]]),T="hsl(225, 90%, 16%)",y="#061f80",v="hsl(225, 94%, 35%)",R="#06c",O="hsl(210, 100%, 50%)",I="hsl(210, 100%, 93%)",A="hsl(225, 100%, 96%)",U="hsl(12, 91%, 46%)",V="hsl(11, 100%, 59%)",Y="hsl(40, 100%, 50%)",G="hsl(46, 100%, 50%)",L="hsl(120, 100%, 25%)",x="#36b37e",C="hsl(0, 0%, 0%)",$="hsl(218, 76%, 15%)",q="hsla(0,0%,10%,.9)",P="hsla(0,0%,10%,.6)",j="hsl(218, 20%, 39%)",F="hsl(218, 17%, 44%)",K="hsl(218, 14%, 49%)",Q="hsl(218, 14%, 54%)",H="hsl(218, 13%, 59%)",z="hsl(218, 13%, 64%)",J="hsl(217, 13%, 69%)",W="hsl(223, 12%, 89%)",X="hsl(228, 14%, 93%)",Z="hsl(210, 7%, 95%)",ee="hsl(220, 16%, 96%)",te="hsl(210, 25%, 98%)",ne="hsl(0, 0%, 98%)",k="hsl(0, 0%, 100%)",oe=v,ae=v,re=k;exports.B100=A;exports.B200=I;exports.B300=O;exports.B400=R;exports.B500=v;exports.B600=y;exports.B900=T;exports.G300=x;exports.G500=L;exports.N0=k;exports.N10=te;exports.N100=Q;exports.N1000=C;exports.N20=ee;exports.N200=K;exports.N25=Z;exports.N30=X;exports.N300=F;exports.N40=W;exports.N400=j;exports.N5=ne;exports.N500=P;exports.N70=J;exports.N80=z;exports.N800=q;exports.N90=H;exports.N900=$;exports.R300=V;exports.R400=U;exports.Theme=S;exports.ThemeSwitcher=D;exports.Y200=G;exports.Y300=Y;exports.primary1=oe;exports.primary2=ae;exports.primary3=re;
 //# sourceMappingURL=theme.cjs.js.map

package/dist/theme.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme.cjs.js","sources":["../src/Theme.vue","../src/colors.js"],"sourcesContent":["<template>\n    <div class=\"theme\">\n        <slot />\n    </div>\n</template>\n\n<script setup>\nimport { provide, ref, watch, onBeforeUnmount } from \"vue\";\nimport \"what-input\";\n\ndefineOptions({\n    name: \"Theme\",\n});\nconst theme = ref({\n    darkMode: window.matchMedia(\"(prefers-color-scheme: dark)\").matches,\n});\n\nwindow\n    .matchMedia(\"(prefers-color-scheme: dark)\")\n    .addEventListener(\"change\", updateDarkMode);\n// Set the color-scheme meta tag.\nvar colorSchemeMeta = document.createElement(\"meta\");\ncolorSchemeMeta.name = \"color-scheme\";\ncolorSchemeMeta.setAttribute(\"content\", \"light dark\");\ndocument.getElementsByTagName(\"head\")[0].appendChild(colorSchemeMeta);\n\nwatch(\n    theme.value,\n    () => {\n        document.documentElement.setAttribute(\n            \"dark-mode\",\n            theme.value.darkMode,\n        );\n    },\n    { deep: true, immediate: true },\n);\n\nonBeforeUnmount(() => {\n    window\n        .matchMedia(\"(prefers-color-scheme: dark)\")\n        .removeEventListener(\"change\", updateDarkMode);\n});\n\nfunction updateDarkMode(event) {\n    if (!event) {\n        return;\n    }\n    theme.value.darkMode = event.matches;\n}\n\nprovide(\"theme\", theme);\n</script>\n\n<style lang=\"less\">\n@import \"index.less\";\n</style>\n","// Blues\nexport const B900 = \"hsl(225, 90%, 16%)\";\n// @go-color-b700 = #000e7f;\nexport const B600 = \"#061f80\";\nexport const B500 = \"hsl(225, 94%, 35%)\";\n// @go-color-b550 = #131ff2;\n// @go-color-b500 = #001dff;\n// @go-color-b400 = #3333ff;\nexport const B400 = \"#06c\";\nexport const B300 = \"hsl(210, 100%, 50%)\";\nexport const B200 = \"hsl(210, 100%, 93%)\";\nexport const B100 = \"hsl(225, 100%, 96%)\";\n\n// Reds\nexport const R400 = \"hsl(12, 91%, 46%)\";\nexport const R300 = \"hsl(11, 100%, 59%)\";\n\n// Yellows\nexport const Y300 = \"hsl(40, 100%, 50%)\";\nexport const Y200 = \"hsl(46, 100%, 50%)\";\n\n// Greens\nexport const G500 = \"hsl(120, 100%, 25%)\";\nexport const G300 = \"#36b37e\";\n\n// Neutrals\nexport const N1000 = \"hsl(0, 0%, 0%)\";\nexport const N900 = \"hsl(218, 76%, 15%)\";\n// @go-color-n900 = hsl(218, 54%, 20%);\nexport const N800 = \"hsla(0,0%,10%,.9)\";\nexport const N500 = \"hsla(0,0%,10%,.6)\";\nexport const N400 = \"hsl(218, 20%, 39%)\";\nexport const N300 = \"hsl(218, 17%, 44%)\";\nexport const N200 = \"hsl(218, 14%, 49%)\";\nexport const N100 = \"hsl(218, 14%, 54%)\";\nexport const N90 = \"hsl(218, 13%, 59%)\";\nexport const N80 = \"hsl(218, 13%, 64%)\";\nexport const N70 = \"hsl(217, 13%, 69%)\";\nexport const N40 = \"hsl(223, 12%, 89%)\";\nexport const N30 = \"hsl(228, 14%, 93%)\";\nexport const N25 = \"hsl(210, 7%, 95%)\";\nexport const N20 = \"hsl(220, 16%, 96%)\";\nexport const N10 = \"hsl(210, 25%, 98%)\";\nexport const N5 = \"hsl(0, 0%, 98%)\";\nexport const N0 = \"hsl(0, 0%, 100%)\";\n\n// Primary color palette\nexport const primary1 = B500;\nexport const primary2 = B500;\nexport const primary3 = N0;\n"],"names":["theme","ref","updateDarkMode","colorSchemeMeta","watch","onBeforeUnmount","event","provide","_openBlock","_createElementBlock","_hoisted_1","_renderSlot","_ctx","B900","B600","B500","B400","B300","B200","B100","R400","R300","Y300","Y200","G500","G300","N1000","N900","N800","N500","N400","N300","N200","N100","N90","N80","N70","N40","N30","N25","N20","N10","N5","N0","primary1","primary2","primary3"],"mappings":"6MAaA,MAAMA,EAAQC,EAAAA,IAAI,CACd,SAAU,OAAO,WAAW,8BAA8B,EAAE,OAChE,CAAC,EAED,OACK,WAAW,8BAA8B,EACzC,iBAAiB,SAAUC,CAAc,EAE9C,IAAIC,EAAkB,SAAS,cAAc,MAAM,EACnDA,EAAgB,KAAO,eACvBA,EAAgB,aAAa,UAAW,YAAY,EACpD,SAAS,qBAAqB,MAAM,EAAE,CAAC,EAAE,YAAYA,CAAe,EAEpEC,EAAAA,MACIJ,EAAM,MACN,IAAM,CACF,SAAS,gBAAgB,aACrB,YACAA,EAAM,MAAM,QACxB,CACI,EACA,CAAE,KAAM,GAAM,UAAW,EAAI,CACjC,EAEAK,EAAAA,gBAAgB,IAAM,CAClB,OACK,WAAW,8BAA8B,EACzC,oBAAoB,SAAUH,CAAc,CACrD,CAAC,EAED,SAASA,EAAeI,EAAO,CACtBA,IAGLN,EAAM,MAAM,SAAWM,EAAM,QACjC,CAEAC,OAAAA,EAAAA,QAAQ,QAASP,CAAK,UAjDlBQ,YAAA,EAAAC,qBAEM,MAFNC,EAEM,CADFC,aAAQC,EAAA,OAAA,SAAA,QCDHC,EAAO,qBAEPC,EAAO,UACPC,EAAO,qBAIPC,EAAO,OACPC,EAAO,sBACPC,EAAO,sBACPC,EAAO,sBAGPC,EAAO,oBACPC,EAAO,qBAGPC,EAAO,qBACPC,EAAO,qBAGPC,EAAO,sBACPC,EAAO,UAGPC,EAAQ,iBACRC,EAAO,qBAEPC,EAAO,oBACPC,EAAO,oBACPC,EAAO,qBACPC,EAAO,qBACPC,EAAO,qBACPC,EAAO,qBACPC,EAAM,qBACNC,EAAM,qBACNC,EAAM,qBACNC,EAAM,qBACNC,EAAM,qBACNC,EAAM,oBACNC,EAAM,qBACNC,EAAM,qBACNC,EAAK,kBACLC,EAAK,mBAGLC,EAAW7B,EACX8B,EAAW9B,EACX+B,EAAWH"}
+{"version":3,"file":"theme.cjs.js","sources":["../src/Theme.vue","../src/ThemeSwitcher.vue","../src/colors.js"],"sourcesContent":["<template>\n    <div class=\"theme\">\n        <slot />\n    </div>\n</template>\n\n<script setup>\nimport { provide, ref, watch, onBeforeUnmount } from \"vue\";\nimport \"what-input\";\n\ndefineOptions({\n    name: \"Theme\",\n});\nconst props = defineProps({\n    mode: {\n        type: String,\n        default: \"auto\",\n        validator: (value) => [\"auto\", \"light\", \"dark\"].includes(value),\n    },\n});\n\nconst DARK_MODE_QUERY = \"(prefers-color-scheme: dark)\";\nconst PREFERS_REDUCED_MOTION_QUERY = \"(prefers-reduced-motion: reduce)\";\nconst THEME_TRANSITION_DURATION = 200;\nconst darkModeMedia = window.matchMedia(DARK_MODE_QUERY);\nconst prefersReducedMotionMedia = window.matchMedia(\n    PREFERS_REDUCED_MOTION_QUERY,\n);\n\nconst theme = ref({\n    darkMode: resolveDarkMode(props.mode),\n});\n\ndarkModeMedia.addEventListener(\"change\", handleSystemPreferenceChange);\n\n// Set the color-scheme meta tag.\nvar colorSchemeMeta = document.createElement(\"meta\");\ncolorSchemeMeta.name = \"color-scheme\";\ncolorSchemeMeta.setAttribute(\"content\", \"light dark\");\ndocument.getElementsByTagName(\"head\")[0].appendChild(colorSchemeMeta);\n\nwatch(\n    () => props.mode,\n    () => {\n        syncDarkMode();\n    },\n    { immediate: true },\n);\n\nwatch(\n    () => theme.value.darkMode,\n    (darkMode, previousValue) => {\n        if (previousValue === undefined) {\n            setDocumentDarkModeAttribute(darkMode);\n            return;\n        }\n        withThemeTransition(() => {\n            setDocumentDarkModeAttribute(darkMode);\n        });\n    },\n    { immediate: true },\n);\n\nonBeforeUnmount(() => {\n    darkModeMedia.removeEventListener(\"change\", handleSystemPreferenceChange);\n});\n\nfunction syncDarkMode() {\n    theme.value.darkMode = resolveDarkMode(props.mode);\n}\n\nfunction resolveDarkMode(mode) {\n    if (mode === \"dark\") {\n        return true;\n    }\n    if (mode === \"light\") {\n        return false;\n    }\n    return darkModeMedia.matches;\n}\n\nfunction handleSystemPreferenceChange(event) {\n    if (!event || props.mode !== \"auto\") {\n        return;\n    }\n    theme.value.darkMode = event.matches;\n}\n\nfunction setDocumentDarkModeAttribute(darkMode) {\n    document.documentElement.setAttribute(\"dark-mode\", darkMode);\n}\n\nfunction withThemeTransition(applyTheme) {\n    if (prefersReducedMotionMedia.matches) {\n        applyTheme();\n        return;\n    }\n    const startViewTransition = document.startViewTransition?.bind(document);\n    if (startViewTransition) {\n        startViewTransition(() => {\n            applyTheme();\n        });\n        return;\n    }\n    applyTheme();\n    const element = document.documentElement;\n    if (typeof element.animate !== \"function\") {\n        return;\n    }\n    window.requestAnimationFrame(() => {\n        element.animate(\n            [\n                { opacity: 0.85 },\n                { opacity: 1 },\n            ],\n            {\n                duration: THEME_TRANSITION_DURATION,\n                easing: \"ease-in-out\",\n            },\n        );\n    });\n}\n\nprovide(\"theme\", theme);\n</script>\n\n<style lang=\"less\">\n@import \"index.less\";\n</style>\n","<template>\n    <DropdownMenu\n        v-model:open=\"open\"\n        text=\"Theme\"\n        aria-label=\"Select theme mode\"\n    >\n        <DropdownItemGroup title=\"Theme\">\n            <DropdownItemRadio\n                v-model:checked=\"internalMode\"\n                value=\"auto\"\n                :label=\"MODE_LABELS.auto\"\n                :aria-label=\"`${MODE_LABELS.auto} mode`\"\n            />\n            <hr class=\"theme-switcher-divider\" role=\"separator\" />\n            <DropdownItemRadio\n                v-model:checked=\"internalMode\"\n                value=\"light\"\n                :label=\"MODE_LABELS.light\"\n                :aria-label=\"`${MODE_LABELS.light} mode`\"\n            />\n            <DropdownItemRadio\n                v-model:checked=\"internalMode\"\n                value=\"dark\"\n                :label=\"MODE_LABELS.dark\"\n                :aria-label=\"`${MODE_LABELS.dark} mode`\"\n            />\n        </DropdownItemGroup>\n    </DropdownMenu>\n</template>\n\n<script setup>\nimport { ref, computed, watch } from \"vue\";\nimport {\n    DropdownMenu,\n    DropdownItemGroup,\n    DropdownItemRadio,\n} from \"@gospore/dropdown-menu\";\n\nconst MODE_OPTIONS = [\n    { value: \"auto\", label: \"System\" },\n    { value: \"light\", label: \"Light\" },\n    { value: \"dark\", label: \"Dark\" },\n];\nconst MODE_LABELS = MODE_OPTIONS.reduce((map, option) => {\n    map[option.value] = option.label;\n    return map;\n}, {});\nconst VALID_MODES = MODE_OPTIONS.map((option) => option.value);\nconst STORAGE_KEY = \"gospore-theme-mode\";\n\nconst props = defineProps({\n    mode: {\n        type: String,\n        default: \"auto\",\n        validator: (value) => [\"auto\", \"light\", \"dark\"].includes(value),\n    },\n});\nconst emit = defineEmits([\"update:mode\"]);\n\nconst open = ref(false);\nconst initialMode = readStoredMode() ?? props.mode;\nconst internalMode = ref(\n    VALID_MODES.includes(initialMode) ? initialMode : \"auto\",\n);\nconst label = computed(\n    () => MODE_LABELS[internalMode.value] ?? MODE_LABELS.auto,\n);\n\nwatch(\n    () => props.mode,\n    (mode) => {\n        if (VALID_MODES.includes(mode) && mode !== internalMode.value) {\n            internalMode.value = mode;\n        }\n    },\n);\n\nwatch(\n    internalMode,\n    (mode) => {\n        if (!VALID_MODES.includes(mode)) {\n            internalMode.value = \"auto\";\n            return;\n        }\n        open.value = false;\n        emit(\"update:mode\", mode);\n        writeStoredMode(mode);\n    },\n    { immediate: true },\n);\n\nfunction readStoredMode() {\n    if (typeof window === \"undefined\") {\n        return null;\n    }\n    const stored = window.localStorage.getItem(STORAGE_KEY);\n    return stored && VALID_MODES.includes(stored) ? stored : null;\n}\n\nfunction writeStoredMode(mode) {\n    if (typeof window === \"undefined\") {\n        return;\n    }\n    window.localStorage.setItem(STORAGE_KEY, mode);\n}\n</script>\n\n<style scoped lang=\"less\">\n.theme-switcher-divider {\n    margin: 4px 0;\n    background-color: var(--go-color-n20);\n}\n\n[dark-mode=\"true\"] {\n    .theme-switcher-divider {\n        background-color: var(--background-color-secondary-dark);\n    }\n}\n</style>\n","// Blues\nexport const B900 = \"hsl(225, 90%, 16%)\";\n// @go-color-b700 = #000e7f;\nexport const B600 = \"#061f80\";\nexport const B500 = \"hsl(225, 94%, 35%)\";\n// @go-color-b550 = #131ff2;\n// @go-color-b500 = #001dff;\n// @go-color-b400 = #3333ff;\nexport const B400 = \"#06c\";\nexport const B300 = \"hsl(210, 100%, 50%)\";\nexport const B200 = \"hsl(210, 100%, 93%)\";\nexport const B100 = \"hsl(225, 100%, 96%)\";\n\n// Reds\nexport const R400 = \"hsl(12, 91%, 46%)\";\nexport const R300 = \"hsl(11, 100%, 59%)\";\n\n// Yellows\nexport const Y300 = \"hsl(40, 100%, 50%)\";\nexport const Y200 = \"hsl(46, 100%, 50%)\";\n\n// Greens\nexport const G500 = \"hsl(120, 100%, 25%)\";\nexport const G300 = \"#36b37e\";\n\n// Neutrals\nexport const N1000 = \"hsl(0, 0%, 0%)\";\nexport const N900 = \"hsl(218, 76%, 15%)\";\n// @go-color-n900 = hsl(218, 54%, 20%);\nexport const N800 = \"hsla(0,0%,10%,.9)\";\nexport const N500 = \"hsla(0,0%,10%,.6)\";\nexport const N400 = \"hsl(218, 20%, 39%)\";\nexport const N300 = \"hsl(218, 17%, 44%)\";\nexport const N200 = \"hsl(218, 14%, 49%)\";\nexport const N100 = \"hsl(218, 14%, 54%)\";\nexport const N90 = \"hsl(218, 13%, 59%)\";\nexport const N80 = \"hsl(218, 13%, 64%)\";\nexport const N70 = \"hsl(217, 13%, 69%)\";\nexport const N40 = \"hsl(223, 12%, 89%)\";\nexport const N30 = \"hsl(228, 14%, 93%)\";\nexport const N25 = \"hsl(210, 7%, 95%)\";\nexport const N20 = \"hsl(220, 16%, 96%)\";\nexport const N10 = \"hsl(210, 25%, 98%)\";\nexport const N5 = \"hsl(0, 0%, 98%)\";\nexport const N0 = \"hsl(0, 0%, 100%)\";\n\n// Primary color palette\nexport const primary1 = B500;\nexport const primary2 = B500;\nexport const primary3 = N0;\n"],"names":["props","__props","darkModeMedia","DARK_MODE_QUERY","prefersReducedMotionMedia","PREFERS_REDUCED_MOTION_QUERY","theme","ref","resolveDarkMode","handleSystemPreferenceChange","colorSchemeMeta","watch","syncDarkMode","darkMode","previousValue","setDocumentDarkModeAttribute","withThemeTransition","onBeforeUnmount","mode","event","applyTheme","startViewTransition","element","THEME_TRANSITION_DURATION","provide","_openBlock","_createElementBlock","_hoisted_1","_renderSlot","_ctx","MODE_OPTIONS","MODE_LABELS","map","option","VALID_MODES","emit","__emit","open","initialMode","readStoredMode","internalMode","computed","writeStoredMode","stored","STORAGE_KEY","_createBlock","_unref","DropdownMenu","$event","_createVNode","DropdownItemGroup","DropdownItemRadio","_createElementVNode","B900","B600","B500","B400","B300","B200","B100","R400","R300","Y300","Y200","G500","G300","N1000","N900","N800","N500","N400","N300","N200","N100","N90","N80","N70","N40","N30","N25","N20","N10","N5","N0","primary1","primary2","primary3"],"mappings":"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"}

package/dist/theme.css

@@ -1 +1 @@
-:root{--border-radius-regular: 3px;--border-radius-large: 6px;--border-width: var(--border-width-2);--border-width-1: 1px;--border-width-2: 2px;--border-width-3: 3px}:root{--go-color-primary1: var(--go-color-b600);--go-color-primary2: var(--go-color-b500);--go-color-primary3: var(--go-color-n0);--go-color-n0: #ffffff;--go-color-n0-rgb: 255, 255, 255;--go-color-n10: #fafbfc;--go-color-n10-rgb: 250, 251, 252;--go-color-n20: #f4f5f7;--go-color-n30: #ebecf0;--go-color-n40: #dfe1e6;--go-color-n40-rgb: 223, 225, 230;--go-color-n50: #c1c7d0;--go-color-n60: #b3bac5;--go-color-n70: #a5adba;--go-color-n80: #97a0af;--go-color-n90: #8993a4;--go-color-n100: #7a869a;--go-color-n100-rgb: 122, 134, 154;--go-color-n200: #6b778c;--go-color-n300: #5e6c84;--go-color-n400: #505f79;--go-color-n500: #42526e;--go-color-n600: #344563;--go-color-n700: #253858;--go-color-n700-rgb: 37, 56, 88;--go-color-n800: #172b4d;--go-color-n900: #091e42;--go-color-n900-rgb: 9, 30, 66;--go-color-n1000: #000000;--go-color-n1000-rgb: 0, 0, 0;--go-color-dn0: #0d1424;--go-color-dn0-rgb: 13, 20, 36;--go-color-dn10: #0e1624;--go-color-dn20: #121a29;--go-color-dn30: #1b2638;--go-color-dn40: #202b3d;--go-color-dn50: #283447;--go-color-dn60: #313d52;--go-color-dn70: #3b475c;--go-color-dn70-rgb: 61, 72, 92;--go-color-dn80: #455166;--go-color-dn90: #56637a;--go-color-dn100: #67758f;--go-color-dn200: #7988a3;--go-color-dn200-rgb: 121, 136, 163;--go-color-dn300: #8c9cb8;--go-color-dn300-rgb: 140, 156, 184;--go-color-dn400: #9fb0cc;--go-color-dn400-rgb: 159, 176, 204;--go-color-dn500: #abbbd6;--go-color-dn500-rgb: 171, 187, 214;--go-color-dn600: #b8c7e0;--go-color-dn600-rgb: 184, 199, 224;--go-color-dn700: #ced9eb;--go-color-dn800: #dce5f5;--go-color-dn900: #e6edfa;--go-color-dn900-rgb: 230, 237, 250;--go-color-r50: #ffebe6;--go-color-r75: #ffbdad;--go-color-r100: #ff8f73;--go-color-r200: #ff7452;--go-color-r300: #ff5630;--go-color-r300-rgb: 255, 86, 48;--go-color-r400: #de350b;--go-color-r500: #bf2600;--go-color-y50: #fffae6;--go-color-y75: #fff0b3;--go-color-y100: #ffe380;--go-color-y200: #ffc400;--go-color-y300: #ffab00;--go-color-y300-rgb: 255, 171, 0;--go-color-y400: #ff991f;--go-color-y500: #ff8b00;--go-color-g50: #e3fcef;--go-color-g75: #abf5d1;--go-color-g100: #79f2c0;--go-color-g200: #57d9a3;--go-color-g300: #36b37e;--go-color-g300-rgb: 54, 179, 126;--go-color-g400: #00875a;--go-color-g500: #006644;--go-color-b50: #deebff;--go-color-b75: #b3d4ff;--go-color-b75-rgb: 179, 212, 255;--go-color-b100: #4c9aff;--go-color-b100-rgb: 76, 154, 255;--go-color-b200: #2684ff;--go-color-b200-rgb: 38, 132, 255;--go-color-b300: #0065ff;--go-color-b400: #0052cc;--go-color-b400-rgb: 0, 82, 204;--go-color-b500: #0747a6;--go-color-b600: #061f80;--go-color-p50: #eae6ff;--go-color-p75: #c0b6f2;--go-color-p100: #998dd9;--go-color-p100-rgb: 153, 141, 217;--go-color-p200: #8777d9;--go-color-p300: #6554c0;--go-color-p300-rgb: 101, 84, 192;--go-color-p400: #5243aa;--go-color-p500: #403294;--go-color-t50: #e6fcff;--go-color-t75: #b3f5ff;--go-color-t100: #79e2f2;--go-color-t200: #00c7e6;--go-color-t200-rgb: 0, 199, 230;--go-color-t300: #00b8d9;--go-color-t300-rgb: 0, 184, 217;--go-color-t400: #00a3bf;--go-color-t500: #008da6;--go-color-primary-light: var(--go-color-b400);--go-color-primary-dark: var(--go-color-b100);--go-color-blue-light: var(--go-color-b400);--go-color-blue-light-rgb: var(--go-color-b400-rgb);--go-color-blue-dark: var(--go-color-b100);--go-color-blue-dark-rgb: var(--go-color-b100-rgb);--go-color-teal-light: var(--go-color-t300);--go-color-teal-light-rgb: var(--go-color-t300-rgb);--go-color-teal-dark: var(--go-color-t200);--go-color-teal-dark-rgb: var(--go-color-t200-rgb);--go-color-purple-light: var(--go-color-p300);--go-color-purple-light-rgb: var(--go-color-p300-rgb);--go-color-purple-dark: var(--go-color-p100);--go-color-purple-dark-rgb: var(--go-color-p100-rgb);--go-color-red-light: var(--go-color-r300);--go-color-red-light-rgb: var(--go-color-r300-rgb);--go-color-red-dark: var(--go-color-r300);--go-color-red-dark-rgb: var(--go-color-r300-rgb);--go-color-yellow-light: var(--go-color-y300);--go-color-yellow-light-rgb: var(--go-color-y300-rgb);--go-color-yellow-dark: var(--go-color-y300);--go-color-yellow-dark-rgb: var(--go-color-y300-rgb);--go-color-green-light: var(--go-color-g300);--go-color-green-light-rgb: var(--go-color-g300-rgb);--go-color-green-dark: var(--go-color-g300);--go-color-green-dark-rgb: var(--go-color-g300-rgb);--background-color-light: var(--go-color-n0);--background-color-dark: var(--go-color-dn0);--background-color-secondary-light: var(--go-color-n20);--background-color-secondary-dark: var(--go-color-dn30);--text-color-light: var(--go-color-n1000);--text-color-dark: var(--go-color-n0);--placeholder-color-light: var(--go-color-n100);--placeholder-color-dark: var(--go-color-dn200);--heading-color-default-light: var(--go-color-n1000);--heading-color-default-dark: var(--go-color-n0);--heading-color-subtle-light: var(--go-color-n200);--heading-color-subtle-dark: var(--go-color-dn300);--link-color-default-light: var(--go-color-b400);--link-color-default-dark: var(--go-color-b100);--link-color-hover-light: var(--go-color-b300);--link-color-hover-dark: var(--go-color-b200);--link-color-active-light: var(--go-color-b500);--link-color-active-dark: var(--go-color-b100);--focus-outline-color: var(--go-color-b100);--table-border-color-light: var(--go-color-n40);--table-border-color-dark: var(--go-color-dn70);--table-hover-color-light: var(--go-color-n20);--table-hover-color-dark: var(--go-color-dn50);--horizontal-rule-color-light: var(--go-color-n40);--horizontal-rule-color-dark: var(--go-color-dn70);--code-color-light: var(--go-color-n40);--code-color-dark: var(--go-color-dn70);--code-block-color-light: var(--background-color-secondary-light);--code-block-color-dark: var(--background-color-secondary-dark);--blockquote-border-color-light: var(--go-color-n40);--blockquote-border-color-dark: var(--go-color-dn70)}:root{--elevation-raised-light: rgba(var(--go-color-n900-rgb), .25) 0px 1px 1px, rgba(var(--go-color-n900-rgb), .31) 0px 0px 1px;--elevation-raised-dark: rgba(var(--go-color-n1000-rgb), 0) 0px 0px 0px, rgba(var(--go-color-n1000-rgb), .5) 0px 1px 1px, rgba(var(--go-color-n1000-rgb), .5) 0px 0px 1px;--elevation-overlay-light: rgba(var(--go-color-n900-rgb), .15) 0px 8px 12px 0px, rgba(var(--go-color-n900-rgb), .31) 0px 0px 1px 0px;--elevation-overlay-dark: var(--go-color-dn70) 0px 0px 0px 1px, rgba(var(--go-color-dn0-rgb), .36) 0px 8px 12px 0px, rgba(var(--go-color-dn0-rgb), .5) 0px 0px 1px 1px;--elevation-avatar-light: inset 0 0 10px rgba(var(--go-color-n900-rgb), 5%);--elevation-avatar-dark: inset 0 0 10px rgba(var(--go-color-dn600-rgb), 5%)}:root{--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;--font-family-code: ui-monospace, SFMono-Medium, "SF Mono", "Segoe UI Mono", "Roboto Mono", "Ubuntu Mono", Menlo, monospace;--font-style-normal: normal;--font-style-italic: italic;--font-size-default: var(--font-size-14);--font-size-12: 12px;--font-size-13: 13px;--font-size-14: 14px;--font-size-15: 15px;--font-size-16: 16px;--font-size-18: 18px;--font-size-20: 20px;--font-size-24: 24px;--font-size-30: 30px;--font-size-36: 36px;--font-size-48: 48px;--font-size-60: 60px;--font-size-72: 72px;--font-weight-thin: 100;--font-weight-light: 300;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 800;--font-weight-black: 900}:root{--layer-card: 100;--layer-navigation: 200;--layer-dialog: 300;--layer-overlay: 400;--layer-modal: 500;--layer-flag: 600;--layer-spotlight: 700;--layer-tooltip: 800}:root{--size-0: 0px;--size-4: 4px;--size-8: 8px;--size-12: 12px;--size-16: 16px;--size-24: 24px;--size-32: 32px;--size-40: 40px;--size-48: 48px;--size-64: 64px;--size-96: 96px;--size-128: 128px;--size-192: 192px;--size-256: 256px;--size-384: 384px;--size-512: 512px;--size-640: 640px;--size-768: 768px;--size-896: 896px;--size-1024: 1024px;--size-1152: 1152px;--size-1280: 1280px;--size-1408: 1408px;--size-1536: 1536px;--size-1664: 1664px;--size-1792: 1792px;--size-1920: 1920px}:root{--transition-100ms-ease-out: .1s ease-out;--transition-100ms-ease-in-out: .1s ease-in-out;--transition-200ms-ease-in: .2s ease-in;--transition-200ms-ease-in-out: .2s ease-in-out}html,body,p,div,h1,h2,h3,h4,h5,h6,ul,ol,dl,img,pre,form,fieldset{margin:var(--size-0);padding:var(--size-0)}img,fieldset{border:var(--size-0)}body,html,#app{height:100%;width:100%}body{background-color:var(--background-color-light);color:var(--text-color-light);font-family:var(--font-family);font-size:var(--font-size-default);font-style:var(--font-style-normal);font-weight:var(--font-weight-regular);line-height:23px}input,select,textarea,button{font-family:inherit;font-size:inherit;font-weight:inherit;line-height:25px}p,ul,ol,dl,h1,h2,h3,h4,h5,h6,blockquote,pre,form,table{margin:calc(var(--grid-size) * 2px) var(--size-0) var(--size-0) var(--size-0)}a{color:var(--link-color-default-light);text-decoration:var(--link-text-decoration-default);border-radius:var(--border-width);cursor:pointer;transition:color var(--transition-100ms-ease-in-out),background-color var(--transition-100ms-ease-in-out)}a:hover{color:var(--link-color-hover-light);text-decoration:var(--link-text-decoration-hover)}a:active{color:var(--link-color-active-light)}h1{font-size:2.07142857em;font-style:var(--font-style-normal);line-height:1.10344828em;color:var(--heading-color-default-light);font-weight:var(--font-weight-semibold);letter-spacing:-.01em;margin-top:calc(var(--grid-size) * 5px)}[dark-mode=true] h1{color:var(--heading-color-default-dark)}h1:first-child{margin-top:var(--size-0)}h2{font-size:1.71428571em;font-style:var(--font-style-normal);line-height:1.16666667em;color:var(--heading-color-default-light);font-weight:var(--font-weight-medium);letter-spacing:-.01em;margin-top:calc(var(--grid-size) * 5px)}[dark-mode=true] h2{color:var(--heading-color-default-dark)}h2:first-child{margin-top:var(--size-0)}h3{font-size:1.42857143em;font-style:var(--font-style-normal);line-height:1.2em;color:var(--heading-color-default-light);font-weight:var(--font-weight-medium);letter-spacing:-.008em;margin-top:calc(var(--grid-size) * 3.5px)}[dark-mode=true] h3{color:var(--heading-color-default-dark)}h3:first-child{margin-top:var(--size-0)}h4{font-size:1.14285714em;font-style:var(--font-style-normal);line-height:1.25em;color:var(--heading-color-default-light);font-weight:var(--font-weight-semibold);letter-spacing:-.006em;margin-top:calc(var(--grid-size) * 3px)}[dark-mode=true] h4{color:var(--heading-color-default-dark)}h4:first-child{margin-top:var(--size-0)}h5{font-size:1em;font-style:var(--font-style-normal);line-height:1.14285714em;color:var(--heading-color-default-light);font-weight:var(--font-weight-semibold);letter-spacing:-.003em;margin-top:calc(var(--grid-size) * 2px)}[dark-mode=true] h5{color:var(--heading-color-default-dark)}h5:first-child{margin-top:var(--size-0)}h6{font-size:.85714286em;font-style:var(--font-style-normal);line-height:1.33333333em;color:var(--heading-color-default-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 2.5px);text-transform:uppercase}[dark-mode=true] h6{color:var(--heading-color-default-dark)}h6:first-child{margin-top:var(--size-0)}ul,ol,dl{padding-left:calc(var(--grid-size) * 5px)}dd,dd+dt,li+li{margin-top:calc(var(--grid-size) / 2px)}ul ul:not(:first-child),ol ul:not(:first-child),ul ol:not(:first-child),ol ol:not(:first-child){margin-top:calc(var(--grid-size) / 2px)}p:first-child,ul:first-child,ol:first-child,dl:first-child,h1:first-child,h2:first-child,h3:first-child,h4:first-child,h5:first-child,h6:first-child,blockquote:first-child,pre:first-child,form:first-child,table:first-child{margin-top:var(--size-0)}:focus{outline:none;box-shadow:var(--size-0) var(--size-0) var(--size-0) var(--focus-outline-width) var(--focus-outline-color)!important}[data-whatintent=mouse] :focus{outline:none;box-shadow:none!important}table{border-collapse:collapse;width:100%}thead,tbody,tfoot{border-bottom:var(--border-width) solid var(--table-border-color-light)}td,th{border:none;padding:calc((var(--grid-size) / 2) * 1px) calc(var(--grid-size) * 1px);text-align:left}th{font-size:.78571429em;font-style:var(--font-style-normal);line-height:1.45454545em;color:var(--heading-color-subtle-light);font-weight:var(--font-weight-bold);margin-top:calc(var(--grid-size) * 2px);line-height:inherit}[dark-mode=true] th{color:var(--heading-color-subtle-dark)}th:first-child{margin-top:var(--size-0)}td:first-child,th:first-child{padding-left:var(--size-0)}td:last-child,th:last-child{padding-right:var(--size-0)}tr{transition:background .1s ease-out,box-shadow .15s cubic-bezier(.47,.03,.49,1.38)}tbody tr:hover{background-color:var(--table-hover-color-light)}hr{background-color:var(--horizontal-rule-color-light);height:2px;border-style:none;margin:var(--size-40) var(--size-0)}pre{font-family:var(--font-family-code);white-space:pre-wrap;padding:var(--size-24) var(--size-32);border-radius:var(--border-radius-regular);background:var(--code-block-color-light);font-size:var(--font-size-12);line-height:23px;overflow-x:auto}code{font-family:var(--font-family-code);padding:var(--size-0);font-size:var(--font-size-12)}p code{font-family:var(--font-family-code);padding:var(--size-0) var(--size-8);border-radius:var(--border-radius-regular);background:var(--code-color-light);font-size:var(--font-size-14)}blockquote{white-space:pre-wrap;border-left:var(--border-width-3) solid var(--blockquote-border-color-light);padding-left:var(--size-8);font-style:var(--font-style-italic)}caption{font-size:1.42857143em;font-style:var(--font-style-normal);line-height:1.2em;color:var(--heading-color-default-light);font-weight:var(--font-weight-medium);letter-spacing:-.008em;margin-top:calc(var(--grid-size) * 3.5px);margin-bottom:var(--size-8);text-align:left}[dark-mode=true] caption{color:var(--heading-color-default-dark)}caption:first-child{margin-top:var(--size-0)}[dark-mode=true] body{background-color:var(--background-color-dark);color:var(--text-color-dark)}[dark-mode=true] h1,[dark-mode=true] h2,[dark-mode=true] h3,[dark-mode=true] h4,[dark-mode=true] h5{color:var(--heading-color-default-dark)}[dark-mode=true] h6{color:var(--heading-color-subtle-dark)}[dark-mode=true] a{color:var(--link-color-default-dark)}[dark-mode=true] a:hover{color:var(--link-color-hover-dark)}[dark-mode=true] a:active{color:var(--link-color-active-dark)}[dark-mode=true] hr{background-color:var(--horizontal-rule-color-dark)}[dark-mode=true] pre{background:var(--code-block-color-dark)}[dark-mode=true] p code{background:var(--code-color-dark)}[dark-mode=true] blockquote{border-left:var(--border-width-3) solid var(--blockquote-border-color-dark)}[dark-mode=true] thead,[dark-mode=true] tbody,[dark-mode=true] tfoot{border-bottom:var(--border-width) solid var(--table-border-color-dark)}[dark-mode=true] tbody tr:hover{background-color:var(--table-hover-color-dark)}:root{--grid-size: 8;--focus-outline-width: 2px;--link-text-decoration-default: none;--link-text-decoration-hover: underline}.heading-900{font-size:2.85714286em;font-style:var(--font-style-normal);line-height:1.14285714em;color:var(--heading-color-default-light);font-weight:var(--font-weight-semibold);letter-spacing:-.01em;margin-top:calc(var(--grid-size) * 6.5px)}[dark-mode=true] .heading-900{color:var(--heading-color-default-dark)}.heading-900:first-child{margin-top:var(--size-0)}.heading-800{font-size:2.07142857em;font-style:var(--font-style-normal);line-height:1.10344828em;color:var(--heading-color-default-light);font-weight:var(--font-weight-semibold);letter-spacing:-.01em;margin-top:calc(var(--grid-size) * 5px)}[dark-mode=true] .heading-800{color:var(--heading-color-default-dark)}.heading-800:first-child{margin-top:var(--size-0)}.heading-700{font-size:1.71428571em;font-style:var(--font-style-normal);line-height:1.16666667em;color:var(--heading-color-default-light);font-weight:var(--font-weight-medium);letter-spacing:-.01em;margin-top:calc(var(--grid-size) * 5px)}[dark-mode=true] .heading-700{color:var(--heading-color-default-dark)}.heading-700:first-child{margin-top:var(--size-0)}.heading-600{font-size:1.42857143em;font-style:var(--font-style-normal);line-height:1.2em;color:var(--heading-color-default-light);font-weight:var(--font-weight-medium);letter-spacing:-.008em;margin-top:calc(var(--grid-size) * 3.5px)}[dark-mode=true] .heading-600{color:var(--heading-color-default-dark)}.heading-600:first-child{margin-top:var(--size-0)}.heading-500{font-size:1.14285714em;font-style:var(--font-style-normal);line-height:1.25em;color:var(--heading-color-default-light);font-weight:var(--font-weight-semibold);letter-spacing:-.006em;margin-top:calc(var(--grid-size) * 3px)}[dark-mode=true] .heading-500{color:var(--heading-color-default-dark)}.heading-500:first-child{margin-top:var(--size-0)}.heading-400{font-size:1em;font-style:var(--font-style-normal);line-height:1.14285714em;color:var(--heading-color-default-light);font-weight:var(--font-weight-semibold);letter-spacing:-.003em;margin-top:calc(var(--grid-size) * 2px)}[dark-mode=true] .heading-400{color:var(--heading-color-default-dark)}.heading-400:first-child{margin-top:var(--size-0)}.heading-300{font-size:.85714286em;font-style:var(--font-style-normal);line-height:1.33333333em;color:var(--heading-color-default-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 2.5px);text-transform:uppercase}[dark-mode=true] .heading-300{color:var(--heading-color-default-dark)}.heading-300:first-child{margin-top:var(--size-0)}.heading-200{font-size:.85714286em;font-style:var(--font-style-normal);line-height:1.33333333em;color:var(--heading-color-subtle-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 2px)}[dark-mode=true] .heading-200{color:var(--heading-color-subtle-dark)}.heading-200:first-child{margin-top:var(--size-0)}.heading-100{font-size:.78571429em;font-style:var(--font-style-normal);line-height:1.45454545em;color:var(--heading-color-subtle-light);font-weight:var(--font-weight-bold);margin-top:calc(var(--grid-size) * 2px)}[dark-mode=true] .heading-100{color:var(--heading-color-subtle-dark)}.heading-100:first-child{margin-top:var(--size-0)}.text-intro{font-size:1.42857143em;font-style:var(--font-style-normal);font-weight:var(--font-weight-regular);line-height:32px}.text-caption{font-size:var(--font-size-12);font-weight:var(--font-weight-regular);display:block;line-height:18px;color:var(--placeholder-color-light)}.text-caption-bold{font-size:var(--font-size-12);font-weight:var(--font-weight-semibold);color:var(--text-color-light)}.text-prominent{font-size:var(--font-size-default);font-weight:var(--font-weight-semibold);color:var(--text-color-light)}.error{color:var(--go-color-red-light)}[dark-mode=true] .text-caption{color:var(--placeholder-color-dark)}[dark-mode=true] .text-caption-bold,[dark-mode=true] .text-prominent{color:var(--text-color-dark)}[dark-mode=true] .error{color:var(--go-color-red-dark)}
+:root{--border-radius-regular: 3px;--border-radius-large: 6px;--border-width: var(--border-width-2);--border-width-1: 1px;--border-width-2: 2px;--border-width-3: 3px}:root{--go-color-primary1: var(--go-color-b600);--go-color-primary2: var(--go-color-b500);--go-color-primary3: var(--go-color-n0);--go-color-n0: #ffffff;--go-color-n0-rgb: 255, 255, 255;--go-color-n10: #fafbfc;--go-color-n10-rgb: 250, 251, 252;--go-color-n20: #f4f5f7;--go-color-n30: #ebecf0;--go-color-n40: #dfe1e6;--go-color-n40-rgb: 223, 225, 230;--go-color-n50: #c1c7d0;--go-color-n60: #b3bac5;--go-color-n70: #a5adba;--go-color-n80: #97a0af;--go-color-n90: #8993a4;--go-color-n100: #7a869a;--go-color-n100-rgb: 122, 134, 154;--go-color-n200: #6b778c;--go-color-n300: #5e6c84;--go-color-n400: #505f79;--go-color-n500: #42526e;--go-color-n600: #344563;--go-color-n700: #253858;--go-color-n700-rgb: 37, 56, 88;--go-color-n800: #172b4d;--go-color-n900: #091e42;--go-color-n900-rgb: 9, 30, 66;--go-color-n1000: #000000;--go-color-n1000-rgb: 0, 0, 0;--go-color-dn0: #0d1424;--go-color-dn0-rgb: 13, 20, 36;--go-color-dn10: #0e1624;--go-color-dn20: #121a29;--go-color-dn30: #1b2638;--go-color-dn40: #202b3d;--go-color-dn50: #283447;--go-color-dn60: #313d52;--go-color-dn70: #3b475c;--go-color-dn70-rgb: 61, 72, 92;--go-color-dn80: #455166;--go-color-dn90: #56637a;--go-color-dn100: #67758f;--go-color-dn200: #7988a3;--go-color-dn200-rgb: 121, 136, 163;--go-color-dn300: #8c9cb8;--go-color-dn300-rgb: 140, 156, 184;--go-color-dn400: #9fb0cc;--go-color-dn400-rgb: 159, 176, 204;--go-color-dn500: #abbbd6;--go-color-dn500-rgb: 171, 187, 214;--go-color-dn600: #b8c7e0;--go-color-dn600-rgb: 184, 199, 224;--go-color-dn700: #ced9eb;--go-color-dn800: #dce5f5;--go-color-dn900: #e6edfa;--go-color-dn900-rgb: 230, 237, 250;--go-color-r50: #ffebe6;--go-color-r75: #ffbdad;--go-color-r100: #ff8f73;--go-color-r200: #ff7452;--go-color-r300: #ff5630;--go-color-r300-rgb: 255, 86, 48;--go-color-r400: #de350b;--go-color-r500: #bf2600;--go-color-y50: #fffae6;--go-color-y75: #fff0b3;--go-color-y100: #ffe380;--go-color-y200: #ffc400;--go-color-y300: #ffab00;--go-color-y300-rgb: 255, 171, 0;--go-color-y400: #ff991f;--go-color-y500: #ff8b00;--go-color-g50: #e3fcef;--go-color-g75: #abf5d1;--go-color-g100: #79f2c0;--go-color-g200: #57d9a3;--go-color-g300: #36b37e;--go-color-g300-rgb: 54, 179, 126;--go-color-g400: #00875a;--go-color-g500: #006644;--go-color-b50: #deebff;--go-color-b75: #b3d4ff;--go-color-b75-rgb: 179, 212, 255;--go-color-b100: #4c9aff;--go-color-b100-rgb: 76, 154, 255;--go-color-b200: #2684ff;--go-color-b200-rgb: 38, 132, 255;--go-color-b300: #0065ff;--go-color-b400: #0052cc;--go-color-b400-rgb: 0, 82, 204;--go-color-b500: #0747a6;--go-color-b600: #061f80;--go-color-p50: #eae6ff;--go-color-p75: #c0b6f2;--go-color-p100: #998dd9;--go-color-p100-rgb: 153, 141, 217;--go-color-p200: #8777d9;--go-color-p300: #6554c0;--go-color-p300-rgb: 101, 84, 192;--go-color-p400: #5243aa;--go-color-p500: #403294;--go-color-t50: #e6fcff;--go-color-t75: #b3f5ff;--go-color-t100: #79e2f2;--go-color-t200: #00c7e6;--go-color-t200-rgb: 0, 199, 230;--go-color-t300: #00b8d9;--go-color-t300-rgb: 0, 184, 217;--go-color-t400: #00a3bf;--go-color-t500: #008da6;--go-color-primary-light: var(--go-color-b400);--go-color-primary-dark: var(--go-color-b100);--go-color-blue-light: var(--go-color-b400);--go-color-blue-light-rgb: var(--go-color-b400-rgb);--go-color-blue-dark: var(--go-color-b100);--go-color-blue-dark-rgb: var(--go-color-b100-rgb);--go-color-teal-light: var(--go-color-t300);--go-color-teal-light-rgb: var(--go-color-t300-rgb);--go-color-teal-dark: var(--go-color-t200);--go-color-teal-dark-rgb: var(--go-color-t200-rgb);--go-color-purple-light: var(--go-color-p300);--go-color-purple-light-rgb: var(--go-color-p300-rgb);--go-color-purple-dark: var(--go-color-p100);--go-color-purple-dark-rgb: var(--go-color-p100-rgb);--go-color-red-light: var(--go-color-r300);--go-color-red-light-rgb: var(--go-color-r300-rgb);--go-color-red-dark: var(--go-color-r300);--go-color-red-dark-rgb: var(--go-color-r300-rgb);--go-color-yellow-light: var(--go-color-y300);--go-color-yellow-light-rgb: var(--go-color-y300-rgb);--go-color-yellow-dark: var(--go-color-y300);--go-color-yellow-dark-rgb: var(--go-color-y300-rgb);--go-color-green-light: var(--go-color-g300);--go-color-green-light-rgb: var(--go-color-g300-rgb);--go-color-green-dark: var(--go-color-g300);--go-color-green-dark-rgb: var(--go-color-g300-rgb);--background-color-light: var(--go-color-n0);--background-color-dark: var(--go-color-dn0);--background-color-secondary-light: var(--go-color-n20);--background-color-secondary-dark: var(--go-color-dn30);--text-color-light: var(--go-color-n1000);--text-color-dark: var(--go-color-n0);--placeholder-color-light: var(--go-color-n100);--placeholder-color-dark: var(--go-color-dn200);--heading-color-default-light: var(--go-color-n1000);--heading-color-default-dark: var(--go-color-n0);--heading-color-subtle-light: var(--go-color-n200);--heading-color-subtle-dark: var(--go-color-dn300);--link-color-default-light: var(--go-color-b400);--link-color-default-dark: var(--go-color-b100);--link-color-hover-light: var(--go-color-b300);--link-color-hover-dark: var(--go-color-b200);--link-color-active-light: var(--go-color-b500);--link-color-active-dark: var(--go-color-b100);--focus-outline-color: var(--go-color-b100);--table-border-color-light: var(--go-color-n40);--table-border-color-dark: var(--go-color-dn70);--table-hover-color-light: var(--go-color-n20);--table-hover-color-dark: var(--go-color-dn50);--horizontal-rule-color-light: var(--go-color-n40);--horizontal-rule-color-dark: var(--go-color-dn70);--code-color-light: var(--go-color-n40);--code-color-dark: var(--go-color-dn70);--code-block-color-light: var(--background-color-secondary-light);--code-block-color-dark: var(--background-color-secondary-dark);--blockquote-border-color-light: var(--go-color-n40);--blockquote-border-color-dark: var(--go-color-dn70)}:root{--elevation-raised-light: rgba(var(--go-color-n900-rgb), .25) 0px 1px 1px, rgba(var(--go-color-n900-rgb), .31) 0px 0px 1px;--elevation-raised-dark: rgba(var(--go-color-n1000-rgb), 0) 0px 0px 0px, rgba(var(--go-color-n1000-rgb), .5) 0px 1px 1px, rgba(var(--go-color-n1000-rgb), .5) 0px 0px 1px;--elevation-overlay-light: rgba(var(--go-color-n900-rgb), .15) 0px 8px 12px 0px, rgba(var(--go-color-n900-rgb), .31) 0px 0px 1px 0px;--elevation-overlay-dark: var(--go-color-dn70) 0px 0px 0px 1px, rgba(var(--go-color-dn0-rgb), .36) 0px 8px 12px 0px, rgba(var(--go-color-dn0-rgb), .5) 0px 0px 1px 1px;--elevation-avatar-light: inset 0 0 10px rgba(var(--go-color-n900-rgb), 5%);--elevation-avatar-dark: inset 0 0 10px rgba(var(--go-color-dn600-rgb), 5%)}:root{--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;--font-family-code: ui-monospace, SFMono-Medium, "SF Mono", "Segoe UI Mono", "Roboto Mono", "Ubuntu Mono", Menlo, monospace;--font-style-normal: normal;--font-style-italic: italic;--font-size-default: var(--font-size-14);--font-size-12: 12px;--font-size-13: 13px;--font-size-14: 14px;--font-size-15: 15px;--font-size-16: 16px;--font-size-18: 18px;--font-size-20: 20px;--font-size-24: 24px;--font-size-30: 30px;--font-size-36: 36px;--font-size-48: 48px;--font-size-60: 60px;--font-size-72: 72px;--font-weight-thin: 100;--font-weight-light: 300;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 800;--font-weight-black: 900}:root{--layer-card: 100;--layer-navigation: 200;--layer-dialog: 300;--layer-overlay: 400;--layer-modal: 500;--layer-flag: 600;--layer-spotlight: 700;--layer-tooltip: 800}:root{--size-0: 0px;--size-4: 4px;--size-8: 8px;--size-12: 12px;--size-16: 16px;--size-24: 24px;--size-32: 32px;--size-40: 40px;--size-48: 48px;--size-64: 64px;--size-96: 96px;--size-128: 128px;--size-192: 192px;--size-256: 256px;--size-384: 384px;--size-512: 512px;--size-640: 640px;--size-768: 768px;--size-896: 896px;--size-1024: 1024px;--size-1152: 1152px;--size-1280: 1280px;--size-1408: 1408px;--size-1536: 1536px;--size-1664: 1664px;--size-1792: 1792px;--size-1920: 1920px}:root{--transition-100ms-ease-out: .1s ease-out;--transition-100ms-ease-in-out: .1s ease-in-out;--transition-200ms-ease-in: .2s ease-in;--transition-200ms-ease-in-out: .2s ease-in-out}html,body,p,div,h1,h2,h3,h4,h5,h6,ul,ol,dl,img,pre,form,fieldset{margin:var(--size-0);padding:var(--size-0)}img,fieldset{border:var(--size-0)}body,html,#app{height:100%;width:100%}body{background-color:var(--background-color-light);color:var(--text-color-light);font-family:var(--font-family);font-size:var(--font-size-default);font-style:var(--font-style-normal);font-weight:var(--font-weight-regular);line-height:23px}input,select,textarea,button{font-family:inherit;font-size:inherit;font-weight:inherit;line-height:25px}p,ul,ol,dl,h1,h2,h3,h4,h5,h6,blockquote,pre,form,table{margin:calc(var(--grid-size) * 2px) var(--size-0) var(--size-0) var(--size-0)}a{color:var(--link-color-default-light);text-decoration:var(--link-text-decoration-default);border-radius:var(--border-width);cursor:pointer;transition:color var(--transition-100ms-ease-in-out),background-color var(--transition-100ms-ease-in-out)}a:hover{color:var(--link-color-hover-light);text-decoration:var(--link-text-decoration-hover)}a:active{color:var(--link-color-active-light)}h1{font-size:2.07142857em;font-style:var(--font-style-normal);line-height:1.10344828em;color:var(--heading-color-default-light);font-weight:var(--font-weight-semibold);letter-spacing:-.01em;margin-top:calc(var(--grid-size) * 5px)}[dark-mode=true] h1{color:var(--heading-color-default-dark)}h1:first-child{margin-top:var(--size-0)}h2{font-size:1.71428571em;font-style:var(--font-style-normal);line-height:1.16666667em;color:var(--heading-color-default-light);font-weight:var(--font-weight-medium);letter-spacing:-.01em;margin-top:calc(var(--grid-size) * 5px)}[dark-mode=true] h2{color:var(--heading-color-default-dark)}h2:first-child{margin-top:var(--size-0)}h3{font-size:1.42857143em;font-style:var(--font-style-normal);line-height:1.2em;color:var(--heading-color-default-light);font-weight:var(--font-weight-medium);letter-spacing:-.008em;margin-top:calc(var(--grid-size) * 3.5px)}[dark-mode=true] h3{color:var(--heading-color-default-dark)}h3:first-child{margin-top:var(--size-0)}h4{font-size:1.14285714em;font-style:var(--font-style-normal);line-height:1.25em;color:var(--heading-color-default-light);font-weight:var(--font-weight-semibold);letter-spacing:-.006em;margin-top:calc(var(--grid-size) * 3px)}[dark-mode=true] h4{color:var(--heading-color-default-dark)}h4:first-child{margin-top:var(--size-0)}h5{font-size:1em;font-style:var(--font-style-normal);line-height:1.14285714em;color:var(--heading-color-default-light);font-weight:var(--font-weight-semibold);letter-spacing:-.003em;margin-top:calc(var(--grid-size) * 2px)}[dark-mode=true] h5{color:var(--heading-color-default-dark)}h5:first-child{margin-top:var(--size-0)}h6{font-size:.85714286em;font-style:var(--font-style-normal);line-height:1.33333333em;color:var(--heading-color-default-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 2.5px);text-transform:uppercase}[dark-mode=true] h6{color:var(--heading-color-default-dark)}h6:first-child{margin-top:var(--size-0)}ul,ol,dl{padding-left:calc(var(--grid-size) * 5px)}dd,dd+dt,li+li{margin-top:calc(var(--grid-size) / 2px)}ul ul:not(:first-child),ol ul:not(:first-child),ul ol:not(:first-child),ol ol:not(:first-child){margin-top:calc(var(--grid-size) / 2px)}p:first-child,ul:first-child,ol:first-child,dl:first-child,h1:first-child,h2:first-child,h3:first-child,h4:first-child,h5:first-child,h6:first-child,blockquote:first-child,pre:first-child,form:first-child,table:first-child{margin-top:var(--size-0)}:focus{outline:none;box-shadow:var(--size-0) var(--size-0) var(--size-0) var(--focus-outline-width) var(--focus-outline-color)}[data-whatintent=mouse] :focus{outline:none;box-shadow:none}table{border-collapse:collapse;width:100%}thead,tbody,tfoot{border-bottom:var(--border-width) solid var(--table-border-color-light)}td,th{border:none;padding:calc((var(--grid-size) / 2) * 1px) calc(var(--grid-size) * 1px);text-align:left}th{font-size:.78571429em;font-style:var(--font-style-normal);line-height:1.45454545em;color:var(--heading-color-subtle-light);font-weight:var(--font-weight-bold);margin-top:calc(var(--grid-size) * 2px);line-height:inherit}[dark-mode=true] th{color:var(--heading-color-subtle-dark)}th:first-child{margin-top:var(--size-0)}td:first-child,th:first-child{padding-left:var(--size-0)}td:last-child,th:last-child{padding-right:var(--size-0)}tr{transition:background .1s ease-out,box-shadow .15s cubic-bezier(.47,.03,.49,1.38)}tbody tr:hover{background-color:var(--table-hover-color-light)}hr{background-color:var(--horizontal-rule-color-light);height:2px;border-style:none;margin:var(--size-40) var(--size-0)}pre{font-family:var(--font-family-code);white-space:pre-wrap;padding:var(--size-24) var(--size-32);border-radius:var(--border-radius-regular);background:var(--code-block-color-light);font-size:var(--font-size-12);line-height:23px;overflow-x:auto}code{font-family:var(--font-family-code);padding:var(--size-0);font-size:var(--font-size-12)}p code{font-family:var(--font-family-code);padding:var(--size-0) var(--size-8);border-radius:var(--border-radius-regular);background:var(--code-color-light);font-size:var(--font-size-14)}blockquote{white-space:pre-wrap;border-left:var(--border-width-3) solid var(--blockquote-border-color-light);padding-left:var(--size-8);font-style:var(--font-style-italic)}caption{font-size:1.42857143em;font-style:var(--font-style-normal);line-height:1.2em;color:var(--heading-color-default-light);font-weight:var(--font-weight-medium);letter-spacing:-.008em;margin-top:calc(var(--grid-size) * 3.5px);margin-bottom:var(--size-8);text-align:left}[dark-mode=true] caption{color:var(--heading-color-default-dark)}caption:first-child{margin-top:var(--size-0)}[dark-mode=true] body{background-color:var(--background-color-dark);color:var(--text-color-dark)}[dark-mode=true] h1,[dark-mode=true] h2,[dark-mode=true] h3,[dark-mode=true] h4,[dark-mode=true] h5{color:var(--heading-color-default-dark)}[dark-mode=true] h6{color:var(--heading-color-subtle-dark)}[dark-mode=true] a{color:var(--link-color-default-dark)}[dark-mode=true] a:hover{color:var(--link-color-hover-dark)}[dark-mode=true] a:active{color:var(--link-color-active-dark)}[dark-mode=true] hr{background-color:var(--horizontal-rule-color-dark)}[dark-mode=true] pre{background:var(--code-block-color-dark)}[dark-mode=true] p code{background:var(--code-color-dark)}[dark-mode=true] blockquote{border-left:var(--border-width-3) solid var(--blockquote-border-color-dark)}[dark-mode=true] thead,[dark-mode=true] tbody,[dark-mode=true] tfoot{border-bottom:var(--border-width) solid var(--table-border-color-dark)}[dark-mode=true] tbody tr:hover{background-color:var(--table-hover-color-dark)}:root{--grid-size: 8;--focus-outline-width: 2px;--link-text-decoration-default: none;--link-text-decoration-hover: underline}.heading-900{font-size:2.85714286em;font-style:var(--font-style-normal);line-height:1.14285714em;color:var(--heading-color-default-light);font-weight:var(--font-weight-semibold);letter-spacing:-.01em;margin-top:calc(var(--grid-size) * 6.5px)}[dark-mode=true] .heading-900{color:var(--heading-color-default-dark)}.heading-900:first-child{margin-top:var(--size-0)}.heading-800{font-size:2.07142857em;font-style:var(--font-style-normal);line-height:1.10344828em;color:var(--heading-color-default-light);font-weight:var(--font-weight-semibold);letter-spacing:-.01em;margin-top:calc(var(--grid-size) * 5px)}[dark-mode=true] .heading-800{color:var(--heading-color-default-dark)}.heading-800:first-child{margin-top:var(--size-0)}.heading-700{font-size:1.71428571em;font-style:var(--font-style-normal);line-height:1.16666667em;color:var(--heading-color-default-light);font-weight:var(--font-weight-medium);letter-spacing:-.01em;margin-top:calc(var(--grid-size) * 5px)}[dark-mode=true] .heading-700{color:var(--heading-color-default-dark)}.heading-700:first-child{margin-top:var(--size-0)}.heading-600{font-size:1.42857143em;font-style:var(--font-style-normal);line-height:1.2em;color:var(--heading-color-default-light);font-weight:var(--font-weight-medium);letter-spacing:-.008em;margin-top:calc(var(--grid-size) * 3.5px)}[dark-mode=true] .heading-600{color:var(--heading-color-default-dark)}.heading-600:first-child{margin-top:var(--size-0)}.heading-500{font-size:1.14285714em;font-style:var(--font-style-normal);line-height:1.25em;color:var(--heading-color-default-light);font-weight:var(--font-weight-semibold);letter-spacing:-.006em;margin-top:calc(var(--grid-size) * 3px)}[dark-mode=true] .heading-500{color:var(--heading-color-default-dark)}.heading-500:first-child{margin-top:var(--size-0)}.heading-400{font-size:1em;font-style:var(--font-style-normal);line-height:1.14285714em;color:var(--heading-color-default-light);font-weight:var(--font-weight-semibold);letter-spacing:-.003em;margin-top:calc(var(--grid-size) * 2px)}[dark-mode=true] .heading-400{color:var(--heading-color-default-dark)}.heading-400:first-child{margin-top:var(--size-0)}.heading-300{font-size:.85714286em;font-style:var(--font-style-normal);line-height:1.33333333em;color:var(--heading-color-default-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 2.5px);text-transform:uppercase}[dark-mode=true] .heading-300{color:var(--heading-color-default-dark)}.heading-300:first-child{margin-top:var(--size-0)}.heading-200{font-size:.85714286em;font-style:var(--font-style-normal);line-height:1.33333333em;color:var(--heading-color-subtle-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 2px)}[dark-mode=true] .heading-200{color:var(--heading-color-subtle-dark)}.heading-200:first-child{margin-top:var(--size-0)}.heading-100{font-size:.78571429em;font-style:var(--font-style-normal);line-height:1.45454545em;color:var(--heading-color-subtle-light);font-weight:var(--font-weight-bold);margin-top:calc(var(--grid-size) * 2px)}[dark-mode=true] .heading-100{color:var(--heading-color-subtle-dark)}.heading-100:first-child{margin-top:var(--size-0)}.text-intro{font-size:1.42857143em;font-style:var(--font-style-normal);font-weight:var(--font-weight-regular);line-height:32px}.text-caption{font-size:var(--font-size-12);font-weight:var(--font-weight-regular);display:block;line-height:18px;color:var(--placeholder-color-light)}.text-caption-bold{font-size:var(--font-size-12);font-weight:var(--font-weight-semibold);color:var(--text-color-light)}.text-prominent{font-size:var(--font-size-default);font-weight:var(--font-weight-semibold);color:var(--text-color-light)}.error{color:var(--go-color-red-light)}[dark-mode=true] .text-caption{color:var(--placeholder-color-dark)}[dark-mode=true] .text-caption-bold,[dark-mode=true] .text-prominent{color:var(--text-color-dark)}[dark-mode=true] .error{color:var(--go-color-red-dark)}.theme-switcher-divider[data-v-441a2d2e]{margin:4px 0;background-color:var(--go-color-n20)}[dark-mode=true] .theme-switcher-divider[data-v-441a2d2e]{background-color:var(--background-color-secondary-dark)}

package/dist/theme.es.js

@@ -1,70 +1,217 @@
-import { ref as n, watch as h, onBeforeUnmount as r, provide as a, createElementBlock as l, openBlock as m, renderSlot as d } from "vue";
+import { ref as N, watch as p, onBeforeUnmount as _, provide as S, createElementBlock as D, openBlock as g, renderSlot as T, computed as y, createBlock as B, unref as r, withCtx as M, createVNode as f, createElementVNode as O } from "vue";
 import "what-input";
-const i = { class: "theme" }, B = /* @__PURE__ */ Object.assign({
+import { DropdownMenu as R, DropdownItemGroup as I, DropdownItemRadio as w } from "@gospore/dropdown-menu";
+const A = { class: "theme" }, U = "(prefers-color-scheme: dark)", L = "(prefers-reduced-motion: reduce)", x = 200, F = /* @__PURE__ */ Object.assign({
   name: "Theme"
 }, {
   __name: "Theme",
-  setup(N) {
-    const e = n({
-      darkMode: window.matchMedia("(prefers-color-scheme: dark)").matches
+  props: {
+    mode: {
+      type: String,
+      default: "auto",
+      validator: (s) => ["auto", "light", "dark"].includes(s)
+    }
+  },
+  setup(s) {
+    const d = s, c = window.matchMedia(U), a = window.matchMedia(
+      L
+    ), l = N({
+      darkMode: m(d.mode)
     });
-    window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change", o);
-    var s = document.createElement("meta");
-    s.name = "color-scheme", s.setAttribute("content", "light dark"), document.getElementsByTagName("head")[0].appendChild(s), h(
-      e.value,
+    c.addEventListener("change", h);
+    var u = document.createElement("meta");
+    u.name = "color-scheme", u.setAttribute("content", "light dark"), document.getElementsByTagName("head")[0].appendChild(u), p(
+      () => d.mode,
       () => {
-        document.documentElement.setAttribute(
-          "dark-mode",
-          e.value.darkMode
-        );
+        v();
       },
-      { deep: !0, immediate: !0 }
-    ), r(() => {
-      window.matchMedia("(prefers-color-scheme: dark)").removeEventListener("change", o);
+      { immediate: !0 }
+    ), p(
+      () => l.value.darkMode,
+      (t, e) => {
+        if (e === void 0) {
+          n(t);
+          return;
+        }
+        k(() => {
+          n(t);
+        });
+      },
+      { immediate: !0 }
+    ), _(() => {
+      c.removeEventListener("change", h);
     });
-    function o(t) {
-      t && (e.value.darkMode = t.matches);
+    function v() {
+      l.value.darkMode = m(d.mode);
+    }
+    function m(t) {
+      return t === "dark" ? !0 : t === "light" ? !1 : c.matches;
     }
-    return a("theme", e), (t, p) => (m(), l("div", i, [
-      d(t.$slots, "default")
+    function h(t) {
+      !t || d.mode !== "auto" || (l.value.darkMode = t.matches);
+    }
+    function n(t) {
+      document.documentElement.setAttribute("dark-mode", t);
+    }
+    function k(t) {
+      if (a.matches) {
+        t();
+        return;
+      }
+      const e = document.startViewTransition?.bind(document);
+      if (e) {
+        e(() => {
+          t();
+        });
+        return;
+      }
+      t();
+      const o = document.documentElement;
+      typeof o.animate == "function" && window.requestAnimationFrame(() => {
+        o.animate(
+          [
+            { opacity: 0.85 },
+            { opacity: 1 }
+          ],
+          {
+            duration: x,
+            easing: "ease-in-out"
+          }
+        );
+      });
+    }
+    return S("theme", l), (t, e) => (g(), D("div", A, [
+      T(t.$slots, "default")
     ]));
   }
-}), _ = "hsl(225, 90%, 16%)", v = "#061f80", c = "hsl(225, 94%, 35%)", M = "#06c", w = "hsl(210, 100%, 50%)", g = "hsl(210, 100%, 93%)", E = "hsl(225, 100%, 96%)", b = "hsl(12, 91%, 46%)", y = "hsl(11, 100%, 59%)", T = "hsl(40, 100%, 50%)", A = "hsl(46, 100%, 50%)", G = "hsl(120, 100%, 25%)", L = "#36b37e", R = "hsl(0, 0%, 0%)", S = "hsl(218, 76%, 15%)", Y = "hsla(0,0%,10%,.9)", j = "hsla(0,0%,10%,.6)", x = "hsl(218, 20%, 39%)", C = "hsl(218, 17%, 44%)", D = "hsl(218, 14%, 49%)", O = "hsl(218, 14%, 54%)", U = "hsl(218, 13%, 59%)", $ = "hsl(218, 13%, 64%)", q = "hsl(217, 13%, 69%)", z = "hsl(223, 12%, 89%)", F = "hsl(228, 14%, 93%)", H = "hsl(210, 7%, 95%)", I = "hsl(220, 16%, 96%)", J = "hsl(210, 25%, 98%)", K = "hsl(0, 0%, 98%)", u = "hsl(0, 0%, 100%)", P = c, Q = c, V = u;
+}), V = (s, d) => {
+  const c = s.__vccOpts || s;
+  for (const [a, l] of d)
+    c[a] = l;
+  return c;
+}, b = "gospore-theme-mode", Y = {
+  __name: "ThemeSwitcher",
+  props: {
+    mode: {
+      type: String,
+      default: "auto",
+      validator: (s) => ["auto", "light", "dark"].includes(s)
+    }
+  },
+  emits: ["update:mode"],
+  setup(s, { emit: d }) {
+    const c = [
+      { value: "auto", label: "System" },
+      { value: "light", label: "Light" },
+      { value: "dark", label: "Dark" }
+    ], a = c.reduce((e, o) => (e[o.value] = o.label, e), {}), l = c.map((e) => e.value), u = s, v = d, m = N(!1), h = k() ?? u.mode, n = N(
+      l.includes(h) ? h : "auto"
+    );
+    y(
+      () => a[n.value] ?? a.auto
+    ), p(
+      () => u.mode,
+      (e) => {
+        l.includes(e) && e !== n.value && (n.value = e);
+      }
+    ), p(
+      n,
+      (e) => {
+        if (!l.includes(e)) {
+          n.value = "auto";
+          return;
+        }
+        m.value = !1, v("update:mode", e), t(e);
+      },
+      { immediate: !0 }
+    );
+    function k() {
+      if (typeof window > "u")
+        return null;
+      const e = window.localStorage.getItem(b);
+      return e && l.includes(e) ? e : null;
+    }
+    function t(e) {
+      typeof window > "u" || window.localStorage.setItem(b, e);
+    }
+    return (e, o) => (g(), B(r(R), {
+      open: m.value,
+      "onUpdate:open": o[3] || (o[3] = (i) => m.value = i),
+      text: "Theme",
+      "aria-label": "Select theme mode"
+    }, {
+      default: M(() => [
+        f(r(I), { title: "Theme" }, {
+          default: M(() => [
+            f(r(w), {
+              checked: n.value,
+              "onUpdate:checked": o[0] || (o[0] = (i) => n.value = i),
+              value: "auto",
+              label: r(a).auto,
+              "aria-label": `${r(a).auto} mode`
+            }, null, 8, ["checked", "label", "aria-label"]),
+            o[4] || (o[4] = O("hr", {
+              class: "theme-switcher-divider",
+              role: "separator"
+            }, null, -1)),
+            f(r(w), {
+              checked: n.value,
+              "onUpdate:checked": o[1] || (o[1] = (i) => n.value = i),
+              value: "light",
+              label: r(a).light,
+              "aria-label": `${r(a).light} mode`
+            }, null, 8, ["checked", "label", "aria-label"]),
+            f(r(w), {
+              checked: n.value,
+              "onUpdate:checked": o[2] || (o[2] = (i) => n.value = i),
+              value: "dark",
+              label: r(a).dark,
+              "aria-label": `${r(a).dark} mode`
+            }, null, 8, ["checked", "label", "aria-label"])
+          ]),
+          _: 1
+        })
+      ]),
+      _: 1
+    }, 8, ["open"]));
+  }
+}, K = /* @__PURE__ */ V(Y, [["__scopeId", "data-v-441a2d2e"]]), Q = "hsl(225, 90%, 16%)", j = "#061f80", E = "hsl(225, 94%, 35%)", q = "#06c", H = "hsl(210, 100%, 50%)", z = "hsl(210, 100%, 93%)", J = "hsl(225, 100%, 96%)", W = "hsl(12, 91%, 46%)", X = "hsl(11, 100%, 59%)", Z = "hsl(40, 100%, 50%)", ee = "hsl(46, 100%, 50%)", te = "hsl(120, 100%, 25%)", oe = "#36b37e", ne = "hsl(0, 0%, 0%)", ae = "hsl(218, 76%, 15%)", le = "hsla(0,0%,10%,.9)", re = "hsla(0,0%,10%,.6)", se = "hsl(218, 20%, 39%)", ce = "hsl(218, 17%, 44%)", de = "hsl(218, 14%, 49%)", ie = "hsl(218, 14%, 54%)", ue = "hsl(218, 13%, 59%)", me = "hsl(218, 13%, 64%)", he = "hsl(217, 13%, 69%)", fe = "hsl(223, 12%, 89%)", pe = "hsl(228, 14%, 93%)", ve = "hsl(210, 7%, 95%)", ke = "hsl(220, 16%, 96%)", we = "hsl(210, 25%, 98%)", Ne = "hsl(0, 0%, 98%)", $ = "hsl(0, 0%, 100%)", Me = E, be = E, ge = $;
 export {
-  E as B100,
-  g as B200,
-  w as B300,
-  M as B400,
-  c as B500,
-  v as B600,
-  _ as B900,
-  L as G300,
-  G as G500,
-  u as N0,
-  J as N10,
-  O as N100,
-  R as N1000,
-  I as N20,
-  D as N200,
-  H as N25,
-  F as N30,
-  C as N300,
-  z as N40,
-  x as N400,
-  K as N5,
-  j as N500,
-  q as N70,
-  $ as N80,
-  Y as N800,
-  U as N90,
-  S as N900,
-  y as R300,
-  b as R400,
-  B as Theme,
-  A as Y200,
-  T as Y300,
-  P as primary1,
-  Q as primary2,
-  V as primary3
+  J as B100,
+  z as B200,
+  H as B300,
+  q as B400,
+  E as B500,
+  j as B600,
+  Q as B900,
+  oe as G300,
+  te as G500,
+  $ as N0,
+  we as N10,
+  ie as N100,
+  ne as N1000,
+  ke as N20,
+  de as N200,
+  ve as N25,
+  pe as N30,
+  ce as N300,
+  fe as N40,
+  se as N400,
+  Ne as N5,
+  re as N500,
+  he as N70,
+  me as N80,
+  le as N800,
+  ue as N90,
+  ae as N900,
+  X as R300,
+  W as R400,
+  F as Theme,
+  K as ThemeSwitcher,
+  ee as Y200,
+  Z as Y300,
+  Me as primary1,
+  be as primary2,
+  ge as primary3
 };
 //# sourceMappingURL=theme.es.js.map

package/dist/theme.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme.es.js","sources":["../src/Theme.vue","../src/colors.js"],"sourcesContent":["<template>\n    <div class=\"theme\">\n        <slot />\n    </div>\n</template>\n\n<script setup>\nimport { provide, ref, watch, onBeforeUnmount } from \"vue\";\nimport \"what-input\";\n\ndefineOptions({\n    name: \"Theme\",\n});\nconst theme = ref({\n    darkMode: window.matchMedia(\"(prefers-color-scheme: dark)\").matches,\n});\n\nwindow\n    .matchMedia(\"(prefers-color-scheme: dark)\")\n    .addEventListener(\"change\", updateDarkMode);\n// Set the color-scheme meta tag.\nvar colorSchemeMeta = document.createElement(\"meta\");\ncolorSchemeMeta.name = \"color-scheme\";\ncolorSchemeMeta.setAttribute(\"content\", \"light dark\");\ndocument.getElementsByTagName(\"head\")[0].appendChild(colorSchemeMeta);\n\nwatch(\n    theme.value,\n    () => {\n        document.documentElement.setAttribute(\n            \"dark-mode\",\n            theme.value.darkMode,\n        );\n    },\n    { deep: true, immediate: true },\n);\n\nonBeforeUnmount(() => {\n    window\n        .matchMedia(\"(prefers-color-scheme: dark)\")\n        .removeEventListener(\"change\", updateDarkMode);\n});\n\nfunction updateDarkMode(event) {\n    if (!event) {\n        return;\n    }\n    theme.value.darkMode = event.matches;\n}\n\nprovide(\"theme\", theme);\n</script>\n\n<style lang=\"less\">\n@import \"index.less\";\n</style>\n","// Blues\nexport const B900 = \"hsl(225, 90%, 16%)\";\n// @go-color-b700 = #000e7f;\nexport const B600 = \"#061f80\";\nexport const B500 = \"hsl(225, 94%, 35%)\";\n// @go-color-b550 = #131ff2;\n// @go-color-b500 = #001dff;\n// @go-color-b400 = #3333ff;\nexport const B400 = \"#06c\";\nexport const B300 = \"hsl(210, 100%, 50%)\";\nexport const B200 = \"hsl(210, 100%, 93%)\";\nexport const B100 = \"hsl(225, 100%, 96%)\";\n\n// Reds\nexport const R400 = \"hsl(12, 91%, 46%)\";\nexport const R300 = \"hsl(11, 100%, 59%)\";\n\n// Yellows\nexport const Y300 = \"hsl(40, 100%, 50%)\";\nexport const Y200 = \"hsl(46, 100%, 50%)\";\n\n// Greens\nexport const G500 = \"hsl(120, 100%, 25%)\";\nexport const G300 = \"#36b37e\";\n\n// Neutrals\nexport const N1000 = \"hsl(0, 0%, 0%)\";\nexport const N900 = \"hsl(218, 76%, 15%)\";\n// @go-color-n900 = hsl(218, 54%, 20%);\nexport const N800 = \"hsla(0,0%,10%,.9)\";\nexport const N500 = \"hsla(0,0%,10%,.6)\";\nexport const N400 = \"hsl(218, 20%, 39%)\";\nexport const N300 = \"hsl(218, 17%, 44%)\";\nexport const N200 = \"hsl(218, 14%, 49%)\";\nexport const N100 = \"hsl(218, 14%, 54%)\";\nexport const N90 = \"hsl(218, 13%, 59%)\";\nexport const N80 = \"hsl(218, 13%, 64%)\";\nexport const N70 = \"hsl(217, 13%, 69%)\";\nexport const N40 = \"hsl(223, 12%, 89%)\";\nexport const N30 = \"hsl(228, 14%, 93%)\";\nexport const N25 = \"hsl(210, 7%, 95%)\";\nexport const N20 = \"hsl(220, 16%, 96%)\";\nexport const N10 = \"hsl(210, 25%, 98%)\";\nexport const N5 = \"hsl(0, 0%, 98%)\";\nexport const N0 = \"hsl(0, 0%, 100%)\";\n\n// Primary color palette\nexport const primary1 = B500;\nexport const primary2 = B500;\nexport const primary3 = N0;\n"],"names":["theme","ref","updateDarkMode","colorSchemeMeta","watch","onBeforeUnmount","event","provide","_openBlock","_createElementBlock","_hoisted_1","_renderSlot","_ctx","B900","B600","B500","B400","B300","B200","B100","R400","R300","Y300","Y200","G500","G300","N1000","N900","N800","N500","N400","N300","N200","N100","N90","N80","N70","N40","N30","N25","N20","N10","N5","N0","primary1","primary2","primary3"],"mappings":";;;;;;;AAaA,UAAMA,IAAQC,EAAI;AAAA,MACd,UAAU,OAAO,WAAW,8BAA8B,EAAE;AAAA,IAChE,CAAC;AAED,WACK,WAAW,8BAA8B,EACzC,iBAAiB,UAAUC,CAAc;AAE9C,QAAIC,IAAkB,SAAS,cAAc,MAAM;AACnD,IAAAA,EAAgB,OAAO,gBACvBA,EAAgB,aAAa,WAAW,YAAY,GACpD,SAAS,qBAAqB,MAAM,EAAE,CAAC,EAAE,YAAYA,CAAe,GAEpEC;AAAA,MACIJ,EAAM;AAAA,MACN,MAAM;AACF,iBAAS,gBAAgB;AAAA,UACrB;AAAA,UACAA,EAAM,MAAM;AAAA,QACxB;AAAA,MACI;AAAA,MACA,EAAE,MAAM,IAAM,WAAW,GAAI;AAAA,IACjC,GAEAK,EAAgB,MAAM;AAClB,aACK,WAAW,8BAA8B,EACzC,oBAAoB,UAAUH,CAAc;AAAA,IACrD,CAAC;AAED,aAASA,EAAeI,GAAO;AAC3B,MAAKA,MAGLN,EAAM,MAAM,WAAWM,EAAM;AAAA,IACjC;AAEA,WAAAC,EAAQ,SAASP,CAAK,cAjDlBQ,EAAA,GAAAC,EAEM,OAFNC,GAEM;AAAA,MADFC,EAAQC,EAAA,QAAA,SAAA;AAAA;;ICDHC,IAAO,sBAEPC,IAAO,WACPC,IAAO,sBAIPC,IAAO,QACPC,IAAO,uBACPC,IAAO,uBACPC,IAAO,uBAGPC,IAAO,qBACPC,IAAO,sBAGPC,IAAO,sBACPC,IAAO,sBAGPC,IAAO,uBACPC,IAAO,WAGPC,IAAQ,kBACRC,IAAO,sBAEPC,IAAO,qBACPC,IAAO,qBACPC,IAAO,sBACPC,IAAO,sBACPC,IAAO,sBACPC,IAAO,sBACPC,IAAM,sBACNC,IAAM,sBACNC,IAAM,sBACNC,IAAM,sBACNC,IAAM,sBACNC,IAAM,qBACNC,IAAM,sBACNC,IAAM,sBACNC,IAAK,mBACLC,IAAK,oBAGLC,IAAW7B,GACX8B,IAAW9B,GACX+B,IAAWH;"}
+{"version":3,"file":"theme.es.js","sources":["../src/Theme.vue","../src/ThemeSwitcher.vue","../src/colors.js"],"sourcesContent":["<template>\n    <div class=\"theme\">\n        <slot />\n    </div>\n</template>\n\n<script setup>\nimport { provide, ref, watch, onBeforeUnmount } from \"vue\";\nimport \"what-input\";\n\ndefineOptions({\n    name: \"Theme\",\n});\nconst props = defineProps({\n    mode: {\n        type: String,\n        default: \"auto\",\n        validator: (value) => [\"auto\", \"light\", \"dark\"].includes(value),\n    },\n});\n\nconst DARK_MODE_QUERY = \"(prefers-color-scheme: dark)\";\nconst PREFERS_REDUCED_MOTION_QUERY = \"(prefers-reduced-motion: reduce)\";\nconst THEME_TRANSITION_DURATION = 200;\nconst darkModeMedia = window.matchMedia(DARK_MODE_QUERY);\nconst prefersReducedMotionMedia = window.matchMedia(\n    PREFERS_REDUCED_MOTION_QUERY,\n);\n\nconst theme = ref({\n    darkMode: resolveDarkMode(props.mode),\n});\n\ndarkModeMedia.addEventListener(\"change\", handleSystemPreferenceChange);\n\n// Set the color-scheme meta tag.\nvar colorSchemeMeta = document.createElement(\"meta\");\ncolorSchemeMeta.name = \"color-scheme\";\ncolorSchemeMeta.setAttribute(\"content\", \"light dark\");\ndocument.getElementsByTagName(\"head\")[0].appendChild(colorSchemeMeta);\n\nwatch(\n    () => props.mode,\n    () => {\n        syncDarkMode();\n    },\n    { immediate: true },\n);\n\nwatch(\n    () => theme.value.darkMode,\n    (darkMode, previousValue) => {\n        if (previousValue === undefined) {\n            setDocumentDarkModeAttribute(darkMode);\n            return;\n        }\n        withThemeTransition(() => {\n            setDocumentDarkModeAttribute(darkMode);\n        });\n    },\n    { immediate: true },\n);\n\nonBeforeUnmount(() => {\n    darkModeMedia.removeEventListener(\"change\", handleSystemPreferenceChange);\n});\n\nfunction syncDarkMode() {\n    theme.value.darkMode = resolveDarkMode(props.mode);\n}\n\nfunction resolveDarkMode(mode) {\n    if (mode === \"dark\") {\n        return true;\n    }\n    if (mode === \"light\") {\n        return false;\n    }\n    return darkModeMedia.matches;\n}\n\nfunction handleSystemPreferenceChange(event) {\n    if (!event || props.mode !== \"auto\") {\n        return;\n    }\n    theme.value.darkMode = event.matches;\n}\n\nfunction setDocumentDarkModeAttribute(darkMode) {\n    document.documentElement.setAttribute(\"dark-mode\", darkMode);\n}\n\nfunction withThemeTransition(applyTheme) {\n    if (prefersReducedMotionMedia.matches) {\n        applyTheme();\n        return;\n    }\n    const startViewTransition = document.startViewTransition?.bind(document);\n    if (startViewTransition) {\n        startViewTransition(() => {\n            applyTheme();\n        });\n        return;\n    }\n    applyTheme();\n    const element = document.documentElement;\n    if (typeof element.animate !== \"function\") {\n        return;\n    }\n    window.requestAnimationFrame(() => {\n        element.animate(\n            [\n                { opacity: 0.85 },\n                { opacity: 1 },\n            ],\n            {\n                duration: THEME_TRANSITION_DURATION,\n                easing: \"ease-in-out\",\n            },\n        );\n    });\n}\n\nprovide(\"theme\", theme);\n</script>\n\n<style lang=\"less\">\n@import \"index.less\";\n</style>\n","<template>\n    <DropdownMenu\n        v-model:open=\"open\"\n        text=\"Theme\"\n        aria-label=\"Select theme mode\"\n    >\n        <DropdownItemGroup title=\"Theme\">\n            <DropdownItemRadio\n                v-model:checked=\"internalMode\"\n                value=\"auto\"\n                :label=\"MODE_LABELS.auto\"\n                :aria-label=\"`${MODE_LABELS.auto} mode`\"\n            />\n            <hr class=\"theme-switcher-divider\" role=\"separator\" />\n            <DropdownItemRadio\n                v-model:checked=\"internalMode\"\n                value=\"light\"\n                :label=\"MODE_LABELS.light\"\n                :aria-label=\"`${MODE_LABELS.light} mode`\"\n            />\n            <DropdownItemRadio\n                v-model:checked=\"internalMode\"\n                value=\"dark\"\n                :label=\"MODE_LABELS.dark\"\n                :aria-label=\"`${MODE_LABELS.dark} mode`\"\n            />\n        </DropdownItemGroup>\n    </DropdownMenu>\n</template>\n\n<script setup>\nimport { ref, computed, watch } from \"vue\";\nimport {\n    DropdownMenu,\n    DropdownItemGroup,\n    DropdownItemRadio,\n} from \"@gospore/dropdown-menu\";\n\nconst MODE_OPTIONS = [\n    { value: \"auto\", label: \"System\" },\n    { value: \"light\", label: \"Light\" },\n    { value: \"dark\", label: \"Dark\" },\n];\nconst MODE_LABELS = MODE_OPTIONS.reduce((map, option) => {\n    map[option.value] = option.label;\n    return map;\n}, {});\nconst VALID_MODES = MODE_OPTIONS.map((option) => option.value);\nconst STORAGE_KEY = \"gospore-theme-mode\";\n\nconst props = defineProps({\n    mode: {\n        type: String,\n        default: \"auto\",\n        validator: (value) => [\"auto\", \"light\", \"dark\"].includes(value),\n    },\n});\nconst emit = defineEmits([\"update:mode\"]);\n\nconst open = ref(false);\nconst initialMode = readStoredMode() ?? props.mode;\nconst internalMode = ref(\n    VALID_MODES.includes(initialMode) ? initialMode : \"auto\",\n);\nconst label = computed(\n    () => MODE_LABELS[internalMode.value] ?? MODE_LABELS.auto,\n);\n\nwatch(\n    () => props.mode,\n    (mode) => {\n        if (VALID_MODES.includes(mode) && mode !== internalMode.value) {\n            internalMode.value = mode;\n        }\n    },\n);\n\nwatch(\n    internalMode,\n    (mode) => {\n        if (!VALID_MODES.includes(mode)) {\n            internalMode.value = \"auto\";\n            return;\n        }\n        open.value = false;\n        emit(\"update:mode\", mode);\n        writeStoredMode(mode);\n    },\n    { immediate: true },\n);\n\nfunction readStoredMode() {\n    if (typeof window === \"undefined\") {\n        return null;\n    }\n    const stored = window.localStorage.getItem(STORAGE_KEY);\n    return stored && VALID_MODES.includes(stored) ? stored : null;\n}\n\nfunction writeStoredMode(mode) {\n    if (typeof window === \"undefined\") {\n        return;\n    }\n    window.localStorage.setItem(STORAGE_KEY, mode);\n}\n</script>\n\n<style scoped lang=\"less\">\n.theme-switcher-divider {\n    margin: 4px 0;\n    background-color: var(--go-color-n20);\n}\n\n[dark-mode=\"true\"] {\n    .theme-switcher-divider {\n        background-color: var(--background-color-secondary-dark);\n    }\n}\n</style>\n","// Blues\nexport const B900 = \"hsl(225, 90%, 16%)\";\n// @go-color-b700 = #000e7f;\nexport const B600 = \"#061f80\";\nexport const B500 = \"hsl(225, 94%, 35%)\";\n// @go-color-b550 = #131ff2;\n// @go-color-b500 = #001dff;\n// @go-color-b400 = #3333ff;\nexport const B400 = \"#06c\";\nexport const B300 = \"hsl(210, 100%, 50%)\";\nexport const B200 = \"hsl(210, 100%, 93%)\";\nexport const B100 = \"hsl(225, 100%, 96%)\";\n\n// Reds\nexport const R400 = \"hsl(12, 91%, 46%)\";\nexport const R300 = \"hsl(11, 100%, 59%)\";\n\n// Yellows\nexport const Y300 = \"hsl(40, 100%, 50%)\";\nexport const Y200 = \"hsl(46, 100%, 50%)\";\n\n// Greens\nexport const G500 = \"hsl(120, 100%, 25%)\";\nexport const G300 = \"#36b37e\";\n\n// Neutrals\nexport const N1000 = \"hsl(0, 0%, 0%)\";\nexport const N900 = \"hsl(218, 76%, 15%)\";\n// @go-color-n900 = hsl(218, 54%, 20%);\nexport const N800 = \"hsla(0,0%,10%,.9)\";\nexport const N500 = \"hsla(0,0%,10%,.6)\";\nexport const N400 = \"hsl(218, 20%, 39%)\";\nexport const N300 = \"hsl(218, 17%, 44%)\";\nexport const N200 = \"hsl(218, 14%, 49%)\";\nexport const N100 = \"hsl(218, 14%, 54%)\";\nexport const N90 = \"hsl(218, 13%, 59%)\";\nexport const N80 = \"hsl(218, 13%, 64%)\";\nexport const N70 = \"hsl(217, 13%, 69%)\";\nexport const N40 = \"hsl(223, 12%, 89%)\";\nexport const N30 = \"hsl(228, 14%, 93%)\";\nexport const N25 = \"hsl(210, 7%, 95%)\";\nexport const N20 = \"hsl(220, 16%, 96%)\";\nexport const N10 = \"hsl(210, 25%, 98%)\";\nexport const N5 = \"hsl(0, 0%, 98%)\";\nexport const N0 = \"hsl(0, 0%, 100%)\";\n\n// Primary color palette\nexport const primary1 = B500;\nexport const primary2 = B500;\nexport const primary3 = N0;\n"],"names":["props","__props","darkModeMedia","DARK_MODE_QUERY","prefersReducedMotionMedia","PREFERS_REDUCED_MOTION_QUERY","theme","ref","resolveDarkMode","handleSystemPreferenceChange","colorSchemeMeta","watch","syncDarkMode","darkMode","previousValue","setDocumentDarkModeAttribute","withThemeTransition","onBeforeUnmount","mode","event","applyTheme","startViewTransition","element","THEME_TRANSITION_DURATION","provide","_openBlock","_createElementBlock","_hoisted_1","_renderSlot","_ctx","MODE_OPTIONS","MODE_LABELS","map","option","VALID_MODES","emit","__emit","open","initialMode","readStoredMode","internalMode","computed","writeStoredMode","stored","STORAGE_KEY","_createBlock","_unref","DropdownMenu","$event","_createVNode","DropdownItemGroup","DropdownItemRadio","_createElementVNode","B900","B600","B500","B400","B300","B200","B100","R400","R300","Y300","Y200","G500","G300","N1000","N900","N800","N500","N400","N300","N200","N100","N90","N80","N70","N40","N30","N25","N20","N10","N5","N0","primary1","primary2","primary3"],"mappings":"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"}

package/dist/theme.umd.js

@@ -1,2 +1,2 @@
-(function(e,n){typeof exports=="object"&&typeof module<"u"?n(exports,require("vue"),require("what-input")):typeof define=="function"&&define.amd?define(["exports","vue","what-input"],n):(e=typeof globalThis<"u"?globalThis:e||self,n(e.theme={},e.Vue))})(this,function(e,n){"use strict";const o={class:"theme"},d=Object.assign({name:"Theme"},{__name:"Theme",setup(z){const c=n.ref({darkMode:window.matchMedia("(prefers-color-scheme: dark)").matches});window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",l);var h=document.createElement("meta");h.name="color-scheme",h.setAttribute("content","light dark"),document.getElementsByTagName("head")[0].appendChild(h),n.watch(c.value,()=>{document.documentElement.setAttribute("dark-mode",c.value.darkMode)},{deep:!0,immediate:!0}),n.onBeforeUnmount(()=>{window.matchMedia("(prefers-color-scheme: dark)").removeEventListener("change",l)});function l(t){t&&(c.value.darkMode=t.matches)}return n.provide("theme",c),(t,F)=>(n.openBlock(),n.createElementBlock("div",o,[n.renderSlot(t.$slots,"default")]))}}),i="hsl(225, 90%, 16%)",m="#061f80",s="hsl(225, 94%, 35%)",N="#06c",u="hsl(210, 100%, 50%)",r="hsl(210, 100%, 93%)",f="hsl(225, 100%, 96%)",B="hsl(12, 91%, 46%)",k="hsl(11, 100%, 59%)",y="hsl(40, 100%, 50%)",w="hsl(46, 100%, 50%)",M="hsl(120, 100%, 25%)",_="#36b37e",g="hsl(0, 0%, 0%)",T="hsl(218, 76%, 15%)",b="hsla(0,0%,10%,.9)",E="hsla(0,0%,10%,.6)",v="hsl(218, 20%, 39%)",G="hsl(218, 17%, 44%)",R="hsl(218, 14%, 49%)",S="hsl(218, 14%, 54%)",Y="hsl(218, 13%, 59%)",j="hsl(218, 13%, 64%)",q="hsl(217, 13%, 69%)",A="hsl(223, 12%, 89%)",L="hsl(228, 14%, 93%)",O="hsl(210, 7%, 95%)",C="hsl(220, 16%, 96%)",D="hsl(210, 25%, 98%)",P="hsl(0, 0%, 98%)",a="hsl(0, 0%, 100%)",U=s,V=s,$=a;e.B100=f,e.B200=r,e.B300=u,e.B400=N,e.B500=s,e.B600=m,e.B900=i,e.G300=_,e.G500=M,e.N0=a,e.N10=D,e.N100=S,e.N1000=g,e.N20=C,e.N200=R,e.N25=O,e.N30=L,e.N300=G,e.N40=A,e.N400=v,e.N5=P,e.N500=E,e.N70=q,e.N80=j,e.N800=b,e.N90=Y,e.N900=T,e.R300=k,e.R400=B,e.Theme=d,e.Y200=w,e.Y300=y,e.primary1=U,e.primary2=V,e.primary3=$,Object.defineProperty(e,Symbol.toStringTag,{value:"Module"})});
+(function(e,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("vue"),require("what-input"),require("@gospore/dropdown-menu")):typeof define=="function"&&define.amd?define(["exports","vue","what-input","@gospore/dropdown-menu"],t):(e=typeof globalThis<"u"?globalThis:e||self,t(e.theme={},e.Vue,e.whatInput,e.DropdownMenu))})(this,function(e,t,ce,f){"use strict";const b={class:"theme"},E="(prefers-color-scheme: dark)",M="(prefers-reduced-motion: reduce)",S=200,B=Object.assign({name:"Theme"},{__name:"Theme",props:{mode:{type:String,default:"auto",validator:i=>["auto","light","dark"].includes(i)}},setup(i){const s=i,d=window.matchMedia(E),c=window.matchMedia(M),r=t.ref({darkMode:h(s.mode)});d.addEventListener("change",N);var m=document.createElement("meta");m.name="color-scheme",m.setAttribute("content","light dark"),document.getElementsByTagName("head")[0].appendChild(m),t.watch(()=>s.mode,()=>{k()},{immediate:!0}),t.watch(()=>r.value.darkMode,(a,n)=>{if(n===void 0){l(a);return}p(()=>{l(a)})},{immediate:!0}),t.onBeforeUnmount(()=>{d.removeEventListener("change",N)});function k(){r.value.darkMode=h(s.mode)}function h(a){return a==="dark"?!0:a==="light"?!1:d.matches}function N(a){!a||s.mode!=="auto"||(r.value.darkMode=a.matches)}function l(a){document.documentElement.setAttribute("dark-mode",a)}function p(a){if(c.matches){a();return}const n=document.startViewTransition?.bind(document);if(n){n(()=>{a()});return}a();const o=document.documentElement;typeof o.animate=="function"&&window.requestAnimationFrame(()=>{o.animate([{opacity:.85},{opacity:1}],{duration:S,easing:"ease-in-out"})})}return t.provide("theme",r),(a,n)=>(t.openBlock(),t.createElementBlock("div",b,[t.renderSlot(a.$slots,"default")]))}}),T=(i,s)=>{const d=i.__vccOpts||i;for(const[c,r]of s)d[c]=r;return d},g="gospore-theme-mode",y=T({__name:"ThemeSwitcher",props:{mode:{type:String,default:"auto",validator:i=>["auto","light","dark"].includes(i)}},emits:["update:mode"],setup(i,{emit:s}){const d=[{value:"auto",label:"System"},{value:"light",label:"Light"},{value:"dark",label:"Dark"}],c=d.reduce((n,o)=>(n[o.value]=o.label,n),{}),r=d.map(n=>n.value),m=i,k=s,h=t.ref(!1),N=p()??m.mode,l=t.ref(r.includes(N)?N:"auto");t.computed(()=>c[l.value]??c.auto),t.watch(()=>m.mode,n=>{r.includes(n)&&n!==l.value&&(l.value=n)}),t.watch(l,n=>{if(!r.includes(n)){l.value="auto";return}h.value=!1,k("update:mode",n),a(n)},{immediate:!0});function p(){if(typeof window>"u")return null;const n=window.localStorage.getItem(g);return n&&r.includes(n)?n:null}function a(n){typeof window>"u"||window.localStorage.setItem(g,n)}return(n,o)=>(t.openBlock(),t.createBlock(t.unref(f.DropdownMenu),{open:h.value,"onUpdate:open":o[3]||(o[3]=u=>h.value=u),text:"Theme","aria-label":"Select theme mode"},{default:t.withCtx(()=>[t.createVNode(t.unref(f.DropdownItemGroup),{title:"Theme"},{default:t.withCtx(()=>[t.createVNode(t.unref(f.DropdownItemRadio),{checked:l.value,"onUpdate:checked":o[0]||(o[0]=u=>l.value=u),value:"auto",label:t.unref(c).auto,"aria-label":`${t.unref(c).auto} mode`},null,8,["checked","label","aria-label"]),o[4]||(o[4]=t.createElementVNode("hr",{class:"theme-switcher-divider",role:"separator"},null,-1)),t.createVNode(t.unref(f.DropdownItemRadio),{checked:l.value,"onUpdate:checked":o[1]||(o[1]=u=>l.value=u),value:"light",label:t.unref(c).light,"aria-label":`${t.unref(c).light} mode`},null,8,["checked","label","aria-label"]),t.createVNode(t.unref(f.DropdownItemRadio),{checked:l.value,"onUpdate:checked":o[2]||(o[2]=u=>l.value=u),value:"dark",label:t.unref(c).dark,"aria-label":`${t.unref(c).dark} mode`},null,8,["checked","label","aria-label"])]),_:1})]),_:1},8,["open"]))}},[["__scopeId","data-v-441a2d2e"]]),D="hsl(225, 90%, 16%)",R="#061f80",w="hsl(225, 94%, 35%)",I="#06c",O="hsl(210, 100%, 50%)",A="hsl(210, 100%, 93%)",U="hsl(225, 100%, 96%)",V="hsl(12, 91%, 46%)",v="hsl(11, 100%, 59%)",Y="hsl(40, 100%, 50%)",G="hsl(46, 100%, 50%)",L="hsl(120, 100%, 25%)",C="#36b37e",$="hsl(0, 0%, 0%)",q="hsl(218, 76%, 15%)",P="hsla(0,0%,10%,.9)",j="hsla(0,0%,10%,.6)",F="hsl(218, 20%, 39%)",K="hsl(218, 17%, 44%)",Q="hsl(218, 14%, 49%)",H="hsl(218, 14%, 54%)",z="hsl(218, 13%, 59%)",J="hsl(218, 13%, 64%)",W="hsl(217, 13%, 69%)",X="hsl(223, 12%, 89%)",Z="hsl(228, 14%, 93%)",x="hsl(210, 7%, 95%)",ee="hsl(220, 16%, 96%)",te="hsl(210, 25%, 98%)",ne="hsl(0, 0%, 98%)",_="hsl(0, 0%, 100%)",ae=w,oe=w,le=_;e.B100=U,e.B200=A,e.B300=O,e.B400=I,e.B500=w,e.B600=R,e.B900=D,e.G300=C,e.G500=L,e.N0=_,e.N10=te,e.N100=H,e.N1000=$,e.N20=ee,e.N200=Q,e.N25=x,e.N30=Z,e.N300=K,e.N40=X,e.N400=F,e.N5=ne,e.N500=j,e.N70=W,e.N80=J,e.N800=P,e.N90=z,e.N900=q,e.R300=v,e.R400=V,e.Theme=B,e.ThemeSwitcher=y,e.Y200=G,e.Y300=Y,e.primary1=ae,e.primary2=oe,e.primary3=le,Object.defineProperty(e,Symbol.toStringTag,{value:"Module"})});
 //# sourceMappingURL=theme.umd.js.map

package/dist/theme.umd.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme.umd.js","sources":["../src/Theme.vue","../src/colors.js"],"sourcesContent":["<template>\n    <div class=\"theme\">\n        <slot />\n    </div>\n</template>\n\n<script setup>\nimport { provide, ref, watch, onBeforeUnmount } from \"vue\";\nimport \"what-input\";\n\ndefineOptions({\n    name: \"Theme\",\n});\nconst theme = ref({\n    darkMode: window.matchMedia(\"(prefers-color-scheme: dark)\").matches,\n});\n\nwindow\n    .matchMedia(\"(prefers-color-scheme: dark)\")\n    .addEventListener(\"change\", updateDarkMode);\n// Set the color-scheme meta tag.\nvar colorSchemeMeta = document.createElement(\"meta\");\ncolorSchemeMeta.name = \"color-scheme\";\ncolorSchemeMeta.setAttribute(\"content\", \"light dark\");\ndocument.getElementsByTagName(\"head\")[0].appendChild(colorSchemeMeta);\n\nwatch(\n    theme.value,\n    () => {\n        document.documentElement.setAttribute(\n            \"dark-mode\",\n            theme.value.darkMode,\n        );\n    },\n    { deep: true, immediate: true },\n);\n\nonBeforeUnmount(() => {\n    window\n        .matchMedia(\"(prefers-color-scheme: dark)\")\n        .removeEventListener(\"change\", updateDarkMode);\n});\n\nfunction updateDarkMode(event) {\n    if (!event) {\n        return;\n    }\n    theme.value.darkMode = event.matches;\n}\n\nprovide(\"theme\", theme);\n</script>\n\n<style lang=\"less\">\n@import \"index.less\";\n</style>\n","// Blues\nexport const B900 = \"hsl(225, 90%, 16%)\";\n// @go-color-b700 = #000e7f;\nexport const B600 = \"#061f80\";\nexport const B500 = \"hsl(225, 94%, 35%)\";\n// @go-color-b550 = #131ff2;\n// @go-color-b500 = #001dff;\n// @go-color-b400 = #3333ff;\nexport const B400 = \"#06c\";\nexport const B300 = \"hsl(210, 100%, 50%)\";\nexport const B200 = \"hsl(210, 100%, 93%)\";\nexport const B100 = \"hsl(225, 100%, 96%)\";\n\n// Reds\nexport const R400 = \"hsl(12, 91%, 46%)\";\nexport const R300 = \"hsl(11, 100%, 59%)\";\n\n// Yellows\nexport const Y300 = \"hsl(40, 100%, 50%)\";\nexport const Y200 = \"hsl(46, 100%, 50%)\";\n\n// Greens\nexport const G500 = \"hsl(120, 100%, 25%)\";\nexport const G300 = \"#36b37e\";\n\n// Neutrals\nexport const N1000 = \"hsl(0, 0%, 0%)\";\nexport const N900 = \"hsl(218, 76%, 15%)\";\n// @go-color-n900 = hsl(218, 54%, 20%);\nexport const N800 = \"hsla(0,0%,10%,.9)\";\nexport const N500 = \"hsla(0,0%,10%,.6)\";\nexport const N400 = \"hsl(218, 20%, 39%)\";\nexport const N300 = \"hsl(218, 17%, 44%)\";\nexport const N200 = \"hsl(218, 14%, 49%)\";\nexport const N100 = \"hsl(218, 14%, 54%)\";\nexport const N90 = \"hsl(218, 13%, 59%)\";\nexport const N80 = \"hsl(218, 13%, 64%)\";\nexport const N70 = \"hsl(217, 13%, 69%)\";\nexport const N40 = \"hsl(223, 12%, 89%)\";\nexport const N30 = \"hsl(228, 14%, 93%)\";\nexport const N25 = \"hsl(210, 7%, 95%)\";\nexport const N20 = \"hsl(220, 16%, 96%)\";\nexport const N10 = \"hsl(210, 25%, 98%)\";\nexport const N5 = \"hsl(0, 0%, 98%)\";\nexport const N0 = \"hsl(0, 0%, 100%)\";\n\n// Primary color palette\nexport const primary1 = B500;\nexport const primary2 = B500;\nexport const primary3 = N0;\n"],"names":["theme","ref","updateDarkMode","colorSchemeMeta","watch","onBeforeUnmount","event","provide","_openBlock","_createElementBlock","_hoisted_1","_renderSlot","_ctx","B900","B600","B500","B400","B300","B200","B100","R400","R300","Y300","Y200","G500","G300","N1000","N900","N800","N500","N400","N300","N200","N100","N90","N80","N70","N40","N30","N25","N20","N10","N5","N0","primary1","primary2","primary3"],"mappings":"6WAaA,MAAMA,EAAQC,EAAAA,IAAI,CACd,SAAU,OAAO,WAAW,8BAA8B,EAAE,OAChE,CAAC,EAED,OACK,WAAW,8BAA8B,EACzC,iBAAiB,SAAUC,CAAc,EAE9C,IAAIC,EAAkB,SAAS,cAAc,MAAM,EACnDA,EAAgB,KAAO,eACvBA,EAAgB,aAAa,UAAW,YAAY,EACpD,SAAS,qBAAqB,MAAM,EAAE,CAAC,EAAE,YAAYA,CAAe,EAEpEC,EAAAA,MACIJ,EAAM,MACN,IAAM,CACF,SAAS,gBAAgB,aACrB,YACAA,EAAM,MAAM,QACxB,CACI,EACA,CAAE,KAAM,GAAM,UAAW,EAAI,CACjC,EAEAK,EAAAA,gBAAgB,IAAM,CAClB,OACK,WAAW,8BAA8B,EACzC,oBAAoB,SAAUH,CAAc,CACrD,CAAC,EAED,SAASA,EAAeI,EAAO,CACtBA,IAGLN,EAAM,MAAM,SAAWM,EAAM,QACjC,CAEAC,OAAAA,EAAAA,QAAQ,QAASP,CAAK,UAjDlBQ,YAAA,EAAAC,qBAEM,MAFNC,EAEM,CADFC,aAAQC,EAAA,OAAA,SAAA,QCDHC,EAAO,qBAEPC,EAAO,UACPC,EAAO,qBAIPC,EAAO,OACPC,EAAO,sBACPC,EAAO,sBACPC,EAAO,sBAGPC,EAAO,oBACPC,EAAO,qBAGPC,EAAO,qBACPC,EAAO,qBAGPC,EAAO,sBACPC,EAAO,UAGPC,EAAQ,iBACRC,EAAO,qBAEPC,EAAO,oBACPC,EAAO,oBACPC,EAAO,qBACPC,EAAO,qBACPC,EAAO,qBACPC,EAAO,qBACPC,EAAM,qBACNC,EAAM,qBACNC,EAAM,qBACNC,EAAM,qBACNC,EAAM,qBACNC,EAAM,oBACNC,EAAM,qBACNC,EAAM,qBACNC,EAAK,kBACLC,EAAK,mBAGLC,EAAW7B,EACX8B,EAAW9B,EACX+B,EAAWH"}
+{"version":3,"file":"theme.umd.js","sources":["../src/Theme.vue","../src/ThemeSwitcher.vue","../src/colors.js"],"sourcesContent":["<template>\n    <div class=\"theme\">\n        <slot />\n    </div>\n</template>\n\n<script setup>\nimport { provide, ref, watch, onBeforeUnmount } from \"vue\";\nimport \"what-input\";\n\ndefineOptions({\n    name: \"Theme\",\n});\nconst props = defineProps({\n    mode: {\n        type: String,\n        default: \"auto\",\n        validator: (value) => [\"auto\", \"light\", \"dark\"].includes(value),\n    },\n});\n\nconst DARK_MODE_QUERY = \"(prefers-color-scheme: dark)\";\nconst PREFERS_REDUCED_MOTION_QUERY = \"(prefers-reduced-motion: reduce)\";\nconst THEME_TRANSITION_DURATION = 200;\nconst darkModeMedia = window.matchMedia(DARK_MODE_QUERY);\nconst prefersReducedMotionMedia = window.matchMedia(\n    PREFERS_REDUCED_MOTION_QUERY,\n);\n\nconst theme = ref({\n    darkMode: resolveDarkMode(props.mode),\n});\n\ndarkModeMedia.addEventListener(\"change\", handleSystemPreferenceChange);\n\n// Set the color-scheme meta tag.\nvar colorSchemeMeta = document.createElement(\"meta\");\ncolorSchemeMeta.name = \"color-scheme\";\ncolorSchemeMeta.setAttribute(\"content\", \"light dark\");\ndocument.getElementsByTagName(\"head\")[0].appendChild(colorSchemeMeta);\n\nwatch(\n    () => props.mode,\n    () => {\n        syncDarkMode();\n    },\n    { immediate: true },\n);\n\nwatch(\n    () => theme.value.darkMode,\n    (darkMode, previousValue) => {\n        if (previousValue === undefined) {\n            setDocumentDarkModeAttribute(darkMode);\n            return;\n        }\n        withThemeTransition(() => {\n            setDocumentDarkModeAttribute(darkMode);\n        });\n    },\n    { immediate: true },\n);\n\nonBeforeUnmount(() => {\n    darkModeMedia.removeEventListener(\"change\", handleSystemPreferenceChange);\n});\n\nfunction syncDarkMode() {\n    theme.value.darkMode = resolveDarkMode(props.mode);\n}\n\nfunction resolveDarkMode(mode) {\n    if (mode === \"dark\") {\n        return true;\n    }\n    if (mode === \"light\") {\n        return false;\n    }\n    return darkModeMedia.matches;\n}\n\nfunction handleSystemPreferenceChange(event) {\n    if (!event || props.mode !== \"auto\") {\n        return;\n    }\n    theme.value.darkMode = event.matches;\n}\n\nfunction setDocumentDarkModeAttribute(darkMode) {\n    document.documentElement.setAttribute(\"dark-mode\", darkMode);\n}\n\nfunction withThemeTransition(applyTheme) {\n    if (prefersReducedMotionMedia.matches) {\n        applyTheme();\n        return;\n    }\n    const startViewTransition = document.startViewTransition?.bind(document);\n    if (startViewTransition) {\n        startViewTransition(() => {\n            applyTheme();\n        });\n        return;\n    }\n    applyTheme();\n    const element = document.documentElement;\n    if (typeof element.animate !== \"function\") {\n        return;\n    }\n    window.requestAnimationFrame(() => {\n        element.animate(\n            [\n                { opacity: 0.85 },\n                { opacity: 1 },\n            ],\n            {\n                duration: THEME_TRANSITION_DURATION,\n                easing: \"ease-in-out\",\n            },\n        );\n    });\n}\n\nprovide(\"theme\", theme);\n</script>\n\n<style lang=\"less\">\n@import \"index.less\";\n</style>\n","<template>\n    <DropdownMenu\n        v-model:open=\"open\"\n        text=\"Theme\"\n        aria-label=\"Select theme mode\"\n    >\n        <DropdownItemGroup title=\"Theme\">\n            <DropdownItemRadio\n                v-model:checked=\"internalMode\"\n                value=\"auto\"\n                :label=\"MODE_LABELS.auto\"\n                :aria-label=\"`${MODE_LABELS.auto} mode`\"\n            />\n            <hr class=\"theme-switcher-divider\" role=\"separator\" />\n            <DropdownItemRadio\n                v-model:checked=\"internalMode\"\n                value=\"light\"\n                :label=\"MODE_LABELS.light\"\n                :aria-label=\"`${MODE_LABELS.light} mode`\"\n            />\n            <DropdownItemRadio\n                v-model:checked=\"internalMode\"\n                value=\"dark\"\n                :label=\"MODE_LABELS.dark\"\n                :aria-label=\"`${MODE_LABELS.dark} mode`\"\n            />\n        </DropdownItemGroup>\n    </DropdownMenu>\n</template>\n\n<script setup>\nimport { ref, computed, watch } from \"vue\";\nimport {\n    DropdownMenu,\n    DropdownItemGroup,\n    DropdownItemRadio,\n} from \"@gospore/dropdown-menu\";\n\nconst MODE_OPTIONS = [\n    { value: \"auto\", label: \"System\" },\n    { value: \"light\", label: \"Light\" },\n    { value: \"dark\", label: \"Dark\" },\n];\nconst MODE_LABELS = MODE_OPTIONS.reduce((map, option) => {\n    map[option.value] = option.label;\n    return map;\n}, {});\nconst VALID_MODES = MODE_OPTIONS.map((option) => option.value);\nconst STORAGE_KEY = \"gospore-theme-mode\";\n\nconst props = defineProps({\n    mode: {\n        type: String,\n        default: \"auto\",\n        validator: (value) => [\"auto\", \"light\", \"dark\"].includes(value),\n    },\n});\nconst emit = defineEmits([\"update:mode\"]);\n\nconst open = ref(false);\nconst initialMode = readStoredMode() ?? props.mode;\nconst internalMode = ref(\n    VALID_MODES.includes(initialMode) ? initialMode : \"auto\",\n);\nconst label = computed(\n    () => MODE_LABELS[internalMode.value] ?? MODE_LABELS.auto,\n);\n\nwatch(\n    () => props.mode,\n    (mode) => {\n        if (VALID_MODES.includes(mode) && mode !== internalMode.value) {\n            internalMode.value = mode;\n        }\n    },\n);\n\nwatch(\n    internalMode,\n    (mode) => {\n        if (!VALID_MODES.includes(mode)) {\n            internalMode.value = \"auto\";\n            return;\n        }\n        open.value = false;\n        emit(\"update:mode\", mode);\n        writeStoredMode(mode);\n    },\n    { immediate: true },\n);\n\nfunction readStoredMode() {\n    if (typeof window === \"undefined\") {\n        return null;\n    }\n    const stored = window.localStorage.getItem(STORAGE_KEY);\n    return stored && VALID_MODES.includes(stored) ? stored : null;\n}\n\nfunction writeStoredMode(mode) {\n    if (typeof window === \"undefined\") {\n        return;\n    }\n    window.localStorage.setItem(STORAGE_KEY, mode);\n}\n</script>\n\n<style scoped lang=\"less\">\n.theme-switcher-divider {\n    margin: 4px 0;\n    background-color: var(--go-color-n20);\n}\n\n[dark-mode=\"true\"] {\n    .theme-switcher-divider {\n        background-color: var(--background-color-secondary-dark);\n    }\n}\n</style>\n","// Blues\nexport const B900 = \"hsl(225, 90%, 16%)\";\n// @go-color-b700 = #000e7f;\nexport const B600 = \"#061f80\";\nexport const B500 = \"hsl(225, 94%, 35%)\";\n// @go-color-b550 = #131ff2;\n// @go-color-b500 = #001dff;\n// @go-color-b400 = #3333ff;\nexport const B400 = \"#06c\";\nexport const B300 = \"hsl(210, 100%, 50%)\";\nexport const B200 = \"hsl(210, 100%, 93%)\";\nexport const B100 = \"hsl(225, 100%, 96%)\";\n\n// Reds\nexport const R400 = \"hsl(12, 91%, 46%)\";\nexport const R300 = \"hsl(11, 100%, 59%)\";\n\n// Yellows\nexport const Y300 = \"hsl(40, 100%, 50%)\";\nexport const Y200 = \"hsl(46, 100%, 50%)\";\n\n// Greens\nexport const G500 = \"hsl(120, 100%, 25%)\";\nexport const G300 = \"#36b37e\";\n\n// Neutrals\nexport const N1000 = \"hsl(0, 0%, 0%)\";\nexport const N900 = \"hsl(218, 76%, 15%)\";\n// @go-color-n900 = hsl(218, 54%, 20%);\nexport const N800 = \"hsla(0,0%,10%,.9)\";\nexport const N500 = \"hsla(0,0%,10%,.6)\";\nexport const N400 = \"hsl(218, 20%, 39%)\";\nexport const N300 = \"hsl(218, 17%, 44%)\";\nexport const N200 = \"hsl(218, 14%, 49%)\";\nexport const N100 = \"hsl(218, 14%, 54%)\";\nexport const N90 = \"hsl(218, 13%, 59%)\";\nexport const N80 = \"hsl(218, 13%, 64%)\";\nexport const N70 = \"hsl(217, 13%, 69%)\";\nexport const N40 = \"hsl(223, 12%, 89%)\";\nexport const N30 = \"hsl(228, 14%, 93%)\";\nexport const N25 = \"hsl(210, 7%, 95%)\";\nexport const N20 = \"hsl(220, 16%, 96%)\";\nexport const N10 = \"hsl(210, 25%, 98%)\";\nexport const N5 = \"hsl(0, 0%, 98%)\";\nexport const N0 = \"hsl(0, 0%, 100%)\";\n\n// Primary color palette\nexport const primary1 = B500;\nexport const primary2 = B500;\nexport const primary3 = N0;\n"],"names":["props","__props","darkModeMedia","DARK_MODE_QUERY","prefersReducedMotionMedia","PREFERS_REDUCED_MOTION_QUERY","theme","ref","resolveDarkMode","handleSystemPreferenceChange","colorSchemeMeta","watch","syncDarkMode","darkMode","previousValue","setDocumentDarkModeAttribute","withThemeTransition","onBeforeUnmount","mode","event","applyTheme","startViewTransition","element","THEME_TRANSITION_DURATION","provide","_openBlock","_createElementBlock","_hoisted_1","_renderSlot","_ctx","MODE_OPTIONS","MODE_LABELS","map","option","VALID_MODES","emit","__emit","open","initialMode","readStoredMode","internalMode","computed","writeStoredMode","stored","STORAGE_KEY","_createBlock","_unref","DropdownMenu","$event","_createVNode","DropdownItemGroup","DropdownItemRadio","_createElementVNode","B900","B600","B500","B400","B300","B200","B100","R400","R300","Y300","Y200","G500","G300","N1000","N900","N800","N500","N400","N300","N200","N100","N90","N80","N70","N40","N30","N25","N20","N10","N5","N0","primary1","primary2","primary3"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@gospore/theme",
-    "version": "1.0.119",
+    "version": "1.0.121",
     "description": "",
     "author": "Gospore",
     "type": "module",
@@ -26,6 +26,7 @@
         "vue": "^3.4.20"
     },
     "dependencies": {
+        "@gospore/dropdown-menu": "^1.0.91",
         "what-input": "^5.2.12"
     },
     "devDependencies": {
@@ -33,5 +34,5 @@
         "unplugin-vue-macros": "^2.14.5",
         "vite": "^7.1.9"
     },
-    "gitHead": "765c5079e8a3825185ce059b0674f47e85edd15c"
+    "gitHead": "59a1a17b10782d00b4072d3eb4f1cb1c55a0da80"
 }