@poveste/app 0.18.3 → 0.19.0

package/dist/THIRD_PARTY_NOTICES.md

@@ -0,0 +1,159 @@
+# Third-party notices
+
+@poveste/app bundles code from the packages below into its `dist`. Each is listed with its version, licence and the licence text it was distributed under.
+
+## @tailwindcss/typography@0.5.20
+
+Licence: MIT
+
+```
+MIT License
+
+Copyright (c) Tailwind Labs, Inc.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+```
+
+## Noto Sans Display@vendored
+
+Licence: OFL-1.1
+
+```
+Copyright 2015 Google Inc. All Rights Reserved. NotoSansDisplay-Italic[wdth,wght].ttf: Copyright 2015 Google Inc. All Rights Reserved.
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded,
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.
+```
+
+## tailwindcss@4.3.3
+
+Licence: MIT
+
+```
+MIT License
+
+Copyright (c) Tailwind Labs, Inc.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+```

package/dist/bundled/app.css

@@ -170,11 +170,11 @@ from {
 }
 }
 @scope (:root) to (.__poveste-render-story:not(.__poveste-render-custom-controls)) {
-.bind-icon-color[data-v-bfa057e9] {
-  color: var(--v1061c03c);
+.bind-icon-color[data-v-e0e9a8e1] {
+  color: var(--v2ce2d009);
 }
-.bind-preview-bg[data-v-bfa057e9] {
-  background-color: var(--v2d8b4c49);
+.bind-preview-bg[data-v-e0e9a8e1] {
+  background-color: var(--v4f3f7242);
 }
 }
 @scope (:root) to (.__poveste-render-story:not(.__poveste-render-custom-controls)) {

package/dist/bundled/components/command/PromptSelect.vue_vue_type_script_setup_true_lang.js

@@ -46,7 +46,7 @@ var PromptSelect_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ def
 			if (typeof props.prompt.options === "function") {
 				const rId = ++requestId;
 				const result = await props.prompt.options(search.value, props.answers);
-				if (rId === requestId) options.value = result;
+				if (rId === requestId) options.value = result ?? [];
 			} else options.value = props.prompt.options;
 		});
 		const formattedOptions = computed(() => {

package/dist/bundled/components/story/StoryNativeScope.js

@@ -0,0 +1,14 @@
+import _plugin_vue_export_helper_default from "../../_virtual/_plugin-vue_export-helper.js";
+import { createElementBlock, openBlock, renderSlot } from "@poveste/vendors/vue";
+//#region src/app/components/story/StoryNativeScope.vue
+var _sfc_main = {};
+var _hoisted_1 = {
+	class: "__poveste-render-story __poveste-render-custom-controls",
+	style: { "display": "contents !important" }
+};
+function _sfc_render(_ctx, _cache) {
+	return openBlock(), createElementBlock("div", _hoisted_1, [renderSlot(_ctx.$slots, "default")]);
+}
+var StoryNativeScope_default = /*#__PURE__*/ _plugin_vue_export_helper_default(_sfc_main, [["render", _sfc_render]]);
+//#endregion
+export { StoryNativeScope_default as default };

package/dist/bundled/components/story/StoryVariantGridItem.js

@@ -2,6 +2,6 @@ import _plugin_vue_export_helper_default from "../../_virtual/_plugin-vue_export
 import StoryVariantGridItem_vue_vue_type_script_setup_true_lang_default from "./StoryVariantGridItem.vue_vue_type_script_setup_true_lang.js";
 /* empty css                                                                     */
 //#region src/app/components/story/StoryVariantGridItem.vue
-var StoryVariantGridItem_default = /*#__PURE__*/ _plugin_vue_export_helper_default(StoryVariantGridItem_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-bfa057e9"]]);
+var StoryVariantGridItem_default = /*#__PURE__*/ _plugin_vue_export_helper_default(StoryVariantGridItem_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-e0e9a8e1"]]);
 //#endregion
 export { StoryVariantGridItem_default as default };

package/dist/bundled/components/story/StoryVariantGridItem.vue_vue_type_script_setup_true_lang.js

@@ -1,7 +1,7 @@
 import { povesteConfig } from "../../util/config.js";
 import { useStoryStore } from "../../stores/story.js";
 import { useScrollOnActive } from "../../util/scroll.js";
-import { previewDarkClasses, usePreviewDark } from "../../util/color-scheme.js";
+import { previewDarkClasses, usePreviewColorScheme, usePreviewDark } from "../../util/color-scheme.js";
 import { getContrastColor } from "../../util/preview-settings.js";
 import { usePreviewSettingsStore } from "../../stores/preview-settings.js";
 import ToolbarNewTab_default from "../toolbar/ToolbarNewTab.js";
@@ -9,6 +9,7 @@ import GenericRenderStory_default from "./GenericRenderStory.js";
 import { useCurrentVariantRoute } from "../../util/variant.js";
 import { getSourceCode } from "../../util/docs.js";
 import CheckerboardPattern_default from "../misc/CheckerboardPattern.js";
+import StoryNativeScope_default from "./StoryNativeScope.js";
 import StoryVariantSinglePreviewRemote_default from "./StoryVariantSinglePreviewRemote.js";
 import { useResizeObserver } from "@poveste/vendors/vue-use";
 import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, nextTick, normalizeClass, normalizeStyle, openBlock, ref, resolveComponent, toDisplayString, toRefs, unref, useCssVars, watch, withCtx, withModifiers } from "@poveste/vendors/vue";
@@ -34,8 +35,8 @@ var StoryVariantGridItem_vue_vue_type_script_setup_true_lang_default = /*@__PURE
 	emits: { resize: (_width, _height) => true },
 	setup(__props, { emit: __emit }) {
 		useCssVars((_ctx) => ({
-			"v1061c03c": unref(variant).iconColor,
-			"v2d8b4c49": unref(settings).backgroundColor
+			"v2ce2d009": unref(variant).iconColor,
+			"v4f3f7242": unref(settings).backgroundColor
 		}));
 		const props = __props;
 		const emit = __emit;
@@ -67,6 +68,7 @@ var StoryVariantGridItem_vue_vue_type_script_setup_true_lang_default = /*@__PURE
 		});
 		const settings = usePreviewSettingsStore().currentSettings;
 		const previewDark = usePreviewDark(settings);
+		const previewColorScheme = usePreviewColorScheme(settings);
 		const contrastColor = computed(() => getContrastColor(settings));
 		const autoApplyContrastColor = computed(() => !!povesteConfig.autoApplyContrastColor);
 		const useIframe = computed(() => {
@@ -131,19 +133,24 @@ var StoryVariantGridItem_vue_vue_type_script_setup_true_lang_default = /*@__PURE
 					variant: unref(variant),
 					"auto-height": "",
 					responsive: false
-				}, null, 8, ["story", "variant"])) : (openBlock(), createBlock(GenericRenderStory_default, {
-					key: `${__props.story.id}-${unref(variant).id}`,
-					variant: unref(variant),
-					story: __props.story,
-					dir: unref(settings).textDirection,
-					class: normalizeClass(unref(previewDark) ? unref(previewDarkClasses)() : void 0),
-					onReady
-				}, null, 8, [
-					"variant",
-					"story",
-					"dir",
-					"class"
-				]))], 4)
+				}, null, 8, ["story", "variant"])) : (openBlock(), createBlock(StoryNativeScope_default, { key: 1 }, {
+					default: withCtx(() => [(openBlock(), createBlock(GenericRenderStory_default, {
+						key: `${__props.story.id}-${unref(variant).id}`,
+						variant: unref(variant),
+						story: __props.story,
+						dir: unref(settings).textDirection,
+						class: normalizeClass(unref(previewDark) ? unref(previewDarkClasses)() : void 0),
+						style: normalizeStyle({ "--poveste-color-scheme": unref(previewColorScheme) }),
+						onReady
+					}, null, 8, [
+						"variant",
+						"story",
+						"dir",
+						"class",
+						"style"
+					]))]),
+					_: 1
+				}))], 4)
 			], 34)], 512);
 		};
 	}

package/dist/bundled/components/story/StoryVariantSinglePreviewNative.vue_vue_type_script_setup_true_lang.js

@@ -1,11 +1,12 @@
 import { povesteConfig } from "../../util/config.js";
 import { useStoryStore } from "../../stores/story.js";
-import { previewDarkClasses, usePreviewDark } from "../../util/color-scheme.js";
+import { previewDarkClasses, usePreviewColorScheme, usePreviewDark } from "../../util/color-scheme.js";
 import { getContrastColor } from "../../util/preview-settings.js";
 import { usePreviewSettingsStore } from "../../stores/preview-settings.js";
 import GenericRenderStory_default from "./GenericRenderStory.js";
+import StoryNativeScope_default from "./StoryNativeScope.js";
 import StoryResponsivePreview_default from "./StoryResponsivePreview.js";
-import { computed, createBlock, createElementVNode, defineComponent, normalizeClass, normalizeStyle, openBlock, unref, watch, withCtx } from "@poveste/vendors/vue";
+import { computed, createBlock, createElementVNode, createVNode, defineComponent, normalizeClass, normalizeStyle, openBlock, unref, watch, withCtx } from "@poveste/vendors/vue";
 //#region src/app/components/story/StoryVariantSinglePreviewNative.vue?vue&type=script&setup=true&lang.ts
 var StoryVariantSinglePreviewNative_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	__name: "StoryVariantSinglePreviewNative",
@@ -25,6 +26,7 @@ var StoryVariantSinglePreviewNative_vue_vue_type_script_setup_true_lang_default
 		}
 		const settings = usePreviewSettingsStore().currentSettings;
 		const previewDark = usePreviewDark(settings);
+		const previewColorScheme = usePreviewColorScheme(settings);
 		const contrastColor = computed(() => getContrastColor(settings));
 		const autoApplyContrastColor = computed(() => !!povesteConfig.autoApplyContrastColor);
 		return (_ctx, _cache) => {
@@ -46,19 +48,24 @@ var StoryVariantSinglePreviewNative_vue_vue_type_script_setup_true_lang_default
 					}]),
 					class: "relative",
 					"data-testid": "sandbox-render"
-				}, [(openBlock(), createBlock(GenericRenderStory_default, {
-					key: `${__props.story.id}-${__props.variant.id}`,
-					variant: __props.variant,
-					story: __props.story,
-					class: normalizeClass(["h-full", unref(previewDark) ? unref(previewDarkClasses)() : void 0]),
-					dir: unref(settings).textDirection,
-					onReady
-				}, null, 8, [
-					"variant",
-					"story",
-					"class",
-					"dir"
-				]))], 4)]),
+				}, [createVNode(StoryNativeScope_default, null, {
+					default: withCtx(() => [(openBlock(), createBlock(GenericRenderStory_default, {
+						key: `${__props.story.id}-${__props.variant.id}`,
+						variant: __props.variant,
+						story: __props.story,
+						class: normalizeClass(["h-full", unref(previewDark) ? unref(previewDarkClasses)() : void 0]),
+						style: normalizeStyle({ "--poveste-color-scheme": unref(previewColorScheme) }),
+						dir: unref(settings).textDirection,
+						onReady
+					}, null, 8, [
+						"variant",
+						"story",
+						"class",
+						"style",
+						"dir"
+					]))]),
+					_: 1
+				})], 4)]),
 				_: 1
 			}, 8, ["variant"]);
 		};

package/dist/bundled/components/story/StoryVariantSinglePreviewRemote.vue_vue_type_script_setup_true_lang.js

@@ -1,7 +1,8 @@
-import { EVENT_SEND, PREVIEW_SETTINGS_REQUEST, PREVIEW_SETTINGS_SYNC, SANDBOX_HEIGHT, SANDBOX_READY, SANDBOX_RETARGET, STATE_SYNC } from "../../util/const.js";
+import { EVENT_SEND, PREVIEW_SETTINGS_REQUEST, PREVIEW_SETTINGS_SYNC, SANDBOX_COLOR_SCHEME, SANDBOX_HEIGHT, SANDBOX_READY, SANDBOX_RETARGET, STATE_SYNC } from "../../util/const.js";
 import { trackWindow } from "../../util/keyboard.js";
 import { useStoryStore } from "../../stores/story.js";
 import { useStoryErrorStore } from "../../stores/story-errors.js";
+import { usePreviewColorScheme } from "../../util/color-scheme.js";
 import { usePreviewSettingsStore } from "../../stores/preview-settings.js";
 import { getSandboxUrl } from "../../util/sandbox.js";
 import { createStateBridge } from "../../util/state-bridge.js";
@@ -48,6 +49,8 @@ var StoryVariantSinglePreviewRemote_vue_vue_type_script_setup_true_lang_default
 	setup(__props) {
 		const props = __props;
 		const settings = usePreviewSettingsStore().currentSettings;
+		const previewColorScheme = usePreviewColorScheme(settings);
+		const sandboxColorScheme = ref(null);
 		const errorStore = useStoryErrorStore();
 		const storyError = computed(() => errorStore.forVariant(props.story.id, props.variant.id));
 		const render = createRenderTracker();
@@ -103,6 +106,9 @@ var StoryVariantSinglePreviewRemote_vue_vue_type_script_setup_true_lang_default
 				case PREVIEW_SETTINGS_REQUEST:
 					syncSettings();
 					break;
+				case SANDBOX_COLOR_SCHEME:
+					if (typeof event.data.scheme === "string") sandboxColorScheme.value = event.data.scheme;
+					break;
 				case SANDBOX_HEIGHT:
 					if (!fromCurrentOccupant(event.data)) break;
 					if (typeof event.data.h === "number" && event.data.h >= MIN_HEIGHT) {
@@ -196,7 +202,7 @@ var StoryVariantSinglePreviewRemote_vue_vue_type_script_setup_true_lang_default
 			immediate: true
 		});
 		function previewStyle(isResponsiveEnabled, finalWidth, finalHeight) {
-			const style = {};
+			const style = { colorScheme: sandboxColorScheme.value ?? previewColorScheme.value };
 			if (isResponsiveEnabled) {
 				if (finalWidth) style["width"] = `${finalWidth}px`;
 				if (finalHeight) style["height"] = `${finalHeight}px`;

package/dist/bundled/index.js

@@ -1,8 +1,10 @@
+import { isDark } from "./util/dark.js";
 import { router } from "./router.js";
+import { installRenderRootColorScheme } from "./util/color-scheme.js";
 import App_default from "./App.js";
-import "./plugin.js";
+import { setupPluginApi } from "./plugin.js";
 import { iconCollections } from "./util/icons.generated.js";
-import { createApp } from "@poveste/vendors/vue";
+import { createApp, watch } from "@poveste/vendors/vue";
 import { addCollection } from "@poveste/vendors/iconify";
 import { createPinia } from "@poveste/vendors/pinia";
 import { generation } from "virtual:$poveste-stories";
@@ -10,11 +12,18 @@ import "virtual:$poveste-theme";
 //#region src/app/index.ts
 async function mountMainApp() {
 	for (const collection of iconCollections) addCollection(collection);
+	watch(isDark, (dark) => {
+		document.documentElement.style.colorScheme = dark ? "dark" : "light";
+	}, { immediate: true });
+	installRenderRootColorScheme();
 	const app = createApp(App_default);
 	app.use(createPinia());
 	app.use(router);
 	app.mount("#app");
-	if (import.meta.hot) import.meta.hot.send("poveste:mount", { generation });
+	if (import.meta.hot) {
+		import.meta.hot.send("poveste:mount", { generation });
+		setupPluginApi();
+	}
 }
 //#endregion
 export { mountMainApp };

package/dist/bundled/sandbox.js

@@ -1,16 +1,18 @@
 import { isDark } from "./util/dark.js";
-import { PREVIEW_SETTINGS_REQUEST, SANDBOX_HEIGHT, SANDBOX_READY, STATE_SYNC } from "./util/const.js";
+import { PREVIEW_SETTINGS_REQUEST, SANDBOX_COLOR_SCHEME, SANDBOX_HEIGHT, SANDBOX_READY, STATE_SYNC } from "./util/const.js";
 import { occupant } from "./util/occupant.js";
-import { previewDarkClasses, resolvePreviewDark } from "./util/color-scheme.js";
+import { lowPriorityColorScheme, previewColorScheme, previewDarkClasses, resolvePreviewDark } from "./util/color-scheme.js";
 import { applyPreviewSettings, loadStoredPreviewSettings, receivedSettings } from "./util/preview-settings.js";
 import GenericMountStory_default from "./components/story/GenericMountStory.js";
 import { mapFile } from "./util/mapping.js";
+import { iconCollections } from "./util/icons.generated.js";
 import GenericRenderStory_default from "./components/story/GenericRenderStory.js";
 import { createStateBridge } from "./util/state-bridge.js";
 import { toRawDeep } from "./util/state.js";
 import { isBenignResizeObserverEvent } from "./util/uncaught.js";
 import { usePreferredDark } from "@poveste/vendors/vue-use";
 import { computed, createApp, h, onMounted, ref, watch, watchEffect } from "@poveste/vendors/vue";
+import { addCollection } from "@poveste/vendors/iconify";
 import { createPinia } from "@poveste/vendors/pinia";
 import { files, onUpdate } from "virtual:$poveste-stories";
 import { parseQuery } from "@poveste/vendors/vue-router";
@@ -55,8 +57,35 @@ watch(previewDark, (value) => {
 		for (const className of previewDarkClasses()) el.classList.toggle(className, value);
 	}
 }, { immediate: true });
+var reportedColorScheme = "";
+function reportColorScheme() {
+	if (window.parent === window) return;
+	const scheme = getComputedStyle(document.documentElement).colorScheme;
+	if (scheme === reportedColorScheme) return;
+	reportedColorScheme = scheme;
+	window.parent.postMessage({
+		type: SANDBOX_COLOR_SCHEME,
+		scheme
+	}, window.location.origin);
+}
+new MutationObserver(reportColorScheme).observe(document.head, {
+	childList: true,
+	subtree: true,
+	characterData: true
+});
+new MutationObserver(reportColorScheme).observe(document.documentElement, {
+	attributes: true,
+	attributeFilter: ["class", "style"]
+});
+document.addEventListener("load", reportColorScheme, true);
+var setRootColorScheme = lowPriorityColorScheme(":root");
+watch(() => previewColorScheme(receivedSettings.colorScheme, isDark.value), (value) => {
+	setRootColorScheme(value);
+	reportColorScheme();
+}, { immediate: true });
 var pendingFrame = null;
 var lastReportedHeight = -1;
+for (const collection of iconCollections) addCollection(collection);
 var app = createApp({
 	name: "SandboxApp",
 	setup() {
@@ -125,6 +154,7 @@ app.mount("#app");
 document.body.classList.add("__poveste-render-story", "__poveste-render-custom-controls");
 function reportHeight() {
 	pendingFrame = null;
+	reportColorScheme();
 	const renderRoot = document.querySelector(".__poveste-render-story");
 	const h = renderRoot ? Math.ceil(renderRoot.getBoundingClientRect().height) : Math.ceil(document.body.scrollHeight);
 	if (h === lastReportedHeight) return;

package/dist/bundled/stores/preview-settings.js

@@ -2,21 +2,46 @@ import { povesteConfig } from "../util/config.js";
 import { defaultPreviewColorScheme } from "../util/color-scheme.js";
 import { PREVIEW_SETTINGS_STORAGE_KEY } from "../util/preview-settings.js";
 import { useStorage } from "@poveste/vendors/vue-use";
+import { watch } from "@poveste/vendors/vue";
 import { defineStore } from "@poveste/vendors/pinia";
 //#region src/app/stores/preview-settings.ts
+var UNITS = [
+	["responsiveWidth", "responsiveHeight"],
+	["backgroundColor"],
+	["rotate"],
+	["checkerboard"],
+	["textDirection"]
+];
+/** The book's `preview` config, with the deprecated `defaultBackgroundColor` under it. */
+function configured() {
+	const legacy = povesteConfig.defaultBackgroundColor;
+	return {
+		...legacy === void 0 ? {} : { backgroundColor: legacy },
+		...povesteConfig.preview
+	};
+}
 var usePreviewSettingsStore = defineStore("preview-settings", () => {
+	const book = configured();
 	const currentSettings = useStorage(PREVIEW_SETTINGS_STORAGE_KEY, {
 		responsiveWidth: 720,
 		responsiveHeight: null,
 		rotate: false,
-		backgroundColor: povesteConfig.defaultBackgroundColor ?? "transparent",
+		backgroundColor: "transparent",
 		backgroundColorPicked: false,
 		checkerboard: false,
 		textDirection: "ltr",
-		colorScheme: defaultPreviewColorScheme
+		colorScheme: defaultPreviewColorScheme,
+		...book
+	});
+	const picked = new Set(currentSettings.value.picked ?? []);
+	if (currentSettings.value.backgroundColorPicked) picked.add("backgroundColor");
+	for (const unit of UNITS) {
+		if (picked.has(unit[0])) continue;
+		for (const key of unit) if (book[key] !== void 0) Object.assign(currentSettings.value, { [key]: book[key] });
+	}
+	for (const unit of UNITS) watch(() => unit.map((key) => currentSettings.value[key]), () => {
+		currentSettings.value.picked = [.../* @__PURE__ */ new Set([...currentSettings.value.picked ?? [], unit[0]])];
 	});
-	const configBg = povesteConfig.defaultBackgroundColor;
-	if (configBg && !currentSettings.value.backgroundColorPicked) currentSettings.value.backgroundColor = configBg;
 	currentSettings.value.colorScheme ??= defaultPreviewColorScheme;
 	function setBackgroundColor(color) {
 		currentSettings.value.backgroundColor = color;

package/dist/bundled/util/color-scheme.js

@@ -23,6 +23,46 @@ function resolvePreviewDark(colorScheme, prefersDark, chromeDark) {
 	}
 }
 /**
+* The CSS `color-scheme` a preview declares, from the same inputs as the class.
+*
+* The class tells the book's CSS; this tells the browser, which paints native
+* widgets, scrollbars and the canvas itself and reads no class (#991). `auto`
+* becomes `light dark`, so the browser follows the OS preference on its own
+* rather than being told the answer `prefersDark` already computed.
+*/
+function previewColorScheme(colorScheme, chromeDark) {
+	switch (colorScheme) {
+		case "light": return "light";
+		case "dark": return "dark";
+		case "auto": return "light dark";
+		default: return chromeDark ? "dark" : "light";
+	}
+}
+/**
+* Declares `color-scheme` on `selector` beneath any rule a book writes: in the
+* first cascade layer of the document, at zero specificity. Set inline, it beat
+* a book's own `:root { color-scheme }` on every render path (#1167).
+*/
+function lowPriorityColorScheme(selector) {
+	const style = document.createElement("style");
+	document.head.prepend(style);
+	return (value) => {
+		style.textContent = `@layer poveste-color-scheme { :where(${selector}) { color-scheme: ${value}; } }`;
+	};
+}
+/**
+* Previews the app renders itself carry their scheme as a custom property, which
+* this applies to their root at the same low priority. Style isolation moves a
+* book's own `:root` rule onto that root, so it wins.
+*/
+function installRenderRootColorScheme() {
+	lowPriorityColorScheme(".__poveste-render-story")("var(--poveste-color-scheme)");
+}
+/** `previewColorScheme`, for previews rendered by the app itself. */
+function usePreviewColorScheme(settings) {
+	return computed(() => previewColorScheme(settings.colorScheme, isDark.value));
+}
+/**
 * Whether the story preview should be rendered dark, for previews rendered by
 * the app itself. The sandbox resolves the same thing from the settings it
 * receives over `PREVIEW_SETTINGS_SYNC`.
@@ -42,4 +82,4 @@ function previewDarkClasses() {
 	return [.../* @__PURE__ */ new Set([darkClass, legacy])].filter((name) => !!name);
 }
 //#endregion
-export { defaultPreviewColorScheme, previewDarkClasses, resolvePreviewDark, usePreviewDark };
+export { defaultPreviewColorScheme, installRenderRootColorScheme, lowPriorityColorScheme, previewColorScheme, previewDarkClasses, resolvePreviewDark, usePreviewColorScheme, usePreviewDark };

package/dist/bundled/util/commands.js

@@ -36,14 +36,26 @@ var builtinCommands = [{
 		window.open("https://poveste.dev/guide/getting-started", "_blank");
 	}
 }];
-function executeCommand(command, params) {
-	if (import.meta.hot) {
-		import.meta.hot.send("poveste:dev-command", {
+async function executeCommand(command, params) {
+	const hot = import.meta.hot;
+	if (!hot) return;
+	const result = await new Promise((resolve) => {
+		const listener = (data) => {
+			if (data.id !== command.id) return;
+			hot.off("poveste:dev-command-result", listener);
+			resolve(data);
+		};
+		hot.on("poveste:dev-command-result", listener);
+		hot.send("poveste:dev-command", {
 			id: command.id,
 			params
 		});
-		command.clientAction?.(params, getCommandContext());
+	});
+	if (result.error) {
+		console.error(`[poveste] ${command.label}: ${result.error}`);
+		return;
 	}
+	command.clientAction?.(params, getCommandContext());
 }
 function getCommandContext() {
 	const storyStore = useStoryStore();

package/dist/bundled/util/const.js

@@ -6,5 +6,6 @@ var PREVIEW_SETTINGS_SYNC = "__poveste:preview-settings-sync";
 var PREVIEW_SETTINGS_REQUEST = "__poveste:preview-settings-request";
 var SANDBOX_HEIGHT = "__poveste:sandbox-height";
 var SANDBOX_RETARGET = "__poveste:sandbox-retarget";
+var SANDBOX_COLOR_SCHEME = "__poveste:sandbox-color-scheme";
 //#endregion
-export { EVENT_SEND, PREVIEW_SETTINGS_REQUEST, PREVIEW_SETTINGS_SYNC, SANDBOX_HEIGHT, SANDBOX_READY, SANDBOX_RETARGET, STATE_SYNC };
+export { EVENT_SEND, PREVIEW_SETTINGS_REQUEST, PREVIEW_SETTINGS_SYNC, SANDBOX_COLOR_SCHEME, SANDBOX_HEIGHT, SANDBOX_READY, SANDBOX_RETARGET, STATE_SYNC };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@poveste/app",
   "type": "module",
-  "version": "0.18.3",
+  "version": "0.19.0",
   "description": "Pre-bundled UI for Poveste",
   "author": {
     "name": "Sorin Gitlan",
@@ -27,6 +27,8 @@
     "./*": "./*"
   },
   "files": [
+    "!src/**/*.spec.ts",
+    "!src/**/__tests__",
     "dist",
     "src"
   ],
@@ -34,9 +36,9 @@
     "node": ">=22.22.2"
   },
   "dependencies": {
-    "@poveste/controls": "^0.18.3",
-    "@poveste/shared": "^0.18.3",
-    "@poveste/vendors": "^0.18.3",
+    "@poveste/controls": "^0.19.0",
+    "@poveste/shared": "^0.19.0",
+    "@poveste/vendors": "^0.19.0",
     "fuse.js": "^7.0.0",
     "shiki": "^4.4.3"
   },