@poveste/app 0.2.0 → 0.3.0

package/dist/bundled/components/layout/LayoutPane.js

@@ -0,0 +1,5 @@
+import LayoutPane_vue_vue_type_script_setup_true_lang_default from "./LayoutPane.vue_vue_type_script_setup_true_lang.js";
+//#region src/app/components/layout/LayoutPane.vue
+var LayoutPane_default = LayoutPane_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { LayoutPane_default as default };

package/dist/bundled/components/layout/LayoutPane.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,47 @@
+import { useLayoutStore } from "../../stores/layout.js";
+import LayoutItem_default from "./LayoutItem.js";
+import LayoutItemGroup_default from "./LayoutItemGroup.js";
+import { createElementBlock, createVNode, defineComponent, openBlock, unref, withCtx } from "@poveste/vendors/vue";
+//#region src/app/components/layout/LayoutPane.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "py-2" };
+var LayoutPane_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "LayoutPane",
+	setup(__props) {
+		const settings = useLayoutStore().settings;
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", _hoisted_1, [createVNode(LayoutItemGroup_default, { title: "Visibility" }, {
+				default: withCtx(() => [createVNode(LayoutItem_default, {
+					title: "Story List",
+					icon: "carbon:open-panel-filled-left",
+					"state-icon": unref(settings).storyListVisible ? "carbon:view" : "carbon:view-off",
+					"data-test-id": "layout-toggle-story-list",
+					onClick: _cache[0] || (_cache[0] = ($event) => unref(settings).storyListVisible = !unref(settings).storyListVisible)
+				}, null, 8, ["state-icon"]), createVNode(LayoutItem_default, {
+					title: "Story Options",
+					icon: "carbon:open-panel-filled-right",
+					"state-icon": unref(settings).storyOptionsVisible ? "carbon:view" : "carbon:view-off",
+					"data-test-id": "layout-toggle-story-options",
+					onClick: _cache[1] || (_cache[1] = ($event) => unref(settings).storyOptionsVisible = !unref(settings).storyOptionsVisible)
+				}, null, 8, ["state-icon"])]),
+				_: 1
+			}), createVNode(LayoutItemGroup_default, { title: "Story Options Placement" }, {
+				default: withCtx(() => [createVNode(LayoutItem_default, {
+					title: "Right",
+					icon: "carbon:open-panel-filled-right",
+					"is-active": unref(settings).storyOptionsPlacement === "right",
+					"data-test-id": "layout-placement-right",
+					onClick: _cache[2] || (_cache[2] = ($event) => unref(settings).storyOptionsPlacement = "right")
+				}, null, 8, ["is-active"]), createVNode(LayoutItem_default, {
+					title: "Bottom",
+					icon: "carbon:open-panel-filled-bottom",
+					"is-active": unref(settings).storyOptionsPlacement === "bottom",
+					"data-test-id": "layout-placement-bottom",
+					onClick: _cache[3] || (_cache[3] = ($event) => unref(settings).storyOptionsPlacement = "bottom")
+				}, null, 8, ["is-active"])]),
+				_: 1
+			})]);
+		};
+	}
+});
+//#endregion
+export { LayoutPane_vue_vue_type_script_setup_true_lang_default as default };

package/dist/bundled/components/misc/CheckerboardPattern.js

