@ohos-ports/histoire-app 1.0.0-beta.0

package/dist/bundled/components/panel/StoryEvents.vue2.js

@@ -0,0 +1,53 @@
+import { defineComponent, computed, onMounted, watch, nextTick, ref, createElementBlock, openBlock, createBlock, withCtx, createVNode, createTextVNode, unref, Fragment, renderList } from "@histoire/vendors/vue";
+import { Icon } from "@histoire/vendors/iconify";
+import { useEventsStore } from "../../stores/events.js";
+import BaseEmpty from "../base/BaseEmpty.vue.js";
+import "./StoryEvent.vue.js";
+import _sfc_main$1 from "./StoryEvent.vue2.js";
+"use strict";
+const _hoisted_1 = { key: 1 };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "StoryEvents",
+  setup(__props) {
+    const eventsStore = useEventsStore();
+    const hasEvents = computed(() => eventsStore.events.length);
+    onMounted(resetUnseen);
+    watch(() => eventsStore.unseen, resetUnseen);
+    async function resetUnseen() {
+      if (eventsStore.unseen > 0) {
+        eventsStore.unseen = 0;
+      }
+      await nextTick();
+      eventsElement.value.scrollTo({ top: eventsElement.value.scrollHeight });
+    }
+    const eventsElement = ref();
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        ref_key: "eventsElement",
+        ref: eventsElement,
+        class: "histoire-story-events"
+      }, [
+        !hasEvents.value ? (openBlock(), createBlock(BaseEmpty, { key: 0 }, {
+          default: withCtx(() => [
+            createVNode(unref(Icon), {
+              icon: "carbon:event-schedule",
+              class: "htw-w-8 htw-h-8 htw-opacity-50 htw-mb-6"
+            }),
+            _cache[0] || (_cache[0] = createTextVNode(" No event fired ", -1))
+          ]),
+          _: 1
+        })) : (openBlock(), createElementBlock("div", _hoisted_1, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(eventsStore).events, (event, key) => {
+            return openBlock(), createBlock(_sfc_main$1, {
+              key,
+              event
+            }, null, 8, ["event"]);
+          }), 128))
+        ]))
+      ], 512);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/bundled/components/panel/StorySidePanel.vue.js

@@ -0,0 +1,5 @@
+import _sfc_main from "./StorySidePanel.vue2.js";
+"use strict";
+export {
+  _sfc_main as default
+};

package/dist/bundled/components/panel/StorySidePanel.vue2.js

