@mulmochat-plugin/ui-image 0.3.0 → 0.4.1

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.
Files changed (4) hide show
  1. package/README.md +6 -0
  2. package/dist/index.cjs +1 -1
  3. package/dist/index.js +31 -50
  4. package/package.json +15 -14
package/README.md CHANGED
@@ -1,3 +1,4 @@
1
+ [![npm version](https://badge.fury.io/js/%40mulmochat-plugin%2Fui-image.svg)](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.
@@ -48,3 +49,8 @@ interface ImageToolData {
48
49
  prompt?: string; // Optional prompt used to generate the image
49
50
  }
50
51
  ```
52
+
53
+ ## Related
54
+
55
+ - Protocol spec: [gui-chat-protocol](https://github.com/receptron/gui-chat-protocol)
56
+ - Reference implementations using this protocol: [mulmoclaude](https://github.com/receptron/mulmoclaude) · [MulmoChat](https://github.com/receptron/MulmoChat)
package/dist/index.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),s={class:"w-full h-full overflow-y-auto"},c={class:"min-h-full flex flex-col items-center justify-center p-4"},n={class:"flex-1 flex items-center justify-center min-h-0"},o=["src"],r={key:0,class:"mt-4 p-3 bg-gray-100 dark:bg-gray-800 rounded-lg max-w-full flex-shrink-0"},i={class:"text-sm text-gray-700 dark:text-gray-300"},m=e.defineComponent({__name:"ImageView",props:{selectedResult:{}},setup(t){return(l,a)=>(e.openBlock(),e.createElementBlock("div",s,[e.createElementVNode("div",c,[e.createElementVNode("div",n,[e.createElementVNode("img",{src:t.selectedResult.data?.imageData,class:"max-w-full max-h-full object-contain rounded",alt:"Current generated image"},null,8,o)]),t.selectedResult.data?.prompt?(e.openBlock(),e.createElementBlock("div",r,[e.createElementVNode("p",i,[a[0]||(a[0]=e.createElementVNode("span",{class:"font-medium"},"Prompt:",-1)),e.createTextVNode(" "+e.toDisplayString(t.selectedResult.data.prompt),1)])])):e.createCommentVNode("",!0)])]))}}),d={class:"min-h-24 flex items-center justify-center"},u=["src"],g={key:1,class:"text-gray-400 text-sm"},f=e.defineComponent({__name:"ImagePreview",props:{result:{}},setup(t){return(l,a)=>(e.openBlock(),e.createElementBlock("div",d,[t.result.data?.imageData?(e.openBlock(),e.createElementBlock("img",{key:0,src:t.result.data.imageData,class:"max-w-full h-auto rounded",alt:"Generated image"},null,8,u)):(e.openBlock(),e.createElementBlock("div",g,"No image yet"))]))}});exports.ImagePreview=f;exports.ImageView=m;
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 { defineComponent as r, createElementBlock as s, openBlock as a, createElementVNode as t, createCommentVNode as c, createTextVNode as o, toDisplayString as i } from "vue";
2
- const m = { class: "w-full h-full overflow-y-auto" }, d = { class: "min-h-full flex flex-col items-center justify-center p-4" }, u = { class: "flex-1 flex items-center justify-center min-h-0" }, f = ["src"], g = {
3
- key: 0,
4
- class: "mt-4 p-3 bg-gray-100 dark:bg-gray-800 rounded-lg max-w-full flex-shrink-0"
5
- }, _ = { class: "text-sm text-gray-700 dark:text-gray-300" }, v = /* @__PURE__ */ r({
6
- __name: "ImageView",
7
- props: {
8
- selectedResult: {}
9
- },
10
- setup(e) {
11
- return (n, l) => (a(), s("div", m, [
12
- t("div", d, [
13
- t("div", u, [
14
- t("img", {
15
- src: e.selectedResult.data?.imageData,
16
- class: "max-w-full max-h-full object-contain rounded",
17
- alt: "Current generated image"
18
- }, null, 8, f)
19
- ]),
20
- e.selectedResult.data?.prompt ? (a(), s("div", g, [
21
- t("p", _, [
22
- l[0] || (l[0] = t("span", { class: "font-medium" }, "Prompt:", -1)),
23
- o(" " + i(e.selectedResult.data.prompt), 1)
24
- ])
25
- ])) : c("", !0)
26
- ])
27
- ]));
28
- }
29
- }), x = { class: "min-h-24 flex items-center justify-center" }, h = ["src"], p = {
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
- export {
49
- w as ImagePreview,
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.0",
3
+ "version": "0.4.1",
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
- "@tailwindcss/vite": "^4.1.18",
30
- "@typescript-eslint/eslint-plugin": "^8.53.0",
31
- "@typescript-eslint/parser": "^8.53.0",
32
- "@vitejs/plugin-vue": "^6.0.3",
33
- "eslint": "^9.39.2",
34
- "eslint-plugin-vue": "^10.6.2",
35
- "globals": "^17.0.0",
36
- "tailwindcss": "^4.1.18",
37
- "typescript": "~5.9.3",
38
- "vite": "^7.3.1",
39
- "vue": "^3.5.26",
40
- "vue-eslint-parser": "^10.2.0",
41
- "vue-tsc": "^3.2.2"
29
+ "@eslint/js": "^10.0.1",
30
+ "@tailwindcss/vite": "^4.3.2",
31
+ "@typescript-eslint/eslint-plugin": "^8.64.0",
32
+ "@typescript-eslint/parser": "^8.64.0",
33
+ "@vitejs/plugin-vue": "^6.0.8",
34
+ "eslint": "^10.7.0",
35
+ "eslint-plugin-vue": "^10.9.2",
36
+ "globals": "^17.7.0",
37
+ "tailwindcss": "^4.3.2",
38
+ "typescript": "~6.0.3",
39
+ "vite": "^8.1.4",
40
+ "vue": "^3.5.39",
41
+ "vue-eslint-parser": "^10.4.1",
42
+ "vue-tsc": "^3.3.7"
42
43
  },
43
44
  "keywords": [
44
45
  "mulmochat",