@@ -0,0 +1,34 @@
+import _plugin_vue_export_helper_default from "../../_virtual/_plugin-vue_export-helper.js";
+import { createElementBlock, createElementVNode, openBlock } from "@poveste/vendors/vue";
+//#region src/app/components/misc/CheckerboardPattern.vue
+var _sfc_main = {};
+var _hoisted_1 = { fill: "none" };
+function _sfc_render(_ctx, _cache) {
+	return openBlock(), createElementBlock("svg", _hoisted_1, [..._cache[0] || (_cache[0] = [createElementVNode("pattern", {
+		id: "checkerboard",
+		width: "64",
+		height: "64",
+		patternUnits: "userSpaceOnUse"
+	}, [createElementVNode("rect", {
+		x: "0",
+		y: "0",
+		width: "32",
+		height: "32",
+		fill: "currentColor"
+	}), createElementVNode("rect", {
+		x: "32",
+		y: "32",
+		width: "32",
+		height: "32",
+		fill: "currentColor"
+	})], -1), createElementVNode("rect", {
+		x: "0",
+		y: "0",
+		width: "100%",
+		height: "100%",
+		fill: "url(#checkerboard)"
+	}, null, -1)])]);
+}
+var CheckerboardPattern_default = /*#__PURE__*/ _plugin_vue_export_helper_default(_sfc_main, [["render", _sfc_render]]);
+//#endregion
+export { CheckerboardPattern_default as default };

package/dist/bundled/components/misc/HatchedPattern.js

@@ -0,0 +1,12 @@
+import _plugin_vue_export_helper_default from "../../_virtual/_plugin-vue_export-helper.js";
+/* empty css                                                               */
+import { createElementBlock, openBlock } from "@poveste/vendors/vue";
+//#region src/app/components/misc/HatchedPattern.vue
+var _sfc_main = {};
+var _hoisted_1 = { class: "__poveste-hatched-pattern" };
+function _sfc_render(_ctx, _cache) {
+	return openBlock(), createElementBlock("div", _hoisted_1);
+}
+var HatchedPattern_default = /*#__PURE__*/ _plugin_vue_export_helper_default(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-c1be54fa"]]);
+//#endregion
+export { HatchedPattern_default as default };

package/dist/bundled/components/panel/ControlsComponentPropItem.js

@@ -0,0 +1,5 @@
+import ControlsComponentPropItem_vue_vue_type_script_setup_true_lang_default from "./ControlsComponentPropItem.vue_vue_type_script_setup_true_lang.js";
+//#region src/app/components/panel/ControlsComponentPropItem.vue
+var ControlsComponentPropItem_default = ControlsComponentPropItem_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { ControlsComponentPropItem_default as default };

package/dist/bundled/components/panel/ControlsComponentPropItem.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,60 @@
+import { computed, createBlock, createCommentVNode, createVNode, defineComponent, normalizeClass, openBlock, resolveDirective, resolveDynamicComponent, unref, withCtx, withDirectives, withModifiers } from "@poveste/vendors/vue";
+import { Icon } from "@poveste/vendors/iconify";
+import { HstCheckbox, HstJson, HstNumber, HstText } from "@poveste/controls";
+//#region src/app/components/panel/ControlsComponentPropItem.vue?vue&type=script&setup=true&lang.ts
+var ControlsComponentPropItem_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "ControlsComponentPropItem",
+	props: {
+		variant: {},
+		component: {},
+		definition: {}
+	},
+	setup(__props) {
+		const props = __props;
+		const comp = computed(() => {
+			switch (props.definition.types?.[0]) {
+				case "string": return HstText;
+				case "number": return HstNumber;
+				case "boolean": return HstCheckbox;
+				default: return HstJson;
+			}
+		});
+		const model = computed({
+			get: () => {
+				return props.variant.state._hPropState[props.component.index]?.[props.definition.name];
+			},
+			set: (value) => {
+				if (!props.variant.state._hPropState[props.component.index]) props.variant.state._hPropState[props.component.index] = {};
+				props.variant.state._hPropState[props.component.index][props.definition.name] = value;
+			}
+		});
+		function reset() {
+			if (props.variant.state._hPropState[props.component.index]) delete props.variant.state._hPropState[props.component.index][props.definition.name];
+		}
+		const canReset = computed(() => props.variant.state?._hPropState?.[props.component.index] && props.definition.name in props.variant.state._hPropState[props.component.index]);
+		return (_ctx, _cache) => {
+			const _directive_tooltip = resolveDirective("tooltip");
+			return comp.value ? (openBlock(), createBlock(resolveDynamicComponent(comp.value), {
+				key: 0,
+				modelValue: model.value,
+				"onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => model.value = $event),
+				placeholder: model.value === void 0 ? __props.definition?.default : null,
+				class: "poveste-controls-component-prop-item",
+				title: `${__props.definition.name}${canReset.value ? " *" : ""}`
+			}, {
+				actions: withCtx(() => [withDirectives(createVNode(unref(Icon), {
+					icon: "carbon:erase",
+					class: normalizeClass(["cursor-pointer w-4 h-4 hover:text-primary-500 dark:hover:text-primary-400 text-gray-900 dark:text-gray-100", [canReset.value ? "opacity-50 hover:opacity-100" : "opacity-25 pointer-events-none"]]),
+					onClick: _cache[0] || (_cache[0] = withModifiers(($event) => reset(), ["stop"]))
+				}, null, 8, ["class"]), [[_directive_tooltip, "Remove override"]])]),
+				_: 1
+			}, 8, [
+				"modelValue",
+				"placeholder",
+				"title"
+			])) : createCommentVNode("", true);
+		};
+	}
+});
+//#endregion
+export { ControlsComponentPropItem_vue_vue_type_script_setup_true_lang_default as default };

