@vite-plugin-opencode-assistant/components 1.0.5

package/es/open-code-widget/src/index.vue.js

@@ -0,0 +1,464 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import "./index-sfc.css";
+import { defineComponent as _defineComponent } from "vue";
+import { useSlots, toRef, ref, watch } from "vue";
+import Frame from "./components/Frame.vue.js";
+import Header from "./components/Header.vue.js";
+import SelectHint from "./components/SelectHint.vue.js";
+import SelectedBubbles from "./components/SelectedBubbles.vue.js";
+import SelectedNodes from "./components/SelectedNodes.vue.js";
+import SessionList from "./components/SessionList.vue.js";
+import Trigger from "./components/Trigger.vue.js";
+import { useSelection } from "../composables/use-selection";
+import { useSession } from "../composables/use-session";
+import { useWidget } from "../composables/use-widget";
+import { useInspector } from "../composables/use-inspector";
+import { provideOpenCodeWidgetContext } from "./context";
+const __vue_sfc__ = /* @__PURE__ */ _defineComponent(__spreadProps(__spreadValues({}, {
+  name: "OpencodeWidget"
+}), {
+  __name: "index",
+  props: {
+    position: { type: String, required: false, default: "bottom-right" },
+    open: { type: Boolean, required: false, default: false },
+    theme: { type: String, required: false, default: "light" },
+    title: { type: String, required: false, default: "AI \u52A9\u624B" },
+    hotkeyLabel: { type: String, required: false, default: "Ctrl+K" },
+    selectShortcutLabel: { type: String, required: false, default: "\u6309 ESC \u6216 Ctrl+P \u9000\u51FA" },
+    selectMode: { type: Boolean, required: false, default: false },
+    sessionListCollapsed: { type: Boolean, required: false, default: true },
+    loading: { type: Boolean, required: false, default: false },
+    loadingSessionList: { type: Boolean, required: false },
+    showEmptyState: { type: Boolean, required: false, default: false },
+    iframeSrc: { type: String, required: false, default: "" },
+    sessions: { type: Array, required: false, default: () => [] },
+    currentSessionId: { type: [String, null], required: false, default: null },
+    selectedElements: { type: Array, required: false, default: () => [] },
+    showClearAll: { type: Boolean, required: false, default: true },
+    selectEnabled: { type: Boolean, required: false, default: true },
+    emptyStateText: { type: String, required: false, default: "\u5F53\u524D\u9879\u76EE\u6682\u65E0\u4F1A\u8BDD" },
+    emptyStateActionText: { type: String, required: false, default: "\u7ACB\u5373\u521B\u5EFA" }
+  },
+  emits: ["update:open", "update:selectMode", "update:sessionListCollapsed", "update:currentSessionId", "update:selectedElements", "toggle", "close", "toggle-session-list", "toggle-select-mode", "create-session", "select-session", "delete-session", "click-selected-node", "remove-selected-node", "clear-selected-nodes", "empty-action"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const slots = useSlots();
+    const notificationMessage = ref("");
+    const notificationVisible = ref(false);
+    let notificationTimer = null;
+    const showNotification = (message, duration = 3e3) => {
+      notificationMessage.value = message;
+      notificationVisible.value = true;
+      if (notificationTimer) clearTimeout(notificationTimer);
+      notificationTimer = setTimeout(() => {
+        notificationVisible.value = false;
+      }, duration);
+    };
+    const dialogVisible = ref(false);
+    const dialogMessage = ref("");
+    let dialogResolve = null;
+    const showConfirmDialog = (message) => {
+      dialogMessage.value = message;
+      dialogVisible.value = true;
+      return new Promise((resolve) => {
+        dialogResolve = resolve;
+      });
+    };
+    const handleDialogConfirm = () => {
+      dialogVisible.value = false;
+      if (dialogResolve) dialogResolve(true);
+    };
+    const handleDialogCancel = () => {
+      dialogVisible.value = false;
+      if (dialogResolve) dialogResolve(false);
+    };
+    __expose({
+      showNotification,
+      showConfirmDialog
+    });
+    const localSessionListCollapsed = ref(props.sessionListCollapsed);
+    watch(
+      () => props.sessionListCollapsed,
+      (val) => {
+        localSessionListCollapsed.value = val;
+      }
+    );
+    const {
+      buttonActive,
+      containerClasses,
+      iframeSource,
+      sessionListTitle,
+      handleClose,
+      handleEmptyAction,
+      handleToggle,
+      handleToggleSessionList
+    } = useWidget({
+      position: toRef(props, "position"),
+      theme: toRef(props, "theme"),
+      open: toRef(props, "open"),
+      selectMode: toRef(props, "selectMode"),
+      iframeSrc: toRef(props, "iframeSrc"),
+      sessionListCollapsed: localSessionListCollapsed,
+      onToggle: (nextOpen) => {
+        emit("update:open", nextOpen);
+        emit("toggle", nextOpen);
+      },
+      onToggleSelectMode: (mode) => {
+        emit("update:selectMode", mode);
+        emit("toggle-select-mode", mode);
+      },
+      onClose: () => {
+        emit("update:open", false);
+        emit("close");
+      },
+      onToggleSessionList: (collapsed) => {
+        localSessionListCollapsed.value = collapsed;
+        emit("update:sessionListCollapsed", collapsed);
+        emit("toggle-session-list", collapsed);
+      },
+      onEmptyAction: () => {
+        emit("empty-action");
+      }
+    });
+    const { sessionItems, handleCreateSession, handleDeleteSession, handleSelectSession } = useSession({
+      sessions: toRef(props, "sessions"),
+      currentSessionId: toRef(props, "currentSessionId"),
+      onCreateSession: () => emit("create-session"),
+      onSelectSession: (session) => {
+        emit("update:currentSessionId", session.id);
+        emit("select-session", session);
+      },
+      onDeleteSession: (session) => emit("delete-session", session),
+      showConfirmDialog
+    });
+    const {
+      bubbleVisible,
+      hasSelectedElements,
+      selectedElementItems,
+      handleClearSelectedNodes,
+      handleClickSelectedNode,
+      handleRemoveSelectedNode,
+      handleToggleSelectMode
+    } = useSelection({
+      selectMode: toRef(props, "selectMode"),
+      selectedElements: toRef(props, "selectedElements"),
+      onToggleSelectMode: (mode) => {
+        emit("update:selectMode", mode);
+        emit("toggle-select-mode", mode);
+      },
+      onRemoveSelectedNode: (payload) => {
+        emit("remove-selected-node", payload);
+        const newElements = [...props.selectedElements];
+        newElements.splice(payload.index, 1);
+        emit("update:selectedElements", newElements);
+      },
+      onClearSelectedNodes: () => {
+        emit("clear-selected-nodes");
+        emit("update:selectedElements", []);
+      },
+      showConfirmDialog
+    });
+    const { highlightVisible, highlightStyle, tooltipVisible, tooltipStyle, tooltipContent } = useInspector({
+      selectMode: toRef(props, "selectMode"),
+      onAddSelectedNode: (element) => {
+        emit("click-selected-node", element);
+      },
+      onExitSelectMode: () => {
+        emit("update:selectMode", false);
+        emit("toggle-select-mode", false);
+      }
+    });
+    provideOpenCodeWidgetContext({
+      theme: toRef(props, "theme"),
+      title: toRef(props, "title"),
+      hotkeyLabel: toRef(props, "hotkeyLabel"),
+      selectShortcutLabel: toRef(props, "selectShortcutLabel"),
+      selectMode: toRef(props, "selectMode"),
+      selectEnabled: toRef(props, "selectEnabled"),
+      sessionListCollapsed: localSessionListCollapsed,
+      loading: toRef(props, "loading"),
+      loadingSessionList: toRef(props, "loadingSessionList"),
+      showEmptyState: toRef(props, "showEmptyState"),
+      emptyStateText: toRef(props, "emptyStateText"),
+      emptyStateActionText: toRef(props, "emptyStateActionText"),
+      showClearAll: toRef(props, "showClearAll"),
+      open: toRef(props, "open"),
+      iframeSource,
+      buttonActive,
+      sessionListTitle,
+      bubbleVisible,
+      hasSelectedElements,
+      sessionItems,
+      selectedElementItems,
+      handleToggle,
+      handleClose,
+      handleToggleSessionList,
+      handleEmptyAction,
+      handleCreateSession,
+      handleSelectSession,
+      handleDeleteSession,
+      handleToggleSelectMode,
+      handleClickSelectedNode,
+      handleRemoveSelectedNode: (payload) => handleRemoveSelectedNode(payload.item, payload.index, payload.source),
+      handleClearSelectedNodes
+    });
+    const __returned__ = { props, emit, slots, notificationMessage, notificationVisible, get notificationTimer() {
+      return notificationTimer;
+    }, set notificationTimer(v) {
+      notificationTimer = v;
+    }, showNotification, dialogVisible, dialogMessage, get dialogResolve() {
+      return dialogResolve;
+    }, set dialogResolve(v) {
+      dialogResolve = v;
+    }, showConfirmDialog, handleDialogConfirm, handleDialogCancel, localSessionListCollapsed, buttonActive, containerClasses, iframeSource, sessionListTitle, handleClose, handleEmptyAction, handleToggle, handleToggleSessionList, sessionItems, handleCreateSession, handleDeleteSession, handleSelectSession, bubbleVisible, hasSelectedElements, selectedElementItems, handleClearSelectedNodes, handleClickSelectedNode, handleRemoveSelectedNode, handleToggleSelectMode, highlightVisible, highlightStyle, tooltipVisible, tooltipStyle, tooltipContent, Frame, Header, SelectHint, SelectedBubbles, SelectedNodes, SessionList, Trigger };
+    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
+    return __returned__;
+  }
+}));
+import { renderSlot as _renderSlot, withCtx as _withCtx, createSlots as _createSlots, createVNode as _createVNode, openBlock as _openBlock, createBlock as _createBlock, createCommentVNode as _createCommentVNode, toDisplayString as _toDisplayString, createElementBlock as _createElementBlock, createElementVNode as _createElementVNode, vShow as _vShow, normalizeClass as _normalizeClass, withDirectives as _withDirectives, normalizeStyle as _normalizeStyle } from "vue";
+const _hoisted_1 = {
+  key: 0,
+  class: "opencode-notification",
+  role: "alert"
+};
+const _hoisted_2 = { class: "opencode-chat-content" };
+const _hoisted_3 = { class: "opencode-tooltip-tag" };
+const _hoisted_4 = { class: "opencode-tooltip-file" };
+const _hoisted_5 = {
+  key: 1,
+  class: "opencode-dialog-overlay"
+};
+const _hoisted_6 = {
+  class: "opencode-dialog",
+  role: "alertdialog",
+  "aria-modal": "true"
+};
+const _hoisted_7 = { class: "opencode-dialog-content" };
+const _hoisted_8 = { class: "opencode-dialog-message" };
+function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
+  return _openBlock(), _createElementBlock(
+    "div",
+    {
+      class: _normalizeClass($setup.containerClasses)
+    },
+    [
+      _createVNode(
+        $setup["Trigger"],
+        null,
+        _createSlots({
+          _: 2
+          /* DYNAMIC */
+        }, [
+          $setup.slots["button-icon"] ? {
+            name: "default",
+            fn: _withCtx(() => [
+              _renderSlot(_ctx.$slots, "button-icon")
+            ]),
+            key: "0"
+          } : void 0
+        ]),
+        1024
+        /* DYNAMIC_SLOTS */
+      ),
+      $setup.bubbleVisible ? (_openBlock(), _createBlock($setup["SelectedBubbles"], { key: 0 })) : _createCommentVNode("v-if", true),
+      _withDirectives(_createElementVNode(
+        "div",
+        {
+          class: _normalizeClass(["opencode-chat", { open: $props.open }])
+        },
+        [
+          _createVNode(
+            $setup["Header"],
+            null,
+            _createSlots({
+              _: 2
+              /* DYNAMIC */
+            }, [
+              $setup.slots["session-toggle-icon"] ? {
+                name: "session-toggle-icon",
+                fn: _withCtx(() => [
+                  _renderSlot(_ctx.$slots, "session-toggle-icon")
+                ]),
+                key: "0"
+              } : void 0,
+              $setup.slots["select-icon"] ? {
+                name: "select-icon",
+                fn: _withCtx(() => [
+                  _renderSlot(_ctx.$slots, "select-icon")
+                ]),
+                key: "1"
+              } : void 0,
+              $setup.slots["close-icon"] ? {
+                name: "close-icon",
+                fn: _withCtx(() => [
+                  _renderSlot(_ctx.$slots, "close-icon")
+                ]),
+                key: "2"
+              } : void 0
+            ]),
+            1024
+            /* DYNAMIC_SLOTS */
+          ),
+          _createCommentVNode(" Notification "),
+          $setup.notificationVisible ? (_openBlock(), _createElementBlock(
+            "div",
+            _hoisted_1,
+            _toDisplayString($setup.notificationMessage),
+            1
+            /* TEXT */
+          )) : _createCommentVNode("v-if", true),
+          _createElementVNode("div", _hoisted_2, [
+            _createVNode($setup["SessionList"], null, {
+              empty: _withCtx(() => [
+                _renderSlot(_ctx.$slots, "sessions-empty", {}, () => [
+                  _cache[0] || (_cache[0] = _createElementVNode(
+                    "div",
+                    { class: "opencode-session-empty" },
+                    "\u6682\u65E0\u4F1A\u8BDD",
+                    -1
+                    /* CACHED */
+                  ))
+                ])
+              ]),
+              _: 3
+              /* FORWARDED */
+            }),
+            _createVNode(
+              $setup["Frame"],
+              null,
+              _createSlots({
+                _: 2
+                /* DYNAMIC */
+              }, [
+                $setup.slots["empty-state"] ? {
+                  name: "empty-state",
+                  fn: _withCtx(() => [
+                    _renderSlot(_ctx.$slots, "empty-state")
+                  ]),
+                  key: "0"
+                } : void 0,
+                $setup.slots.loading ? {
+                  name: "loading",
+                  fn: _withCtx(() => [
+                    _renderSlot(_ctx.$slots, "loading")
+                  ]),
+                  key: "1"
+                } : void 0,
+                $setup.slots.content ? {
+                  name: "content",
+                  fn: _withCtx(() => [
+                    _renderSlot(_ctx.$slots, "content")
+                  ]),
+                  key: "2"
+                } : void 0
+              ]),
+              1024
+              /* DYNAMIC_SLOTS */
+            ),
+            _createVNode($setup["SelectedNodes"])
+          ])
+        ],
+        2
+        /* CLASS */
+      ), [
+        [_vShow, !$props.selectMode]
+      ]),
+      _createVNode($setup["SelectHint"]),
+      _createCommentVNode(" Inspector Highlight "),
+      _withDirectives(_createElementVNode(
+        "div",
+        {
+          class: "opencode-element-highlight",
+          style: _normalizeStyle(__spreadValues({
+            display: $setup.highlightVisible ? "block" : "none"
+          }, $setup.highlightStyle))
+        },
+        null,
+        4
+        /* STYLE */
+      ), [
+        [_vShow, $setup.highlightVisible]
+      ]),
+      _createCommentVNode(" Inspector Tooltip "),
+      _withDirectives(_createElementVNode(
+        "div",
+        {
+          class: "opencode-element-tooltip",
+          style: _normalizeStyle(__spreadValues({
+            display: $setup.tooltipVisible ? "block" : "none"
+          }, $setup.tooltipStyle))
+        },
+        [
+          _createElementVNode(
+            "div",
+            _hoisted_3,
+            _toDisplayString($setup.tooltipContent.description),
+            1
+            /* TEXT */
+          ),
+          _createElementVNode(
+            "div",
+            _hoisted_4,
+            _toDisplayString($setup.tooltipContent.fileInfo),
+            1
+            /* TEXT */
+          )
+        ],
+        4
+        /* STYLE */
+      ), [
+        [_vShow, $setup.tooltipVisible]
+      ]),
+      _createCommentVNode(" Dialog "),
+      $setup.dialogVisible ? (_openBlock(), _createElementBlock("div", _hoisted_5, [
+        _createElementVNode("div", _hoisted_6, [
+          _createElementVNode("div", _hoisted_7, [
+            _createElementVNode(
+              "div",
+              _hoisted_8,
+              _toDisplayString($setup.dialogMessage),
+              1
+              /* TEXT */
+            )
+          ]),
+          _createElementVNode("div", { class: "opencode-dialog-actions" }, [
+            _createElementVNode("button", {
+              class: "opencode-dialog-btn cancel",
+              onClick: $setup.handleDialogCancel
+            }, "\u53D6\u6D88"),
+            _createElementVNode("button", {
+              class: "opencode-dialog-btn confirm",
+              onClick: $setup.handleDialogConfirm
+            }, "\u786E\u8BA4")
+          ])
+        ])
+      ])) : _createCommentVNode("v-if", true)
+    ],
+    2
+    /* CLASS */
+  );
+}
+__vue_sfc__.render = __vue_render__;
+var index_vue_default = __vue_sfc__;
+export {
+  index_vue_default as default
+};