@@ -0,0 +1,83 @@
+import { defineComponent, computed, createBlock, unref, openBlock, withCtx, createElementVNode, createVNode, resolveDynamicComponent } from "@histoire/vendors/vue";
+import { useRoute } from "@histoire/vendors/vue-router";
+import { useStoryStore } from "../../stores/story.js";
+import BaseEmpty from "../base/BaseEmpty.vue.js";
+import BaseSplitPane from "../base/BaseSplitPane.vue.js";
+import "./PaneTabs.vue.js";
+import "./StoryControls.vue.js";
+import "./StoryDocs.vue.js";
+import "./StoryEvents.vue.js";
+import StorySourceCode from "./StorySourceCode.vue.js";
+import _sfc_main$1 from "./StoryControls.vue2.js";
+import _sfc_main$2 from "./StoryEvents.vue2.js";
+import _sfc_main$3 from "./StoryDocs.vue2.js";
+import _sfc_main$4 from "./PaneTabs.vue2.js";
+"use strict";
+const _hoisted_1 = { class: "htw-flex htw-flex-col htw-h-full" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "StorySidePanel",
+  setup(__props) {
+    const storyStore = useStoryStore();
+    const route = useRoute();
+    const panelContentComponent = computed(() => {
+      switch (route.query.tab) {
+        case "docs":
+          return _sfc_main$3;
+        case "events":
+          return _sfc_main$2;
+        default:
+          return _sfc_main$1;
+      }
+    });
+    return (_ctx, _cache) => {
+      return !unref(storyStore).currentVariant ? (openBlock(), createBlock(BaseEmpty, {
+        key: 0,
+        class: "histoire-story-side-panel histoire-selection"
+      }, {
+        default: withCtx(() => [..._cache[0] || (_cache[0] = [
+          createElementVNode("span", null, "Select a variant", -1)
+        ])]),
+        _: 1
+      })) : !unref(storyStore).currentVariant.configReady || !unref(storyStore).currentVariant.previewReady ? (openBlock(), createBlock(BaseEmpty, {
+        key: 1,
+        class: "histoire-story-side-panel histoire-loading"
+      }, {
+        default: withCtx(() => [..._cache[1] || (_cache[1] = [
+          createElementVNode("span", null, "Loading...", -1)
+        ])]),
+        _: 1
+      })) : (openBlock(), createBlock(BaseSplitPane, {
+        key: 2,
+        "save-id": "story-sidepane",
+        orientation: "portrait",
+        class: "histoire-story-side-panel histoire-loaded htw-h-full",
+        "data-test-id": "story-side-panel"
+      }, {
+        first: withCtx(() => [
+          createElementVNode("div", _hoisted_1, [
+            createVNode(_sfc_main$4, {
+              story: unref(storyStore).currentStory,
+              variant: unref(storyStore).currentVariant
+            }, null, 8, ["story", "variant"]),
+            (openBlock(), createBlock(resolveDynamicComponent(panelContentComponent.value), {
+              story: unref(storyStore).currentStory,
+              variant: unref(storyStore).currentVariant,
+              class: "htw-h-full htw-overflow-auto"
+            }, null, 8, ["story", "variant"]))
+          ])
+        ]),
+        last: withCtx(() => [
+          createVNode(StorySourceCode, {
+            story: unref(storyStore).currentStory,
+            variant: unref(storyStore).currentVariant,
+            class: "htw-h-full"
+          }, null, 8, ["story", "variant"])
+        ]),
+        _: 1
+      }));
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/bundled/components/panel/StorySourceCode.vue.js

@@ -0,0 +1,8 @@
+import _sfc_main from "./StorySourceCode.vue2.js";
+/* empty css                     */
+import _export_sfc from "../../_virtual/_plugin-vue_export-helper.js";
+"use strict";
+const StorySourceCode = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-96af7f40"]]);
+export {
+  StorySourceCode as default
+};

package/dist/bundled/components/panel/StorySourceCode.vue2.js

@@ -0,0 +1,204 @@
+import { defineComponent, ref, watchEffect, markRaw, shallowRef, watch, computed, onMounted, nextTick, resolveDirective, createElementBlock, openBlock, createCommentVNode, createBlock, createElementVNode, createVNode, withDirectives, normalizeClass, unref, toDisplayString, withCtx } from "@histoire/vendors/vue";
+import { HstCopyIcon } from "@histoire/controls";
+import { unindent } from "@histoire/shared";
+import { Icon } from "@histoire/vendors/iconify";
+import { createHighlighter } from "shiki";
+import { clientSupportPlugins } from "../../_virtual/histoire-support-plugins-client.js";
+import { isDark } from "../../util/dark.js";
+import BaseEmpty from "../base/BaseEmpty.vue.js";
+"use strict";
+const _hoisted_1 = { class: "histoire-story-source-code htw-bg-gray-50 dark:htw-bg-gray-750 htw-h-full htw-overflow-hidden htw-flex htw-flex-col" };
+const _hoisted_2 = {
+  key: 0,
+  class: "htw-h-10 htw-flex-none htw-border-b htw-border-solid htw-border-gray-500/5 htw-px-4 htw-flex htw-items-center htw-gap-2"
+};
+const _hoisted_3 = { class: "htw-flex htw-flex-none htw-gap-px htw-h-full htw-py-2" };
+const _hoisted_4 = {
+  key: 1,
+  class: "htw-text-red-500 htw-h-full htw-p-2 htw-overflow-auto htw-font-mono htw-text-sm"
+};
+const _hoisted_5 = ["value"];
+const _hoisted_6 = ["innerHTML"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "StorySourceCode",
+  props: {
+    story: {},
+    variant: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const generateSourceCodeFn = ref(null);
+    watchEffect(async () => {
+      const clientPlugin = clientSupportPlugins[props.story.file?.supportPluginId];
+      if (clientPlugin) {
+        const pluginModule = await clientPlugin();
+        generateSourceCodeFn.value = markRaw(pluginModule.generateSourceCode);
+      }
+    });
+    const highlighter = shallowRef();
+    const dynamicSourceCode = ref("");
+    const error = ref(null);
+    watch(() => [props.variant, generateSourceCodeFn.value], async () => {
+      if (!generateSourceCodeFn.value) return;
+      error.value = null;
+      dynamicSourceCode.value = "";
+      try {
+        if (props.variant.source) {
+          dynamicSourceCode.value = props.variant.source;
+        } else if (props.variant.slots?.().source) {
+          const source = props.variant.slots?.().source()[0].children;
+          if (source) {
+            dynamicSourceCode.value = await unindent(source);
+          }
+        } else {
+          dynamicSourceCode.value = await generateSourceCodeFn.value(props.variant);
+        }
+      } catch (e) {
+        console.error(e);
+        error.value = e.message;
+      }
+      if (!dynamicSourceCode.value) {
+        displayedSource.value = "static";
+      }
+    }, {
+      deep: true,
+      immediate: true
+    });
+    const staticSourceCode = ref("");
+    watch(() => [props.story, props.story?.file?.source], async () => {
+      staticSourceCode.value = "";
+      const sourceLoader = props.story.file?.source;
+      if (sourceLoader) {
+        staticSourceCode.value = (await sourceLoader()).default;
+      }
+    }, {
+      immediate: true
+    });
+    const displayedSource = ref("dynamic");
+    const displayedSourceCode = computed(() => {
+      if (displayedSource.value === "dynamic") {
+        return dynamicSourceCode.value;
+      }
+      return staticSourceCode.value;
+    });
+    onMounted(async () => {
+      highlighter.value = await createHighlighter({
+        langs: [
+          "html",
+          "jsx"
+        ],
+        themes: [
+          "github-light",
+          "github-dark"
+        ]
+      });
+    });
+    const sourceHtml = computed(() => displayedSourceCode.value ? highlighter.value?.codeToHtml(displayedSourceCode.value, {
+      lang: "html",
+      theme: isDark.value ? "github-dark" : "github-light"
+    }) : "");
+    let lastScroll = 0;
+    watch(() => props.variant, () => {
+      lastScroll = 0;
+    });
+    const scroller = ref();
+    function onScroll(event) {
+      if (sourceHtml.value) {
+        lastScroll = event.target.scrollTop;
+      }
+    }
+    watch(sourceHtml, async () => {
+      await nextTick();
+      if (scroller.value) {
+        scroller.value.scrollTop = lastScroll;
+      }
+    });
+    return (_ctx, _cache) => {
+      const _directive_tooltip = resolveDirective("tooltip");
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        !error.value ? (openBlock(), createElementBlock("div", _hoisted_2, [
+          _cache[2] || (_cache[2] = createElementVNode("div", { class: "htw-text-gray-900 dark:htw-text-gray-100" }, " Source ", -1)),
+          _cache[3] || (_cache[3] = createElementVNode("div", { class: "htw-flex-1" }, null, -1)),
+          createElementVNode("div", _hoisted_3, [
+            withDirectives((openBlock(), createElementBlock("button", {
+              class: normalizeClass(["htw-flex htw-items-center htw-gap-1 htw-h-full htw-px-1 htw-bg-gray-500/10 htw-rounded-l htw-transition-all htw-ease-[cubic-bezier(0,1,.6,1)] htw-duration-300 htw-overflow-hidden", [
+                displayedSource.value !== "dynamic" ? "htw-max-w-6 htw-opacity-70" : "htw-max-w-[82px] htw-text-primary-600 dark:htw-text-primary-400",
+                dynamicSourceCode.value ? "htw-cursor-pointer hover:htw-bg-gray-500/30 active:htw-bg-gray-600/50" : "htw-opacity-50"
+              ]]),
+              onClick: _cache[0] || (_cache[0] = ($event) => dynamicSourceCode.value && (displayedSource.value = "dynamic"))
+            }, [
+              createVNode(unref(Icon), {
+                icon: "carbon:flash",
+                class: "htw-w-4 htw-h-4 htw-flex-none"
+              }),
+              createElementVNode("span", {
+                class: normalizeClass(["transition-opacity duration-300", {
+                  "opacity-0": displayedSource.value !== "dynamic"
+                }])
+              }, " Dynamic ", 2)
+            ], 2)), [
+              [_directive_tooltip, !dynamicSourceCode.value ? "Dynamic source code is not available" : displayedSource.value !== "dynamic" ? "Switch to dynamic source" : null]
+            ]),
+            withDirectives((openBlock(), createElementBlock("button", {
+              class: normalizeClass(["htw-flex htw-items-center htw-gap-1 htw-h-full htw-px-1 htw-bg-gray-500/10 htw-rounded-r htw-transition-all htw-ease-[cubic-bezier(0,1,.6,1)] htw-duration-300 htw-overflow-hidden", [
+                displayedSource.value !== "static" ? "htw-max-w-6 htw-opacity-70" : "htw-max-w-[63px] htw-text-primary-600 dark:htw-text-primary-400",
+                staticSourceCode.value ? "htw-cursor-pointer hover:htw-bg-gray-500/30 active:htw-bg-gray-600/50" : "htw-opacity-50"
+              ]]),
+              onClick: _cache[1] || (_cache[1] = ($event) => staticSourceCode.value && (displayedSource.value = "static"))
+            }, [
+              createVNode(unref(Icon), {
+                icon: "carbon:document",
+                class: "htw-w-4 htw-h-4 htw-flex-none"
+              }),
+              createElementVNode("span", {
+                class: normalizeClass(["transition-opacity duration-300", {
+                  "opacity-0": displayedSource.value !== "static"
+                }])
+              }, " Static ", 2)
+            ], 2)), [
+              [_directive_tooltip, !staticSourceCode.value ? "Static source code is not available" : displayedSource.value !== "static" ? "Switch to static source" : null]
+            ])
+          ]),
+          createVNode(unref(HstCopyIcon), {
+            content: displayedSourceCode.value,
+            class: "htw-flex-none"
+          }, null, 8, ["content"])
+        ])) : createCommentVNode("", true),
+        error.value ? (openBlock(), createElementBlock("div", _hoisted_4, " Error: " + toDisplayString(error.value), 1)) : !displayedSourceCode.value ? (openBlock(), createBlock(BaseEmpty, { key: 2 }, {
+          default: withCtx(() => [
+            createVNode(unref(Icon), {
+              icon: "carbon:code-hide",
+              class: "htw-w-8 htw-h-8 htw-opacity-50 htw-mb-6"
+            }),
+            _cache[4] || (_cache[4] = createElementVNode("span", null, "Not available", -1))
+          ]),
+          _: 1
+        })) : !sourceHtml.value ? (openBlock(), createElementBlock("textarea", {
+          key: 3,
+          ref_key: "scroller",
+          ref: scroller,
+          class: "__histoire-code-placeholder htw-w-full htw-h-full htw-p-4 htw-outline-none htw-bg-transparent htw-resize-none htw-m-0",
+          value: displayedSourceCode.value,
+          readonly: "",
+          "data-test-id": "story-source-code",
+          onScroll
+        }, null, 40, _hoisted_5)) : (openBlock(), createElementBlock("div", {
+          key: 4,
+          ref_key: "scroller",
+          ref: scroller,
+          class: "htw-w-full htw-h-full htw-overflow-auto",
+          "data-test-id": "story-source-code",
+          onScroll
+        }, [
+          createElementVNode("div", {
+            class: "__histoire-code htw-p-4 htw-w-fit",
+            innerHTML: sourceHtml.value
+          }, null, 8, _hoisted_6)
+        ], 544))
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/bundled/components/search/SearchItem.vue.js

@@ -0,0 +1,8 @@
+import _sfc_main from "./SearchItem.vue2.js";
+/* empty css                */
+import _export_sfc from "../../_virtual/_plugin-vue_export-helper.js";
+"use strict";
+const SearchItem = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-9f94ad2b"]]);
+export {
+  SearchItem as default
+};

package/dist/bundled/components/search/SearchItem.vue2.js

@@ -0,0 +1,93 @@
+import { defineComponent, useCssVars, ref, toRefs, createElementBlock, openBlock, unref, createBlock, createCommentVNode, withCtx, createVNode } from "@histoire/vendors/vue";
+import { useRouter } from "@histoire/vendors/vue-router";
+import { onKeyboardShortcut } from "../../util/keyboard.js";
+import { useScrollOnActive } from "../../util/scroll.js";
+import "../base/BaseListItem.vue.js";
+import BaseListItemLink from "../base/BaseListItemLink.vue.js";
+import "./SearchItemContent.vue.js";
+import _sfc_main$1 from "./SearchItemContent.vue2.js";
+import _sfc_main$2 from "../base/BaseListItem.vue2.js";
+"use strict";
+const _hoisted_1 = ["data-selected"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "SearchItem",
+  props: {
+    result: {
+      type: Object,
+      required: true
+    },
+    selected: {
+      type: Boolean,
+      default: false
+    }
+  },
+  emits: {
+    close: () => true
+  },
+  setup(__props, { emit: __emit }) {
+    useCssVars((_ctx) => ({
+      "v1f9aa6ca": __props.result.iconColor
+    }));
+    const props = __props;
+    const emit = __emit;
+    const el = ref();
+    const { selected } = toRefs(props);
+    useScrollOnActive(selected, el);
+    const router = useRouter();
+    onKeyboardShortcut(["enter"], () => {
+      if (!props.selected) return;
+      action();
+    });
+    function action(fromClick = false) {
+      if ("route" in props.result && !fromClick) {
+        router.push(props.result.route);
+      }
+      if ("onActivate" in props.result) {
+        props.result.onActivate();
+      }
+      emit("close");
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        ref_key: "el",
+        ref: el,
+        class: "histoire-search-item",
+        "data-test-id": "search-item",
+        "data-selected": unref(selected) ? "" : void 0
+      }, [
+        "route" in __props.result ? (openBlock(), createBlock(BaseListItemLink, {
+          key: 0,
+          to: __props.result.route,
+          "is-active": unref(selected),
+          class: "htw-px-6 htw-py-4 htw-gap-4",
+          onNavigate: _cache[0] || (_cache[0] = ($event) => action(true))
+        }, {
+          default: withCtx(() => [
+            createVNode(_sfc_main$1, {
+              result: __props.result,
+              selected: unref(selected)
+            }, null, 8, ["result", "selected"])
+          ]),
+          _: 1
+        }, 8, ["to", "is-active"])) : createCommentVNode("", true),
+        "onActivate" in __props.result ? (openBlock(), createBlock(_sfc_main$2, {
+          key: 1,
+          "is-active": unref(selected),
+          class: "htw-px-6 htw-py-4 htw-gap-4",
+          onNavigate: _cache[1] || (_cache[1] = ($event) => action(true))
+        }, {
+          default: withCtx(() => [
+            createVNode(_sfc_main$1, {
+              result: __props.result,
+              selected: unref(selected)
+            }, null, 8, ["result", "selected"])
+          ]),
+          _: 1
+        }, 8, ["is-active"])) : createCommentVNode("", true)
+      ], 8, _hoisted_1);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/bundled/components/search/SearchItemContent.vue.js

@@ -0,0 +1,5 @@
+import _sfc_main from "./SearchItemContent.vue2.js";
+"use strict";
+export {
+  _sfc_main as default
+};

package/dist/bundled/components/search/SearchItemContent.vue2.js

@@ -0,0 +1,71 @@
+import { defineComponent, createElementBlock, openBlock, Fragment, createVNode, createElementVNode, normalizeClass, createCommentVNode, createTextVNode, toDisplayString, renderList, createBlock, unref } from "@histoire/vendors/vue";
+import { Icon } from "@histoire/vendors/iconify";
+import BaseIcon from "../base/BaseIcon.vue.js";
+"use strict";
+const _hoisted_1 = { class: "htw-flex-1" };
+const _hoisted_2 = { class: "htw-flex" };
+const _hoisted_3 = { class: "htw-ml-auto htw-opacity-40" };
+const _hoisted_4 = {
+  key: 0,
+  class: "htw-flex htw-items-center htw-gap-0.5 htw-opacity-60"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "SearchItemContent",
+  props: {
+    result: {},
+    selected: { type: Boolean }
+  },
+  setup(__props) {
+    const defaultIcons = {
+      story: "carbon:cube",
+      variant: "carbon:cube"
+    };
+    const kindLabels = {
+      story: "Story",
+      variant: "Variant",
+      command: "Command"
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock(Fragment, null, [
+        createVNode(BaseIcon, {
+          icon: __props.result.icon ?? defaultIcons[__props.result.kind],
+          class: normalizeClass(["htw-w-4 htw-h-4", [
+            !__props.selected ? [
+              __props.result.iconColor ? "bind-icon-color" : {
+                "htw-text-primary-500": __props.result.kind === "story",
+                "htw-text-gray-500": __props.result.kind === "variant"
+              }
+            ] : [],
+            {
+              "colorize-black": __props.selected
+            }
+          ]])
+        }, null, 8, ["icon", "class"]),
+        createElementVNode("div", _hoisted_1, [
+          createElementVNode("div", _hoisted_2, [
+            createTextVNode(toDisplayString(__props.result.title) + " ", 1),
+            createElementVNode("span", _hoisted_3, toDisplayString(kindLabels[__props.result.kind]), 1)
+          ]),
+          __props.result.path?.length ? (openBlock(), createElementBlock("div", _hoisted_4, [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(__props.result.path, (p, index) => {
+              return openBlock(), createElementBlock("div", {
+                key: index,
+                class: "htw-flex htw-items-center htw-gap-0.5"
+              }, [
+                index > 0 ? (openBlock(), createBlock(unref(Icon), {
+                  key: 0,
+                  icon: "carbon:chevron-right",
+                  class: "htw-w-4 htw-h-4 htw-mt-0.5 htw-opacity-50"
+                })) : createCommentVNode("", true),
+                createElementVNode("span", null, toDisplayString(p), 1)
+              ]);
+            }), 128))
+          ])) : createCommentVNode("", true)
+        ])
+      ], 64);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/bundled/components/search/SearchLoading.vue.js

@@ -0,0 +1,5 @@
+import _sfc_main from "./SearchLoading.vue2.js";
+"use strict";
+export {
+  _sfc_main as default
+};

package/dist/bundled/components/search/SearchLoading.vue2.js

@@ -0,0 +1,21 @@
+import { defineComponent, createElementBlock, openBlock, createVNode, createTextVNode, unref } from "@histoire/vendors/vue";
+import { Icon } from "@histoire/vendors/iconify";
+"use strict";
+const _hoisted_1 = { class: "histoire-search-loading htw-flex htw-items-center htw-gap-4 htw-pl-6 htw-border htw-border-transparent focus-visible:htw-border-primary-500 htw-h-[51px] htw-opacity-30" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "SearchLoading",
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createVNode(unref(Icon), {
+          icon: "carbon:search",
+          class: "flex-none htw-w-4 htw-h-4"
+        }),
+        _cache[0] || (_cache[0] = createTextVNode(" Loading... ", -1))
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/bundled/components/search/SearchModal.vue.js

@@ -0,0 +1,5 @@
+import _sfc_main from "./SearchModal.vue2.js";
+"use strict";
+export {
+  _sfc_main as default
+};

package/dist/bundled/components/search/SearchModal.vue2.js

@@ -0,0 +1,51 @@
+import { defineComponent, defineAsyncComponent, withDirectives, openBlock, createElementBlock, createElementVNode, createVNode, unref, vShow } from "@histoire/vendors/vue";
+import "./SearchLoading.vue.js";
+import _sfc_main$1 from "./SearchLoading.vue2.js";
+"use strict";
+const _hoisted_1 = {
+  class: "histoire-search-modal htw-fixed htw-inset-0 htw-bg-white/80 dark:htw-bg-gray-900/80 htw-z-20",
+  "data-test-id": "search-modal"
+};
+const _hoisted_2 = { class: "htw-bg-white dark:htw-bg-gray-900 md:htw-mt-16 md:htw-mx-auto htw-w-screen htw-max-w-[512px] htw-shadow-xl htw-border htw-border-gray-200 dark:htw-border-gray-750 htw-rounded-lg htw-relative htw-divide-y htw-divide-gray-200 dark:htw-divide-gray-850" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "SearchModal",
+  props: {
+    shown: {
+      type: Boolean,
+      default: false
+    }
+  },
+  emits: {
+    close: () => true
+  },
+  setup(__props, { emit: __emit }) {
+    const SearchPane = defineAsyncComponent({
+      loader: () => import("./SearchPane.vue.js"),
+      loadingComponent: _sfc_main$1,
+      delay: 0
+    });
+    const emit = __emit;
+    function close() {
+      emit("close");
+    }
+    return (_ctx, _cache) => {
+      return withDirectives((openBlock(), createElementBlock("div", _hoisted_1, [
+        createElementVNode("div", {
+          class: "htw-absolute htw-inset-0",
+          onClick: _cache[0] || (_cache[0] = ($event) => close())
+        }),
+        createElementVNode("div", _hoisted_2, [
+          createVNode(unref(SearchPane), {
+            shown: __props.shown,
+            onClose: _cache[1] || (_cache[1] = ($event) => close())
+          }, null, 8, ["shown"])
+        ])
+      ], 512)), [
+        [vShow, __props.shown]
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/bundled/components/search/SearchPane.vue.js

@@ -0,0 +1,5 @@
+import _sfc_main from "./SearchPane.vue2.js";
+"use strict";
+export {
+  _sfc_main as default
+};