package/dist/bundled/components/panel/ControlsComponentProps.js

@@ -0,0 +1,5 @@
+import ControlsComponentProps_vue_vue_type_script_setup_true_lang_default from "./ControlsComponentProps.vue_vue_type_script_setup_true_lang.js";
+//#region src/app/components/panel/ControlsComponentProps.vue
+var ControlsComponentProps_default = ControlsComponentProps_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { ControlsComponentProps_default as default };

package/dist/bundled/components/panel/ControlsComponentProps.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,39 @@
+import ControlsComponentPropItem_default from "./ControlsComponentPropItem.js";
+import { Fragment, createBlock, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, openBlock, renderList, resolveDirective, toDisplayString, unref, withDirectives } from "@poveste/vendors/vue";
+import { Icon } from "@poveste/vendors/iconify";
+//#region src/app/components/panel/ControlsComponentProps.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "poveste-controls-component-props" };
+var _hoisted_2 = { class: "font-mono p-2 flex items-center gap-1" };
+var ControlsComponentProps_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "ControlsComponentProps",
+	props: {
+		variant: {},
+		definition: {}
+	},
+	setup(__props) {
+		return (_ctx, _cache) => {
+			const _directive_tooltip = resolveDirective("tooltip");
+			return openBlock(), createElementBlock("div", _hoisted_1, [createElementVNode("div", _hoisted_2, [withDirectives(createVNode(unref(Icon), {
+				icon: "carbon:flash",
+				class: "w-4 h-4 text-primary-500 flex-none"
+			}, null, 512), [[_directive_tooltip, "Auto-detected props"]]), createElementVNode("div", null, [
+				_cache[0] || (_cache[0] = createElementVNode("span", { class: "opacity-30" }, "<", -1)),
+				createTextVNode(toDisplayString(__props.definition.name), 1),
+				_cache[1] || (_cache[1] = createElementVNode("span", { class: "opacity-30" }, ">", -1))
+			])]), (openBlock(true), createElementBlock(Fragment, null, renderList(__props.definition.props, (prop) => {
+				return openBlock(), createBlock(ControlsComponentPropItem_default, {
+					key: prop.name,
+					variant: __props.variant,
+					component: __props.definition,
+					definition: prop
+				}, null, 8, [
+					"variant",
+					"component",
+					"definition"
+				]);
+			}), 128))]);
+		};
+	}
+});
+//#endregion
+export { ControlsComponentProps_vue_vue_type_script_setup_true_lang_default as default };

package/dist/bundled/components/panel/ControlsComponentState.js

