@gnai/message-content-renderer 0.1.5 → 0.1.7

package/dist/default-avatar.svg

@@ -0,0 +1,10 @@
+<svg width="96" height="96" viewBox="0 0 96 96" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <circle cx="48" cy="48" r="48" fill="#E6E8ED" />
+  <circle cx="48" cy="36" r="16" fill="#B7BBC6" />
+  <path
+    d="M24 76c4.5-14 16.5-22 24-22s19.5 8 24 22"
+    stroke="#B7BBC6"
+    stroke-width="8"
+    stroke-linecap="round"
+  />
+</svg>

package/dist/index.d.ts

@@ -6,6 +6,8 @@ import { PublicProps } from 'vue';
 declare type __VLS_Props = {
     content: MessageContent | UserMessageContent | string;
     role?: 'user' | 'assistant';
+    showActions?: boolean;
+    allowRegenerate?: boolean;
 };
 
 declare type __VLS_Props_2 = {
@@ -25,7 +27,15 @@ export declare interface MessageContent {
     content: string;
 }
 
-export declare const MessageContentRenderer: DefineComponent<__VLS_Props, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+export declare const MessageContentRenderer: DefineComponent<__VLS_Props, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+copy: () => any;
+regenerate: () => any;
+delete: () => any;
+}, string, PublicProps, Readonly<__VLS_Props> & Readonly<{
+onCopy?: (() => any) | undefined;
+onRegenerate?: (() => any) | undefined;
+onDelete?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
 
 export declare interface UserMessageContent {
     texts: string[] | null;

package/dist/message-content-renderer.css

@@ -1 +1 @@
-.vjs-tree-brackets{cursor:pointer}.vjs-tree-brackets:hover{color:#1890ff}.vjs-check-controller{position:absolute;left:0}.vjs-check-controller.is-checked .vjs-check-controller-inner{background-color:#1890ff;border-color:#0076e4}.vjs-check-controller.is-checked .vjs-check-controller-inner.is-checkbox:after{transform:rotate(45deg) scaleY(1)}.vjs-check-controller.is-checked .vjs-check-controller-inner.is-radio:after{transform:translate(-50%,-50%) scale(1)}.vjs-check-controller .vjs-check-controller-inner{display:inline-block;position:relative;border:1px solid #bfcbd9;border-radius:2px;vertical-align:middle;box-sizing:border-box;width:16px;height:16px;background-color:#fff;z-index:1;cursor:pointer;transition:border-color .25s cubic-bezier(.71,-.46,.29,1.46),background-color .25s cubic-bezier(.71,-.46,.29,1.46)}.vjs-check-controller .vjs-check-controller-inner:after{box-sizing:content-box;content:"";border:2px solid #fff;border-left:0;border-top:0;height:8px;left:4px;position:absolute;top:1px;transform:rotate(45deg) scaleY(0);width:4px;transition:transform .15s cubic-bezier(.71,-.46,.88,.6) .05s;transform-origin:center}.vjs-check-controller .vjs-check-controller-inner.is-radio{border-radius:100%}.vjs-check-controller .vjs-check-controller-inner.is-radio:after{border-radius:100%;height:4px;background-color:#fff;left:50%;top:50%}.vjs-check-controller .vjs-check-controller-original{opacity:0;outline:none;position:absolute;z-index:-1;inset:0;margin:0}.vjs-carets{position:absolute;right:0;cursor:pointer}.vjs-carets svg{transition:transform .3s}.vjs-carets:hover{color:#1890ff}.vjs-carets-close{transform:rotate(-90deg)}.vjs-tree-node{display:flex;position:relative;line-height:20px}.vjs-tree-node.has-carets{padding-left:15px}.vjs-tree-node.has-carets.has-selector,.vjs-tree-node.has-selector{padding-left:30px}.vjs-tree-node.is-highlight,.vjs-tree-node:hover{background-color:#e6f7ff;border-radius:4px}.vjs-tree-node.is-highlight .vjs-tree-node-actions,.vjs-tree-node:hover .vjs-tree-node-actions{display:block}.vjs-tree-node .vjs-indent{display:flex;position:relative}.vjs-tree-node .vjs-indent-unit.has-line{border-left:1px dashed #bfcbd9}.vjs-tree-node .vjs-tree-node-actions{display:none;position:absolute;right:0;top:0;padding:0 4px;background-color:#e6f7ff;border-radius:4px}.vjs-tree-node .vjs-tree-node-actions .vjs-tree-node-actions-item{cursor:pointer}.vjs-tree-node .vjs-tree-node-actions .vjs-tree-node-actions-item:hover{color:#1890ff}.vjs-tree-node.dark.is-highlight,.vjs-tree-node.dark .vjs-tree-node-actions,.vjs-tree-node.dark:hover{background-color:#2e4558}.vjs-node-index{position:absolute;right:100%;margin-right:4px;-webkit-user-select:none;user-select:none}.vjs-colon{white-space:pre}.vjs-comment{color:#bfcbd9}.vjs-value{word-break:break-word}.vjs-value-null,.vjs-value-undefined{color:#d55fde}.vjs-value-boolean,.vjs-value-number{color:#1d8ce0}.vjs-value-string{color:#13ce66}.vjs-tree{font-family:Monaco,Menlo,Consolas,Bitstream Vera Sans Mono,monospace;font-size:14px;text-align:left}.vjs-tree.is-virtual{overflow:auto}.vjs-tree.is-virtual .vjs-tree-node{white-space:nowrap}.image-viewer[data-v-92c159ee]{position:fixed;inset:0;background:#000000e6;display:flex;align-items:center;justify-content:center;z-index:2000;padding:32px;cursor:zoom-out}.close-button[data-v-92c159ee]{position:fixed;top:24px;right:24px;width:48px;height:48px;display:flex;align-items:center;justify-content:center;color:#fff;background:#00000080;border-radius:50%;cursor:pointer;transition:all .15s cubic-bezier(.4,0,.2,1);z-index:2001}.close-button[data-v-92c159ee]:hover{background:#000c;transform:scale(1.1)}.close-button svg[data-v-92c159ee]{width:24px;height:24px}.viewer-content[data-v-92c159ee]{max-width:90%;max-height:90%;display:flex;align-items:center;justify-content:center;cursor:default}.viewer-content img[data-v-92c159ee]{max-width:100%;max-height:90vh;object-fit:contain;border-radius:10px;box-shadow:0 8px 32px #00000080}.viewer-enter-active[data-v-92c159ee],.viewer-leave-active[data-v-92c159ee]{transition:opacity .2s cubic-bezier(.4,0,.2,1)}.viewer-enter-from[data-v-92c159ee],.viewer-leave-to[data-v-92c159ee]{opacity:0}@media(max-width:768px){.image-viewer[data-v-92c159ee]{padding:16px}.close-button[data-v-92c159ee]{top:16px;right:16px;width:40px;height:40px}.close-button svg[data-v-92c159ee]{width:20px;height:20px}.viewer-content img[data-v-92c159ee]{border-radius:6px}}.content-text[data-v-a6c720b9]{font-size:15px;line-height:1.6;color:#1d1d1f;background:#fff;border-radius:10px;padding:10px 14px;display:inline-block;max-width:100%}.content-text[data-v-a6c720b9] p{margin:0 0 8px;white-space:pre-wrap;word-wrap:break-word}.content-text[data-v-a6c720b9] p:last-child{margin-bottom:0}.content-text[data-v-a6c720b9] code{background:#fff;padding:2px 6px;border-radius:4px;font-family:Courier New,monospace;font-size:14px}.content-text[data-v-a6c720b9] pre{background:#fff;padding:16px;border-radius:10px;overflow-x:auto;margin:8px 0}.content-text[data-v-a6c720b9] pre code{background:none;padding:0}.content-text[data-v-a6c720b9] a{color:#007aff;text-decoration:none}.content-text[data-v-a6c720b9] a:hover{text-decoration:underline}.content-text[data-v-a6c720b9] ul,.content-text[data-v-a6c720b9] ol{margin:8px 0;padding-left:32px}.content-text[data-v-a6c720b9] blockquote{border-left:4px solid #d2d2d7;padding-left:16px;margin:8px 0;color:#6e6e73}.content-text.role-user[data-v-a6c720b9]{background:#007aff;color:#fff}.content-text.role-user[data-v-a6c720b9] a{color:#fff}.content-file[data-v-24190b61]{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;background:#fff;border:1px solid #d2d2d7;border-radius:10px;cursor:pointer;transition:all .15s cubic-bezier(.4,0,.2,1)}.content-file[data-v-24190b61]:hover{background:#f5f5f7;border-color:#007aff}.content-file .file-icon[data-v-24190b61]{width:20px;height:20px;color:#6e6e73}.content-file .file-name[data-v-24190b61]{font-size:14px;color:#1d1d1f;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.content-file .download-icon[data-v-24190b61]{width:16px;height:16px;color:#007aff}@media(max-width:768px){.content-file .file-name[data-v-24190b61]{max-width:150px}}.message-image[data-v-24952cda]{display:block;max-width:300px;width:auto;height:220px;border-radius:10px;object-fit:cover;cursor:pointer;transition:transform .2s cubic-bezier(.4,0,.2,1)}.message-image[data-v-24952cda]:hover{transform:scale(1.02)}.message-image.is-full-width[data-v-24952cda]{width:100%;max-width:100%}@media(max-width:768px){.message-image[data-v-24952cda]{max-width:200px;height:180px}}.message-video[data-v-be6bb72d]{display:block;max-width:100%;max-height:220px;border-radius:10px}.message-video.is-full-width[data-v-be6bb72d]{width:100%}@media(max-width:768px){.message-video[data-v-be6bb72d]{max-height:180px}}.message-audio[data-v-c0d42074]{max-width:100%;height:40px}.message-content-renderer[data-v-c620f628]{display:inline-flex;max-width:100%}.content-user-message[data-v-c620f628]{display:flex;flex-direction:column;gap:16px;align-items:flex-start}.files-grid[data-v-c620f628]{display:inline-flex;flex-direction:column;align-items:flex-start;gap:8px}.role-user .content-user-message[data-v-c620f628],.role-user .files-grid[data-v-c620f628]{align-items:flex-end}.content-medialib .json-viewer[data-v-c620f628]{background:#fff;padding:16px;border-radius:10px;font-size:13px;max-height:400px;overflow:auto}
+.vjs-tree-brackets{cursor:pointer}.vjs-tree-brackets:hover{color:#1890ff}.vjs-check-controller{position:absolute;left:0}.vjs-check-controller.is-checked .vjs-check-controller-inner{background-color:#1890ff;border-color:#0076e4}.vjs-check-controller.is-checked .vjs-check-controller-inner.is-checkbox:after{transform:rotate(45deg) scaleY(1)}.vjs-check-controller.is-checked .vjs-check-controller-inner.is-radio:after{transform:translate(-50%,-50%) scale(1)}.vjs-check-controller .vjs-check-controller-inner{display:inline-block;position:relative;border:1px solid #bfcbd9;border-radius:2px;vertical-align:middle;box-sizing:border-box;width:16px;height:16px;background-color:#fff;z-index:1;cursor:pointer;transition:border-color .25s cubic-bezier(.71,-.46,.29,1.46),background-color .25s cubic-bezier(.71,-.46,.29,1.46)}.vjs-check-controller .vjs-check-controller-inner:after{box-sizing:content-box;content:"";border:2px solid #fff;border-left:0;border-top:0;height:8px;left:4px;position:absolute;top:1px;transform:rotate(45deg) scaleY(0);width:4px;transition:transform .15s cubic-bezier(.71,-.46,.88,.6) .05s;transform-origin:center}.vjs-check-controller .vjs-check-controller-inner.is-radio{border-radius:100%}.vjs-check-controller .vjs-check-controller-inner.is-radio:after{border-radius:100%;height:4px;background-color:#fff;left:50%;top:50%}.vjs-check-controller .vjs-check-controller-original{opacity:0;outline:none;position:absolute;z-index:-1;inset:0;margin:0}.vjs-carets{position:absolute;right:0;cursor:pointer}.vjs-carets svg{transition:transform .3s}.vjs-carets:hover{color:#1890ff}.vjs-carets-close{transform:rotate(-90deg)}.vjs-tree-node{display:flex;position:relative;line-height:20px}.vjs-tree-node.has-carets{padding-left:15px}.vjs-tree-node.has-carets.has-selector,.vjs-tree-node.has-selector{padding-left:30px}.vjs-tree-node.is-highlight,.vjs-tree-node:hover{background-color:#e6f7ff;border-radius:4px}.vjs-tree-node.is-highlight .vjs-tree-node-actions,.vjs-tree-node:hover .vjs-tree-node-actions{display:block}.vjs-tree-node .vjs-indent{display:flex;position:relative}.vjs-tree-node .vjs-indent-unit.has-line{border-left:1px dashed #bfcbd9}.vjs-tree-node .vjs-tree-node-actions{display:none;position:absolute;right:0;top:0;padding:0 4px;background-color:#e6f7ff;border-radius:4px}.vjs-tree-node .vjs-tree-node-actions .vjs-tree-node-actions-item{cursor:pointer}.vjs-tree-node .vjs-tree-node-actions .vjs-tree-node-actions-item:hover{color:#1890ff}.vjs-tree-node.dark.is-highlight,.vjs-tree-node.dark .vjs-tree-node-actions,.vjs-tree-node.dark:hover{background-color:#2e4558}.vjs-node-index{position:absolute;right:100%;margin-right:4px;-webkit-user-select:none;user-select:none}.vjs-colon{white-space:pre}.vjs-comment{color:#bfcbd9}.vjs-value{word-break:break-word}.vjs-value-null,.vjs-value-undefined{color:#d55fde}.vjs-value-boolean,.vjs-value-number{color:#1d8ce0}.vjs-value-string{color:#13ce66}.vjs-tree{font-family:Monaco,Menlo,Consolas,Bitstream Vera Sans Mono,monospace;font-size:14px;text-align:left}.vjs-tree.is-virtual{overflow:auto}.vjs-tree.is-virtual .vjs-tree-node{white-space:nowrap}.image-viewer[data-v-92c159ee]{position:fixed;inset:0;background:#000000e6;display:flex;align-items:center;justify-content:center;z-index:2000;padding:32px;cursor:zoom-out}.close-button[data-v-92c159ee]{position:fixed;top:24px;right:24px;width:48px;height:48px;display:flex;align-items:center;justify-content:center;color:#fff;background:#00000080;border-radius:50%;cursor:pointer;transition:all .15s cubic-bezier(.4,0,.2,1);z-index:2001}.close-button[data-v-92c159ee]:hover{background:#000c;transform:scale(1.1)}.close-button svg[data-v-92c159ee]{width:24px;height:24px}.viewer-content[data-v-92c159ee]{max-width:90%;max-height:90%;display:flex;align-items:center;justify-content:center;cursor:default}.viewer-content img[data-v-92c159ee]{max-width:100%;max-height:90vh;object-fit:contain;border-radius:10px;box-shadow:0 8px 32px #00000080}.viewer-enter-active[data-v-92c159ee],.viewer-leave-active[data-v-92c159ee]{transition:opacity .2s cubic-bezier(.4,0,.2,1)}.viewer-enter-from[data-v-92c159ee],.viewer-leave-to[data-v-92c159ee]{opacity:0}@media(max-width:768px){.image-viewer[data-v-92c159ee]{padding:16px}.close-button[data-v-92c159ee]{top:16px;right:16px;width:40px;height:40px}.close-button svg[data-v-92c159ee]{width:20px;height:20px}.viewer-content img[data-v-92c159ee]{border-radius:6px}}.content-text[data-v-d4935523]{font-size:15px;line-height:1.6;color:#1d1d1f;background:#fff;border-radius:10px;padding:10px 14px;display:inline-block;max-width:100%;word-break:break-all}.content-text.is-plain[data-v-d4935523]{white-space:pre-wrap;word-wrap:break-word}.content-text[data-v-d4935523] p{margin:0 0 8px;white-space:pre-wrap;word-wrap:break-word}.content-text[data-v-d4935523] p:last-child{margin-bottom:0}.content-text[data-v-d4935523] code{background:#fff;padding:2px 6px;border-radius:4px;font-family:Courier New,monospace;font-size:14px;color:#000}.content-text[data-v-d4935523] pre{background:#fff;padding:16px;border-radius:10px;overflow-x:auto;margin:8px 0}.content-text[data-v-d4935523] pre code{background:none;padding:0;color:#000}.content-text[data-v-d4935523] a{color:#007aff;text-decoration:none}.content-text[data-v-d4935523] a:hover{text-decoration:underline}.content-text[data-v-d4935523] ul,.content-text[data-v-d4935523] ol{margin:8px 0;padding-left:32px}.content-text[data-v-d4935523] blockquote{border-left:4px solid #d2d2d7;padding-left:16px;margin:8px 0;color:#6e6e73}.content-text.role-user[data-v-d4935523]{background:#007aff;color:#fff}.content-text.role-user[data-v-d4935523] a{color:#fff}.content-text.role-user[data-v-d4935523] code,.content-text.role-user[data-v-d4935523] pre{background:#2f4f4f}.content-file[data-v-24190b61]{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;background:#fff;border:1px solid #d2d2d7;border-radius:10px;cursor:pointer;transition:all .15s cubic-bezier(.4,0,.2,1)}.content-file[data-v-24190b61]:hover{background:#f5f5f7;border-color:#007aff}.content-file .file-icon[data-v-24190b61]{width:20px;height:20px;color:#6e6e73}.content-file .file-name[data-v-24190b61]{font-size:14px;color:#1d1d1f;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.content-file .download-icon[data-v-24190b61]{width:16px;height:16px;color:#007aff}@media(max-width:768px){.content-file .file-name[data-v-24190b61]{max-width:150px}}.message-image[data-v-24952cda]{display:block;max-width:300px;width:auto;height:220px;border-radius:10px;object-fit:cover;cursor:pointer;transition:transform .2s cubic-bezier(.4,0,.2,1)}.message-image[data-v-24952cda]:hover{transform:scale(1.02)}.message-image.is-full-width[data-v-24952cda]{width:100%;max-width:100%}@media(max-width:768px){.message-image[data-v-24952cda]{max-width:200px;height:180px}}.message-video[data-v-be6bb72d]{display:block;max-width:100%;max-height:220px;border-radius:10px}.message-video.is-full-width[data-v-be6bb72d]{width:100%}@media(max-width:768px){.message-video[data-v-be6bb72d]{max-height:180px}}.message-audio[data-v-c0d42074]{max-width:100%;height:40px}.message-content-renderer[data-v-02192e04]{display:inline-flex;max-width:100%;position:relative}.renderer-actions[data-v-02192e04]{position:absolute;top:-30px;display:inline-flex;gap:4px;padding:4px 6px;border-radius:var(--radius-md);border:1px solid var(--color-border-light);background:var(--color-bg-secondary);box-shadow:var(--shadow-sm);opacity:0;pointer-events:none;transition:opacity var(--transition-fast),transform var(--transition-fast);transform:translateY(-4px);word-break:keep-all}.renderer-actions.actions-user[data-v-02192e04]{right:0}.renderer-actions.actions-assistant[data-v-02192e04]{left:0}.renderer-action-btn[data-v-02192e04]{display:inline-flex;align-items:center;gap:4px;padding:4px 8px;font-size:12px;color:var(--color-text-secondary);border-radius:var(--radius-sm);transition:background var(--transition-fast),color var(--transition-fast)}.renderer-action-btn[data-v-02192e04]:hover{background:var(--color-bg);color:var(--color-text-primary)}.renderer-action-btn.danger[data-v-02192e04]:hover{color:var(--color-error)}.renderer-action-btn svg[data-v-02192e04]{width:14px;height:14px}.content-user-message[data-v-02192e04]{display:flex;flex-direction:column;gap:16px;align-items:flex-start}.files-grid[data-v-02192e04]{display:inline-flex;flex-direction:column;align-items:flex-start;gap:8px}.role-user .content-user-message[data-v-02192e04],.role-user .files-grid[data-v-02192e04]{align-items:flex-end}.content-medialib .json-viewer[data-v-02192e04]{background:#fff;padding:16px;border-radius:10px;font-size:13px;max-height:400px;overflow:auto}@media(max-width:768px){.renderer-actions[data-v-02192e04]{display:none}}