@vite-plugin-opencode-assistant/components 1.0.76 → 1.0.78
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/index.d.ts +1 -1
- package/es/index.mjs +1 -1
- package/es/open-code-widget/composables/use-inspector.mjs +76 -26
- package/es/open-code-widget/src/index-sfc.css +1 -1
- package/lib/@vite-plugin-opencode-assistant/components.cjs.js +82 -16
- package/lib/@vite-plugin-opencode-assistant/components.es.js +82 -16
- package/lib/components.css +1 -1
- package/lib/index.cjs +1 -1
- package/lib/index.d.ts +1 -1
- package/lib/open-code-widget/composables/use-inspector.cjs +75 -25
- package/lib/open-code-widget/src/index-sfc.css +1 -1
- package/lib/web-types.json +1 -1
- package/package.json +2 -2
package/es/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import OpenCodeWidget from './open-code-widget';
|
|
2
2
|
import type { App } from 'vue';
|
|
3
|
-
declare const version = "1.0.
|
|
3
|
+
declare const version = "1.0.78";
|
|
4
4
|
declare function install(app: App<any>, options?: any): void;
|
|
5
5
|
export { install, version, OpenCodeWidget };
|
|
6
6
|
export default install;
|
package/es/index.mjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ref, watch, onMounted, onUnmounted } from "vue";
|
|
1
|
+
import { ref, watch, onMounted, onUnmounted, nextTick } from "vue";
|
|
2
2
|
import { truncate } from "@vite-plugin-opencode-assistant/shared";
|
|
3
3
|
import getCssSelector from "css-selector-generator";
|
|
4
4
|
const IGNORE_SELECTORS = [
|
|
@@ -264,33 +264,83 @@ function useInspector(options) {
|
|
|
264
264
|
background: currentPrimaryBg
|
|
265
265
|
};
|
|
266
266
|
}
|
|
267
|
-
const tooltipHeight = 50;
|
|
268
|
-
const tooltipWidth = 200;
|
|
269
|
-
const margin = 10;
|
|
270
|
-
let tooltipTop = rect.top - tooltipHeight - 8;
|
|
271
|
-
let tooltipLeft = rect.left;
|
|
272
|
-
if (tooltipTop < margin) {
|
|
273
|
-
tooltipTop = rect.bottom + 8;
|
|
274
|
-
}
|
|
275
|
-
if (tooltipTop + tooltipHeight > window.innerHeight - margin) {
|
|
276
|
-
tooltipTop = Math.max(margin, rect.top - tooltipHeight - 8);
|
|
277
|
-
}
|
|
278
|
-
if (tooltipLeft < margin) {
|
|
279
|
-
tooltipLeft = margin;
|
|
280
|
-
}
|
|
281
|
-
if (tooltipLeft + tooltipWidth > window.innerWidth - margin) {
|
|
282
|
-
tooltipLeft = window.innerWidth - tooltipWidth - margin;
|
|
283
|
-
}
|
|
284
|
-
const newTooltipTop = `${tooltipTop}px`;
|
|
285
|
-
const newTooltipLeft = `${tooltipLeft}px`;
|
|
286
|
-
if (tooltipStyle.value.top !== newTooltipTop || tooltipStyle.value.left !== newTooltipLeft) {
|
|
287
|
-
tooltipStyle.value = {
|
|
288
|
-
top: newTooltipTop,
|
|
289
|
-
left: newTooltipLeft
|
|
290
|
-
};
|
|
291
|
-
}
|
|
292
267
|
highlightVisible.value = true;
|
|
293
268
|
tooltipVisible.value = true;
|
|
269
|
+
void nextTick(() => {
|
|
270
|
+
const tooltipEl = document.querySelector(".opencode-element-tooltip");
|
|
271
|
+
if (!tooltipEl) return;
|
|
272
|
+
const tooltipWidth = tooltipEl.offsetWidth;
|
|
273
|
+
const tooltipHeight = tooltipEl.offsetHeight;
|
|
274
|
+
if (tooltipWidth === 0 || tooltipHeight === 0) return;
|
|
275
|
+
const margin = 10;
|
|
276
|
+
const gap = 4;
|
|
277
|
+
const viewportWidth = window.innerWidth;
|
|
278
|
+
const viewportHeight = window.innerHeight;
|
|
279
|
+
const clampLeft = (left) => Math.max(margin, Math.min(left, viewportWidth - tooltipWidth - margin));
|
|
280
|
+
const clampTop = (top) => Math.max(margin, Math.min(top, viewportHeight - tooltipHeight - margin));
|
|
281
|
+
const candidateTop = rect.top - tooltipHeight - gap;
|
|
282
|
+
const candidateBottom = rect.bottom + gap;
|
|
283
|
+
const candidateRight = rect.right + gap;
|
|
284
|
+
const candidateLeft = rect.left - tooltipWidth - gap;
|
|
285
|
+
const verticalCenter = rect.top + (rect.height - tooltipHeight) / 2;
|
|
286
|
+
let tooltipTop = 0;
|
|
287
|
+
let tooltipLeft = 0;
|
|
288
|
+
let placed = false;
|
|
289
|
+
if (candidateTop >= margin) {
|
|
290
|
+
tooltipTop = candidateTop;
|
|
291
|
+
tooltipLeft = clampLeft(rect.left);
|
|
292
|
+
placed = true;
|
|
293
|
+
}
|
|
294
|
+
if (!placed && candidateBottom + tooltipHeight <= viewportHeight - margin) {
|
|
295
|
+
tooltipTop = candidateBottom;
|
|
296
|
+
tooltipLeft = clampLeft(rect.left);
|
|
297
|
+
placed = true;
|
|
298
|
+
}
|
|
299
|
+
if (!placed && candidateRight + tooltipWidth <= viewportWidth - margin) {
|
|
300
|
+
tooltipLeft = candidateRight;
|
|
301
|
+
tooltipTop = clampTop(verticalCenter);
|
|
302
|
+
placed = true;
|
|
303
|
+
}
|
|
304
|
+
if (!placed && candidateLeft >= margin) {
|
|
305
|
+
tooltipLeft = candidateLeft;
|
|
306
|
+
tooltipTop = clampTop(verticalCenter);
|
|
307
|
+
placed = true;
|
|
308
|
+
}
|
|
309
|
+
if (!placed) {
|
|
310
|
+
const corners = [
|
|
311
|
+
{ top: margin, left: margin },
|
|
312
|
+
{ top: margin, left: viewportWidth - tooltipWidth - margin },
|
|
313
|
+
{ top: viewportHeight - tooltipHeight - margin, left: margin },
|
|
314
|
+
{
|
|
315
|
+
top: viewportHeight - tooltipHeight - margin,
|
|
316
|
+
left: viewportWidth - tooltipWidth - margin
|
|
317
|
+
}
|
|
318
|
+
];
|
|
319
|
+
for (const corner of corners) {
|
|
320
|
+
const tooltipRight = corner.left + tooltipWidth;
|
|
321
|
+
const tooltipBottom = corner.top + tooltipHeight;
|
|
322
|
+
const overlaps = tooltipRight <= rect.left || rect.right <= corner.left || tooltipBottom <= rect.top || rect.bottom <= corner.top;
|
|
323
|
+
if (overlaps) {
|
|
324
|
+
tooltipTop = corner.top;
|
|
325
|
+
tooltipLeft = corner.left;
|
|
326
|
+
placed = true;
|
|
327
|
+
break;
|
|
328
|
+
}
|
|
329
|
+
}
|
|
330
|
+
if (!placed) {
|
|
331
|
+
tooltipTop = margin;
|
|
332
|
+
tooltipLeft = margin;
|
|
333
|
+
}
|
|
334
|
+
}
|
|
335
|
+
const newTooltipTop = `${tooltipTop}px`;
|
|
336
|
+
const newTooltipLeft = `${tooltipLeft}px`;
|
|
337
|
+
if (tooltipStyle.value.top !== newTooltipTop || tooltipStyle.value.left !== newTooltipLeft) {
|
|
338
|
+
tooltipStyle.value = {
|
|
339
|
+
top: newTooltipTop,
|
|
340
|
+
left: newTooltipLeft
|
|
341
|
+
};
|
|
342
|
+
}
|
|
343
|
+
});
|
|
294
344
|
} else {
|
|
295
345
|
highlightVisible.value = false;
|
|
296
346
|
tooltipVisible.value = false;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.opencode-widget{--oc-bg-main: #ffffff;--oc-bg-secondary: #f8f9fa;--oc-bg-tertiary: #f3f4f6;--oc-overlay-bg: rgba(255, 255, 255, .9);--oc-bg-inverse: #1e1e1e;--oc-text-primary: #282828;--oc-text-secondary: #4b5563;--oc-text-tertiary: #6b7280;--oc-text-placeholder: #9ca3af;--oc-text-inverse: #ffffff;--oc-border-primary: #e5e7eb;--oc-border-secondary: #d1d5db;--oc-primary: #3b82f6;--oc-primary-hover: #2563eb;--oc-primary-bg: rgba(59, 130, 246, .1);--oc-danger: #ef4444;--oc-danger-hover: #dc2626;--oc-danger-active: #b91c1c;--oc-success: #10b981;--oc-overlay: rgba(0, 0, 0, .5);--oc-tooltip-bg: #1e1e1e;--oc-dialog-overlay: rgba(0, 0, 0, .5);--oc-thinking-gradient-1: #10b981;--oc-thinking-gradient-2: #059669;--oc-thinking-glow: rgba(16, 185, 129, .3);--oc-thinking-glow-strong: rgba(16, 185, 129, .6);--oc-skeleton-bg: #e5e7eb;--oc-skeleton-gradient: linear-gradient(90deg, #e5e7eb 25%, #f3f4f6 50%, #e5e7eb 75%);--oc-shadow-sm: 0 2px 4px rgba(0, 0, 0, .1);--oc-shadow-md: 0 4px 12px rgba(0, 0, 0, .15);--oc-shadow-lg: 0 8px 32px rgba(0, 0, 0, .12);--oc-shadow-xl: 0 20px 60px rgba(0, 0, 0, .3);--oc-shadow-primary: 0 2px 4px rgba(59, 130, 246, .2);--oc-shadow-primary-hover: 0 4px 6px rgba(59, 130, 246, .3);--oc-shadow-danger: 0 4px 12px rgba(239, 68, 68, .3);--oc-trigger-bg: #3b82f6;--oc-trigger-bg-hover: #2563eb;--oc-trigger-bg-active: #1d4ed8;--oc-trigger-shadow: 0 2px 8px rgba(59, 130, 246, .3);--oc-trigger-shadow-hover: 0 4px 12px rgba(59, 130, 246, .4);--oc-trigger-shadow-active: 0 4px 12px rgba(59, 130, 246, .5);position:fixed;z-index:999999;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.opencode-widget.opencode-theme-dark{--oc-bg-main: #1a1a1a;--oc-bg-secondary: #1e1e1e;--oc-bg-tertiary: #282828;--oc-overlay-bg: rgba(26, 26, 26, .9);--oc-bg-inverse: #ffffff;--oc-text-primary: #f3f4f6;--oc-text-secondary: #d1d5db;--oc-text-tertiary: #9ca3af;--oc-text-placeholder: #6b7280;--oc-text-inverse: #282828;--oc-border-primary: #282828;--oc-border-secondary: #4b5563;--oc-primary: #3b82f6;--oc-primary-hover: #2563eb;--oc-primary-bg: rgba(59, 130, 246, .15);--oc-danger: #ef4444;--oc-danger-hover: #dc2626;--oc-danger-active: #b91c1c;--oc-success: #10b981;--oc-overlay: rgba(26, 26, 26, .9);--oc-tooltip-bg: #282828;--oc-dialog-overlay: rgba(0, 0, 0, .7);--oc-thinking-gradient-1: #34d399;--oc-thinking-gradient-2: #10b981;--oc-thinking-glow: rgba(52, 211, 153, .3);--oc-thinking-glow-strong: rgba(52, 211, 153, .6);--oc-skeleton-bg: #151515;--oc-skeleton-gradient: linear-gradient(90deg, #282828 25%, #4b5563 50%, #282828 75%);--oc-shadow-sm: 0 2px 4px rgba(0, 0, 0, .3);--oc-shadow-md: 0 4px 12px rgba(0, 0, 0, .4);--oc-shadow-lg: 0 8px 32px rgba(0, 0, 0, .4);--oc-shadow-xl: 0 20px 60px rgba(0, 0, 0, .6);--oc-shadow-primary: 0 2px 4px rgba(59, 130, 246, .3);--oc-shadow-primary-hover: 0 4px 6px rgba(59, 130, 246, .4);--oc-shadow-danger: 0 4px 12px rgba(239, 68, 68, .4);--oc-trigger-bg: #60a5fa;--oc-trigger-bg-hover: #3b82f6;--oc-trigger-bg-active: #2563eb;--oc-trigger-shadow: 0 2px 8px rgba(96, 165, 250, .4);--oc-trigger-shadow-hover: 0 4px 12px rgba(96, 165, 250, .5);--oc-trigger-shadow-active: 0 4px 12px rgba(96, 165, 250, .6)}.opencode-chat{position:fixed;bottom:20px;width:700px;height:86vh;max-height:calc(100vh - 40px);background:var(--oc-bg-main);border-radius:16px;box-shadow:var(--oc-shadow-lg);overflow:hidden;opacity:0;visibility:hidden;transform:translate3d(var(---chatAnimationOrigin\.x),var(---chatAnimationOrigin\.y),0) scale(.95);transition:all .3s ease;display:flex;flex-direction:column;z-index:99999}.opencode-chat.open{opacity:1;visibility:visible;transform:translateZ(0) scale(1)}.opencode-chat.no-transition,.opencode-chat.no-transition.open{transition:none!important}.opencode-chat.minimized{width:320px;height:320px}.opencode-chat.minimized .opencode-iframe-container{margin-top:-146px}.opencode-chat-content{display:flex;flex:1;overflow:hidden}.opencode-notification{position:absolute;top:20px;left:50%;transform:translate(-50%);padding:12px 24px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-radius:10px;font-size:14px;font-weight:500;box-shadow:0 4px 16px #3b82f666,0 0 0 2px #3b82f633;animation:slideDown .3s ease;z-index:10000000;display:flex;align-items:center;gap:10px}.opencode-notification:before{content:"\1f4a1";font-size:16px}.opencode-dialog-overlay{position:fixed;inset:0;background:var(--oc-dialog-overlay);display:flex;align-items:center;justify-content:center;z-index:9999999;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.opencode-dialog{background:var(--oc-bg-main);border-radius:12px;padding:24px;min-width:320px;max-width:400px;box-shadow:var(--oc-shadow-xl);animation:scaleIn .2s ease}@keyframes scaleIn{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.opencode-dialog-content{margin-bottom:20px}.opencode-dialog-message{font-size:15px;color:var(--oc-text-primary);line-height:1.5}.opencode-dialog-actions{display:flex;gap:12px;justify-content:flex-end}.opencode-dialog-btn{padding:10px 20px;border-radius:8px;border:none;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.opencode-dialog-btn.cancel{background:var(--oc-bg-tertiary);color:var(--oc-text-primary)}.opencode-dialog-btn.cancel:hover{background:var(--oc-text-primary);color:var(--oc-bg-main)}.opencode-dialog-btn.confirm{background:var(--oc-danger);color:#fff}.opencode-dialog-btn.confirm:hover{background:var(--oc-danger-hover)}@keyframes slideDown{0%{transform:translate(-50%) translateY(-100%);opacity:0}to{transform:translate(-50%) translateY(0);opacity:1}}.opencode-page-notification{position:fixed;top:20px;left:50%;transform:translate(-50%);padding:12px 24px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-radius:10px;font-size:14px;font-weight:500;box-shadow:0 4px 16px #3b82f666,0 0 0 2px #3b82f633;animation:slideDown .3s ease;z-index:2147483647;display:flex;align-items:center;gap:10px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.opencode-page-notification:before{content:"\1f4a1";font-size:16px}.opencode-element-highlight{position:fixed;pointer-events:none;z-index:999998;border-radius:4px}#vue-inspector-container{display:none!important}.opencode-element-tooltip{position:fixed;background:var(--oc-tooltip-bg);color:#fff;padding:8px 12px;border-radius:6px;font-size:12px;z-index:9999998;box-shadow:var(--oc-shadow-md);max-width:300px;pointer-events:none}.opencode-tooltip-tag{font-weight:500;margin-bottom:4px;word-break:break-all}.opencode-tooltip-file{font-size:11px;color:var(--oc-text-placeholder);word-break:break-all}.opencode-element-highlight-temp{position:absolute;pointer-events:none;z-index:999998;border-radius:4px;animation:highlight-pulse 2s ease-out forwards}@keyframes highlight-pulse{0%{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.02)}to{opacity:0;transform:scale(1)}}@media(max-width:768px){.opencode-chat{width:calc(100vw - 40px);height:calc(100vh - 100px)}}body.has-opencode-split{transition:padding .3s ease;min-width:auto}body.has-opencode-split-right{padding-right:var(--opencode-split-width, 500px)}body.has-opencode-split-left{padding-left:var(--opencode-split-width, 500px)}.opencode-widget.extension-mode{position:static;width:100%;height:100%;display:flex}
|
|
1
|
+
.opencode-widget{--oc-bg-main: #ffffff;--oc-bg-secondary: #f8f9fa;--oc-bg-tertiary: #f3f4f6;--oc-overlay-bg: rgba(255, 255, 255, .9);--oc-bg-inverse: #1e1e1e;--oc-text-primary: #282828;--oc-text-secondary: #4b5563;--oc-text-tertiary: #6b7280;--oc-text-placeholder: #9ca3af;--oc-text-inverse: #ffffff;--oc-border-primary: #e5e7eb;--oc-border-secondary: #d1d5db;--oc-primary: #3b82f6;--oc-primary-hover: #2563eb;--oc-primary-bg: rgba(59, 130, 246, .1);--oc-danger: #ef4444;--oc-danger-hover: #dc2626;--oc-danger-active: #b91c1c;--oc-success: #10b981;--oc-overlay: rgba(0, 0, 0, .5);--oc-tooltip-bg: #1e1e1e;--oc-dialog-overlay: rgba(0, 0, 0, .5);--oc-thinking-gradient-1: #10b981;--oc-thinking-gradient-2: #059669;--oc-thinking-glow: rgba(16, 185, 129, .3);--oc-thinking-glow-strong: rgba(16, 185, 129, .6);--oc-skeleton-bg: #e5e7eb;--oc-skeleton-gradient: linear-gradient(90deg, #e5e7eb 25%, #f3f4f6 50%, #e5e7eb 75%);--oc-shadow-sm: 0 2px 4px rgba(0, 0, 0, .1);--oc-shadow-md: 0 4px 12px rgba(0, 0, 0, .15);--oc-shadow-lg: 0 8px 32px rgba(0, 0, 0, .12);--oc-shadow-xl: 0 20px 60px rgba(0, 0, 0, .3);--oc-shadow-primary: 0 2px 4px rgba(59, 130, 246, .2);--oc-shadow-primary-hover: 0 4px 6px rgba(59, 130, 246, .3);--oc-shadow-danger: 0 4px 12px rgba(239, 68, 68, .3);--oc-trigger-bg: #3b82f6;--oc-trigger-bg-hover: #2563eb;--oc-trigger-bg-active: #1d4ed8;--oc-trigger-shadow: 0 2px 8px rgba(59, 130, 246, .3);--oc-trigger-shadow-hover: 0 4px 12px rgba(59, 130, 246, .4);--oc-trigger-shadow-active: 0 4px 12px rgba(59, 130, 246, .5);position:fixed;z-index:999999;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.opencode-widget.opencode-theme-dark{--oc-bg-main: #1a1a1a;--oc-bg-secondary: #1e1e1e;--oc-bg-tertiary: #282828;--oc-overlay-bg: rgba(26, 26, 26, .9);--oc-bg-inverse: #ffffff;--oc-text-primary: #f3f4f6;--oc-text-secondary: #d1d5db;--oc-text-tertiary: #9ca3af;--oc-text-placeholder: #6b7280;--oc-text-inverse: #282828;--oc-border-primary: #282828;--oc-border-secondary: #4b5563;--oc-primary: #3b82f6;--oc-primary-hover: #2563eb;--oc-primary-bg: rgba(59, 130, 246, .15);--oc-danger: #ef4444;--oc-danger-hover: #dc2626;--oc-danger-active: #b91c1c;--oc-success: #10b981;--oc-overlay: rgba(26, 26, 26, .9);--oc-tooltip-bg: #282828;--oc-dialog-overlay: rgba(0, 0, 0, .7);--oc-thinking-gradient-1: #34d399;--oc-thinking-gradient-2: #10b981;--oc-thinking-glow: rgba(52, 211, 153, .3);--oc-thinking-glow-strong: rgba(52, 211, 153, .6);--oc-skeleton-bg: #151515;--oc-skeleton-gradient: linear-gradient(90deg, #282828 25%, #4b5563 50%, #282828 75%);--oc-shadow-sm: 0 2px 4px rgba(0, 0, 0, .3);--oc-shadow-md: 0 4px 12px rgba(0, 0, 0, .4);--oc-shadow-lg: 0 8px 32px rgba(0, 0, 0, .4);--oc-shadow-xl: 0 20px 60px rgba(0, 0, 0, .6);--oc-shadow-primary: 0 2px 4px rgba(59, 130, 246, .3);--oc-shadow-primary-hover: 0 4px 6px rgba(59, 130, 246, .4);--oc-shadow-danger: 0 4px 12px rgba(239, 68, 68, .4);--oc-trigger-bg: #60a5fa;--oc-trigger-bg-hover: #3b82f6;--oc-trigger-bg-active: #2563eb;--oc-trigger-shadow: 0 2px 8px rgba(96, 165, 250, .4);--oc-trigger-shadow-hover: 0 4px 12px rgba(96, 165, 250, .5);--oc-trigger-shadow-active: 0 4px 12px rgba(96, 165, 250, .6)}.opencode-chat{position:fixed;bottom:20px;width:700px;height:86vh;max-height:calc(100vh - 40px);background:var(--oc-bg-main);border-radius:16px;box-shadow:var(--oc-shadow-lg);overflow:hidden;opacity:0;visibility:hidden;transform:translate3d(var(---chatAnimationOrigin\.x),var(---chatAnimationOrigin\.y),0) scale(.95);transition:all .3s ease;display:flex;flex-direction:column;z-index:99999}.opencode-chat.open{opacity:1;visibility:visible;transform:translateZ(0) scale(1)}.opencode-chat.no-transition,.opencode-chat.no-transition.open{transition:none!important}.opencode-chat.minimized{width:320px;height:320px}.opencode-chat.minimized .opencode-iframe-container{margin-top:-146px}.opencode-chat-content{display:flex;flex:1;overflow:hidden}.opencode-notification{position:absolute;top:20px;left:50%;transform:translate(-50%);padding:12px 24px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-radius:10px;font-size:14px;font-weight:500;box-shadow:0 4px 16px #3b82f666,0 0 0 2px #3b82f633;animation:slideDown .3s ease;z-index:10000000;display:flex;align-items:center;gap:10px}.opencode-notification:before{content:"\1f4a1";font-size:16px}.opencode-dialog-overlay{position:fixed;inset:0;background:var(--oc-dialog-overlay);display:flex;align-items:center;justify-content:center;z-index:9999999;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.opencode-dialog{background:var(--oc-bg-main);border-radius:12px;padding:24px;min-width:320px;max-width:400px;box-shadow:var(--oc-shadow-xl);animation:scaleIn .2s ease}@keyframes scaleIn{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.opencode-dialog-content{margin-bottom:20px}.opencode-dialog-message{font-size:15px;color:var(--oc-text-primary);line-height:1.5}.opencode-dialog-actions{display:flex;gap:12px;justify-content:flex-end}.opencode-dialog-btn{padding:10px 20px;border-radius:8px;border:none;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.opencode-dialog-btn.cancel{background:var(--oc-bg-tertiary);color:var(--oc-text-primary)}.opencode-dialog-btn.cancel:hover{background:var(--oc-text-primary);color:var(--oc-bg-main)}.opencode-dialog-btn.confirm{background:var(--oc-danger);color:#fff}.opencode-dialog-btn.confirm:hover{background:var(--oc-danger-hover)}@keyframes slideDown{0%{transform:translate(-50%) translateY(-100%);opacity:0}to{transform:translate(-50%) translateY(0);opacity:1}}.opencode-page-notification{position:fixed;top:20px;left:50%;transform:translate(-50%);padding:12px 24px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-radius:10px;font-size:14px;font-weight:500;box-shadow:0 4px 16px #3b82f666,0 0 0 2px #3b82f633;animation:slideDown .3s ease;z-index:2147483647;display:flex;align-items:center;gap:10px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.opencode-page-notification:before{content:"\1f4a1";font-size:16px}.opencode-element-highlight{position:fixed;pointer-events:none;z-index:999998;border-radius:4px}#vue-inspector-container{display:none!important}.opencode-element-tooltip{position:fixed;background:var(--oc-tooltip-bg);color:#fff;padding:8px 12px;border-radius:6px;font-size:12px;z-index:9999998;box-shadow:var(--oc-shadow-md);max-width:300px;pointer-events:none;line-height:1}.opencode-tooltip-tag{font-weight:500;margin-bottom:4px;word-break:break-all}.opencode-tooltip-file{font-size:11px;color:var(--oc-text-placeholder);word-break:break-all}.opencode-element-highlight-temp{position:absolute;pointer-events:none;z-index:999998;border-radius:4px;animation:highlight-pulse 2s ease-out forwards}@keyframes highlight-pulse{0%{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.02)}to{opacity:0;transform:scale(1)}}@media(max-width:768px){.opencode-chat{width:calc(100vw - 40px);height:calc(100vh - 100px)}}body.has-opencode-split{transition:padding .3s ease;min-width:auto}body.has-opencode-split-right{padding-right:var(--opencode-split-width, 500px)}body.has-opencode-split-left{padding-left:var(--opencode-split-width, 500px)}.opencode-widget.extension-mode{position:static;width:100%;height:100%;display:flex}
|
|
@@ -2135,23 +2135,89 @@ function useInspector(options) {
|
|
|
2135
2135
|
border: `2px solid ${currentPrimary}`,
|
|
2136
2136
|
background: currentPrimaryBg
|
|
2137
2137
|
};
|
|
2138
|
-
const tooltipHeight = 50;
|
|
2139
|
-
const tooltipWidth = 200;
|
|
2140
|
-
const margin = 10;
|
|
2141
|
-
let tooltipTop = rect.top - tooltipHeight - 8;
|
|
2142
|
-
let tooltipLeft = rect.left;
|
|
2143
|
-
if (tooltipTop < margin) tooltipTop = rect.bottom + 8;
|
|
2144
|
-
if (tooltipTop + tooltipHeight > window.innerHeight - margin) tooltipTop = Math.max(margin, rect.top - tooltipHeight - 8);
|
|
2145
|
-
if (tooltipLeft < margin) tooltipLeft = margin;
|
|
2146
|
-
if (tooltipLeft + tooltipWidth > window.innerWidth - margin) tooltipLeft = window.innerWidth - tooltipWidth - margin;
|
|
2147
|
-
const newTooltipTop = `${tooltipTop}px`;
|
|
2148
|
-
const newTooltipLeft = `${tooltipLeft}px`;
|
|
2149
|
-
if (tooltipStyle.value.top !== newTooltipTop || tooltipStyle.value.left !== newTooltipLeft) tooltipStyle.value = {
|
|
2150
|
-
top: newTooltipTop,
|
|
2151
|
-
left: newTooltipLeft
|
|
2152
|
-
};
|
|
2153
2138
|
highlightVisible.value = true;
|
|
2154
2139
|
tooltipVisible.value = true;
|
|
2140
|
+
(0, vue.nextTick)(() => {
|
|
2141
|
+
const tooltipEl = document.querySelector(".opencode-element-tooltip");
|
|
2142
|
+
if (!tooltipEl) return;
|
|
2143
|
+
const tooltipWidth = tooltipEl.offsetWidth;
|
|
2144
|
+
const tooltipHeight = tooltipEl.offsetHeight;
|
|
2145
|
+
if (tooltipWidth === 0 || tooltipHeight === 0) return;
|
|
2146
|
+
const margin = 10;
|
|
2147
|
+
const gap = 4;
|
|
2148
|
+
const viewportWidth = window.innerWidth;
|
|
2149
|
+
const viewportHeight = window.innerHeight;
|
|
2150
|
+
const clampLeft = (left) => Math.max(margin, Math.min(left, viewportWidth - tooltipWidth - margin));
|
|
2151
|
+
const clampTop = (top) => Math.max(margin, Math.min(top, viewportHeight - tooltipHeight - margin));
|
|
2152
|
+
const candidateTop = rect.top - tooltipHeight - gap;
|
|
2153
|
+
const candidateBottom = rect.bottom + gap;
|
|
2154
|
+
const candidateRight = rect.right + gap;
|
|
2155
|
+
const candidateLeft = rect.left - tooltipWidth - gap;
|
|
2156
|
+
const verticalCenter = rect.top + (rect.height - tooltipHeight) / 2;
|
|
2157
|
+
let tooltipTop = 0;
|
|
2158
|
+
let tooltipLeft = 0;
|
|
2159
|
+
let placed = false;
|
|
2160
|
+
if (candidateTop >= margin) {
|
|
2161
|
+
tooltipTop = candidateTop;
|
|
2162
|
+
tooltipLeft = clampLeft(rect.left);
|
|
2163
|
+
placed = true;
|
|
2164
|
+
}
|
|
2165
|
+
if (!placed && candidateBottom + tooltipHeight <= viewportHeight - margin) {
|
|
2166
|
+
tooltipTop = candidateBottom;
|
|
2167
|
+
tooltipLeft = clampLeft(rect.left);
|
|
2168
|
+
placed = true;
|
|
2169
|
+
}
|
|
2170
|
+
if (!placed && candidateRight + tooltipWidth <= viewportWidth - margin) {
|
|
2171
|
+
tooltipLeft = candidateRight;
|
|
2172
|
+
tooltipTop = clampTop(verticalCenter);
|
|
2173
|
+
placed = true;
|
|
2174
|
+
}
|
|
2175
|
+
if (!placed && candidateLeft >= margin) {
|
|
2176
|
+
tooltipLeft = candidateLeft;
|
|
2177
|
+
tooltipTop = clampTop(verticalCenter);
|
|
2178
|
+
placed = true;
|
|
2179
|
+
}
|
|
2180
|
+
if (!placed) {
|
|
2181
|
+
const corners = [
|
|
2182
|
+
{
|
|
2183
|
+
top: margin,
|
|
2184
|
+
left: margin
|
|
2185
|
+
},
|
|
2186
|
+
{
|
|
2187
|
+
top: margin,
|
|
2188
|
+
left: viewportWidth - tooltipWidth - margin
|
|
2189
|
+
},
|
|
2190
|
+
{
|
|
2191
|
+
top: viewportHeight - tooltipHeight - margin,
|
|
2192
|
+
left: margin
|
|
2193
|
+
},
|
|
2194
|
+
{
|
|
2195
|
+
top: viewportHeight - tooltipHeight - margin,
|
|
2196
|
+
left: viewportWidth - tooltipWidth - margin
|
|
2197
|
+
}
|
|
2198
|
+
];
|
|
2199
|
+
for (const corner of corners) {
|
|
2200
|
+
const tooltipRight = corner.left + tooltipWidth;
|
|
2201
|
+
const tooltipBottom = corner.top + tooltipHeight;
|
|
2202
|
+
if (tooltipRight <= rect.left || rect.right <= corner.left || tooltipBottom <= rect.top || rect.bottom <= corner.top) {
|
|
2203
|
+
tooltipTop = corner.top;
|
|
2204
|
+
tooltipLeft = corner.left;
|
|
2205
|
+
placed = true;
|
|
2206
|
+
break;
|
|
2207
|
+
}
|
|
2208
|
+
}
|
|
2209
|
+
if (!placed) {
|
|
2210
|
+
tooltipTop = margin;
|
|
2211
|
+
tooltipLeft = margin;
|
|
2212
|
+
}
|
|
2213
|
+
}
|
|
2214
|
+
const newTooltipTop = `${tooltipTop}px`;
|
|
2215
|
+
const newTooltipLeft = `${tooltipLeft}px`;
|
|
2216
|
+
if (tooltipStyle.value.top !== newTooltipTop || tooltipStyle.value.left !== newTooltipLeft) tooltipStyle.value = {
|
|
2217
|
+
top: newTooltipTop,
|
|
2218
|
+
left: newTooltipLeft
|
|
2219
|
+
};
|
|
2220
|
+
});
|
|
2155
2221
|
} else {
|
|
2156
2222
|
highlightVisible.value = false;
|
|
2157
2223
|
tooltipVisible.value = false;
|
|
@@ -3255,7 +3321,7 @@ __vue_sfc__.render = __vue_render__;
|
|
|
3255
3321
|
var open_code_widget_default = __vue_sfc__;
|
|
3256
3322
|
//#endregion
|
|
3257
3323
|
//#region es/index.mjs
|
|
3258
|
-
var version = "1.0.
|
|
3324
|
+
var version = "1.0.78";
|
|
3259
3325
|
function install(app, options) {
|
|
3260
3326
|
[open_code_widget_default].forEach((item) => {
|
|
3261
3327
|
if (item.install) app.use(item, options);
|
|
@@ -2108,23 +2108,89 @@ function useInspector(options) {
|
|
|
2108
2108
|
border: `2px solid ${currentPrimary}`,
|
|
2109
2109
|
background: currentPrimaryBg
|
|
2110
2110
|
};
|
|
2111
|
-
const tooltipHeight = 50;
|
|
2112
|
-
const tooltipWidth = 200;
|
|
2113
|
-
const margin = 10;
|
|
2114
|
-
let tooltipTop = rect.top - tooltipHeight - 8;
|
|
2115
|
-
let tooltipLeft = rect.left;
|
|
2116
|
-
if (tooltipTop < margin) tooltipTop = rect.bottom + 8;
|
|
2117
|
-
if (tooltipTop + tooltipHeight > window.innerHeight - margin) tooltipTop = Math.max(margin, rect.top - tooltipHeight - 8);
|
|
2118
|
-
if (tooltipLeft < margin) tooltipLeft = margin;
|
|
2119
|
-
if (tooltipLeft + tooltipWidth > window.innerWidth - margin) tooltipLeft = window.innerWidth - tooltipWidth - margin;
|
|
2120
|
-
const newTooltipTop = `${tooltipTop}px`;
|
|
2121
|
-
const newTooltipLeft = `${tooltipLeft}px`;
|
|
2122
|
-
if (tooltipStyle.value.top !== newTooltipTop || tooltipStyle.value.left !== newTooltipLeft) tooltipStyle.value = {
|
|
2123
|
-
top: newTooltipTop,
|
|
2124
|
-
left: newTooltipLeft
|
|
2125
|
-
};
|
|
2126
2111
|
highlightVisible.value = true;
|
|
2127
2112
|
tooltipVisible.value = true;
|
|
2113
|
+
nextTick(() => {
|
|
2114
|
+
const tooltipEl = document.querySelector(".opencode-element-tooltip");
|
|
2115
|
+
if (!tooltipEl) return;
|
|
2116
|
+
const tooltipWidth = tooltipEl.offsetWidth;
|
|
2117
|
+
const tooltipHeight = tooltipEl.offsetHeight;
|
|
2118
|
+
if (tooltipWidth === 0 || tooltipHeight === 0) return;
|
|
2119
|
+
const margin = 10;
|
|
2120
|
+
const gap = 4;
|
|
2121
|
+
const viewportWidth = window.innerWidth;
|
|
2122
|
+
const viewportHeight = window.innerHeight;
|
|
2123
|
+
const clampLeft = (left) => Math.max(margin, Math.min(left, viewportWidth - tooltipWidth - margin));
|
|
2124
|
+
const clampTop = (top) => Math.max(margin, Math.min(top, viewportHeight - tooltipHeight - margin));
|
|
2125
|
+
const candidateTop = rect.top - tooltipHeight - gap;
|
|
2126
|
+
const candidateBottom = rect.bottom + gap;
|
|
2127
|
+
const candidateRight = rect.right + gap;
|
|
2128
|
+
const candidateLeft = rect.left - tooltipWidth - gap;
|
|
2129
|
+
const verticalCenter = rect.top + (rect.height - tooltipHeight) / 2;
|
|
2130
|
+
let tooltipTop = 0;
|
|
2131
|
+
let tooltipLeft = 0;
|
|
2132
|
+
let placed = false;
|
|
2133
|
+
if (candidateTop >= margin) {
|
|
2134
|
+
tooltipTop = candidateTop;
|
|
2135
|
+
tooltipLeft = clampLeft(rect.left);
|
|
2136
|
+
placed = true;
|
|
2137
|
+
}
|
|
2138
|
+
if (!placed && candidateBottom + tooltipHeight <= viewportHeight - margin) {
|
|
2139
|
+
tooltipTop = candidateBottom;
|
|
2140
|
+
tooltipLeft = clampLeft(rect.left);
|
|
2141
|
+
placed = true;
|
|
2142
|
+
}
|
|
2143
|
+
if (!placed && candidateRight + tooltipWidth <= viewportWidth - margin) {
|
|
2144
|
+
tooltipLeft = candidateRight;
|
|
2145
|
+
tooltipTop = clampTop(verticalCenter);
|
|
2146
|
+
placed = true;
|
|
2147
|
+
}
|
|
2148
|
+
if (!placed && candidateLeft >= margin) {
|
|
2149
|
+
tooltipLeft = candidateLeft;
|
|
2150
|
+
tooltipTop = clampTop(verticalCenter);
|
|
2151
|
+
placed = true;
|
|
2152
|
+
}
|
|
2153
|
+
if (!placed) {
|
|
2154
|
+
const corners = [
|
|
2155
|
+
{
|
|
2156
|
+
top: margin,
|
|
2157
|
+
left: margin
|
|
2158
|
+
},
|
|
2159
|
+
{
|
|
2160
|
+
top: margin,
|
|
2161
|
+
left: viewportWidth - tooltipWidth - margin
|
|
2162
|
+
},
|
|
2163
|
+
{
|
|
2164
|
+
top: viewportHeight - tooltipHeight - margin,
|
|
2165
|
+
left: margin
|
|
2166
|
+
},
|
|
2167
|
+
{
|
|
2168
|
+
top: viewportHeight - tooltipHeight - margin,
|
|
2169
|
+
left: viewportWidth - tooltipWidth - margin
|
|
2170
|
+
}
|
|
2171
|
+
];
|
|
2172
|
+
for (const corner of corners) {
|
|
2173
|
+
const tooltipRight = corner.left + tooltipWidth;
|
|
2174
|
+
const tooltipBottom = corner.top + tooltipHeight;
|
|
2175
|
+
if (tooltipRight <= rect.left || rect.right <= corner.left || tooltipBottom <= rect.top || rect.bottom <= corner.top) {
|
|
2176
|
+
tooltipTop = corner.top;
|
|
2177
|
+
tooltipLeft = corner.left;
|
|
2178
|
+
placed = true;
|
|
2179
|
+
break;
|
|
2180
|
+
}
|
|
2181
|
+
}
|
|
2182
|
+
if (!placed) {
|
|
2183
|
+
tooltipTop = margin;
|
|
2184
|
+
tooltipLeft = margin;
|
|
2185
|
+
}
|
|
2186
|
+
}
|
|
2187
|
+
const newTooltipTop = `${tooltipTop}px`;
|
|
2188
|
+
const newTooltipLeft = `${tooltipLeft}px`;
|
|
2189
|
+
if (tooltipStyle.value.top !== newTooltipTop || tooltipStyle.value.left !== newTooltipLeft) tooltipStyle.value = {
|
|
2190
|
+
top: newTooltipTop,
|
|
2191
|
+
left: newTooltipLeft
|
|
2192
|
+
};
|
|
2193
|
+
});
|
|
2128
2194
|
} else {
|
|
2129
2195
|
highlightVisible.value = false;
|
|
2130
2196
|
tooltipVisible.value = false;
|
|
@@ -3228,7 +3294,7 @@ __vue_sfc__.render = __vue_render__;
|
|
|
3228
3294
|
var open_code_widget_default = __vue_sfc__;
|
|
3229
3295
|
//#endregion
|
|
3230
3296
|
//#region es/index.mjs
|
|
3231
|
-
var version = "1.0.
|
|
3297
|
+
var version = "1.0.78";
|
|
3232
3298
|
function install(app, options) {
|
|
3233
3299
|
[open_code_widget_default].forEach((item) => {
|
|
3234
3300
|
if (item.install) app.use(item, options);
|
package/lib/components.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
.opencode-widget{--oc-bg-main: #ffffff;--oc-bg-secondary: #f8f9fa;--oc-bg-tertiary: #f3f4f6;--oc-overlay-bg: rgba(255, 255, 255, .9);--oc-bg-inverse: #1e1e1e;--oc-text-primary: #282828;--oc-text-secondary: #4b5563;--oc-text-tertiary: #6b7280;--oc-text-placeholder: #9ca3af;--oc-text-inverse: #ffffff;--oc-border-primary: #e5e7eb;--oc-border-secondary: #d1d5db;--oc-primary: #3b82f6;--oc-primary-hover: #2563eb;--oc-primary-bg: rgba(59, 130, 246, .1);--oc-danger: #ef4444;--oc-danger-hover: #dc2626;--oc-danger-active: #b91c1c;--oc-success: #10b981;--oc-overlay: rgba(0, 0, 0, .5);--oc-tooltip-bg: #1e1e1e;--oc-dialog-overlay: rgba(0, 0, 0, .5);--oc-thinking-gradient-1: #10b981;--oc-thinking-gradient-2: #059669;--oc-thinking-glow: rgba(16, 185, 129, .3);--oc-thinking-glow-strong: rgba(16, 185, 129, .6);--oc-skeleton-bg: #e5e7eb;--oc-skeleton-gradient: linear-gradient(90deg, #e5e7eb 25%, #f3f4f6 50%, #e5e7eb 75%);--oc-shadow-sm: 0 2px 4px rgba(0, 0, 0, .1);--oc-shadow-md: 0 4px 12px rgba(0, 0, 0, .15);--oc-shadow-lg: 0 8px 32px rgba(0, 0, 0, .12);--oc-shadow-xl: 0 20px 60px rgba(0, 0, 0, .3);--oc-shadow-primary: 0 2px 4px rgba(59, 130, 246, .2);--oc-shadow-primary-hover: 0 4px 6px rgba(59, 130, 246, .3);--oc-shadow-danger: 0 4px 12px rgba(239, 68, 68, .3);--oc-trigger-bg: #3b82f6;--oc-trigger-bg-hover: #2563eb;--oc-trigger-bg-active: #1d4ed8;--oc-trigger-shadow: 0 2px 8px rgba(59, 130, 246, .3);--oc-trigger-shadow-hover: 0 4px 12px rgba(59, 130, 246, .4);--oc-trigger-shadow-active: 0 4px 12px rgba(59, 130, 246, .5);position:fixed;z-index:999999;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.opencode-widget.opencode-theme-dark{--oc-bg-main: #1a1a1a;--oc-bg-secondary: #1e1e1e;--oc-bg-tertiary: #282828;--oc-overlay-bg: rgba(26, 26, 26, .9);--oc-bg-inverse: #ffffff;--oc-text-primary: #f3f4f6;--oc-text-secondary: #d1d5db;--oc-text-tertiary: #9ca3af;--oc-text-placeholder: #6b7280;--oc-text-inverse: #282828;--oc-border-primary: #282828;--oc-border-secondary: #4b5563;--oc-primary: #3b82f6;--oc-primary-hover: #2563eb;--oc-primary-bg: rgba(59, 130, 246, .15);--oc-danger: #ef4444;--oc-danger-hover: #dc2626;--oc-danger-active: #b91c1c;--oc-success: #10b981;--oc-overlay: rgba(26, 26, 26, .9);--oc-tooltip-bg: #282828;--oc-dialog-overlay: rgba(0, 0, 0, .7);--oc-thinking-gradient-1: #34d399;--oc-thinking-gradient-2: #10b981;--oc-thinking-glow: rgba(52, 211, 153, .3);--oc-thinking-glow-strong: rgba(52, 211, 153, .6);--oc-skeleton-bg: #151515;--oc-skeleton-gradient: linear-gradient(90deg, #282828 25%, #4b5563 50%, #282828 75%);--oc-shadow-sm: 0 2px 4px rgba(0, 0, 0, .3);--oc-shadow-md: 0 4px 12px rgba(0, 0, 0, .4);--oc-shadow-lg: 0 8px 32px rgba(0, 0, 0, .4);--oc-shadow-xl: 0 20px 60px rgba(0, 0, 0, .6);--oc-shadow-primary: 0 2px 4px rgba(59, 130, 246, .3);--oc-shadow-primary-hover: 0 4px 6px rgba(59, 130, 246, .4);--oc-shadow-danger: 0 4px 12px rgba(239, 68, 68, .4);--oc-trigger-bg: #60a5fa;--oc-trigger-bg-hover: #3b82f6;--oc-trigger-bg-active: #2563eb;--oc-trigger-shadow: 0 2px 8px rgba(96, 165, 250, .4);--oc-trigger-shadow-hover: 0 4px 12px rgba(96, 165, 250, .5);--oc-trigger-shadow-active: 0 4px 12px rgba(96, 165, 250, .6)}.opencode-chat{position:fixed;bottom:20px;width:700px;height:86vh;max-height:calc(100vh - 40px);background:var(--oc-bg-main);border-radius:16px;box-shadow:var(--oc-shadow-lg);overflow:hidden;opacity:0;visibility:hidden;transform:translate3d(var(---chatAnimationOrigin\.x),var(---chatAnimationOrigin\.y),0) scale(.95);transition:all .3s ease;display:flex;flex-direction:column;z-index:99999}.opencode-chat.open{opacity:1;visibility:visible;transform:translateZ(0) scale(1)}.opencode-chat.no-transition,.opencode-chat.no-transition.open{transition:none!important}.opencode-chat.minimized{width:320px;height:320px}.opencode-chat.minimized .opencode-iframe-container{margin-top:-146px}.opencode-chat-content{display:flex;flex:1;overflow:hidden}.opencode-notification{position:absolute;top:20px;left:50%;transform:translate(-50%);padding:12px 24px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-radius:10px;font-size:14px;font-weight:500;box-shadow:0 4px 16px #3b82f666,0 0 0 2px #3b82f633;animation:slideDown .3s ease;z-index:10000000;display:flex;align-items:center;gap:10px}.opencode-notification:before{content:"\1f4a1";font-size:16px}.opencode-dialog-overlay{position:fixed;inset:0;background:var(--oc-dialog-overlay);display:flex;align-items:center;justify-content:center;z-index:9999999;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.opencode-dialog{background:var(--oc-bg-main);border-radius:12px;padding:24px;min-width:320px;max-width:400px;box-shadow:var(--oc-shadow-xl);animation:scaleIn .2s ease}@keyframes scaleIn{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.opencode-dialog-content{margin-bottom:20px}.opencode-dialog-message{font-size:15px;color:var(--oc-text-primary);line-height:1.5}.opencode-dialog-actions{display:flex;gap:12px;justify-content:flex-end}.opencode-dialog-btn{padding:10px 20px;border-radius:8px;border:none;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.opencode-dialog-btn.cancel{background:var(--oc-bg-tertiary);color:var(--oc-text-primary)}.opencode-dialog-btn.cancel:hover{background:var(--oc-text-primary);color:var(--oc-bg-main)}.opencode-dialog-btn.confirm{background:var(--oc-danger);color:#fff}.opencode-dialog-btn.confirm:hover{background:var(--oc-danger-hover)}@keyframes slideDown{0%{transform:translate(-50%) translateY(-100%);opacity:0}to{transform:translate(-50%) translateY(0);opacity:1}}.opencode-page-notification{position:fixed;top:20px;left:50%;transform:translate(-50%);padding:12px 24px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-radius:10px;font-size:14px;font-weight:500;box-shadow:0 4px 16px #3b82f666,0 0 0 2px #3b82f633;animation:slideDown .3s ease;z-index:2147483647;display:flex;align-items:center;gap:10px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.opencode-page-notification:before{content:"\1f4a1";font-size:16px}.opencode-element-highlight{position:fixed;pointer-events:none;z-index:999998;border-radius:4px}#vue-inspector-container{display:none!important}.opencode-element-tooltip{position:fixed;background:var(--oc-tooltip-bg);color:#fff;padding:8px 12px;border-radius:6px;font-size:12px;z-index:9999998;box-shadow:var(--oc-shadow-md);max-width:300px;pointer-events:none}.opencode-tooltip-tag{font-weight:500;margin-bottom:4px;word-break:break-all}.opencode-tooltip-file{font-size:11px;color:var(--oc-text-placeholder);word-break:break-all}.opencode-element-highlight-temp{position:absolute;pointer-events:none;z-index:999998;border-radius:4px;animation:highlight-pulse 2s ease-out forwards}@keyframes highlight-pulse{0%{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.02)}to{opacity:0;transform:scale(1)}}@media(max-width:768px){.opencode-chat{width:calc(100vw - 40px);height:calc(100vh - 100px)}}body.has-opencode-split{transition:padding .3s ease;min-width:auto}body.has-opencode-split-right{padding-right:var(--opencode-split-width, 500px)}body.has-opencode-split-left{padding-left:var(--opencode-split-width, 500px)}.opencode-widget.extension-mode{position:static;width:100%;height:100%;display:flex}
|
|
1
|
+
.opencode-widget{--oc-bg-main: #ffffff;--oc-bg-secondary: #f8f9fa;--oc-bg-tertiary: #f3f4f6;--oc-overlay-bg: rgba(255, 255, 255, .9);--oc-bg-inverse: #1e1e1e;--oc-text-primary: #282828;--oc-text-secondary: #4b5563;--oc-text-tertiary: #6b7280;--oc-text-placeholder: #9ca3af;--oc-text-inverse: #ffffff;--oc-border-primary: #e5e7eb;--oc-border-secondary: #d1d5db;--oc-primary: #3b82f6;--oc-primary-hover: #2563eb;--oc-primary-bg: rgba(59, 130, 246, .1);--oc-danger: #ef4444;--oc-danger-hover: #dc2626;--oc-danger-active: #b91c1c;--oc-success: #10b981;--oc-overlay: rgba(0, 0, 0, .5);--oc-tooltip-bg: #1e1e1e;--oc-dialog-overlay: rgba(0, 0, 0, .5);--oc-thinking-gradient-1: #10b981;--oc-thinking-gradient-2: #059669;--oc-thinking-glow: rgba(16, 185, 129, .3);--oc-thinking-glow-strong: rgba(16, 185, 129, .6);--oc-skeleton-bg: #e5e7eb;--oc-skeleton-gradient: linear-gradient(90deg, #e5e7eb 25%, #f3f4f6 50%, #e5e7eb 75%);--oc-shadow-sm: 0 2px 4px rgba(0, 0, 0, .1);--oc-shadow-md: 0 4px 12px rgba(0, 0, 0, .15);--oc-shadow-lg: 0 8px 32px rgba(0, 0, 0, .12);--oc-shadow-xl: 0 20px 60px rgba(0, 0, 0, .3);--oc-shadow-primary: 0 2px 4px rgba(59, 130, 246, .2);--oc-shadow-primary-hover: 0 4px 6px rgba(59, 130, 246, .3);--oc-shadow-danger: 0 4px 12px rgba(239, 68, 68, .3);--oc-trigger-bg: #3b82f6;--oc-trigger-bg-hover: #2563eb;--oc-trigger-bg-active: #1d4ed8;--oc-trigger-shadow: 0 2px 8px rgba(59, 130, 246, .3);--oc-trigger-shadow-hover: 0 4px 12px rgba(59, 130, 246, .4);--oc-trigger-shadow-active: 0 4px 12px rgba(59, 130, 246, .5);position:fixed;z-index:999999;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.opencode-widget.opencode-theme-dark{--oc-bg-main: #1a1a1a;--oc-bg-secondary: #1e1e1e;--oc-bg-tertiary: #282828;--oc-overlay-bg: rgba(26, 26, 26, .9);--oc-bg-inverse: #ffffff;--oc-text-primary: #f3f4f6;--oc-text-secondary: #d1d5db;--oc-text-tertiary: #9ca3af;--oc-text-placeholder: #6b7280;--oc-text-inverse: #282828;--oc-border-primary: #282828;--oc-border-secondary: #4b5563;--oc-primary: #3b82f6;--oc-primary-hover: #2563eb;--oc-primary-bg: rgba(59, 130, 246, .15);--oc-danger: #ef4444;--oc-danger-hover: #dc2626;--oc-danger-active: #b91c1c;--oc-success: #10b981;--oc-overlay: rgba(26, 26, 26, .9);--oc-tooltip-bg: #282828;--oc-dialog-overlay: rgba(0, 0, 0, .7);--oc-thinking-gradient-1: #34d399;--oc-thinking-gradient-2: #10b981;--oc-thinking-glow: rgba(52, 211, 153, .3);--oc-thinking-glow-strong: rgba(52, 211, 153, .6);--oc-skeleton-bg: #151515;--oc-skeleton-gradient: linear-gradient(90deg, #282828 25%, #4b5563 50%, #282828 75%);--oc-shadow-sm: 0 2px 4px rgba(0, 0, 0, .3);--oc-shadow-md: 0 4px 12px rgba(0, 0, 0, .4);--oc-shadow-lg: 0 8px 32px rgba(0, 0, 0, .4);--oc-shadow-xl: 0 20px 60px rgba(0, 0, 0, .6);--oc-shadow-primary: 0 2px 4px rgba(59, 130, 246, .3);--oc-shadow-primary-hover: 0 4px 6px rgba(59, 130, 246, .4);--oc-shadow-danger: 0 4px 12px rgba(239, 68, 68, .4);--oc-trigger-bg: #60a5fa;--oc-trigger-bg-hover: #3b82f6;--oc-trigger-bg-active: #2563eb;--oc-trigger-shadow: 0 2px 8px rgba(96, 165, 250, .4);--oc-trigger-shadow-hover: 0 4px 12px rgba(96, 165, 250, .5);--oc-trigger-shadow-active: 0 4px 12px rgba(96, 165, 250, .6)}.opencode-chat{position:fixed;bottom:20px;width:700px;height:86vh;max-height:calc(100vh - 40px);background:var(--oc-bg-main);border-radius:16px;box-shadow:var(--oc-shadow-lg);overflow:hidden;opacity:0;visibility:hidden;transform:translate3d(var(---chatAnimationOrigin\.x),var(---chatAnimationOrigin\.y),0) scale(.95);transition:all .3s ease;display:flex;flex-direction:column;z-index:99999}.opencode-chat.open{opacity:1;visibility:visible;transform:translateZ(0) scale(1)}.opencode-chat.no-transition,.opencode-chat.no-transition.open{transition:none!important}.opencode-chat.minimized{width:320px;height:320px}.opencode-chat.minimized .opencode-iframe-container{margin-top:-146px}.opencode-chat-content{display:flex;flex:1;overflow:hidden}.opencode-notification{position:absolute;top:20px;left:50%;transform:translate(-50%);padding:12px 24px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-radius:10px;font-size:14px;font-weight:500;box-shadow:0 4px 16px #3b82f666,0 0 0 2px #3b82f633;animation:slideDown .3s ease;z-index:10000000;display:flex;align-items:center;gap:10px}.opencode-notification:before{content:"\1f4a1";font-size:16px}.opencode-dialog-overlay{position:fixed;inset:0;background:var(--oc-dialog-overlay);display:flex;align-items:center;justify-content:center;z-index:9999999;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.opencode-dialog{background:var(--oc-bg-main);border-radius:12px;padding:24px;min-width:320px;max-width:400px;box-shadow:var(--oc-shadow-xl);animation:scaleIn .2s ease}@keyframes scaleIn{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.opencode-dialog-content{margin-bottom:20px}.opencode-dialog-message{font-size:15px;color:var(--oc-text-primary);line-height:1.5}.opencode-dialog-actions{display:flex;gap:12px;justify-content:flex-end}.opencode-dialog-btn{padding:10px 20px;border-radius:8px;border:none;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.opencode-dialog-btn.cancel{background:var(--oc-bg-tertiary);color:var(--oc-text-primary)}.opencode-dialog-btn.cancel:hover{background:var(--oc-text-primary);color:var(--oc-bg-main)}.opencode-dialog-btn.confirm{background:var(--oc-danger);color:#fff}.opencode-dialog-btn.confirm:hover{background:var(--oc-danger-hover)}@keyframes slideDown{0%{transform:translate(-50%) translateY(-100%);opacity:0}to{transform:translate(-50%) translateY(0);opacity:1}}.opencode-page-notification{position:fixed;top:20px;left:50%;transform:translate(-50%);padding:12px 24px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-radius:10px;font-size:14px;font-weight:500;box-shadow:0 4px 16px #3b82f666,0 0 0 2px #3b82f633;animation:slideDown .3s ease;z-index:2147483647;display:flex;align-items:center;gap:10px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.opencode-page-notification:before{content:"\1f4a1";font-size:16px}.opencode-element-highlight{position:fixed;pointer-events:none;z-index:999998;border-radius:4px}#vue-inspector-container{display:none!important}.opencode-element-tooltip{position:fixed;background:var(--oc-tooltip-bg);color:#fff;padding:8px 12px;border-radius:6px;font-size:12px;z-index:9999998;box-shadow:var(--oc-shadow-md);max-width:300px;pointer-events:none;line-height:1}.opencode-tooltip-tag{font-weight:500;margin-bottom:4px;word-break:break-all}.opencode-tooltip-file{font-size:11px;color:var(--oc-text-placeholder);word-break:break-all}.opencode-element-highlight-temp{position:absolute;pointer-events:none;z-index:999998;border-radius:4px;animation:highlight-pulse 2s ease-out forwards}@keyframes highlight-pulse{0%{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.02)}to{opacity:0;transform:scale(1)}}@media(max-width:768px){.opencode-chat{width:calc(100vw - 40px);height:calc(100vh - 100px)}}body.has-opencode-split{transition:padding .3s ease;min-width:auto}body.has-opencode-split-right{padding-right:var(--opencode-split-width, 500px)}body.has-opencode-split-left{padding-left:var(--opencode-split-width, 500px)}.opencode-widget.extension-mode{position:static;width:100%;height:100%;display:flex}
|
|
2
2
|
.opencode-chat{position:fixed;bottom:20px;width:700px;height:86vh;max-height:calc(100vh - 40px);background:var(--oc-bg-main);border-radius:16px;box-shadow:var(--oc-shadow-lg);overflow:hidden;display:flex;flex-direction:column;z-index:99999}.opencode-chat:not(.split-mode){opacity:0;visibility:hidden;transition:all .3s ease;transform:translate3d(var(---animationOrigin\.x),var(---animationOrigin\.y),0) scale(.95)}.opencode-chat.split-mode{position:fixed;top:0;bottom:0;height:100vh;max-height:100vh;border-radius:0;box-shadow:var(--oc-shadow-lg);overflow:visible;opacity:1;visibility:visible;transition:transform .3s ease}.opencode-chat.split-mode.split-right{right:0;border-left:1px solid var(--oc-border-primary);transform:translate(100%)}.opencode-chat.split-mode.split-left{left:0;border-right:1px solid var(--oc-border-primary);transform:translate(-100%)}.opencode-chat.split-mode .opencode-chat-content{overflow:hidden;flex:1}.opencode-chat.split-mode.open{transform:translate(0)}.opencode-chat.split-mode.dragging{transition:none}.opencode-chat.dragging .opencode-iframe{pointer-events:none}.opencode-chat.extension-mode{position:static;width:100%;height:100%;bottom:auto;left:auto;right:auto;border-radius:0;border-left:none;border-right:none;max-height:none;box-shadow:none;transform:none;opacity:1;visibility:visible}.opencode-chat:not(.split-mode){opacity:0;visibility:hidden;transition:all .3s ease}.opencode-chat:not(.split-mode).open{opacity:1;visibility:visible;transform:translateZ(0) scale(1)}.opencode-chat.no-transition,.opencode-chat.no-transition.open{transition:none!important}.opencode-chat.minimized:not(.split-mode){width:320px;height:320px}.opencode-chat.minimized:not(.split-mode) .opencode-iframe-container{margin-top:-146px}.opencode-chat-content{display:flex;flex:1;overflow:hidden}.opencode-notification{position:absolute;top:20px;left:50%;transform:translate(-50%);padding:12px 24px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-radius:10px;font-size:14px;z-index:100;animation:opencode-notification-fade-in .3s ease}@keyframes opencode-notification-fade-in{0%{opacity:0;transform:translate(-50%) translateY(-10px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.opencode-session-empty{padding:24px;text-align:center;color:var(--oc-text-placeholder);font-size:14px}.opencode-split-toggle-btn{position:absolute;left:-21px;top:50%;transform:translateY(-50%);width:20px;height:48px;background:#fff;border:none;border-radius:8px 0 0 8px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#667eea;box-shadow:0 4px 12px #667eea66;transition:all .3s ease;z-index:5;transform-origin:right center}.opencode-split-toggle-btn.split-left{left:auto;right:-21px;border-radius:0 8px 8px 0;transform-origin:left center}.opencode-split-toggle-btn:hover{transform:translateY(-50%) scale(1.1);box-shadow:0 6px 16px #667eea80}.opencode-split-toggle-btn.split-left:hover{transform:translateY(-50%) scale(1.1)}.opencode-split-toggle-btn.opencode-theme-dark{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 4px 12px #667eea4d}.opencode-split-toggle-btn.opencode-theme-dark:before{content:"";position:absolute;inset:-2px 0 -2px -2px;border-radius:8px 0 0 8px;background:linear-gradient(135deg,#8b9cf5,#9d6bc7);z-index:-1}.opencode-split-toggle-btn.opencode-theme-dark.split-left:before{left:0;right:-2px;border-radius:0 8px 8px 0}.opencode-split-toggle-btn.opencode-theme-dark:hover{box-shadow:0 6px 16px #667eea66}.opencode-split-toggle-btn.thinking{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;animation:split-thinking-glow 2s ease-in-out infinite,split-thinking-pulse 2s ease-in-out infinite;box-shadow:0 0 20px #667eea99,0 0 40px #764ba266,0 0 60px #667eea33}.opencode-split-toggle-btn.thinking:before{content:"";position:absolute;inset:-2px 0 -2px -2px;border-radius:8px 0 0 8px;background:linear-gradient(135deg,#8b9cf5,#9d6bc7);z-index:-1}.opencode-split-toggle-btn.thinking.split-left:before{left:0;right:-2px;border-radius:0 8px 8px 0}.opencode-split-toggle-btn.thinking:after{content:"";position:absolute;inset:-3px -1px -3px -3px;border-radius:8px 0 0 8px;background:conic-gradient(from 180deg,transparent,rgba(102,126,234,.3),transparent,rgba(118,75,162,.3),transparent);z-index:-2;animation:split-thinking-rotate 2s linear infinite reverse;filter:blur(8px)}.opencode-split-toggle-btn.thinking.split-left:after{left:-1px;right:-3px;border-radius:0 8px 8px 0}@keyframes split-thinking-glow{0%,to{box-shadow:0 0 20px #667eea99,0 0 40px #764ba266,0 0 60px #667eea33}50%{box-shadow:0 0 30px #667eeacc,0 0 60px #764ba299,0 0 90px #667eea4d}}@keyframes split-thinking-rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes split-thinking-pulse{0%,to{transform:translateY(-50%) scale(1)}50%{transform:translateY(-50%) scale(.92)}}.opencode-split-toggle-icon{display:flex;align-items:center;justify-content:center;transition:transform .25s ease}.opencode-split-toggle-btn:hover .opencode-split-toggle-icon{transform:scale(1.1)}
|
|
3
3
|
.opencode-iframe-container{flex:1;position:relative;overflow:hidden;display:flex;flex-direction:column}.opencode-loading-overlay{position:absolute;inset:0;background:var(--oc-overlay-bg);display:none;flex-direction:column;align-items:center;justify-content:center;z-index:10;transition:opacity .3s ease}.opencode-loading-overlay.visible{display:flex}.opencode-loading-spinner{width:40px;height:40px;border:3px solid var(--oc-border-primary);border-top-color:var(--oc-primary);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.opencode-loading-text{margin-top:12px;font-size:14px;color:var(--oc-text-placeholder)}.opencode-error-overlay{position:absolute;inset:0;z-index:15;display:none}.opencode-error-overlay.visible{display:flex}.opencode-empty-state-overlay{position:absolute;inset:0;background:var(--oc-bg-secondary);display:none;flex-direction:column;align-items:center;justify-content:center;z-index:5;transition:opacity .3s ease}.opencode-empty-state-overlay.visible{display:flex}.opencode-empty-state-icon{color:var(--oc-text-placeholder);margin-bottom:16px}.opencode-empty-state-text{color:var(--oc-text-primary);font-size:16px;font-weight:500;margin-bottom:24px}.opencode-empty-state-btn{padding:10px 24px;border-radius:8px;border:none;background:var(--oc-primary);color:#fff;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s;box-shadow:var(--oc-shadow-primary)}.opencode-empty-state-btn:hover{background:var(--oc-primary-hover);transform:translateY(-1px);box-shadow:var(--oc-shadow-primary-hover)}.opencode-empty-state-btn:active{transform:translateY(0)}.opencode-iframe{width:100%;height:100%;border:none}
|
|
4
4
|
.opencode-chat-header{position:relative;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 12px;height:40px;background:var(--oc-bg-secondary);border-bottom:1px solid var(--oc-border-primary);z-index:5}.opencode-chat-header-left{display:flex;align-items:center;gap:4px}.opencode-chat-header-title{font-size:14px;font-weight:600;color:var(--oc-text-primary);position:absolute;left:50%;transform:translate(-50%)}.opencode-chat-header-actions{display:flex;gap:4px}.opencode-header-btn{width:28px;height:28px;border-radius:6px;border:none;background:transparent;color:var(--oc-text-placeholder);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.opencode-header-btn:hover{background:var(--oc-bg-tertiary);color:var(--oc-text-primary)}.opencode-header-btn.close:hover{background:var(--oc-danger);color:#fff}.opencode-header-btn.select-btn.active,.opencode-header-btn.session-toggle.active{background:var(--oc-primary);color:#fff}
|
package/lib/index.cjs
CHANGED
|
@@ -34,7 +34,7 @@ __export(lib_exports, {
|
|
|
34
34
|
});
|
|
35
35
|
module.exports = __toCommonJS(lib_exports);
|
|
36
36
|
var import_open_code_widget = __toESM(require("./open-code-widget/index.cjs"));
|
|
37
|
-
const version = "1.0.
|
|
37
|
+
const version = "1.0.78";
|
|
38
38
|
function install(app, options) {
|
|
39
39
|
const components = [
|
|
40
40
|
import_open_code_widget.default
|
package/lib/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import OpenCodeWidget from './open-code-widget';
|
|
2
2
|
import type { App } from 'vue';
|
|
3
|
-
declare const version = "1.0.
|
|
3
|
+
declare const version = "1.0.78";
|
|
4
4
|
declare function install(app: App<any>, options?: any): void;
|
|
5
5
|
export { install, version, OpenCodeWidget };
|
|
6
6
|
export default install;
|
|
@@ -296,33 +296,83 @@ function useInspector(options) {
|
|
|
296
296
|
background: currentPrimaryBg
|
|
297
297
|
};
|
|
298
298
|
}
|
|
299
|
-
const tooltipHeight = 50;
|
|
300
|
-
const tooltipWidth = 200;
|
|
301
|
-
const margin = 10;
|
|
302
|
-
let tooltipTop = rect.top - tooltipHeight - 8;
|
|
303
|
-
let tooltipLeft = rect.left;
|
|
304
|
-
if (tooltipTop < margin) {
|
|
305
|
-
tooltipTop = rect.bottom + 8;
|
|
306
|
-
}
|
|
307
|
-
if (tooltipTop + tooltipHeight > window.innerHeight - margin) {
|
|
308
|
-
tooltipTop = Math.max(margin, rect.top - tooltipHeight - 8);
|
|
309
|
-
}
|
|
310
|
-
if (tooltipLeft < margin) {
|
|
311
|
-
tooltipLeft = margin;
|
|
312
|
-
}
|
|
313
|
-
if (tooltipLeft + tooltipWidth > window.innerWidth - margin) {
|
|
314
|
-
tooltipLeft = window.innerWidth - tooltipWidth - margin;
|
|
315
|
-
}
|
|
316
|
-
const newTooltipTop = `${tooltipTop}px`;
|
|
317
|
-
const newTooltipLeft = `${tooltipLeft}px`;
|
|
318
|
-
if (tooltipStyle.value.top !== newTooltipTop || tooltipStyle.value.left !== newTooltipLeft) {
|
|
319
|
-
tooltipStyle.value = {
|
|
320
|
-
top: newTooltipTop,
|
|
321
|
-
left: newTooltipLeft
|
|
322
|
-
};
|
|
323
|
-
}
|
|
324
299
|
highlightVisible.value = true;
|
|
325
300
|
tooltipVisible.value = true;
|
|
301
|
+
void (0, import_vue.nextTick)(() => {
|
|
302
|
+
const tooltipEl = document.querySelector(".opencode-element-tooltip");
|
|
303
|
+
if (!tooltipEl) return;
|
|
304
|
+
const tooltipWidth = tooltipEl.offsetWidth;
|
|
305
|
+
const tooltipHeight = tooltipEl.offsetHeight;
|
|
306
|
+
if (tooltipWidth === 0 || tooltipHeight === 0) return;
|
|
307
|
+
const margin = 10;
|
|
308
|
+
const gap = 4;
|
|
309
|
+
const viewportWidth = window.innerWidth;
|
|
310
|
+
const viewportHeight = window.innerHeight;
|
|
311
|
+
const clampLeft = (left) => Math.max(margin, Math.min(left, viewportWidth - tooltipWidth - margin));
|
|
312
|
+
const clampTop = (top) => Math.max(margin, Math.min(top, viewportHeight - tooltipHeight - margin));
|
|
313
|
+
const candidateTop = rect.top - tooltipHeight - gap;
|
|
314
|
+
const candidateBottom = rect.bottom + gap;
|
|
315
|
+
const candidateRight = rect.right + gap;
|
|
316
|
+
const candidateLeft = rect.left - tooltipWidth - gap;
|
|
317
|
+
const verticalCenter = rect.top + (rect.height - tooltipHeight) / 2;
|
|
318
|
+
let tooltipTop = 0;
|
|
319
|
+
let tooltipLeft = 0;
|
|
320
|
+
let placed = false;
|
|
321
|
+
if (candidateTop >= margin) {
|
|
322
|
+
tooltipTop = candidateTop;
|
|
323
|
+
tooltipLeft = clampLeft(rect.left);
|
|
324
|
+
placed = true;
|
|
325
|
+
}
|
|
326
|
+
if (!placed && candidateBottom + tooltipHeight <= viewportHeight - margin) {
|
|
327
|
+
tooltipTop = candidateBottom;
|
|
328
|
+
tooltipLeft = clampLeft(rect.left);
|
|
329
|
+
placed = true;
|
|
330
|
+
}
|
|
331
|
+
if (!placed && candidateRight + tooltipWidth <= viewportWidth - margin) {
|
|
332
|
+
tooltipLeft = candidateRight;
|
|
333
|
+
tooltipTop = clampTop(verticalCenter);
|
|
334
|
+
placed = true;
|
|
335
|
+
}
|
|
336
|
+
if (!placed && candidateLeft >= margin) {
|
|
337
|
+
tooltipLeft = candidateLeft;
|
|
338
|
+
tooltipTop = clampTop(verticalCenter);
|
|
339
|
+
placed = true;
|
|
340
|
+
}
|
|
341
|
+
if (!placed) {
|
|
342
|
+
const corners = [
|
|
343
|
+
{ top: margin, left: margin },
|
|
344
|
+
{ top: margin, left: viewportWidth - tooltipWidth - margin },
|
|
345
|
+
{ top: viewportHeight - tooltipHeight - margin, left: margin },
|
|
346
|
+
{
|
|
347
|
+
top: viewportHeight - tooltipHeight - margin,
|
|
348
|
+
left: viewportWidth - tooltipWidth - margin
|
|
349
|
+
}
|
|
350
|
+
];
|
|
351
|
+
for (const corner of corners) {
|
|
352
|
+
const tooltipRight = corner.left + tooltipWidth;
|
|
353
|
+
const tooltipBottom = corner.top + tooltipHeight;
|
|
354
|
+
const overlaps = tooltipRight <= rect.left || rect.right <= corner.left || tooltipBottom <= rect.top || rect.bottom <= corner.top;
|
|
355
|
+
if (overlaps) {
|
|
356
|
+
tooltipTop = corner.top;
|
|
357
|
+
tooltipLeft = corner.left;
|
|
358
|
+
placed = true;
|
|
359
|
+
break;
|
|
360
|
+
}
|
|
361
|
+
}
|
|
362
|
+
if (!placed) {
|
|
363
|
+
tooltipTop = margin;
|
|
364
|
+
tooltipLeft = margin;
|
|
365
|
+
}
|
|
366
|
+
}
|
|
367
|
+
const newTooltipTop = `${tooltipTop}px`;
|
|
368
|
+
const newTooltipLeft = `${tooltipLeft}px`;
|
|
369
|
+
if (tooltipStyle.value.top !== newTooltipTop || tooltipStyle.value.left !== newTooltipLeft) {
|
|
370
|
+
tooltipStyle.value = {
|
|
371
|
+
top: newTooltipTop,
|
|
372
|
+
left: newTooltipLeft
|
|
373
|
+
};
|
|
374
|
+
}
|
|
375
|
+
});
|
|
326
376
|
} else {
|
|
327
377
|
highlightVisible.value = false;
|
|
328
378
|
tooltipVisible.value = false;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.opencode-widget{--oc-bg-main: #ffffff;--oc-bg-secondary: #f8f9fa;--oc-bg-tertiary: #f3f4f6;--oc-overlay-bg: rgba(255, 255, 255, .9);--oc-bg-inverse: #1e1e1e;--oc-text-primary: #282828;--oc-text-secondary: #4b5563;--oc-text-tertiary: #6b7280;--oc-text-placeholder: #9ca3af;--oc-text-inverse: #ffffff;--oc-border-primary: #e5e7eb;--oc-border-secondary: #d1d5db;--oc-primary: #3b82f6;--oc-primary-hover: #2563eb;--oc-primary-bg: rgba(59, 130, 246, .1);--oc-danger: #ef4444;--oc-danger-hover: #dc2626;--oc-danger-active: #b91c1c;--oc-success: #10b981;--oc-overlay: rgba(0, 0, 0, .5);--oc-tooltip-bg: #1e1e1e;--oc-dialog-overlay: rgba(0, 0, 0, .5);--oc-thinking-gradient-1: #10b981;--oc-thinking-gradient-2: #059669;--oc-thinking-glow: rgba(16, 185, 129, .3);--oc-thinking-glow-strong: rgba(16, 185, 129, .6);--oc-skeleton-bg: #e5e7eb;--oc-skeleton-gradient: linear-gradient(90deg, #e5e7eb 25%, #f3f4f6 50%, #e5e7eb 75%);--oc-shadow-sm: 0 2px 4px rgba(0, 0, 0, .1);--oc-shadow-md: 0 4px 12px rgba(0, 0, 0, .15);--oc-shadow-lg: 0 8px 32px rgba(0, 0, 0, .12);--oc-shadow-xl: 0 20px 60px rgba(0, 0, 0, .3);--oc-shadow-primary: 0 2px 4px rgba(59, 130, 246, .2);--oc-shadow-primary-hover: 0 4px 6px rgba(59, 130, 246, .3);--oc-shadow-danger: 0 4px 12px rgba(239, 68, 68, .3);--oc-trigger-bg: #3b82f6;--oc-trigger-bg-hover: #2563eb;--oc-trigger-bg-active: #1d4ed8;--oc-trigger-shadow: 0 2px 8px rgba(59, 130, 246, .3);--oc-trigger-shadow-hover: 0 4px 12px rgba(59, 130, 246, .4);--oc-trigger-shadow-active: 0 4px 12px rgba(59, 130, 246, .5);position:fixed;z-index:999999;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.opencode-widget.opencode-theme-dark{--oc-bg-main: #1a1a1a;--oc-bg-secondary: #1e1e1e;--oc-bg-tertiary: #282828;--oc-overlay-bg: rgba(26, 26, 26, .9);--oc-bg-inverse: #ffffff;--oc-text-primary: #f3f4f6;--oc-text-secondary: #d1d5db;--oc-text-tertiary: #9ca3af;--oc-text-placeholder: #6b7280;--oc-text-inverse: #282828;--oc-border-primary: #282828;--oc-border-secondary: #4b5563;--oc-primary: #3b82f6;--oc-primary-hover: #2563eb;--oc-primary-bg: rgba(59, 130, 246, .15);--oc-danger: #ef4444;--oc-danger-hover: #dc2626;--oc-danger-active: #b91c1c;--oc-success: #10b981;--oc-overlay: rgba(26, 26, 26, .9);--oc-tooltip-bg: #282828;--oc-dialog-overlay: rgba(0, 0, 0, .7);--oc-thinking-gradient-1: #34d399;--oc-thinking-gradient-2: #10b981;--oc-thinking-glow: rgba(52, 211, 153, .3);--oc-thinking-glow-strong: rgba(52, 211, 153, .6);--oc-skeleton-bg: #151515;--oc-skeleton-gradient: linear-gradient(90deg, #282828 25%, #4b5563 50%, #282828 75%);--oc-shadow-sm: 0 2px 4px rgba(0, 0, 0, .3);--oc-shadow-md: 0 4px 12px rgba(0, 0, 0, .4);--oc-shadow-lg: 0 8px 32px rgba(0, 0, 0, .4);--oc-shadow-xl: 0 20px 60px rgba(0, 0, 0, .6);--oc-shadow-primary: 0 2px 4px rgba(59, 130, 246, .3);--oc-shadow-primary-hover: 0 4px 6px rgba(59, 130, 246, .4);--oc-shadow-danger: 0 4px 12px rgba(239, 68, 68, .4);--oc-trigger-bg: #60a5fa;--oc-trigger-bg-hover: #3b82f6;--oc-trigger-bg-active: #2563eb;--oc-trigger-shadow: 0 2px 8px rgba(96, 165, 250, .4);--oc-trigger-shadow-hover: 0 4px 12px rgba(96, 165, 250, .5);--oc-trigger-shadow-active: 0 4px 12px rgba(96, 165, 250, .6)}.opencode-chat{position:fixed;bottom:20px;width:700px;height:86vh;max-height:calc(100vh - 40px);background:var(--oc-bg-main);border-radius:16px;box-shadow:var(--oc-shadow-lg);overflow:hidden;opacity:0;visibility:hidden;transform:translate3d(var(---chatAnimationOrigin\.x),var(---chatAnimationOrigin\.y),0) scale(.95);transition:all .3s ease;display:flex;flex-direction:column;z-index:99999}.opencode-chat.open{opacity:1;visibility:visible;transform:translateZ(0) scale(1)}.opencode-chat.no-transition,.opencode-chat.no-transition.open{transition:none!important}.opencode-chat.minimized{width:320px;height:320px}.opencode-chat.minimized .opencode-iframe-container{margin-top:-146px}.opencode-chat-content{display:flex;flex:1;overflow:hidden}.opencode-notification{position:absolute;top:20px;left:50%;transform:translate(-50%);padding:12px 24px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-radius:10px;font-size:14px;font-weight:500;box-shadow:0 4px 16px #3b82f666,0 0 0 2px #3b82f633;animation:slideDown .3s ease;z-index:10000000;display:flex;align-items:center;gap:10px}.opencode-notification:before{content:"\1f4a1";font-size:16px}.opencode-dialog-overlay{position:fixed;inset:0;background:var(--oc-dialog-overlay);display:flex;align-items:center;justify-content:center;z-index:9999999;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.opencode-dialog{background:var(--oc-bg-main);border-radius:12px;padding:24px;min-width:320px;max-width:400px;box-shadow:var(--oc-shadow-xl);animation:scaleIn .2s ease}@keyframes scaleIn{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.opencode-dialog-content{margin-bottom:20px}.opencode-dialog-message{font-size:15px;color:var(--oc-text-primary);line-height:1.5}.opencode-dialog-actions{display:flex;gap:12px;justify-content:flex-end}.opencode-dialog-btn{padding:10px 20px;border-radius:8px;border:none;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.opencode-dialog-btn.cancel{background:var(--oc-bg-tertiary);color:var(--oc-text-primary)}.opencode-dialog-btn.cancel:hover{background:var(--oc-text-primary);color:var(--oc-bg-main)}.opencode-dialog-btn.confirm{background:var(--oc-danger);color:#fff}.opencode-dialog-btn.confirm:hover{background:var(--oc-danger-hover)}@keyframes slideDown{0%{transform:translate(-50%) translateY(-100%);opacity:0}to{transform:translate(-50%) translateY(0);opacity:1}}.opencode-page-notification{position:fixed;top:20px;left:50%;transform:translate(-50%);padding:12px 24px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-radius:10px;font-size:14px;font-weight:500;box-shadow:0 4px 16px #3b82f666,0 0 0 2px #3b82f633;animation:slideDown .3s ease;z-index:2147483647;display:flex;align-items:center;gap:10px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.opencode-page-notification:before{content:"\1f4a1";font-size:16px}.opencode-element-highlight{position:fixed;pointer-events:none;z-index:999998;border-radius:4px}#vue-inspector-container{display:none!important}.opencode-element-tooltip{position:fixed;background:var(--oc-tooltip-bg);color:#fff;padding:8px 12px;border-radius:6px;font-size:12px;z-index:9999998;box-shadow:var(--oc-shadow-md);max-width:300px;pointer-events:none}.opencode-tooltip-tag{font-weight:500;margin-bottom:4px;word-break:break-all}.opencode-tooltip-file{font-size:11px;color:var(--oc-text-placeholder);word-break:break-all}.opencode-element-highlight-temp{position:absolute;pointer-events:none;z-index:999998;border-radius:4px;animation:highlight-pulse 2s ease-out forwards}@keyframes highlight-pulse{0%{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.02)}to{opacity:0;transform:scale(1)}}@media(max-width:768px){.opencode-chat{width:calc(100vw - 40px);height:calc(100vh - 100px)}}body.has-opencode-split{transition:padding .3s ease;min-width:auto}body.has-opencode-split-right{padding-right:var(--opencode-split-width, 500px)}body.has-opencode-split-left{padding-left:var(--opencode-split-width, 500px)}.opencode-widget.extension-mode{position:static;width:100%;height:100%;display:flex}
|
|
1
|
+
.opencode-widget{--oc-bg-main: #ffffff;--oc-bg-secondary: #f8f9fa;--oc-bg-tertiary: #f3f4f6;--oc-overlay-bg: rgba(255, 255, 255, .9);--oc-bg-inverse: #1e1e1e;--oc-text-primary: #282828;--oc-text-secondary: #4b5563;--oc-text-tertiary: #6b7280;--oc-text-placeholder: #9ca3af;--oc-text-inverse: #ffffff;--oc-border-primary: #e5e7eb;--oc-border-secondary: #d1d5db;--oc-primary: #3b82f6;--oc-primary-hover: #2563eb;--oc-primary-bg: rgba(59, 130, 246, .1);--oc-danger: #ef4444;--oc-danger-hover: #dc2626;--oc-danger-active: #b91c1c;--oc-success: #10b981;--oc-overlay: rgba(0, 0, 0, .5);--oc-tooltip-bg: #1e1e1e;--oc-dialog-overlay: rgba(0, 0, 0, .5);--oc-thinking-gradient-1: #10b981;--oc-thinking-gradient-2: #059669;--oc-thinking-glow: rgba(16, 185, 129, .3);--oc-thinking-glow-strong: rgba(16, 185, 129, .6);--oc-skeleton-bg: #e5e7eb;--oc-skeleton-gradient: linear-gradient(90deg, #e5e7eb 25%, #f3f4f6 50%, #e5e7eb 75%);--oc-shadow-sm: 0 2px 4px rgba(0, 0, 0, .1);--oc-shadow-md: 0 4px 12px rgba(0, 0, 0, .15);--oc-shadow-lg: 0 8px 32px rgba(0, 0, 0, .12);--oc-shadow-xl: 0 20px 60px rgba(0, 0, 0, .3);--oc-shadow-primary: 0 2px 4px rgba(59, 130, 246, .2);--oc-shadow-primary-hover: 0 4px 6px rgba(59, 130, 246, .3);--oc-shadow-danger: 0 4px 12px rgba(239, 68, 68, .3);--oc-trigger-bg: #3b82f6;--oc-trigger-bg-hover: #2563eb;--oc-trigger-bg-active: #1d4ed8;--oc-trigger-shadow: 0 2px 8px rgba(59, 130, 246, .3);--oc-trigger-shadow-hover: 0 4px 12px rgba(59, 130, 246, .4);--oc-trigger-shadow-active: 0 4px 12px rgba(59, 130, 246, .5);position:fixed;z-index:999999;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.opencode-widget.opencode-theme-dark{--oc-bg-main: #1a1a1a;--oc-bg-secondary: #1e1e1e;--oc-bg-tertiary: #282828;--oc-overlay-bg: rgba(26, 26, 26, .9);--oc-bg-inverse: #ffffff;--oc-text-primary: #f3f4f6;--oc-text-secondary: #d1d5db;--oc-text-tertiary: #9ca3af;--oc-text-placeholder: #6b7280;--oc-text-inverse: #282828;--oc-border-primary: #282828;--oc-border-secondary: #4b5563;--oc-primary: #3b82f6;--oc-primary-hover: #2563eb;--oc-primary-bg: rgba(59, 130, 246, .15);--oc-danger: #ef4444;--oc-danger-hover: #dc2626;--oc-danger-active: #b91c1c;--oc-success: #10b981;--oc-overlay: rgba(26, 26, 26, .9);--oc-tooltip-bg: #282828;--oc-dialog-overlay: rgba(0, 0, 0, .7);--oc-thinking-gradient-1: #34d399;--oc-thinking-gradient-2: #10b981;--oc-thinking-glow: rgba(52, 211, 153, .3);--oc-thinking-glow-strong: rgba(52, 211, 153, .6);--oc-skeleton-bg: #151515;--oc-skeleton-gradient: linear-gradient(90deg, #282828 25%, #4b5563 50%, #282828 75%);--oc-shadow-sm: 0 2px 4px rgba(0, 0, 0, .3);--oc-shadow-md: 0 4px 12px rgba(0, 0, 0, .4);--oc-shadow-lg: 0 8px 32px rgba(0, 0, 0, .4);--oc-shadow-xl: 0 20px 60px rgba(0, 0, 0, .6);--oc-shadow-primary: 0 2px 4px rgba(59, 130, 246, .3);--oc-shadow-primary-hover: 0 4px 6px rgba(59, 130, 246, .4);--oc-shadow-danger: 0 4px 12px rgba(239, 68, 68, .4);--oc-trigger-bg: #60a5fa;--oc-trigger-bg-hover: #3b82f6;--oc-trigger-bg-active: #2563eb;--oc-trigger-shadow: 0 2px 8px rgba(96, 165, 250, .4);--oc-trigger-shadow-hover: 0 4px 12px rgba(96, 165, 250, .5);--oc-trigger-shadow-active: 0 4px 12px rgba(96, 165, 250, .6)}.opencode-chat{position:fixed;bottom:20px;width:700px;height:86vh;max-height:calc(100vh - 40px);background:var(--oc-bg-main);border-radius:16px;box-shadow:var(--oc-shadow-lg);overflow:hidden;opacity:0;visibility:hidden;transform:translate3d(var(---chatAnimationOrigin\.x),var(---chatAnimationOrigin\.y),0) scale(.95);transition:all .3s ease;display:flex;flex-direction:column;z-index:99999}.opencode-chat.open{opacity:1;visibility:visible;transform:translateZ(0) scale(1)}.opencode-chat.no-transition,.opencode-chat.no-transition.open{transition:none!important}.opencode-chat.minimized{width:320px;height:320px}.opencode-chat.minimized .opencode-iframe-container{margin-top:-146px}.opencode-chat-content{display:flex;flex:1;overflow:hidden}.opencode-notification{position:absolute;top:20px;left:50%;transform:translate(-50%);padding:12px 24px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-radius:10px;font-size:14px;font-weight:500;box-shadow:0 4px 16px #3b82f666,0 0 0 2px #3b82f633;animation:slideDown .3s ease;z-index:10000000;display:flex;align-items:center;gap:10px}.opencode-notification:before{content:"\1f4a1";font-size:16px}.opencode-dialog-overlay{position:fixed;inset:0;background:var(--oc-dialog-overlay);display:flex;align-items:center;justify-content:center;z-index:9999999;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.opencode-dialog{background:var(--oc-bg-main);border-radius:12px;padding:24px;min-width:320px;max-width:400px;box-shadow:var(--oc-shadow-xl);animation:scaleIn .2s ease}@keyframes scaleIn{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.opencode-dialog-content{margin-bottom:20px}.opencode-dialog-message{font-size:15px;color:var(--oc-text-primary);line-height:1.5}.opencode-dialog-actions{display:flex;gap:12px;justify-content:flex-end}.opencode-dialog-btn{padding:10px 20px;border-radius:8px;border:none;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.opencode-dialog-btn.cancel{background:var(--oc-bg-tertiary);color:var(--oc-text-primary)}.opencode-dialog-btn.cancel:hover{background:var(--oc-text-primary);color:var(--oc-bg-main)}.opencode-dialog-btn.confirm{background:var(--oc-danger);color:#fff}.opencode-dialog-btn.confirm:hover{background:var(--oc-danger-hover)}@keyframes slideDown{0%{transform:translate(-50%) translateY(-100%);opacity:0}to{transform:translate(-50%) translateY(0);opacity:1}}.opencode-page-notification{position:fixed;top:20px;left:50%;transform:translate(-50%);padding:12px 24px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-radius:10px;font-size:14px;font-weight:500;box-shadow:0 4px 16px #3b82f666,0 0 0 2px #3b82f633;animation:slideDown .3s ease;z-index:2147483647;display:flex;align-items:center;gap:10px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.opencode-page-notification:before{content:"\1f4a1";font-size:16px}.opencode-element-highlight{position:fixed;pointer-events:none;z-index:999998;border-radius:4px}#vue-inspector-container{display:none!important}.opencode-element-tooltip{position:fixed;background:var(--oc-tooltip-bg);color:#fff;padding:8px 12px;border-radius:6px;font-size:12px;z-index:9999998;box-shadow:var(--oc-shadow-md);max-width:300px;pointer-events:none;line-height:1}.opencode-tooltip-tag{font-weight:500;margin-bottom:4px;word-break:break-all}.opencode-tooltip-file{font-size:11px;color:var(--oc-text-placeholder);word-break:break-all}.opencode-element-highlight-temp{position:absolute;pointer-events:none;z-index:999998;border-radius:4px;animation:highlight-pulse 2s ease-out forwards}@keyframes highlight-pulse{0%{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.02)}to{opacity:0;transform:scale(1)}}@media(max-width:768px){.opencode-chat{width:calc(100vw - 40px);height:calc(100vh - 100px)}}body.has-opencode-split{transition:padding .3s ease;min-width:auto}body.has-opencode-split-right{padding-right:var(--opencode-split-width, 500px)}body.has-opencode-split-left{padding-left:var(--opencode-split-width, 500px)}.opencode-widget.extension-mode{position:static;width:100%;height:100%;display:flex}
|
package/lib/web-types.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"$schema":"https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json","framework":"vue","name":"@vite-plugin-opencode-assistant/components","version":"1.0.
|
|
1
|
+
{"$schema":"https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json","framework":"vue","name":"@vite-plugin-opencode-assistant/components","version":"1.0.78","contributions":{"html":{"tags":[{"name":"open-code","attributes":[{"name":"","default":"`'bottom-right'`","description":"挂件显示的位置","value":{"type":"`'bottom-right' | 'bottom-left' | 'top-right' | 'top-left'`","kind":"expression"}},{"name":"","default":"`false`","description":"挂件是否打开","value":{"type":"`boolean`","kind":"expression"}},{"name":"","default":"`'auto'`","description":"主题模式","value":{"type":"`'light' | 'dark' | 'auto'`","kind":"expression"}},{"name":"","default":"`'AI 助手'`","description":"助手头部显示的标题","value":{"type":"`string`","kind":"expression"}},{"name":"","default":"`'Ctrl+K'`","description":"快捷键提示文本","value":{"type":"`string`","kind":"expression"}},{"name":"","default":"`'按 ESC 或 Ctrl+P 退出'`","description":"选择模式快捷键提示文本","value":{"type":"`string`","kind":"expression"}},{"name":"","default":"`false`","description":"是否进入选择页面元素模式","value":{"type":"`boolean`","kind":"expression"}},{"name":"","default":"`true`","description":"会话列表是否折叠","value":{"type":"`boolean`","kind":"expression"}},{"name":"","default":"`'id'`","description":"会话列表项的唯一键字段","value":{"type":"`string`","kind":"expression"}},{"name":"","default":"`false`","description":"iframe 是否显示加载状态","value":{"type":"`boolean`","kind":"expression"}},{"name":"","default":"`undefined`","description":"会话列表是否加载中","value":{"type":"`boolean`","kind":"expression"}},{"name":"","default":"`false`","description":"是否显示会话列表骨架屏","value":{"type":"`boolean`","kind":"expression"}},{"name":"","default":"`false`","description":"是否显示空状态","value":{"type":"`boolean`","kind":"expression"}},{"name":"","default":"`false`","description":"是否显示错误状态","value":{"type":"`boolean`","kind":"expression"}},{"name":"","default":"`'当前项目暂无会话'`","description":"空状态显示的文本","value":{"type":"`string`","kind":"expression"}},{"name":"","default":"`'立即创建'`","description":"空状态操作按钮文本","value":{"type":"`string`","kind":"expression"}},{"name":"","default":"`''`","description":"Web UI 的 URL 来源","value":{"type":"`string`","kind":"expression"}},{"name":"","default":"`[]`","description":"会话列表数据","value":{"type":"`OpenCodeWidgetSession[]`","kind":"expression"}},{"name":"","default":"`null`","description":"当前选中的会话 ID","value":{"type":"`string | null`","kind":"expression"}},{"name":"","default":"`[]`","description":"已选中的元素列表","value":{"type":"`OpenCodeSelectedElement[]`","kind":"expression"}},{"name":"","default":"`true`","description":"是否显示\"一键清空\"按钮","value":{"type":"`boolean`","kind":"expression"}},{"name":"","default":"`true`","description":"是否启用选择模式","value":{"type":"`boolean`","kind":"expression"}},{"name":"","default":"`false`","description":"是否显示思考状态(加载中)","value":{"type":"`boolean`","kind":"expression"}}],"events":[{"name":"`update:open`","description":"当挂件打开或关闭时触发","arguments":[{"name":"open","type":"en"},{"name":"boolean"}]},{"name":"`update:selectMode`","description":"当选择模式切换时触发","arguments":[{"name":"mode","type":"de"},{"name":"boolean"}]},{"name":"`update:sessionListCollapsed`","description":"当会话列表折叠状态改变时触发","arguments":[{"name":"collapsed","type":"ed"},{"name":"boolean"}]},{"name":"`update:currentSessionId`","description":"当选中的会话 ID 改变时触发","arguments":[{"name":"sessionId","type":"Id"},{"name":"string | null"}]},{"name":"`update:selectedElements`","description":"当已选中的元素列表改变时触发","arguments":[{"name":"elements","type":"ts"},{"name":"OpenCodeSelectedElement[]"}]},{"name":"`update:theme`","description":"当主题模式改变时触发","arguments":[{"name":"theme","type":"me"},{"name":"'light' | 'dark' | 'auto'"}]},{"name":"`update:thinking`","description":"当思考状态改变时触发","arguments":[{"name":"thinking","type":"ng"},{"name":"boolean"}]},{"name":"","description":"点击触发挂件开关","arguments":[{"name":"open","type":"en"},{"name":"boolean"}]},{"name":"","description":"点击关闭按钮时触发","arguments":[]},{"name":"`toggle-session-list`","description":"点击会话列表切换按钮时触发","arguments":[{"name":"collapsed","type":"ed"},{"name":"boolean"}]},{"name":"`toggle-select-mode`","description":"点击选择模式切换按钮时触发","arguments":[{"name":"mode","type":"de"},{"name":"boolean"}]},{"name":"`toggle-theme`","description":"点击主题切换按钮时触发","arguments":[{"name":"theme","type":"me"},{"name":"'light' | 'dark' | 'auto'"}]},{"name":"`create-session`","description":"点击创建新会话时触发","arguments":[]},{"name":"`select-session`","description":"选中某个历史会话时触发","arguments":[{"name":"session","type":"on"},{"name":"OpenCodeWidgetSession"}]},{"name":"`delete-session`","description":"删除某个历史会话时触发","arguments":[{"name":"session","type":"on"},{"name":"OpenCodeWidgetSession"}]},{"name":"`click-selected-node`","description":"点击已选中的气泡或节点卡片时触发","arguments":[{"name":"element","type":"nt"},{"name":"OpenCodeSelectedElement"}]},{"name":"`remove-selected-node`","description":"删除已选中的元素时触发","arguments":[{"name":"payload","type":"ad"},{"name":"OpenCodeRemoveSelectedPayload"}]},{"name":"`clear-selected-nodes`","description":"清空所有选中元素时触发","arguments":[]},{"name":"`empty-action`","description":"点击空状态操作按钮时触发","arguments":[]},{"name":"`frame-loaded`","description":"iframe 加载完成时触发","arguments":[]},{"name":"`thinking-change`","description":"思考状态改变时触发(用于显示加载动画)","arguments":[{"name":"thinking","type":"ng"},{"name":"boolean"}]}],"slots":[{"name":"`button-icon`","description":"自定义触发按钮图标"},{"name":"`session-toggle-icon`","description":"自定义会话列表切换图标"},{"name":"`select-icon`","description":"自定义选择模式切换图标"},{"name":"`close-icon`","description":"自定义关闭按钮图标"},{"name":"`theme-icon`","description":"自定义主题切换图标"},{"name":"`sessions-empty`","description":"自定义会话列表空状态"},{"name":"`empty-state`","description":"自定义 iframe 空状态"},{"name":"","description":"自定义 iframe 加载状态"},{"name":"","description":"自定义错误状态"},{"name":"","description":"自定义 iframe 内容"}]}],"attributes":[]}},"js-types-syntax":"typescript"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vite-plugin-opencode-assistant/components",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.78",
|
|
4
4
|
"description": "Reusable OpenCode widget components built with Pagoda CLI",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "lib/index.cjs",
|
|
@@ -31,7 +31,7 @@
|
|
|
31
31
|
},
|
|
32
32
|
"dependencies": {
|
|
33
33
|
"css-selector-generator": "^3.9.1",
|
|
34
|
-
"@vite-plugin-opencode-assistant/shared": "1.0.
|
|
34
|
+
"@vite-plugin-opencode-assistant/shared": "1.0.78"
|
|
35
35
|
},
|
|
36
36
|
"scripts": {
|
|
37
37
|
"build": "pagoda-cli build",
|