@@ -0,0 +1,5 @@
+import ControlsComponentState_vue_vue_type_script_setup_true_lang_default from "./ControlsComponentState.vue_vue_type_script_setup_true_lang.js";
+//#region src/app/components/panel/ControlsComponentState.vue
+var ControlsComponentState_default = ControlsComponentState_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { ControlsComponentState_default as default };

package/dist/bundled/components/panel/ControlsComponentState.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,29 @@
+import ControlsComponentStateItem_default from "./ControlsComponentStateItem.js";
+import { Fragment, computed, createBlock, createElementBlock, createElementVNode, createVNode, defineComponent, openBlock, renderList, resolveDirective, unref, withDirectives } from "@poveste/vendors/vue";
+import { Icon } from "@poveste/vendors/iconify";
+//#region src/app/components/panel/ControlsComponentState.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "poveste-controls-component-init-state" };
+var _hoisted_2 = { class: "p-2 flex items-center gap-1" };
+var ControlsComponentState_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "ControlsComponentState",
+	props: { variant: {} },
+	setup(__props) {
+		const props = __props;
+		const stateKeys = computed(() => Object.keys(props.variant.state || {}).filter((key) => !key.startsWith("_h")));
+		return (_ctx, _cache) => {
+			const _directive_tooltip = resolveDirective("tooltip");
+			return openBlock(), createElementBlock("div", _hoisted_1, [createElementVNode("div", _hoisted_2, [withDirectives(createVNode(unref(Icon), {
+				icon: "carbon:data-vis-1",
+				class: "w-4 h-4 text-primary-500 flex-none"
+			}, null, 512), [[_directive_tooltip, "Auto-detected state"]]), _cache[0] || (_cache[0] = createElementVNode("div", null, " State ", -1))]), (openBlock(true), createElementBlock(Fragment, null, renderList(stateKeys.value, (key) => {
+				return openBlock(), createBlock(ControlsComponentStateItem_default, {
+					key,
+					item: key,
+					variant: __props.variant
+				}, null, 8, ["item", "variant"]);
+			}), 128))]);
+		};
+	}
+});
+//#endregion
+export { ControlsComponentState_vue_vue_type_script_setup_true_lang_default as default };

package/dist/bundled/components/panel/ControlsComponentStateItem.js

@@ -0,0 +1,5 @@
+import ControlsComponentStateItem_vue_vue_type_script_setup_true_lang_default from "./ControlsComponentStateItem.vue_vue_type_script_setup_true_lang.js";
+//#region src/app/components/panel/ControlsComponentStateItem.vue
+var ControlsComponentStateItem_default = ControlsComponentStateItem_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { ControlsComponentStateItem_default as default };

package/dist/bundled/components/panel/ControlsComponentStateItem.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,40 @@
+import { computed, createBlock, createCommentVNode, defineComponent, openBlock, resolveDynamicComponent } from "@poveste/vendors/vue";
+import { HstCheckbox, HstJson, HstNumber, HstText } from "@poveste/controls";
+//#region src/app/components/panel/ControlsComponentStateItem.vue?vue&type=script&setup=true&lang.ts
+var ControlsComponentStateItem_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "ControlsComponentStateItem",
+	props: {
+		variant: {},
+		item: {}
+	},
+	setup(__props) {
+		const props = __props;
+		const comp = computed(() => {
+			switch (typeof props.variant.state[props.item]) {
+				case "string": return HstText;
+				case "number": return HstNumber;
+				case "boolean": return HstCheckbox;
+				default: return HstJson;
+			}
+		});
+		const model = computed({
+			get: () => {
+				return props.variant.state[props.item];
+			},
+			set: (value) => {
+				props.variant.state[props.item] = value;
+			}
+		});
+		return (_ctx, _cache) => {
+			return comp.value ? (openBlock(), createBlock(resolveDynamicComponent(comp.value), {
+				key: 0,
+				modelValue: model.value,
+				"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => model.value = $event),
+				class: "poveste-controls-component-prop-item",
+				title: props.item
+			}, null, 8, ["modelValue", "title"])) : createCommentVNode("", true);
+		};
+	}
+});
+//#endregion
+export { ControlsComponentStateItem_vue_vue_type_script_setup_true_lang_default as default };