package/es/open-code-widget/src/types.d.ts

@@ -0,0 +1,74 @@
+export type OpenCodeWidgetPosition = "bottom-right" | "bottom-left" | "top-right" | "top-left";
+export type OpenCodeWidgetTheme = "light" | "dark" | "auto";
+export interface OpenCodeWidgetSession {
+    id: string;
+    title?: string;
+    updatedAt?: string | number | Date;
+    meta?: string;
+    directory?: string;
+}
+export interface OpenCodeSelectedElement {
+    filePath: string | null;
+    line: number | null;
+    column: number | null;
+    innerText: string;
+    description: string;
+}
+export interface OpenCodeWidgetProps {
+    position?: OpenCodeWidgetPosition;
+    open?: boolean;
+    theme?: OpenCodeWidgetTheme;
+    title?: string;
+    hotkeyLabel?: string;
+    selectShortcutLabel?: string;
+    selectMode?: boolean;
+    sessionListCollapsed?: boolean;
+    loading?: boolean;
+    loadingSessionList?: boolean;
+    showEmptyState?: boolean;
+    iframeSrc?: string;
+    sessions?: OpenCodeWidgetSession[];
+    currentSessionId?: string | null;
+    selectedElements?: OpenCodeSelectedElement[];
+    showClearAll?: boolean;
+    selectEnabled?: boolean;
+    emptyStateText?: string;
+    emptyStateActionText?: string;
+}
+export type OpenCodeWidgetEmits = {
+    (e: "update:open", value: boolean): void;
+    (e: "update:selectMode", value: boolean): void;
+    (e: "update:sessionListCollapsed", value: boolean): void;
+    (e: "update:currentSessionId", value: string | null): void;
+    (e: "update:selectedElements", value: OpenCodeSelectedElement[]): void;
+    (e: "toggle", value: boolean): void;
+    (e: "close"): void;
+    (e: "toggle-session-list", value: boolean): void;
+    (e: "toggle-select-mode", value: boolean): void;
+    (e: "create-session"): void;
+    (e: "select-session", session: OpenCodeWidgetSession): void;
+    (e: "delete-session", session: OpenCodeWidgetSession): void;
+    (e: "click-selected-node", element: OpenCodeSelectedElement): void;
+    (e: "remove-selected-node", payload: OpenCodeRemoveSelectedPayload): void;
+    (e: "clear-selected-nodes"): void;
+    (e: "empty-action"): void;
+};
+export interface OpenCodeRemoveSelectedPayload {
+    element: OpenCodeSelectedElement;
+    index: number;
+    source: "panel" | "bubble";
+}
+export interface OpenCodeWidgetSessionItem {
+    key: string;
+    title: string;
+    meta: string;
+    active: boolean;
+    session: OpenCodeWidgetSession;
+}
+export interface OpenCodeSelectedElementItem {
+    key: string;
+    description: string;
+    bubbleFileText: string;
+    panelFileText: string;
+    element: OpenCodeSelectedElement;
+}