@vite-plugin-opencode-assistant/components 1.0.5
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/env.d.ts +10 -0
- package/es/index.d.ts +6 -0
- package/es/index.js +21 -0
- package/es/open-code-widget/composables/use-inspector.d.ts +52 -0
- package/es/open-code-widget/composables/use-inspector.js +188 -0
- package/es/open-code-widget/composables/use-selection.d.ts +19 -0
- package/es/open-code-widget/composables/use-selection.js +142 -0
- package/es/open-code-widget/composables/use-session.d.ts +16 -0
- package/es/open-code-widget/composables/use-session.js +68 -0
- package/es/open-code-widget/composables/use-widget.d.ts +24 -0
- package/es/open-code-widget/composables/use-widget.js +44 -0
- package/es/open-code-widget/index.d.ts +3 -0
- package/es/open-code-widget/index.js +6 -0
- package/es/open-code-widget/src/components/Frame-sfc.css +1 -0
- package/es/open-code-widget/src/components/Frame.vue.d.ts +16 -0
- package/es/open-code-widget/src/components/Frame.vue.js +120 -0
- package/es/open-code-widget/src/components/Header-sfc.css +1 -0
- package/es/open-code-widget/src/components/Header.vue.d.ts +16 -0
- package/es/open-code-widget/src/components/Header.vue.js +140 -0
- package/es/open-code-widget/src/components/SelectHint-sfc.css +1 -0
- package/es/open-code-widget/src/components/SelectHint.vue.d.ts +2 -0
- package/es/open-code-widget/src/components/SelectHint.vue.js +46 -0
- package/es/open-code-widget/src/components/SelectedBubbles-sfc.css +1 -0
- package/es/open-code-widget/src/components/SelectedBubbles.vue.d.ts +2 -0
- package/es/open-code-widget/src/components/SelectedBubbles.vue.js +84 -0
- package/es/open-code-widget/src/components/SelectedNodes-sfc.css +1 -0
- package/es/open-code-widget/src/components/SelectedNodes.vue.d.ts +2 -0
- package/es/open-code-widget/src/components/SelectedNodes.vue.js +103 -0
- package/es/open-code-widget/src/components/SessionList-sfc.css +1 -0
- package/es/open-code-widget/src/components/SessionList.vue.d.ts +12 -0
- package/es/open-code-widget/src/components/SessionList.vue.js +209 -0
- package/es/open-code-widget/src/components/Trigger-sfc.css +1 -0
- package/es/open-code-widget/src/components/Trigger.vue.d.ts +12 -0
- package/es/open-code-widget/src/components/Trigger.vue.js +66 -0
- package/es/open-code-widget/src/context.d.ts +42 -0
- package/es/open-code-widget/src/context.js +16 -0
- package/es/open-code-widget/src/index-sfc.css +1 -0
- package/es/open-code-widget/src/index.vue.d.ts +83 -0
- package/es/open-code-widget/src/index.vue.js +464 -0
- package/es/open-code-widget/src/types.d.ts +74 -0
- package/es/open-code-widget/src/types.js +0 -0
- package/es/open-code-widget/style/index-pure.d.ts +0 -0
- package/es/open-code-widget/style/index-pure.js +0 -0
- package/es/open-code-widget/style/index.d.ts +0 -0
- package/es/open-code-widget/style/index.js +0 -0
- package/es/open-code-widget/style/less-pure.d.ts +0 -0
- package/es/open-code-widget/style/less-pure.js +0 -0
- package/es/open-code-widget/style/less.d.ts +0 -0
- package/es/open-code-widget/style/less.js +0 -0
- package/lib/@vite-plugin-opencode-assistant/components.cjs.js +1322 -0
- package/lib/@vite-plugin-opencode-assistant/components.es.js +1315 -0
- package/lib/components.css +9 -0
- package/lib/env.d.ts +10 -0
- package/lib/index.css +0 -0
- package/lib/index.d.ts +6 -0
- package/lib/index.js +50 -0
- package/lib/index.less +0 -0
- package/lib/open-code-widget/composables/use-inspector.d.ts +52 -0
- package/lib/open-code-widget/composables/use-inspector.js +207 -0
- package/lib/open-code-widget/composables/use-selection.d.ts +19 -0
- package/lib/open-code-widget/composables/use-selection.js +161 -0
- package/lib/open-code-widget/composables/use-session.d.ts +16 -0
- package/lib/open-code-widget/composables/use-session.js +87 -0
- package/lib/open-code-widget/composables/use-widget.d.ts +24 -0
- package/lib/open-code-widget/composables/use-widget.js +63 -0
- package/lib/open-code-widget/index.d.ts +3 -0
- package/lib/open-code-widget/index.js +36 -0
- package/lib/open-code-widget/src/components/Frame-sfc.css +1 -0
- package/lib/open-code-widget/src/components/Frame.vue.d.ts +16 -0
- package/lib/open-code-widget/src/components/Frame.vue.js +139 -0
- package/lib/open-code-widget/src/components/Header-sfc.css +1 -0
- package/lib/open-code-widget/src/components/Header.vue.d.ts +16 -0
- package/lib/open-code-widget/src/components/Header.vue.js +159 -0
- package/lib/open-code-widget/src/components/SelectHint-sfc.css +1 -0
- package/lib/open-code-widget/src/components/SelectHint.vue.d.ts +2 -0
- package/lib/open-code-widget/src/components/SelectHint.vue.js +65 -0
- package/lib/open-code-widget/src/components/SelectedBubbles-sfc.css +1 -0
- package/lib/open-code-widget/src/components/SelectedBubbles.vue.d.ts +2 -0
- package/lib/open-code-widget/src/components/SelectedBubbles.vue.js +103 -0
- package/lib/open-code-widget/src/components/SelectedNodes-sfc.css +1 -0
- package/lib/open-code-widget/src/components/SelectedNodes.vue.d.ts +2 -0
- package/lib/open-code-widget/src/components/SelectedNodes.vue.js +122 -0
- package/lib/open-code-widget/src/components/SessionList-sfc.css +1 -0
- package/lib/open-code-widget/src/components/SessionList.vue.d.ts +12 -0
- package/lib/open-code-widget/src/components/SessionList.vue.js +228 -0
- package/lib/open-code-widget/src/components/Trigger-sfc.css +1 -0
- package/lib/open-code-widget/src/components/Trigger.vue.d.ts +12 -0
- package/lib/open-code-widget/src/components/Trigger.vue.js +85 -0
- package/lib/open-code-widget/src/context.d.ts +42 -0
- package/lib/open-code-widget/src/context.js +35 -0
- package/lib/open-code-widget/src/index-sfc.css +1 -0
- package/lib/open-code-widget/src/index.vue.d.ts +83 -0
- package/lib/open-code-widget/src/index.vue.js +491 -0
- package/lib/open-code-widget/src/types.d.ts +74 -0
- package/lib/open-code-widget/src/types.js +15 -0
- package/lib/open-code-widget/style/index-pure.d.ts +0 -0
- package/lib/open-code-widget/style/index-pure.js +0 -0
- package/lib/open-code-widget/style/index.d.ts +0 -0
- package/lib/open-code-widget/style/index.js +0 -0
- package/lib/open-code-widget/style/less-pure.d.ts +0 -0
- package/lib/open-code-widget/style/less-pure.js +0 -0
- package/lib/open-code-widget/style/less.d.ts +0 -0
- package/lib/open-code-widget/style/less.js +0 -0
- package/lib/web-types.json +1 -0
- package/package.json +46 -0
|
@@ -0,0 +1,9 @@
|
|
|
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-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: linear-gradient(135deg, #667eea 0%, #764ba2 100%);--oc-trigger-bg-hover: linear-gradient(135deg, #764ba2 0%, #667eea 100%);--oc-trigger-bg-active: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);--oc-trigger-shadow: 0 4px 15px rgba(102, 126, 234, .4);--oc-trigger-shadow-hover: 0 6px 20px rgba(102, 126, 234, .6);--oc-trigger-shadow-active: 0 6px 20px rgba(240, 147, 251, .4);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-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: linear-gradient(135deg, #667eea 0%, #764ba2 100%);--oc-trigger-bg-hover: linear-gradient(135deg, #764ba2 0%, #667eea 100%);--oc-trigger-bg-active: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);--oc-trigger-shadow: 0 4px 15px rgba(102, 126, 234, .5);--oc-trigger-shadow-hover: 0 6px 20px rgba(102, 126, 234, .7);--oc-trigger-shadow-active: 0 6px 20px rgba(240, 147, 251, .5)}.opencode-widget.bottom-right{bottom:20px;right:20px}.opencode-widget.bottom-left{bottom:20px;left:20px}.opencode-widget.top-right{top:20px;right:20px}.opencode-widget.top-left{top:20px;left:20px}.opencode-chat{position:absolute;width:700px;height:86vh;background:var(--oc-bg-main);border-radius:16px;box-shadow:var(--oc-shadow-lg);overflow:hidden;opacity:0;visibility:hidden;transform:translateY(20px) scale(.95);transition:all .3s ease;display:flex;flex-direction:column}.opencode-chat-content{display:flex;flex:1;overflow:hidden}.opencode-widget.bottom-right .opencode-chat{bottom:56px;right:0}.opencode-widget.bottom-left .opencode-chat{bottom:56px;left:0}.opencode-widget.top-right .opencode-chat{top:56px;right:0}.opencode-widget.top-left .opencode-chat{top:56px;left:0}.opencode-widget.bottom-right .opencode-selected-bubbles{bottom:56px;right:0}.opencode-widget.bottom-left .opencode-selected-bubbles{bottom:56px;left:0}.opencode-widget.top-right .opencode-selected-bubbles{top:56px;bottom:auto;right:0}.opencode-widget.top-left .opencode-selected-bubbles{top:56px;bottom:auto;left:0}.opencode-chat.open{opacity:1;visibility:visible;transform:translateY(0) scale(1)}.opencode-notification{position:absolute;top:20px;left:50%;transform:translate(-50%);padding:12px 20px;background:var(--oc-bg-main);color:var(--oc-text-primary);border:1px solid var(--oc-border-primary);border-radius:8px;font-size:14px;box-shadow:var(--oc-shadow-lg);animation:slideDown .3s ease;z-index:10000000}.opencode-dialog-overlay{position:fixed;top:0;left:0;right:0;bottom: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-element-highlight{position:fixed;pointer-events:none;z-index:999998;display:none;transition:all .1s ease;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;display:none;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)}}
|
|
2
|
+
.opencode-iframe-container{flex:1;position:relative;overflow:hidden;display:flex;flex-direction:column;margin-top:-42px}.opencode-loading-overlay{position:absolute;top:0;left:0;right:0;bottom: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-empty-state-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:var(--oc-bg-secondary);display:none;flex-direction:column;align-items:center;justify-content:center;z-index:5;transition:opacity .3s ease;margin-top:42px}.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}
|
|
3
|
+
.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{background:var(--oc-primary);color:#fff}
|
|
4
|
+
.opencode-select-mode-hint{position:fixed;top:20px;left:50%;transform:translate(-50%);padding:10px 16px;background:var(--oc-danger);color:#fff;border-radius:8px;font-size:13px;box-shadow:var(--oc-shadow-danger);z-index:9999999;display:none;align-items:center;gap:12px}.opencode-select-mode-hint.visible{display:flex;animation:slideDown .3s ease}.opencode-hint-shortcut{padding:2px 6px;background:rgba(255,255,255,.2);border-radius:4px;font-size:12px}
|
|
5
|
+
.opencode-selected-bubbles{position:absolute;display:none;flex-direction:column;gap:6px;max-width:220px;max-height:300px;overflow-y:auto}.opencode-selected-bubbles.visible{display:flex}.opencode-selected-bubble{display:flex;flex-direction:column;gap:2px;padding:8px 24px 8px 10px;background:var(--oc-bg-main);border:1px solid var(--oc-border-primary);border-radius:8px;font-size:12px;box-shadow:var(--oc-shadow-sm);position:relative;cursor:pointer;transition:all .2s}.opencode-selected-bubble:hover{border-color:var(--oc-primary);box-shadow:var(--oc-shadow-primary)}.opencode-bubble-text{color:var(--oc-text-primary);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.opencode-bubble-file{color:var(--oc-text-placeholder);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.opencode-bubble-remove{position:absolute;top:8px;right:6px;width:16px;height:16px;border-radius:50%;border:none;background:transparent;color:var(--oc-text-placeholder);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:12px;transition:all .2s}.opencode-bubble-remove:hover{background:var(--oc-danger);color:#fff}.opencode-bubble-empty{padding:8px 12px;background:var(--oc-bg-main);border:1px dashed var(--oc-border-secondary);border-radius:8px;color:var(--oc-text-placeholder);font-size:12px;text-align:center}
|
|
6
|
+
.opencode-right-toolbar{width:140px;background:var(--oc-bg-secondary);border-left:1px solid var(--oc-border-primary);display:flex;flex-direction:column;flex-shrink:0;transition:width .2s ease;overflow:hidden}.opencode-right-toolbar.collapsed{width:0;overflow:hidden}.opencode-right-toolbar.collapsed .opencode-selected-nodes-header,.opencode-right-toolbar.collapsed .opencode-selected-nodes,.opencode-right-toolbar.collapsed .opencode-clear-all-btn{display:none}.opencode-selected-nodes-header{padding:12px 8px 8px;border-bottom:1px solid var(--oc-border-primary)}.opencode-selected-nodes-title{font-size:14px;font-weight:600;color:var(--oc-text-primary);margin-bottom:4px}.opencode-selected-nodes-desc{font-size:11px;color:var(--oc-text-placeholder);line-height:1.4}.opencode-selected-nodes{flex:1;display:flex;flex-direction:column;padding:8px;gap:6px;overflow-y:auto;overflow-x:hidden}.opencode-selected-nodes:empty:before{content:"\6682\65e0\9009\4e2d\5143\7d20";color:var(--oc-text-placeholder);font-size:12px;text-align:center;padding:20px 10px}.opencode-selected-node{display:flex;align-items:center;gap:8px;padding:8px 10px;background:var(--oc-bg-main);border:1px solid var(--oc-border-primary);border-radius:6px;font-size:12px;transition:all .2s}.opencode-selected-node:hover{border-color:var(--oc-primary);box-shadow:var(--oc-shadow-primary)}.opencode-node-content{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.opencode-node-text{color:var(--oc-text-primary);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.opencode-node-file{color:var(--oc-text-placeholder);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.opencode-node-remove{width:18px;height:18px;border-radius:4px;border:none;background:transparent;color:var(--oc-text-placeholder);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:14px;transition:all .2s;flex-shrink:0}.opencode-node-remove:hover{background:var(--oc-danger);color:#fff}.opencode-clear-all-btn{width:calc(100% - 16px);margin:8px;padding:8px 12px;border-radius:6px;border:none;background:var(--oc-danger);color:#fff;font-size:12px;font-weight:500;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:4px;transition:all .2s}.opencode-clear-all-btn:hover{background:var(--oc-danger-hover);transform:scale(1.02)}
|
|
7
|
+
.opencode-session-list{width:240px;background:var(--oc-bg-secondary);border-right:1px solid var(--oc-border-primary);display:flex;flex-direction:column;flex-shrink:0;transition:width .2s ease}.opencode-session-list.collapsed{width:0;overflow:hidden}.opencode-session-list.collapsed .opencode-session-list-header,.opencode-session-list.collapsed .opencode-session-list-content{display:none}.opencode-session-list-header{padding:16px;border-bottom:1px solid var(--oc-border-primary);display:flex;justify-content:space-between;align-items:center;font-weight:600;font-size:14px;color:var(--oc-text-primary)}.opencode-new-session-btn{width:28px;height:28px;border-radius:6px;border:none;background:var(--oc-primary);color:#fff;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.opencode-new-session-btn:hover{background:var(--oc-primary-hover);transform:scale(1.05)}.opencode-session-list-content{flex:1;overflow-y:auto;padding:8px;position:relative}.opencode-session-list-loading-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:var(--oc-overlay-bg);display:flex;align-items:center;justify-content:center;z-index:10;border-radius:8px}.opencode-loading-spinner.small{width:24px;height:24px;border-width:2px}.opencode-session-item{padding:12px;border-radius:8px;cursor:pointer;transition:all .2s;margin-bottom:4px;color:var(--oc-text-primary)}.opencode-session-item:hover{background:var(--oc-bg-tertiary)}.opencode-session-item.active{background:var(--oc-primary);color:#fff}.opencode-session-title{font-size:14px;font-weight:500;margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.opencode-session-meta{font-size:12px;opacity:.6}.opencode-session-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}.opencode-session-delete-btn{width:20px;height:20px;border-radius:4px;border:none;background:transparent;color:var(--oc-text-placeholder);font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;opacity:0;flex-shrink:0}.opencode-session-item:hover .opencode-session-delete-btn{opacity:1}.opencode-session-delete-btn:hover{background:var(--oc-danger);color:#fff}.opencode-session-item.active .opencode-session-delete-btn{color:rgba(255,255,255,.7)}.opencode-session-item.active .opencode-session-delete-btn:hover{background:rgba(255,255,255,.2);color:#fff}.opencode-session-header-skeleton{padding:16px;border-bottom:1px solid var(--oc-border-primary);display:none;justify-content:space-between;align-items:center}.opencode-session-header-skeleton.visible{display:flex}.opencode-skeleton-header-title{height:18px;width:80px;background:var(--oc-skeleton-gradient);background-size:200% 100%;animation:skeleton-loading 1.5s ease-in-out infinite;border-radius:4px}.opencode-skeleton-header-btn{width:28px;height:28px;background:var(--oc-skeleton-gradient);background-size:200% 100%;animation:skeleton-loading 1.5s ease-in-out infinite;border-radius:6px}.opencode-session-skeleton{flex:1;overflow-y:auto;padding:8px;display:none}.opencode-session-skeleton.visible{display:block}.opencode-skeleton-item{padding:12px;border-radius:8px;margin-bottom:4px;background:var(--oc-skeleton-bg)}.opencode-skeleton-title{height:16px;background:var(--oc-skeleton-gradient);background-size:200% 100%;animation:skeleton-loading 1.5s ease-in-out infinite;border-radius:4px;margin-bottom:8px;width:70%}.opencode-skeleton-meta{height:12px;background:var(--oc-skeleton-gradient);background-size:200% 100%;animation:skeleton-loading 1.5s ease-in-out infinite;border-radius:4px;width:50%}.opencode-session-empty{padding:32px 16px;text-align:center;color:var(--oc-text-placeholder);font-size:13px}@keyframes skeleton-loading{0%{background-position:200% 0}to{background-position:-200% 0}}
|
|
8
|
+
.opencode-button{width:44px;height:44px;border-radius:50%;background:var(--oc-trigger-bg);border:none;cursor:pointer;box-shadow:var(--oc-trigger-shadow);transition:all .3s ease;display:flex;align-items:center;justify-content:center;color:#fff;padding:0;position:relative}.opencode-button:before{content:"";position:absolute;top:-8px;left:-8px;right:-8px;bottom:-8px;border-radius:50%}.opencode-button:hover{transform:scale(1.1);box-shadow:var(--oc-trigger-shadow-hover);background:var(--oc-trigger-bg-hover)}.opencode-button.active{background:var(--oc-trigger-bg-active);box-shadow:var(--oc-trigger-shadow-active)}.opencode-button.active svg{transform:rotate(180deg)}.opencode-button svg{transition:transform .3s ease}.opencode-button.loading{animation:pulse 1s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}
|
|
9
|
+
/*$vite$:1*/
|
package/lib/env.d.ts
ADDED
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/// <reference lib="dom" />
|
|
2
|
+
/// <reference lib="dom.iterable" />
|
|
3
|
+
|
|
4
|
+
declare module "*.vue" {
|
|
5
|
+
import type { DefineComponent } from "vue";
|
|
6
|
+
|
|
7
|
+
const component: DefineComponent<Record<string, never>, Record<string, never>, unknown>;
|
|
8
|
+
|
|
9
|
+
export default component;
|
|
10
|
+
}
|
package/lib/index.css
ADDED
|
File without changes
|
package/lib/index.d.ts
ADDED
package/lib/index.js
ADDED
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __export = (target, all) => {
|
|
8
|
+
for (var name in all)
|
|
9
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
+
};
|
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
+
for (let key of __getOwnPropNames(from))
|
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
+
}
|
|
17
|
+
return to;
|
|
18
|
+
};
|
|
19
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
21
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
22
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
23
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
24
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
25
|
+
mod
|
|
26
|
+
));
|
|
27
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
28
|
+
var lib_exports = {};
|
|
29
|
+
__export(lib_exports, {
|
|
30
|
+
OpenCodeWidget: () => import_open_code_widget.default,
|
|
31
|
+
default: () => lib_default,
|
|
32
|
+
install: () => install,
|
|
33
|
+
version: () => version
|
|
34
|
+
});
|
|
35
|
+
module.exports = __toCommonJS(lib_exports);
|
|
36
|
+
var import_open_code_widget = __toESM(require("./open-code-widget"));
|
|
37
|
+
const version = "1.0.5";
|
|
38
|
+
function install(app, options) {
|
|
39
|
+
const components = [
|
|
40
|
+
import_open_code_widget.default
|
|
41
|
+
];
|
|
42
|
+
components.forEach((item) => {
|
|
43
|
+
if (item.install) {
|
|
44
|
+
app.use(item, options);
|
|
45
|
+
} else if (item.name) {
|
|
46
|
+
app.component(item.name, item);
|
|
47
|
+
}
|
|
48
|
+
});
|
|
49
|
+
}
|
|
50
|
+
var lib_default = install;
|
package/lib/index.less
ADDED
|
File without changes
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import { type Ref } from "vue";
|
|
2
|
+
import type { OpenCodeSelectedElement } from "../src/types";
|
|
3
|
+
interface VueInspector {
|
|
4
|
+
getTargetNode: (e: MouseEvent) => {
|
|
5
|
+
targetNode: Element | null;
|
|
6
|
+
params: {
|
|
7
|
+
file?: string;
|
|
8
|
+
line?: number;
|
|
9
|
+
column?: number;
|
|
10
|
+
} | null;
|
|
11
|
+
};
|
|
12
|
+
handleClick: (e: MouseEvent) => void;
|
|
13
|
+
enable: () => void;
|
|
14
|
+
disable: () => void;
|
|
15
|
+
__opencode_hooked?: boolean;
|
|
16
|
+
}
|
|
17
|
+
declare global {
|
|
18
|
+
interface Window {
|
|
19
|
+
__VUE_INSPECTOR__?: VueInspector;
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
interface UseInspectorOptions {
|
|
23
|
+
selectMode: Ref<boolean>;
|
|
24
|
+
onAddSelectedNode: (element: OpenCodeSelectedElement) => void;
|
|
25
|
+
onExitSelectMode: () => void;
|
|
26
|
+
}
|
|
27
|
+
export declare function useInspector(options: UseInspectorOptions): {
|
|
28
|
+
highlightVisible: Ref<boolean, boolean>;
|
|
29
|
+
highlightStyle: Ref<Record<string, string>, Record<string, string>>;
|
|
30
|
+
tooltipVisible: Ref<boolean, boolean>;
|
|
31
|
+
tooltipStyle: Ref<{
|
|
32
|
+
top: string;
|
|
33
|
+
left: string;
|
|
34
|
+
}, {
|
|
35
|
+
top: string;
|
|
36
|
+
left: string;
|
|
37
|
+
} | {
|
|
38
|
+
top: string;
|
|
39
|
+
left: string;
|
|
40
|
+
}>;
|
|
41
|
+
tooltipContent: Ref<{
|
|
42
|
+
description: string;
|
|
43
|
+
fileInfo: string;
|
|
44
|
+
}, {
|
|
45
|
+
description: string;
|
|
46
|
+
fileInfo: string;
|
|
47
|
+
} | {
|
|
48
|
+
description: string;
|
|
49
|
+
fileInfo: string;
|
|
50
|
+
}>;
|
|
51
|
+
};
|
|
52
|
+
export {};
|
|
@@ -0,0 +1,207 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
4
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
5
|
+
var __export = (target, all) => {
|
|
6
|
+
for (var name in all)
|
|
7
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
8
|
+
};
|
|
9
|
+
var __copyProps = (to, from, except, desc) => {
|
|
10
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
11
|
+
for (let key of __getOwnPropNames(from))
|
|
12
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
13
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
14
|
+
}
|
|
15
|
+
return to;
|
|
16
|
+
};
|
|
17
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
18
|
+
var use_inspector_exports = {};
|
|
19
|
+
__export(use_inspector_exports, {
|
|
20
|
+
useInspector: () => useInspector
|
|
21
|
+
});
|
|
22
|
+
module.exports = __toCommonJS(use_inspector_exports);
|
|
23
|
+
var import_vue = require("vue");
|
|
24
|
+
function truncate(str, maxLength) {
|
|
25
|
+
if (!str) return "";
|
|
26
|
+
return str.length > maxLength ? str.substring(0, maxLength) + "..." : str;
|
|
27
|
+
}
|
|
28
|
+
function getDirectText(element) {
|
|
29
|
+
let text = "";
|
|
30
|
+
for (let i = 0; i < element.childNodes.length; i++) {
|
|
31
|
+
const child = element.childNodes[i];
|
|
32
|
+
if (child.nodeType === Node.TEXT_NODE) {
|
|
33
|
+
text += child.textContent || "";
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
return text.trim();
|
|
37
|
+
}
|
|
38
|
+
function getElementDescription(element) {
|
|
39
|
+
const tag = element.tagName.toLowerCase();
|
|
40
|
+
const parts = [tag];
|
|
41
|
+
const id = element.id;
|
|
42
|
+
if (id) parts.push(`#${id}`);
|
|
43
|
+
if (typeof element.className === "string") {
|
|
44
|
+
const className = element.className.trim().split(/\s+/).filter(Boolean).slice(0, 2).join(".");
|
|
45
|
+
if (className) parts.push(`.${className}`);
|
|
46
|
+
}
|
|
47
|
+
const name = element.getAttribute("name");
|
|
48
|
+
if (name) parts.push(`[name="${name}"]`);
|
|
49
|
+
const placeholder = element.getAttribute("placeholder");
|
|
50
|
+
if (placeholder) parts.push(`[placeholder="${placeholder.substring(0, 20)}"]`);
|
|
51
|
+
const src = element.getAttribute("src");
|
|
52
|
+
if (src) parts.push(`[src]`);
|
|
53
|
+
const href = element.getAttribute("href");
|
|
54
|
+
if (href && href !== "#") parts.push(`[href]`);
|
|
55
|
+
return parts.join("");
|
|
56
|
+
}
|
|
57
|
+
function useInspector(options) {
|
|
58
|
+
const highlightVisible = (0, import_vue.ref)(false);
|
|
59
|
+
const highlightStyle = (0, import_vue.ref)({
|
|
60
|
+
top: "0px",
|
|
61
|
+
left: "0px",
|
|
62
|
+
width: "0px",
|
|
63
|
+
height: "0px"
|
|
64
|
+
});
|
|
65
|
+
const tooltipVisible = (0, import_vue.ref)(false);
|
|
66
|
+
const tooltipStyle = (0, import_vue.ref)({ top: "0px", left: "0px" });
|
|
67
|
+
const tooltipContent = (0, import_vue.ref)({ description: "", fileInfo: "" });
|
|
68
|
+
const INSPECTOR_CHECK_INTERVAL = 500;
|
|
69
|
+
let inspectorCheckTimer = null;
|
|
70
|
+
function handleMouseMove(e) {
|
|
71
|
+
if (!options.selectMode.value) return;
|
|
72
|
+
const inspector = window.__VUE_INSPECTOR__;
|
|
73
|
+
if (!inspector) return;
|
|
74
|
+
const { targetNode, params } = inspector.getTargetNode(e);
|
|
75
|
+
if (targetNode && params) {
|
|
76
|
+
const rect = targetNode.getBoundingClientRect();
|
|
77
|
+
const widget = document.querySelector(".opencode-widget");
|
|
78
|
+
let primary = "#3b82f6";
|
|
79
|
+
let primaryBg = "rgba(59, 130, 246, 0.1)";
|
|
80
|
+
if (widget) {
|
|
81
|
+
const style = getComputedStyle(widget);
|
|
82
|
+
primary = style.getPropertyValue("--oc-primary").trim() || primary;
|
|
83
|
+
primaryBg = style.getPropertyValue("--oc-primary-bg").trim() || primaryBg;
|
|
84
|
+
}
|
|
85
|
+
highlightVisible.value = true;
|
|
86
|
+
highlightStyle.value = {
|
|
87
|
+
top: `${rect.top}px`,
|
|
88
|
+
left: `${rect.left}px`,
|
|
89
|
+
width: `${rect.width}px`,
|
|
90
|
+
height: `${rect.height}px`,
|
|
91
|
+
border: `2px solid ${primary}`,
|
|
92
|
+
background: primaryBg
|
|
93
|
+
};
|
|
94
|
+
const description = getElementDescription(targetNode);
|
|
95
|
+
const fileName = params.file ? params.file.split("/").pop() : "";
|
|
96
|
+
let lineInfo = "";
|
|
97
|
+
if (params.line) {
|
|
98
|
+
lineInfo = `:${params.line}`;
|
|
99
|
+
if (params.column) {
|
|
100
|
+
lineInfo += `:${params.column}`;
|
|
101
|
+
}
|
|
102
|
+
}
|
|
103
|
+
tooltipContent.value = {
|
|
104
|
+
description,
|
|
105
|
+
fileInfo: fileName ? `${fileName}${lineInfo}` : ""
|
|
106
|
+
};
|
|
107
|
+
tooltipVisible.value = true;
|
|
108
|
+
const tooltipHeight = 50;
|
|
109
|
+
const tooltipWidth = 200;
|
|
110
|
+
let tooltipTop = rect.top - tooltipHeight - 8;
|
|
111
|
+
let tooltipLeft = rect.left;
|
|
112
|
+
if (tooltipTop < 10) {
|
|
113
|
+
tooltipTop = rect.bottom + 8;
|
|
114
|
+
}
|
|
115
|
+
if (tooltipLeft + tooltipWidth > window.innerWidth - 10) {
|
|
116
|
+
tooltipLeft = window.innerWidth - tooltipWidth - 10;
|
|
117
|
+
}
|
|
118
|
+
tooltipStyle.value = {
|
|
119
|
+
top: `${tooltipTop}px`,
|
|
120
|
+
left: `${tooltipLeft}px`
|
|
121
|
+
};
|
|
122
|
+
} else {
|
|
123
|
+
highlightVisible.value = false;
|
|
124
|
+
tooltipVisible.value = false;
|
|
125
|
+
}
|
|
126
|
+
}
|
|
127
|
+
function setupInspectorHook() {
|
|
128
|
+
const inspector = window.__VUE_INSPECTOR__;
|
|
129
|
+
if (!inspector || inspector.__opencode_hooked) return;
|
|
130
|
+
const originalHandleClick = inspector.handleClick.bind(inspector);
|
|
131
|
+
inspector.handleClick = function(e) {
|
|
132
|
+
var _a, _b, _c;
|
|
133
|
+
if (options.selectMode.value) {
|
|
134
|
+
const { targetNode, params } = inspector.getTargetNode(e);
|
|
135
|
+
if (targetNode && params) {
|
|
136
|
+
const innerText = getDirectText(targetNode);
|
|
137
|
+
const description = getElementDescription(targetNode);
|
|
138
|
+
const elementInfo = {
|
|
139
|
+
filePath: (_a = params.file) != null ? _a : null,
|
|
140
|
+
line: (_b = params.line) != null ? _b : null,
|
|
141
|
+
column: (_c = params.column) != null ? _c : null,
|
|
142
|
+
innerText: truncate(innerText, 200),
|
|
143
|
+
description
|
|
144
|
+
};
|
|
145
|
+
options.onAddSelectedNode(elementInfo);
|
|
146
|
+
}
|
|
147
|
+
return;
|
|
148
|
+
}
|
|
149
|
+
return originalHandleClick.call(inspector, e);
|
|
150
|
+
};
|
|
151
|
+
inspector.__opencode_hooked = true;
|
|
152
|
+
}
|
|
153
|
+
function handleKeydown(e) {
|
|
154
|
+
if (e.key === "Escape" && options.selectMode.value) {
|
|
155
|
+
e.preventDefault();
|
|
156
|
+
e.stopPropagation();
|
|
157
|
+
options.onExitSelectMode();
|
|
158
|
+
}
|
|
159
|
+
}
|
|
160
|
+
(0, import_vue.watch)(options.selectMode, (newVal) => {
|
|
161
|
+
const inspector = window.__VUE_INSPECTOR__;
|
|
162
|
+
if (newVal) {
|
|
163
|
+
if (inspector) {
|
|
164
|
+
inspector.enable();
|
|
165
|
+
}
|
|
166
|
+
document.addEventListener("mousemove", handleMouseMove);
|
|
167
|
+
document.addEventListener("keydown", handleKeydown, true);
|
|
168
|
+
} else {
|
|
169
|
+
if (inspector) {
|
|
170
|
+
inspector.disable();
|
|
171
|
+
}
|
|
172
|
+
document.removeEventListener("mousemove", handleMouseMove);
|
|
173
|
+
document.removeEventListener("keydown", handleKeydown, true);
|
|
174
|
+
highlightVisible.value = false;
|
|
175
|
+
tooltipVisible.value = false;
|
|
176
|
+
}
|
|
177
|
+
});
|
|
178
|
+
(0, import_vue.onMounted)(() => {
|
|
179
|
+
if (window.__VUE_INSPECTOR__) {
|
|
180
|
+
setupInspectorHook();
|
|
181
|
+
} else {
|
|
182
|
+
inspectorCheckTimer = window.setInterval(() => {
|
|
183
|
+
if (window.__VUE_INSPECTOR__) {
|
|
184
|
+
setupInspectorHook();
|
|
185
|
+
if (inspectorCheckTimer) {
|
|
186
|
+
window.clearInterval(inspectorCheckTimer);
|
|
187
|
+
inspectorCheckTimer = null;
|
|
188
|
+
}
|
|
189
|
+
}
|
|
190
|
+
}, INSPECTOR_CHECK_INTERVAL);
|
|
191
|
+
}
|
|
192
|
+
});
|
|
193
|
+
(0, import_vue.onUnmounted)(() => {
|
|
194
|
+
if (inspectorCheckTimer) {
|
|
195
|
+
window.clearInterval(inspectorCheckTimer);
|
|
196
|
+
}
|
|
197
|
+
document.removeEventListener("mousemove", handleMouseMove);
|
|
198
|
+
document.removeEventListener("keydown", handleKeydown, true);
|
|
199
|
+
});
|
|
200
|
+
return {
|
|
201
|
+
highlightVisible,
|
|
202
|
+
highlightStyle,
|
|
203
|
+
tooltipVisible,
|
|
204
|
+
tooltipStyle,
|
|
205
|
+
tooltipContent
|
|
206
|
+
};
|
|
207
|
+
}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { type Ref } from "vue";
|
|
2
|
+
import type { OpenCodeRemoveSelectedPayload, OpenCodeSelectedElement, OpenCodeSelectedElementItem } from "../src/types";
|
|
3
|
+
export interface UseSelectionOptions {
|
|
4
|
+
selectMode: Ref<boolean>;
|
|
5
|
+
selectedElements: Ref<OpenCodeSelectedElement[]>;
|
|
6
|
+
onToggleSelectMode: (mode: boolean) => void;
|
|
7
|
+
onRemoveSelectedNode: (payload: OpenCodeRemoveSelectedPayload) => void;
|
|
8
|
+
onClearSelectedNodes: () => void;
|
|
9
|
+
showConfirmDialog: (message: string) => Promise<boolean>;
|
|
10
|
+
}
|
|
11
|
+
export declare function useSelection(options: UseSelectionOptions): {
|
|
12
|
+
bubbleVisible: import("vue").ComputedRef<boolean>;
|
|
13
|
+
hasSelectedElements: import("vue").ComputedRef<boolean>;
|
|
14
|
+
selectedElementItems: import("vue").ComputedRef<OpenCodeSelectedElementItem[]>;
|
|
15
|
+
handleClearSelectedNodes: () => Promise<void>;
|
|
16
|
+
handleClickSelectedNode: (item: OpenCodeSelectedElementItem) => void;
|
|
17
|
+
handleRemoveSelectedNode: (item: OpenCodeSelectedElementItem, index: number, source: OpenCodeRemoveSelectedPayload["source"]) => void;
|
|
18
|
+
handleToggleSelectMode: () => void;
|
|
19
|
+
};
|
|
@@ -0,0 +1,161 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
4
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
5
|
+
var __export = (target, all) => {
|
|
6
|
+
for (var name in all)
|
|
7
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
8
|
+
};
|
|
9
|
+
var __copyProps = (to, from, except, desc) => {
|
|
10
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
11
|
+
for (let key of __getOwnPropNames(from))
|
|
12
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
13
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
14
|
+
}
|
|
15
|
+
return to;
|
|
16
|
+
};
|
|
17
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
18
|
+
var __async = (__this, __arguments, generator) => {
|
|
19
|
+
return new Promise((resolve, reject) => {
|
|
20
|
+
var fulfilled = (value) => {
|
|
21
|
+
try {
|
|
22
|
+
step(generator.next(value));
|
|
23
|
+
} catch (e) {
|
|
24
|
+
reject(e);
|
|
25
|
+
}
|
|
26
|
+
};
|
|
27
|
+
var rejected = (value) => {
|
|
28
|
+
try {
|
|
29
|
+
step(generator.throw(value));
|
|
30
|
+
} catch (e) {
|
|
31
|
+
reject(e);
|
|
32
|
+
}
|
|
33
|
+
};
|
|
34
|
+
var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
|
|
35
|
+
step((generator = generator.apply(__this, __arguments)).next());
|
|
36
|
+
});
|
|
37
|
+
};
|
|
38
|
+
var use_selection_exports = {};
|
|
39
|
+
__export(use_selection_exports, {
|
|
40
|
+
useSelection: () => useSelection
|
|
41
|
+
});
|
|
42
|
+
module.exports = __toCommonJS(use_selection_exports);
|
|
43
|
+
var import_vue = require("vue");
|
|
44
|
+
function truncate(value, maxLength) {
|
|
45
|
+
if (value.length <= maxLength) {
|
|
46
|
+
return value;
|
|
47
|
+
}
|
|
48
|
+
return `${value.slice(0, maxLength)}...`;
|
|
49
|
+
}
|
|
50
|
+
function getElementKey(element, index) {
|
|
51
|
+
var _a;
|
|
52
|
+
if (element.filePath && element.line) {
|
|
53
|
+
return `${element.filePath}:${element.line}:${(_a = element.column) != null ? _a : 0}`;
|
|
54
|
+
}
|
|
55
|
+
return `${element.description}-${index}`;
|
|
56
|
+
}
|
|
57
|
+
function getBubbleFileText(element) {
|
|
58
|
+
var _a;
|
|
59
|
+
const fileName = ((_a = element.filePath) == null ? void 0 : _a.split("/").pop()) || "";
|
|
60
|
+
const lineInfo = element.line ? `:${element.line}${element.column ? `:${element.column}` : ""}` : "";
|
|
61
|
+
return `${fileName}${lineInfo}`;
|
|
62
|
+
}
|
|
63
|
+
function getPanelFileText(element) {
|
|
64
|
+
var _a, _b;
|
|
65
|
+
const fileName = ((_a = element.filePath) == null ? void 0 : _a.split("/").pop()) || "\u672A\u77E5\u6587\u4EF6";
|
|
66
|
+
const lineInfo = element.line ? `:${element.line}${element.column ? `:${element.column}` : ""}` : "";
|
|
67
|
+
const textPreview = ((_b = element.innerText) == null ? void 0 : _b.trim()) ? `${truncate(element.innerText.trim(), 30)} \xB7 ` : "";
|
|
68
|
+
return `${textPreview}${fileName}${lineInfo}`;
|
|
69
|
+
}
|
|
70
|
+
function useSelection(options) {
|
|
71
|
+
const bubbleVisible = (0, import_vue.computed)(() => options.selectMode.value);
|
|
72
|
+
const selectedElementItems = (0, import_vue.computed)(
|
|
73
|
+
() => (options.selectedElements.value || []).map(
|
|
74
|
+
(element, index) => ({
|
|
75
|
+
key: getElementKey(element, index),
|
|
76
|
+
description: element.description || "\u672A\u77E5\u5143\u7D20",
|
|
77
|
+
bubbleFileText: getBubbleFileText(element),
|
|
78
|
+
panelFileText: getPanelFileText(element),
|
|
79
|
+
element
|
|
80
|
+
})
|
|
81
|
+
)
|
|
82
|
+
);
|
|
83
|
+
const hasSelectedElements = (0, import_vue.computed)(() => selectedElementItems.value.length > 0);
|
|
84
|
+
function handleToggleSelectMode() {
|
|
85
|
+
options.onToggleSelectMode(!options.selectMode.value);
|
|
86
|
+
}
|
|
87
|
+
function handleClickSelectedNode(item) {
|
|
88
|
+
const description = item.element.description;
|
|
89
|
+
if (!description) return;
|
|
90
|
+
let targetElement = null;
|
|
91
|
+
if (description.includes("#")) {
|
|
92
|
+
const idMatch = description.match(/#([^.[\s]+)/);
|
|
93
|
+
if (idMatch) {
|
|
94
|
+
targetElement = document.getElementById(idMatch[1]);
|
|
95
|
+
}
|
|
96
|
+
}
|
|
97
|
+
if (!targetElement && description.includes(".")) {
|
|
98
|
+
const classMatch = description.match(/^([a-z]+)\.([^[\s]+)/i);
|
|
99
|
+
if (classMatch) {
|
|
100
|
+
const tagName = classMatch[1];
|
|
101
|
+
const classes = classMatch[2].split(".").filter(Boolean);
|
|
102
|
+
const selector = `${tagName}.${classes.join(".")}`;
|
|
103
|
+
targetElement = document.querySelector(selector);
|
|
104
|
+
}
|
|
105
|
+
}
|
|
106
|
+
if (!targetElement) {
|
|
107
|
+
const tagMatch = description.match(/^([a-z]+)/i);
|
|
108
|
+
if (tagMatch) {
|
|
109
|
+
const simpleSelector = description.split(/[.[\s]/)[0];
|
|
110
|
+
targetElement = document.querySelector(simpleSelector);
|
|
111
|
+
}
|
|
112
|
+
}
|
|
113
|
+
if (targetElement) {
|
|
114
|
+
targetElement.scrollIntoView({ behavior: "smooth", block: "center" });
|
|
115
|
+
const highlightOverlay = document.createElement("div");
|
|
116
|
+
highlightOverlay.className = "opencode-element-highlight-temp";
|
|
117
|
+
const widget = document.querySelector(".opencode-widget");
|
|
118
|
+
let primary = "#3b82f6";
|
|
119
|
+
let primaryBg = "rgba(59, 130, 246, 0.1)";
|
|
120
|
+
if (widget) {
|
|
121
|
+
const style = getComputedStyle(widget);
|
|
122
|
+
primary = style.getPropertyValue("--oc-primary").trim() || primary;
|
|
123
|
+
primaryBg = style.getPropertyValue("--oc-primary-bg").trim() || primaryBg;
|
|
124
|
+
}
|
|
125
|
+
highlightOverlay.style.border = `2px solid ${primary}`;
|
|
126
|
+
highlightOverlay.style.background = primaryBg;
|
|
127
|
+
const rect = targetElement.getBoundingClientRect();
|
|
128
|
+
highlightOverlay.style.top = `${rect.top + window.scrollY}px`;
|
|
129
|
+
highlightOverlay.style.left = `${rect.left + window.scrollX}px`;
|
|
130
|
+
highlightOverlay.style.width = `${rect.width}px`;
|
|
131
|
+
highlightOverlay.style.height = `${rect.height}px`;
|
|
132
|
+
document.body.appendChild(highlightOverlay);
|
|
133
|
+
setTimeout(() => {
|
|
134
|
+
highlightOverlay.remove();
|
|
135
|
+
}, 2e3);
|
|
136
|
+
}
|
|
137
|
+
}
|
|
138
|
+
function handleRemoveSelectedNode(item, index, source) {
|
|
139
|
+
options.onRemoveSelectedNode({ element: item.element, index, source });
|
|
140
|
+
}
|
|
141
|
+
function handleClearSelectedNodes() {
|
|
142
|
+
return __async(this, null, function* () {
|
|
143
|
+
if (!options.selectedElements.value || options.selectedElements.value.length === 0) return;
|
|
144
|
+
const confirmed = yield options.showConfirmDialog(
|
|
145
|
+
`\u786E\u5B9A\u8981\u6E05\u7A7A\u6240\u6709 ${options.selectedElements.value.length} \u4E2A\u5DF2\u9009\u8282\u70B9\u5417\uFF1F`
|
|
146
|
+
);
|
|
147
|
+
if (confirmed) {
|
|
148
|
+
options.onClearSelectedNodes();
|
|
149
|
+
}
|
|
150
|
+
});
|
|
151
|
+
}
|
|
152
|
+
return {
|
|
153
|
+
bubbleVisible,
|
|
154
|
+
hasSelectedElements,
|
|
155
|
+
selectedElementItems,
|
|
156
|
+
handleClearSelectedNodes,
|
|
157
|
+
handleClickSelectedNode,
|
|
158
|
+
handleRemoveSelectedNode,
|
|
159
|
+
handleToggleSelectMode
|
|
160
|
+
};
|
|
161
|
+
}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { type Ref } from "vue";
|
|
2
|
+
import type { OpenCodeWidgetSession, OpenCodeWidgetSessionItem } from "../src/types";
|
|
3
|
+
export interface UseSessionOptions {
|
|
4
|
+
sessions: Ref<OpenCodeWidgetSession[]>;
|
|
5
|
+
currentSessionId: Ref<string | number | null>;
|
|
6
|
+
onCreateSession: () => void;
|
|
7
|
+
onSelectSession: (session: OpenCodeWidgetSession) => void;
|
|
8
|
+
onDeleteSession: (session: OpenCodeWidgetSession) => void;
|
|
9
|
+
showConfirmDialog: (message: string) => Promise<boolean>;
|
|
10
|
+
}
|
|
11
|
+
export declare function useSession(options: UseSessionOptions): {
|
|
12
|
+
sessionItems: import("vue").ComputedRef<OpenCodeWidgetSessionItem[]>;
|
|
13
|
+
handleCreateSession: () => void;
|
|
14
|
+
handleDeleteSession: (item: OpenCodeWidgetSessionItem) => Promise<void>;
|
|
15
|
+
handleSelectSession: (item: OpenCodeWidgetSessionItem) => void;
|
|
16
|
+
};
|
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
4
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
5
|
+
var __export = (target, all) => {
|
|
6
|
+
for (var name in all)
|
|
7
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
8
|
+
};
|
|
9
|
+
var __copyProps = (to, from, except, desc) => {
|
|
10
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
11
|
+
for (let key of __getOwnPropNames(from))
|
|
12
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
13
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
14
|
+
}
|
|
15
|
+
return to;
|
|
16
|
+
};
|
|
17
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
18
|
+
var __async = (__this, __arguments, generator) => {
|
|
19
|
+
return new Promise((resolve, reject) => {
|
|
20
|
+
var fulfilled = (value) => {
|
|
21
|
+
try {
|
|
22
|
+
step(generator.next(value));
|
|
23
|
+
} catch (e) {
|
|
24
|
+
reject(e);
|
|
25
|
+
}
|
|
26
|
+
};
|
|
27
|
+
var rejected = (value) => {
|
|
28
|
+
try {
|
|
29
|
+
step(generator.throw(value));
|
|
30
|
+
} catch (e) {
|
|
31
|
+
reject(e);
|
|
32
|
+
}
|
|
33
|
+
};
|
|
34
|
+
var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
|
|
35
|
+
step((generator = generator.apply(__this, __arguments)).next());
|
|
36
|
+
});
|
|
37
|
+
};
|
|
38
|
+
var use_session_exports = {};
|
|
39
|
+
__export(use_session_exports, {
|
|
40
|
+
useSession: () => useSession
|
|
41
|
+
});
|
|
42
|
+
module.exports = __toCommonJS(use_session_exports);
|
|
43
|
+
var import_vue = require("vue");
|
|
44
|
+
function formatSessionMeta(session) {
|
|
45
|
+
if (session.meta) {
|
|
46
|
+
return session.meta;
|
|
47
|
+
}
|
|
48
|
+
if (!session.updatedAt) {
|
|
49
|
+
return "";
|
|
50
|
+
}
|
|
51
|
+
const date = new Date(session.updatedAt);
|
|
52
|
+
if (Number.isNaN(date.getTime())) {
|
|
53
|
+
return "";
|
|
54
|
+
}
|
|
55
|
+
return `${date.toLocaleDateString()} ${date.toLocaleTimeString()}`;
|
|
56
|
+
}
|
|
57
|
+
function useSession(options) {
|
|
58
|
+
const sessionItems = (0, import_vue.computed)(
|
|
59
|
+
() => (options.sessions.value || []).map((session) => ({
|
|
60
|
+
key: session.id,
|
|
61
|
+
title: session.title || "\u65B0\u4F1A\u8BDD",
|
|
62
|
+
meta: formatSessionMeta(session),
|
|
63
|
+
active: session.id === options.currentSessionId.value,
|
|
64
|
+
session
|
|
65
|
+
}))
|
|
66
|
+
);
|
|
67
|
+
function handleCreateSession() {
|
|
68
|
+
options.onCreateSession();
|
|
69
|
+
}
|
|
70
|
+
function handleSelectSession(item) {
|
|
71
|
+
options.onSelectSession(item.session);
|
|
72
|
+
}
|
|
73
|
+
function handleDeleteSession(item) {
|
|
74
|
+
return __async(this, null, function* () {
|
|
75
|
+
const confirmed = yield options.showConfirmDialog(`\u786E\u5B9A\u8981\u5220\u9664\u4F1A\u8BDD "${item.title}" \u5417\uFF1F`);
|
|
76
|
+
if (confirmed) {
|
|
77
|
+
options.onDeleteSession(item.session);
|
|
78
|
+
}
|
|
79
|
+
});
|
|
80
|
+
}
|
|
81
|
+
return {
|
|
82
|
+
sessionItems,
|
|
83
|
+
handleCreateSession,
|
|
84
|
+
handleDeleteSession,
|
|
85
|
+
handleSelectSession
|
|
86
|
+
};
|
|
87
|
+
}
|