package/dist/bundled/components/panel/PaneTabs.js

@@ -0,0 +1,5 @@
+import PaneTabs_vue_vue_type_script_setup_true_lang_default from "./PaneTabs.vue_vue_type_script_setup_true_lang.js";
+//#region src/app/components/panel/PaneTabs.vue
+var PaneTabs_default = PaneTabs_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { PaneTabs_default as default };

package/dist/bundled/components/panel/PaneTabs.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,137 @@
+import { useStoryDoc } from "./StoryDocs.vue_vue_type_script_setup_true_lang.js";
+import "./StoryDocs.js";
+import { useEventsStore } from "../../stores/events.js";
+import BaseOverflowMenu_default from "../base/BaseOverflowMenu.js";
+import BaseOverflowTab_default from "../base/BaseOverflowTab.js";
+import BaseTab_default from "../base/BaseTab.js";
+import BaseTag_default from "../base/BaseTag.js";
+import { computed, createBlock, createCommentVNode, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, toDisplayString, toRefs, unref, withCtx } from "@poveste/vendors/vue";
+//#region src/app/components/panel/PaneTabs.vue?vue&type=script&setup=true&lang.ts
+var PaneTabs_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "PaneTabs",
+	props: {
+		story: {},
+		variant: {}
+	},
+	setup(__props) {
+		const { story } = toRefs(__props);
+		const { renderedDoc } = useStoryDoc(story);
+		const eventsStore = useEventsStore();
+		const hasEvents = computed(() => eventsStore.events.length);
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(BaseOverflowMenu_default, { class: "poveste-pane-tabs h-10 flex-none border-b border-gray-100 dark:border-gray-750" }, {
+				overflow: withCtx(() => [
+					createVNode(BaseOverflowTab_default, {
+						to: {
+							..._ctx.$route,
+							query: {
+								..._ctx.$route.query,
+								tab: ""
+							}
+						},
+						matched: !_ctx.$route.query.tab
+					}, {
+						default: withCtx(() => [..._cache[3] || (_cache[3] = [createTextVNode(" Controls ", -1)])]),
+						_: 1
+					}, 8, ["to", "matched"]),
+					createVNode(BaseOverflowTab_default, {
+						to: {
+							..._ctx.$route,
+							query: {
+								..._ctx.$route.query,
+								tab: "docs"
+							}
+						},
+						matched: _ctx.$route.query.tab === "docs",
+						class: normalizeClass({ "opacity-50": !unref(renderedDoc) })
+					}, {
+						default: withCtx(() => [..._cache[4] || (_cache[4] = [createTextVNode(" Docs ", -1)])]),
+						_: 1
+					}, 8, [
+						"to",
+						"matched",
+						"class"
+					]),
+					createVNode(BaseOverflowTab_default, {
+						to: {
+							..._ctx.$route,
+							query: {
+								..._ctx.$route.query,
+								tab: "events"
+							}
+						},
+						matched: _ctx.$route.query.tab === "events",
+						class: normalizeClass({ "opacity-50": !hasEvents.value })
+					}, {
+						default: withCtx(() => [_cache[5] || (_cache[5] = createTextVNode(" Events ", -1)), unref(eventsStore).unseen ? (openBlock(), createBlock(BaseTag_default, { key: 0 }, {
+							default: withCtx(() => [createTextVNode(toDisplayString(unref(eventsStore).unseen <= 99 ? unref(eventsStore).unseen : "99+"), 1)]),
+							_: 1
+						})) : createCommentVNode("", true)]),
+						_: 1
+					}, 8, [
+						"to",
+						"matched",
+						"class"
+					])
+				]),
+				default: withCtx(() => [
+					createVNode(BaseTab_default, {
+						to: {
+							..._ctx.$route,
+							query: {
+								..._ctx.$route.query,
+								tab: ""
+							}
+						},
+						matched: !_ctx.$route.query.tab
+					}, {
+						default: withCtx(() => [..._cache[0] || (_cache[0] = [createTextVNode(" Controls ", -1)])]),
+						_: 1
+					}, 8, ["to", "matched"]),
+					createVNode(BaseTab_default, {
+						to: {
+							..._ctx.$route,
+							query: {
+								..._ctx.$route.query,
+								tab: "docs"
+							}
+						},
+						matched: _ctx.$route.query.tab === "docs",
+						class: normalizeClass({ "opacity-50": !unref(renderedDoc) })
+					}, {
+						default: withCtx(() => [..._cache[1] || (_cache[1] = [createTextVNode(" Docs ", -1)])]),
+						_: 1
+					}, 8, [
+						"to",
+						"matched",
+						"class"
+					]),
+					createVNode(BaseTab_default, {
+						to: {
+							..._ctx.$route,
+							query: {
+								..._ctx.$route.query,
+								tab: "events"
+							}
+						},
+						matched: _ctx.$route.query.tab === "events",
+						class: normalizeClass({ "opacity-50": !hasEvents.value })
+					}, {
+						default: withCtx(() => [_cache[2] || (_cache[2] = createTextVNode(" Events ", -1)), unref(eventsStore).unseen ? (openBlock(), createBlock(BaseTag_default, { key: 0 }, {
+							default: withCtx(() => [createTextVNode(toDisplayString(unref(eventsStore).unseen <= 99 ? unref(eventsStore).unseen : "99+"), 1)]),
+							_: 1
+						})) : createCommentVNode("", true)]),
+						_: 1
+					}, 8, [
+						"to",
+						"matched",
+						"class"
+					])
+				]),
+				_: 1
+			});
+		};
+	}
+});
+//#endregion
+export { PaneTabs_vue_vue_type_script_setup_true_lang_default as default };

