@mulmochat-plugin/ui-image 0.3.0 → 0.4.0
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/README.md +2 -1
- package/dist/index.cjs +1 -1
- package/dist/index.js +31 -50
- package/package.json +15 -14
package/README.md
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
[](https://badge.fury.io/js/%40mulmochat-plugin%2Fui-image)
|
|
1
2
|
# @mulmochat-plugin/ui-image
|
|
2
3
|
|
|
3
4
|
Shared image UI components for MulmoChat plugins.
|
|
@@ -47,4 +48,4 @@ interface ImageToolData {
|
|
|
47
48
|
imageData: string; // Base64 encoded image data URL
|
|
48
49
|
prompt?: string; // Optional prompt used to generate the image
|
|
49
50
|
}
|
|
50
|
-
```
|
|
51
|
+
```
|
package/dist/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require(`vue`);var t={class:`w-full h-full overflow-y-auto`},n={class:`min-h-full flex flex-col items-center justify-center p-4`},r={class:`flex-1 flex items-center justify-center min-h-0`},i=[`src`],a={key:0,class:`mt-4 p-3 bg-gray-100 dark:bg-gray-800 rounded-lg max-w-full flex-shrink-0`},o={class:`text-sm text-gray-700 dark:text-gray-300`},s=(0,e.defineComponent)({__name:`ImageView`,props:{selectedResult:{}},setup(s){return(c,l)=>((0,e.openBlock)(),(0,e.createElementBlock)(`div`,t,[(0,e.createElementVNode)(`div`,n,[(0,e.createElementVNode)(`div`,r,[(0,e.createElementVNode)(`img`,{src:s.selectedResult.data?.imageData,class:`max-w-full max-h-full object-contain rounded`,alt:`Current generated image`},null,8,i)]),s.selectedResult.data?.prompt?((0,e.openBlock)(),(0,e.createElementBlock)(`div`,a,[(0,e.createElementVNode)(`p`,o,[l[0]||=(0,e.createElementVNode)(`span`,{class:`font-medium`},`Prompt:`,-1),(0,e.createTextVNode)(` `+(0,e.toDisplayString)(s.selectedResult.data.prompt),1)])])):(0,e.createCommentVNode)(``,!0)])]))}}),c={class:`min-h-24 flex items-center justify-center`},l=[`src`],u={key:1,class:`text-gray-400 text-sm`},d=(0,e.defineComponent)({__name:`ImagePreview`,props:{result:{}},setup(t){return(n,r)=>((0,e.openBlock)(),(0,e.createElementBlock)(`div`,c,[t.result.data?.imageData?((0,e.openBlock)(),(0,e.createElementBlock)(`img`,{key:0,src:t.result.data.imageData,class:`max-w-full h-auto rounded`,alt:`Generated image`},null,8,l)):((0,e.openBlock)(),(0,e.createElementBlock)(`div`,u,`No image yet`))]))}});exports.ImagePreview=d,exports.ImageView=s;
|
package/dist/index.js
CHANGED
|
@@ -1,51 +1,32 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
}
|
|
30
|
-
key: 1,
|
|
31
|
-
class: "text-gray-400 text-sm"
|
|
32
|
-
}, w = /* @__PURE__ */ r({
|
|
33
|
-
__name: "ImagePreview",
|
|
34
|
-
props: {
|
|
35
|
-
result: {}
|
|
36
|
-
},
|
|
37
|
-
setup(e) {
|
|
38
|
-
return (n, l) => (a(), s("div", x, [
|
|
39
|
-
e.result.data?.imageData ? (a(), s("img", {
|
|
40
|
-
key: 0,
|
|
41
|
-
src: e.result.data.imageData,
|
|
42
|
-
class: "max-w-full h-auto rounded",
|
|
43
|
-
alt: "Generated image"
|
|
44
|
-
}, null, 8, h)) : (a(), s("div", p, "No image yet"))
|
|
45
|
-
]));
|
|
46
|
-
}
|
|
1
|
+
import { createCommentVNode as e, createElementBlock as t, createElementVNode as n, createTextVNode as r, defineComponent as i, openBlock as a, toDisplayString as o } from "vue";
|
|
2
|
+
//#region src/ImageView.vue?vue&type=script&setup=true&lang.ts
|
|
3
|
+
var s = { class: "w-full h-full overflow-y-auto" }, c = { class: "min-h-full flex flex-col items-center justify-center p-4" }, l = { class: "flex-1 flex items-center justify-center min-h-0" }, u = ["src"], d = {
|
|
4
|
+
key: 0,
|
|
5
|
+
class: "mt-4 p-3 bg-gray-100 dark:bg-gray-800 rounded-lg max-w-full flex-shrink-0"
|
|
6
|
+
}, f = { class: "text-sm text-gray-700 dark:text-gray-300" }, p = /* @__PURE__ */ i({
|
|
7
|
+
__name: "ImageView",
|
|
8
|
+
props: { selectedResult: {} },
|
|
9
|
+
setup(i) {
|
|
10
|
+
return (p, m) => (a(), t("div", s, [n("div", c, [n("div", l, [n("img", {
|
|
11
|
+
src: i.selectedResult.data?.imageData,
|
|
12
|
+
class: "max-w-full max-h-full object-contain rounded",
|
|
13
|
+
alt: "Current generated image"
|
|
14
|
+
}, null, 8, u)]), i.selectedResult.data?.prompt ? (a(), t("div", d, [n("p", f, [m[0] ||= n("span", { class: "font-medium" }, "Prompt:", -1), r(" " + o(i.selectedResult.data.prompt), 1)])])) : e("", !0)])]));
|
|
15
|
+
}
|
|
16
|
+
}), m = { class: "min-h-24 flex items-center justify-center" }, h = ["src"], g = {
|
|
17
|
+
key: 1,
|
|
18
|
+
class: "text-gray-400 text-sm"
|
|
19
|
+
}, _ = /* @__PURE__ */ i({
|
|
20
|
+
__name: "ImagePreview",
|
|
21
|
+
props: { result: {} },
|
|
22
|
+
setup(e) {
|
|
23
|
+
return (n, r) => (a(), t("div", m, [e.result.data?.imageData ? (a(), t("img", {
|
|
24
|
+
key: 0,
|
|
25
|
+
src: e.result.data.imageData,
|
|
26
|
+
class: "max-w-full h-auto rounded",
|
|
27
|
+
alt: "Generated image"
|
|
28
|
+
}, null, 8, h)) : (a(), t("div", g, "No image yet"))]));
|
|
29
|
+
}
|
|
47
30
|
});
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
v as ImageView
|
|
51
|
-
};
|
|
31
|
+
//#endregion
|
|
32
|
+
export { _ as ImagePreview, p as ImageView };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mulmochat-plugin/ui-image",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.4.0",
|
|
4
4
|
"description": "Shared image UI components for MulmoChat plugins",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.cjs",
|
|
@@ -26,19 +26,20 @@
|
|
|
26
26
|
"vue": "^3.5.0"
|
|
27
27
|
},
|
|
28
28
|
"devDependencies": {
|
|
29
|
-
"@
|
|
30
|
-
"@
|
|
31
|
-
"@typescript-eslint/
|
|
32
|
-
"@
|
|
33
|
-
"
|
|
34
|
-
"eslint
|
|
35
|
-
"
|
|
36
|
-
"
|
|
37
|
-
"
|
|
38
|
-
"
|
|
39
|
-
"
|
|
40
|
-
"vue
|
|
41
|
-
"vue-
|
|
29
|
+
"@eslint/js": "^10.0.1",
|
|
30
|
+
"@tailwindcss/vite": "^4.2.4",
|
|
31
|
+
"@typescript-eslint/eslint-plugin": "^8.59.2",
|
|
32
|
+
"@typescript-eslint/parser": "^8.59.2",
|
|
33
|
+
"@vitejs/plugin-vue": "^6.0.5",
|
|
34
|
+
"eslint": "^10.3.0",
|
|
35
|
+
"eslint-plugin-vue": "^10.9.1",
|
|
36
|
+
"globals": "^17.6.0",
|
|
37
|
+
"tailwindcss": "^4.2.4",
|
|
38
|
+
"typescript": "~6.0.3",
|
|
39
|
+
"vite": "^8.0.11",
|
|
40
|
+
"vue": "^3.5.34",
|
|
41
|
+
"vue-eslint-parser": "^10.4.0",
|
|
42
|
+
"vue-tsc": "^3.2.8"
|
|
42
43
|
},
|
|
43
44
|
"keywords": [
|
|
44
45
|
"mulmochat",
|