package/dist/bundled/components/panel/StatePresets.js

@@ -0,0 +1,5 @@
+import StatePresets_vue_vue_type_script_setup_true_lang_default from "./StatePresets.vue_vue_type_script_setup_true_lang.js";
+//#region src/app/components/panel/StatePresets.vue
+var StatePresets_default = StatePresets_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { StatePresets_default as default };

package/dist/bundled/components/panel/StatePresets.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,147 @@
+import { toRawDeep } from "../../util/state.js";
+import BaseSelect_default from "../base/BaseSelect.js";
+import { onClickOutside, useStorage, useTimeoutFn } from "@poveste/vendors/vue-use";
+import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, isRef, nextTick, normalizeClass, onMounted, openBlock, ref, resolveDirective, toDisplayString, unref, vModelText, withCtx, withDirectives, withKeys, withModifiers } from "@poveste/vendors/vue";
+import { Icon } from "@poveste/vendors/iconify";
+import { applyState, clone, omit } from "@poveste/shared";
+//#region src/app/components/panel/StatePresets.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "poveste-state-presets flex gap-2 w-full items-center" };
+var _hoisted_2 = ["onUpdate:modelValue"];
+var _hoisted_3 = {
+	key: 1,
+	class: "flex items-center gap-2"
+};
+var _hoisted_4 = { class: "flex-1 truncate" };
+var _hoisted_5 = { class: "flex gap-2 items-center" };
+var _hoisted_6 = { class: "flex-1 truncate" };
+var DEFAULT_ID = "default";
+var StatePresets_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "StatePresets",
+	props: {
+		story: {},
+		variant: {}
+	},
+	setup(__props) {
+		const props = __props;
+		const saveId = computed(() => `${props.story.id}:${props.variant.id}`);
+		const omitKeys = ["_hPropDefs"];
+		const defaultState = clone(omit(toRawDeep(props.variant.state), omitKeys));
+		const selectedOption = useStorage(`_poveste-presets/${saveId.value}/selected`, DEFAULT_ID);
+		const presetStates = useStorage(`_poveste-presets/${saveId.value}/states`, /* @__PURE__ */ new Map());
+		const presetsOptions = computed(() => {
+			const options = { [DEFAULT_ID]: "Initial state" };
+			presetStates.value.forEach((value, key) => {
+				options[key] = value.label;
+			});
+			return options;
+		});
+		function resetState() {
+			selectedOption.value = DEFAULT_ID;
+			applyState(props.variant.state, clone(defaultState));
+		}
+		function applyPreset(id) {
+			if (id === DEFAULT_ID) resetState();
+			else if (presetStates.value.has(id)) applyState(props.variant.state, clone(toRawDeep(presetStates.value.get(id).state)));
+		}
+		onMounted(() => {
+			if (selectedOption.value !== DEFAULT_ID) applyPreset(selectedOption.value);
+		});
+		const input = ref();
+		const select = ref();
+		const canEdit = computed(() => selectedOption.value !== DEFAULT_ID);
+		const isEditing = ref(false);
+		async function createPreset() {
+			const id = Date.now().toString();
+			presetStates.value.set(id, {
+				state: clone(omit(toRawDeep(props.variant.state), omitKeys)),
+				label: "New preset"
+			});
+			selectedOption.value = id;
+			isEditing.value = true;
+			await nextTick();
+			input.value.select();
+		}
+		const savedNotif = ref(false);
+		const savedTimeout = useTimeoutFn(() => {
+			savedNotif.value = false;
+		}, 1e3);
+		async function savePreset() {
+			if (!canEdit.value) return;
+			const preset = presetStates.value.get(selectedOption.value);
+			preset.state = clone(omit(toRawDeep(props.variant.state), omitKeys));
+			savedNotif.value = true;
+			savedTimeout.start();
+		}
+		function deletePreset(id) {
+			if (!confirm("Are you sure you want to delete this preset?")) return;
+			if (selectedOption.value === id) resetState();
+			presetStates.value.delete(id);
+		}
+		async function startEditing() {
+			if (!canEdit.value) return;
+			isEditing.value = true;
+			await nextTick();
+			input.value.select();
+		}
+		function stopEditing() {
+			isEditing.value = false;
+		}
+		onClickOutside(select, stopEditing);
+		return (_ctx, _cache) => {
+			const _directive_tooltip = resolveDirective("tooltip");
+			return openBlock(), createElementBlock("div", _hoisted_1, [
+				createElementVNode("div", {
+					ref_key: "select",
+					ref: select,
+					class: "flex-1 min-w-0"
+				}, [createVNode(BaseSelect_default, {
+					modelValue: unref(selectedOption),
+					"onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => isRef(selectedOption) ? selectedOption.value = $event : null),
+					options: presetsOptions.value,
+					onDblclick: _cache[3] || (_cache[3] = ($event) => startEditing()),
+					onKeydown: [_cache[4] || (_cache[4] = withKeys(($event) => stopEditing(), ["enter"])), _cache[5] || (_cache[5] = withKeys(($event) => stopEditing(), ["escape"]))],
+					onSelect: _cache[6] || (_cache[6] = (id) => applyPreset(id))
+				}, {
+					default: withCtx(({ label }) => [isEditing.value ? withDirectives((openBlock(), createElementBlock("input", {
+						key: 0,
+						ref_key: "input",
+						ref: input,
+						"onUpdate:modelValue": ($event) => unref(presetStates).get(unref(selectedOption)).label = $event,
+						type: "text",
+						class: "text-inherit bg-transparent w-full h-full outline-none",
+						onClick: _cache[0] || (_cache[0] = withModifiers(() => {}, ["stop", "prevent"]))
+					}, null, 8, _hoisted_2)), [[vModelText, unref(presetStates).get(unref(selectedOption)).label]]) : (openBlock(), createElementBlock("div", _hoisted_3, [createElementVNode("span", _hoisted_4, toDisplayString(label), 1), canEdit.value ? withDirectives((openBlock(), createBlock(unref(Icon), {
+						key: 0,
+						icon: "carbon:edit",
+						class: "flex-none cursor-pointer w-4 h-4 hover:text-primary-500 opacity-50 hover:opacity-100 dark:hover:text-primary-400 text-gray-900 dark:text-gray-100",
+						onClick: _cache[1] || (_cache[1] = withModifiers(($event) => startEditing(), ["stop"]))
+					}, null, 512)), [[_directive_tooltip, "Rename this preset"]]) : createCommentVNode("", true)]))]),
+					option: withCtx(({ label, value }) => [createElementVNode("div", _hoisted_5, [createElementVNode("span", _hoisted_6, toDisplayString(label), 1), value !== DEFAULT_ID ? withDirectives((openBlock(), createBlock(unref(Icon), {
+						key: 0,
+						icon: "carbon:trash-can",
+						class: "flex-none cursor-pointer w-4 h-4 hover:text-primary-500 opacity-50 hover:opacity-100 dark:hover:text-primary-400 text-gray-900 dark:text-gray-100",
+						onClick: withModifiers(($event) => deletePreset(value), ["stop"])
+					}, null, 8, ["onClick"])), [[_directive_tooltip, "Delete this preset"]]) : createCommentVNode("", true)])]),
+					_: 1
+				}, 8, ["modelValue", "options"])], 512),
+				withDirectives(createVNode(unref(Icon), {
+					icon: savedNotif.value ? "carbon:checkmark" : "carbon:save",
+					class: normalizeClass(["cursor-pointer w-4 h-4 hover:text-primary-500 dark:hover:text-primary-400 text-gray-900 dark:text-gray-100", [canEdit.value ? "opacity-50 hover:opacity-100" : "opacity-25 pointer-events-none"]]),
+					onClick: _cache[7] || (_cache[7] = ($event) => savePreset())
+				}, null, 8, ["icon", "class"]), [[_directive_tooltip, savedNotif.value ? "Saved!" : canEdit.value ? "Save to preset" : null]]),
+				withDirectives(createVNode(unref(Icon), {
+					icon: "carbon:add-alt",
+					class: "cursor-pointer w-4 h-4 hover:text-primary-500 opacity-50 hover:opacity-100 dark:hover:text-primary-400 text-gray-900 dark:text-gray-100",
+					onClick: _cache[8] || (_cache[8] = ($event) => createPreset())
+				}, null, 512), [[_directive_tooltip, "Create new preset"]]),
+				withDirectives(createVNode(unref(Icon), {
+					icon: "carbon:reset",
+					class: "cursor-pointer w-4 h-4 hover:text-primary-500 opacity-50 hover:opacity-100 dark:hover:text-primary-400 text-gray-900 dark:text-gray-100",
+					onClick: _cache[9] || (_cache[9] = ($event) => resetState())
+				}, null, 512), [[_directive_tooltip, "Reset to initial state"]])
+			]);
+		};
+	}
+});
+//#endregion
+export { StatePresets_vue_vue_type_script_setup_true_lang_default as default };

package/dist/bundled/components/panel/StoryControls.js

@@ -0,0 +1,5 @@
+import StoryControls_vue_vue_type_script_setup_true_lang_default from "./StoryControls.vue_vue_type_script_setup_true_lang.js";
+//#region src/app/components/panel/StoryControls.vue
+var StoryControls_default = StoryControls_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { StoryControls_default as default };