@gui-chat-plugin/set-image-style 0.1.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 +67 -0
- package/dist/core/definition.d.ts +6 -0
- package/dist/core/index.d.ts +5 -0
- package/dist/core/plugin.d.ts +12 -0
- package/dist/core/types.d.ts +25 -0
- package/dist/core.cjs +1 -0
- package/dist/core.js +69 -0
- package/dist/index.cjs +1 -0
- package/dist/index.d.ts +6 -0
- package/dist/index.js +7 -0
- package/dist/style.css +1 -0
- package/dist/vue/Preview.vue.d.ts +8 -0
- package/dist/vue/index.d.ts +15 -0
- package/dist/vue.cjs +1 -0
- package/dist/vue.js +83 -0
- package/package.json +63 -0
package/README.md
ADDED
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
# @gui-chat-plugin/set-image-style
|
|
2
|
+
|
|
3
|
+
[](https://www.npmjs.com/package/@gui-chat-plugin/set-image-style)
|
|
4
|
+
|
|
5
|
+
A set-image-style plugin for [MulmoChat](https://github.com/receptron/MulmoChat).
|
|
6
|
+
|
|
7
|
+
## Overview
|
|
8
|
+
|
|
9
|
+
This plugin allows users to configure the image generation style (realistic, anime, cartoon, etc.) that will be used by the image generation plugin.
|
|
10
|
+
|
|
11
|
+
## Installation
|
|
12
|
+
|
|
13
|
+
```bash
|
|
14
|
+
yarn add @gui-chat-plugin/set-image-style
|
|
15
|
+
```
|
|
16
|
+
|
|
17
|
+
## Usage
|
|
18
|
+
|
|
19
|
+
### Vue Implementation (for MulmoChat)
|
|
20
|
+
|
|
21
|
+
```typescript
|
|
22
|
+
// In src/tools/index.ts
|
|
23
|
+
import SetImageStylePlugin from "@gui-chat-plugin/set-image-style/vue";
|
|
24
|
+
|
|
25
|
+
const pluginList = [
|
|
26
|
+
// ... other plugins
|
|
27
|
+
SetImageStylePlugin,
|
|
28
|
+
];
|
|
29
|
+
|
|
30
|
+
// In src/main.ts
|
|
31
|
+
import "@gui-chat-plugin/set-image-style/style.css";
|
|
32
|
+
```
|
|
33
|
+
|
|
34
|
+
### Core Only (Framework-agnostic)
|
|
35
|
+
|
|
36
|
+
```typescript
|
|
37
|
+
import { pluginCore, TOOL_NAME } from "@gui-chat-plugin/set-image-style";
|
|
38
|
+
```
|
|
39
|
+
|
|
40
|
+
## Package Exports
|
|
41
|
+
|
|
42
|
+
| Export | Description |
|
|
43
|
+
|--------|-------------|
|
|
44
|
+
| `@gui-chat-plugin/set-image-style` | Core (framework-agnostic) |
|
|
45
|
+
| `@gui-chat-plugin/set-image-style/vue` | Vue implementation |
|
|
46
|
+
| `@gui-chat-plugin/set-image-style/style.css` | Tailwind CSS styles |
|
|
47
|
+
|
|
48
|
+
## Test Prompts
|
|
49
|
+
|
|
50
|
+
1. "Set the image style to anime"
|
|
51
|
+
2. "Change the image generation style to realistic"
|
|
52
|
+
3. "I want cartoon-style images"
|
|
53
|
+
4. "Use photorealistic style for images"
|
|
54
|
+
|
|
55
|
+
## Development
|
|
56
|
+
|
|
57
|
+
```bash
|
|
58
|
+
yarn install
|
|
59
|
+
yarn dev # Start dev server
|
|
60
|
+
yarn build # Build
|
|
61
|
+
yarn typecheck # Type check
|
|
62
|
+
yarn lint # Lint
|
|
63
|
+
```
|
|
64
|
+
|
|
65
|
+
## License
|
|
66
|
+
|
|
67
|
+
MIT
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* SetImageStyle Plugin Core (Framework-agnostic)
|
|
3
|
+
*/
|
|
4
|
+
import type { ToolPluginCore, ToolContext, ToolResult } from "gui-chat-protocol";
|
|
5
|
+
import type { SetImageStyleArgs, SetImageStyleData, SetImageStyleJsonData } from "./types";
|
|
6
|
+
export { TOOL_NAME, TOOL_DEFINITION } from "./definition";
|
|
7
|
+
/**
|
|
8
|
+
* Execute the setImageStyle function
|
|
9
|
+
* Updates the image generation config to include a style modifier
|
|
10
|
+
*/
|
|
11
|
+
export declare const executeSetImageStyle: (context: ToolContext, args: SetImageStyleArgs) => Promise<ToolResult<SetImageStyleData, SetImageStyleJsonData>>;
|
|
12
|
+
export declare const pluginCore: ToolPluginCore<SetImageStyleData, SetImageStyleJsonData, SetImageStyleArgs>;
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* SetImageStyle Plugin Types
|
|
3
|
+
*/
|
|
4
|
+
/** Arguments passed to the setImageStyle tool */
|
|
5
|
+
export interface SetImageStyleArgs {
|
|
6
|
+
styleModifier: string;
|
|
7
|
+
}
|
|
8
|
+
/** Data stored in result.data (displayed in UI) */
|
|
9
|
+
export interface SetImageStyleData {
|
|
10
|
+
styleModifier: string;
|
|
11
|
+
previousStyleModifier: string;
|
|
12
|
+
}
|
|
13
|
+
/** JSON data returned in result.jsonData (sent to LLM) */
|
|
14
|
+
export interface SetImageStyleJsonData {
|
|
15
|
+
success: boolean;
|
|
16
|
+
styleModifier?: string;
|
|
17
|
+
previousStyleModifier?: string;
|
|
18
|
+
backend?: string;
|
|
19
|
+
error?: string;
|
|
20
|
+
}
|
|
21
|
+
/** Configuration value for image generation backend (from app layer) */
|
|
22
|
+
export interface ImageGenerationConfig {
|
|
23
|
+
backend: string;
|
|
24
|
+
styleModifier?: string;
|
|
25
|
+
}
|
package/dist/core.cjs
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a="setImageStyle",r={type:"function",name:a,description:"Set the image style modifier that will be automatically applied to all future image generation requests. This allows you to establish a consistent visual style for all generated images.",parameters:{type:"object",properties:{styleModifier:{type:"string",description:"The style description to append to all image generation prompts (e.g., 'ghibli-style anime', 'oil painting', 'cyberpunk', 'watercolor', 'minimalist line art'). Use an empty string to clear the current style."}},required:["styleModifier"]}},o=async(l,g)=>{const{styleModifier:t}=g,i=l.app;if(!i?.getImageConfig)return{message:"getImageConfig function not available",jsonData:{success:!1,error:"getImageConfig function not available"}};try{const e=i.getImageConfig(),n=e.styleModifier||"",c={...e,styleModifier:t.trim()};i.setConfig?.("imageGenerationBackend",c);const s=t.trim()==="",m=s?"Image style cleared":`Image style set to: ${t.trim()}`,u=s?"Acknowledge that the image style has been cleared. All future images will be generated without a consistent style modifier.":`Acknowledge that all future images will now be generated with the style: "${t.trim()}". This style will be automatically applied to every image generation request until changed.`;return{message:m,data:{styleModifier:t.trim(),previousStyleModifier:n},jsonData:{success:!0,styleModifier:t.trim(),previousStyleModifier:n,backend:e.backend},instructions:u,instructionsRequired:!0}}catch(e){return console.error("ERR: exception in setImageStyle",e),{message:`Failed to set image style: ${e instanceof Error?e.message:"Unknown error"}`,jsonData:{success:!1,error:e instanceof Error?e.message:"Unknown error"},instructions:"Acknowledge that there was an error setting the image style and ask the user to try again."}}},y={toolDefinition:r,execute:o,generatingMessage:"Setting image style...",isEnabled:()=>!0,backends:["imageGen"]};exports.TOOL_DEFINITION=r;exports.TOOL_NAME=a;exports.executeSetImageStyle=o;exports.pluginCore=y;
|
package/dist/core.js
ADDED
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
const c = "setImageStyle", m = {
|
|
2
|
+
type: "function",
|
|
3
|
+
name: c,
|
|
4
|
+
description: "Set the image style modifier that will be automatically applied to all future image generation requests. This allows you to establish a consistent visual style for all generated images.",
|
|
5
|
+
parameters: {
|
|
6
|
+
type: "object",
|
|
7
|
+
properties: {
|
|
8
|
+
styleModifier: {
|
|
9
|
+
type: "string",
|
|
10
|
+
description: "The style description to append to all image generation prompts (e.g., 'ghibli-style anime', 'oil painting', 'cyberpunk', 'watercolor', 'minimalist line art'). Use an empty string to clear the current style."
|
|
11
|
+
}
|
|
12
|
+
},
|
|
13
|
+
required: ["styleModifier"]
|
|
14
|
+
}
|
|
15
|
+
}, u = async (a, r) => {
|
|
16
|
+
const { styleModifier: t } = r, i = a.app;
|
|
17
|
+
if (!i?.getImageConfig)
|
|
18
|
+
return {
|
|
19
|
+
message: "getImageConfig function not available",
|
|
20
|
+
jsonData: {
|
|
21
|
+
success: !1,
|
|
22
|
+
error: "getImageConfig function not available"
|
|
23
|
+
}
|
|
24
|
+
};
|
|
25
|
+
try {
|
|
26
|
+
const e = i.getImageConfig(), s = e.styleModifier || "", o = {
|
|
27
|
+
...e,
|
|
28
|
+
styleModifier: t.trim()
|
|
29
|
+
};
|
|
30
|
+
i.setConfig?.("imageGenerationBackend", o);
|
|
31
|
+
const n = t.trim() === "", l = n ? "Image style cleared" : `Image style set to: ${t.trim()}`, g = n ? "Acknowledge that the image style has been cleared. All future images will be generated without a consistent style modifier." : `Acknowledge that all future images will now be generated with the style: "${t.trim()}". This style will be automatically applied to every image generation request until changed.`;
|
|
32
|
+
return {
|
|
33
|
+
message: l,
|
|
34
|
+
data: {
|
|
35
|
+
styleModifier: t.trim(),
|
|
36
|
+
previousStyleModifier: s
|
|
37
|
+
},
|
|
38
|
+
jsonData: {
|
|
39
|
+
success: !0,
|
|
40
|
+
styleModifier: t.trim(),
|
|
41
|
+
previousStyleModifier: s,
|
|
42
|
+
backend: e.backend
|
|
43
|
+
},
|
|
44
|
+
instructions: g,
|
|
45
|
+
instructionsRequired: !0
|
|
46
|
+
};
|
|
47
|
+
} catch (e) {
|
|
48
|
+
return console.error("ERR: exception in setImageStyle", e), {
|
|
49
|
+
message: `Failed to set image style: ${e instanceof Error ? e.message : "Unknown error"}`,
|
|
50
|
+
jsonData: {
|
|
51
|
+
success: !1,
|
|
52
|
+
error: e instanceof Error ? e.message : "Unknown error"
|
|
53
|
+
},
|
|
54
|
+
instructions: "Acknowledge that there was an error setting the image style and ask the user to try again."
|
|
55
|
+
};
|
|
56
|
+
}
|
|
57
|
+
}, y = {
|
|
58
|
+
toolDefinition: m,
|
|
59
|
+
execute: u,
|
|
60
|
+
generatingMessage: "Setting image style...",
|
|
61
|
+
isEnabled: () => !0,
|
|
62
|
+
backends: ["imageGen"]
|
|
63
|
+
};
|
|
64
|
+
export {
|
|
65
|
+
m as TOOL_DEFINITION,
|
|
66
|
+
c as TOOL_NAME,
|
|
67
|
+
u as executeSetImageStyle,
|
|
68
|
+
y as pluginCore
|
|
69
|
+
};
|
package/dist/index.cjs
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./core.cjs");exports.TOOL_DEFINITION=e.TOOL_DEFINITION;exports.TOOL_NAME=e.TOOL_NAME;exports.executeSetImageStyle=e.executeSetImageStyle;exports.pluginCore=e.pluginCore;
|
package/dist/index.d.ts
ADDED
package/dist/index.js
ADDED
package/dist/style.css
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse:0;--tw-border-style:solid;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000}}}@layer theme{:root,:host{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-red-500:oklch(63.7% .237 25.331);--color-red-600:oklch(57.7% .245 27.325);--color-green-500:oklch(72.3% .219 149.579);--color-emerald-50:oklch(97.9% .021 166.113);--color-emerald-100:oklch(95% .052 163.051);--color-emerald-200:oklch(90.5% .093 164.15);--color-emerald-800:oklch(43.2% .095 166.913);--color-blue-400:oklch(70.7% .165 254.624);--color-blue-600:oklch(54.6% .245 262.881);--color-indigo-100:oklch(93% .034 272.788);--color-indigo-200:oklch(87% .065 274.039);--color-indigo-300:oklch(78.5% .115 274.713);--color-indigo-500:oklch(58.5% .233 277.117);--color-indigo-600:oklch(51.1% .262 276.966);--color-indigo-700:oklch(45.7% .24 277.023);--color-gray-50:oklch(98.5% .002 247.839);--color-gray-100:oklch(96.7% .003 264.542);--color-gray-200:oklch(92.8% .006 264.531);--color-gray-300:oklch(87.2% .01 258.338);--color-gray-400:oklch(70.7% .022 261.325);--color-gray-500:oklch(55.1% .027 264.364);--color-gray-600:oklch(44.6% .03 256.802);--color-gray-700:oklch(37.3% .034 259.733);--color-gray-800:oklch(27.8% .033 256.848);--color-gray-900:oklch(21% .034 264.665);--color-white:#fff;--spacing:.25rem;--container-3xl:48rem;--text-xs:.75rem;--text-xs--line-height:calc(1/.75);--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-xl:1.25rem;--text-xl--line-height:calc(1.75/1.25);--font-weight-medium:500;--radius-md:.375rem;--radius-lg:.5rem;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.m-0{margin:calc(var(--spacing)*0)}.mx-auto{margin-inline:auto}.mt-1{margin-top:calc(var(--spacing)*1)}.mt-3{margin-top:calc(var(--spacing)*3)}.mt-4{margin-top:calc(var(--spacing)*4)}.mb-0\.5{margin-bottom:calc(var(--spacing)*.5)}.mb-2{margin-bottom:calc(var(--spacing)*2)}.mb-3{margin-bottom:calc(var(--spacing)*3)}.mb-4{margin-bottom:calc(var(--spacing)*4)}.mb-5{margin-bottom:calc(var(--spacing)*5)}.mb-8{margin-bottom:calc(var(--spacing)*8)}.block{display:block}.contents{display:contents}.flex{display:flex}.h-4{height:calc(var(--spacing)*4)}.w-4{width:calc(var(--spacing)*4)}.w-full{width:100%}.max-w-3xl{max-width:var(--container-3xl)}.max-w-\[200px\]{max-width:200px}.cursor-pointer{cursor:pointer}.resize-y{resize:vertical}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.gap-1{gap:calc(var(--spacing)*1)}.gap-2{gap:calc(var(--spacing)*2)}.gap-3{gap:calc(var(--spacing)*3)}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*1)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*1)*calc(1 - var(--tw-space-y-reverse)))}.overflow-x-auto{overflow-x:auto}.rounded{border-radius:.25rem}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.border{border-style:var(--tw-border-style);border-width:1px}.border-none{--tw-border-style:none;border-style:none}.border-emerald-200{border-color:var(--color-emerald-200)}.border-gray-200{border-color:var(--color-gray-200)}.border-gray-300{border-color:var(--color-gray-300)}.border-indigo-200{border-color:var(--color-indigo-200)}.bg-emerald-50{background-color:var(--color-emerald-50)}.bg-emerald-100{background-color:var(--color-emerald-100)}.bg-gray-50{background-color:var(--color-gray-50)}.bg-gray-100{background-color:var(--color-gray-100)}.bg-indigo-100{background-color:var(--color-indigo-100)}.bg-indigo-600{background-color:var(--color-indigo-600)}.bg-white{background-color:var(--color-white)}.p-1{padding:calc(var(--spacing)*1)}.p-2{padding:calc(var(--spacing)*2)}.p-3{padding:calc(var(--spacing)*3)}.p-4{padding:calc(var(--spacing)*4)}.p-5{padding:calc(var(--spacing)*5)}.px-4{padding-inline:calc(var(--spacing)*4)}.px-6{padding-inline:calc(var(--spacing)*6)}.py-2{padding-block:calc(var(--spacing)*2)}.py-2\.5{padding-block:calc(var(--spacing)*2.5)}.font-mono{font-family:var(--font-mono)}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.whitespace-pre-wrap{white-space:pre-wrap}.text-blue-600{color:var(--color-blue-600)}.text-emerald-800{color:var(--color-emerald-800)}.text-gray-400{color:var(--color-gray-400)}.text-gray-500{color:var(--color-gray-500)}.text-gray-600{color:var(--color-gray-600)}.text-gray-700{color:var(--color-gray-700)}.text-gray-800{color:var(--color-gray-800)}.text-green-500{color:var(--color-green-500)}.text-indigo-700{color:var(--color-indigo-700)}.text-red-500{color:var(--color-red-500)}.text-red-600{color:var(--color-red-600)}.text-white{color:var(--color-white)}.line-through{text-decoration-line:line-through}.shadow-md{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a),0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}@media(hover:hover){.hover\:border-indigo-300:hover{border-color:var(--color-indigo-300)}.hover\:bg-indigo-200:hover{background-color:var(--color-indigo-200)}.hover\:bg-indigo-700:hover{background-color:var(--color-indigo-700)}}.focus\:border-indigo-500:focus{border-color:var(--color-indigo-500)}.focus\:ring-\[3px\]:focus{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(3px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.focus\:ring-indigo-500\/10:focus{--tw-ring-color:#625fff1a}@supports (color:color-mix(in lab,red,red)){.focus\:ring-indigo-500\/10:focus{--tw-ring-color:color-mix(in oklab,var(--color-indigo-500)10%,transparent)}}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}@media(prefers-color-scheme:dark){.dark\:border-gray-700{border-color:var(--color-gray-700)}.dark\:bg-gray-800{background-color:var(--color-gray-800)}.dark\:bg-gray-900{background-color:var(--color-gray-900)}.dark\:text-blue-400{color:var(--color-blue-400)}.dark\:text-gray-300{color:var(--color-gray-300)}.dark\:text-gray-400{color:var(--color-gray-400)}}}body{margin:calc(var(--spacing)*0);background-color:var(--color-gray-100);padding:calc(var(--spacing)*5);font-family:var(--font-sans)}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { ToolResult } from "gui-chat-protocol";
|
|
2
|
+
import type { SetImageStyleJsonData } from "../core/types";
|
|
3
|
+
type __VLS_Props = {
|
|
4
|
+
result: ToolResult<unknown, SetImageStyleJsonData>;
|
|
5
|
+
};
|
|
6
|
+
declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
7
|
+
declare const _default: typeof __VLS_export;
|
|
8
|
+
export default _default;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* SetImageStyle Plugin - Vue Implementation
|
|
3
|
+
*/
|
|
4
|
+
import "../style.css";
|
|
5
|
+
import type { ToolPlugin } from "gui-chat-protocol/vue";
|
|
6
|
+
import type { SetImageStyleArgs, SetImageStyleData, SetImageStyleJsonData } from "../core/types";
|
|
7
|
+
import Preview from "./Preview.vue";
|
|
8
|
+
export declare const plugin: ToolPlugin<SetImageStyleData, SetImageStyleJsonData, SetImageStyleArgs>;
|
|
9
|
+
export type { SetImageStyleArgs, SetImageStyleData, SetImageStyleJsonData, ImageGenerationConfig, } from "../core/types";
|
|
10
|
+
export { TOOL_NAME, TOOL_DEFINITION, executeSetImageStyle, pluginCore, } from "../core/plugin";
|
|
11
|
+
export { Preview };
|
|
12
|
+
declare const _default: {
|
|
13
|
+
plugin: ToolPlugin<SetImageStyleData, SetImageStyleJsonData, SetImageStyleArgs, import("gui-chat-protocol/vue").InputHandler, Record<string, unknown>>;
|
|
14
|
+
};
|
|
15
|
+
export default _default;
|
package/dist/vue.cjs
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("./core.cjs"),e=require("vue"),m={class:"p-2 bg-gray-50 dark:bg-gray-800 rounded"},p={class:"text-xs text-gray-600 dark:text-gray-400"},g={key:0,class:"space-y-1"},v={class:"flex items-center gap-1"},y={key:0,class:"font-medium"},x={key:1,class:"font-medium"},k={key:0,class:"mt-1"},E={class:"text-xs font-mono bg-white dark:bg-gray-900 p-1 rounded border border-gray-200 dark:border-gray-700"},_={key:1,class:"mt-1"},N={class:"text-xs font-mono text-gray-400 line-through"},f={key:1,class:"flex items-center gap-1 text-red-500"},n=e.defineComponent({__name:"Preview",props:{result:{}},setup(d){const s=d,i=e.computed(()=>s.result.jsonData?.success||!1),r=e.computed(()=>s.result.jsonData?.styleModifier||""),a=e.computed(()=>s.result.jsonData?.previousStyleModifier||""),l=e.computed(()=>r.value===""),u=e.computed(()=>s.result.jsonData?.error);return(B,t)=>(e.openBlock(),e.createElementBlock("div",m,[t[4]||(t[4]=e.createElementVNode("div",{class:"flex items-center gap-2 mb-2"},[e.createElementVNode("svg",{xmlns:"http://www.w3.org/2000/svg",class:"h-4 w-4 text-blue-600 dark:text-blue-400",viewBox:"0 0 20 20",fill:"currentColor"},[e.createElementVNode("path",{"fill-rule":"evenodd",d:"M4 2a2 2 0 00-2 2v11a3 3 0 106 0V4a2 2 0 00-2-2H4zm1 14a1 1 0 100-2 1 1 0 000 2zm5-1.757l4.9-4.9a2 2 0 000-2.828L13.485 5.1a2 2 0 00-2.828 0L10 5.757v8.486zM16 18H9.071l6-6H16a2 2 0 012 2v2a2 2 0 01-2 2z","clip-rule":"evenodd"})]),e.createElementVNode("span",{class:"text-sm font-medium text-gray-700 dark:text-gray-300"}," Image Style ")],-1)),e.createElementVNode("div",p,[i.value?(e.openBlock(),e.createElementBlock("div",g,[e.createElementVNode("div",v,[t[0]||(t[0]=e.createElementVNode("span",{class:"text-green-500"},"✓",-1)),l.value?(e.openBlock(),e.createElementBlock("span",y,"Style Cleared")):(e.openBlock(),e.createElementBlock("span",x,"Style Updated"))]),l.value?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",k,[t[1]||(t[1]=e.createElementVNode("div",{class:"text-xs text-gray-500 mb-0.5"},"New style:",-1)),e.createElementVNode("div",E,e.toDisplayString(r.value),1)])),a.value&&!l.value?(e.openBlock(),e.createElementBlock("div",_,[t[2]||(t[2]=e.createElementVNode("div",{class:"text-xs text-gray-500 mb-0.5"},"Previous:",-1)),e.createElementVNode("div",N,e.toDisplayString(a.value),1)])):e.createCommentVNode("",!0)])):(e.openBlock(),e.createElementBlock("div",f,[t[3]||(t[3]=e.createElementVNode("span",null,"✗",-1)),e.createElementVNode("span",null,e.toDisplayString(u.value||"Failed to set image style"),1)]))])]))}}),c={...o.pluginCore,previewComponent:n},V={plugin:c};exports.TOOL_DEFINITION=o.TOOL_DEFINITION;exports.TOOL_NAME=o.TOOL_NAME;exports.executeSetImageStyle=o.executeSetImageStyle;exports.pluginCore=o.pluginCore;exports.Preview=n;exports.default=V;exports.plugin=c;
|
package/dist/vue.js
ADDED
|
@@ -0,0 +1,83 @@
|
|
|
1
|
+
import { pluginCore as v } from "./core.js";
|
|
2
|
+
import { TOOL_DEFINITION as B, TOOL_NAME as H, executeSetImageStyle as P } from "./core.js";
|
|
3
|
+
import { defineComponent as g, computed as r, createElementBlock as s, openBlock as o, createElementVNode as e, createCommentVNode as u, toDisplayString as n } from "vue";
|
|
4
|
+
const x = { class: "p-2 bg-gray-50 dark:bg-gray-800 rounded" }, y = { class: "text-xs text-gray-600 dark:text-gray-400" }, f = {
|
|
5
|
+
key: 0,
|
|
6
|
+
class: "space-y-1"
|
|
7
|
+
}, _ = { class: "flex items-center gap-1" }, k = {
|
|
8
|
+
key: 0,
|
|
9
|
+
class: "font-medium"
|
|
10
|
+
}, b = {
|
|
11
|
+
key: 1,
|
|
12
|
+
class: "font-medium"
|
|
13
|
+
}, w = {
|
|
14
|
+
key: 0,
|
|
15
|
+
class: "mt-1"
|
|
16
|
+
}, h = { class: "text-xs font-mono bg-white dark:bg-gray-900 p-1 rounded border border-gray-200 dark:border-gray-700" }, M = {
|
|
17
|
+
key: 1,
|
|
18
|
+
class: "mt-1"
|
|
19
|
+
}, S = { class: "text-xs font-mono text-gray-400 line-through" }, C = {
|
|
20
|
+
key: 1,
|
|
21
|
+
class: "flex items-center gap-1 text-red-500"
|
|
22
|
+
}, D = /* @__PURE__ */ g({
|
|
23
|
+
__name: "Preview",
|
|
24
|
+
props: {
|
|
25
|
+
result: {}
|
|
26
|
+
},
|
|
27
|
+
setup(c) {
|
|
28
|
+
const a = c, m = r(() => a.result.jsonData?.success || !1), i = r(
|
|
29
|
+
() => a.result.jsonData?.styleModifier || ""
|
|
30
|
+
), d = r(
|
|
31
|
+
() => a.result.jsonData?.previousStyleModifier || ""
|
|
32
|
+
), l = r(() => i.value === ""), p = r(() => a.result.jsonData?.error);
|
|
33
|
+
return (I, t) => (o(), s("div", x, [
|
|
34
|
+
t[4] || (t[4] = e("div", { class: "flex items-center gap-2 mb-2" }, [
|
|
35
|
+
e("svg", {
|
|
36
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
37
|
+
class: "h-4 w-4 text-blue-600 dark:text-blue-400",
|
|
38
|
+
viewBox: "0 0 20 20",
|
|
39
|
+
fill: "currentColor"
|
|
40
|
+
}, [
|
|
41
|
+
e("path", {
|
|
42
|
+
"fill-rule": "evenodd",
|
|
43
|
+
d: "M4 2a2 2 0 00-2 2v11a3 3 0 106 0V4a2 2 0 00-2-2H4zm1 14a1 1 0 100-2 1 1 0 000 2zm5-1.757l4.9-4.9a2 2 0 000-2.828L13.485 5.1a2 2 0 00-2.828 0L10 5.757v8.486zM16 18H9.071l6-6H16a2 2 0 012 2v2a2 2 0 01-2 2z",
|
|
44
|
+
"clip-rule": "evenodd"
|
|
45
|
+
})
|
|
46
|
+
]),
|
|
47
|
+
e("span", { class: "text-sm font-medium text-gray-700 dark:text-gray-300" }, " Image Style ")
|
|
48
|
+
], -1)),
|
|
49
|
+
e("div", y, [
|
|
50
|
+
m.value ? (o(), s("div", f, [
|
|
51
|
+
e("div", _, [
|
|
52
|
+
t[0] || (t[0] = e("span", { class: "text-green-500" }, "✓", -1)),
|
|
53
|
+
l.value ? (o(), s("span", k, "Style Cleared")) : (o(), s("span", b, "Style Updated"))
|
|
54
|
+
]),
|
|
55
|
+
l.value ? u("", !0) : (o(), s("div", w, [
|
|
56
|
+
t[1] || (t[1] = e("div", { class: "text-xs text-gray-500 mb-0.5" }, "New style:", -1)),
|
|
57
|
+
e("div", h, n(i.value), 1)
|
|
58
|
+
])),
|
|
59
|
+
d.value && !l.value ? (o(), s("div", M, [
|
|
60
|
+
t[2] || (t[2] = e("div", { class: "text-xs text-gray-500 mb-0.5" }, "Previous:", -1)),
|
|
61
|
+
e("div", S, n(d.value), 1)
|
|
62
|
+
])) : u("", !0)
|
|
63
|
+
])) : (o(), s("div", C, [
|
|
64
|
+
t[3] || (t[3] = e("span", null, "✗", -1)),
|
|
65
|
+
e("span", null, n(p.value || "Failed to set image style"), 1)
|
|
66
|
+
]))
|
|
67
|
+
])
|
|
68
|
+
]));
|
|
69
|
+
}
|
|
70
|
+
}), N = {
|
|
71
|
+
...v,
|
|
72
|
+
previewComponent: D
|
|
73
|
+
// No viewComponent - this plugin only has a preview
|
|
74
|
+
}, z = { plugin: N };
|
|
75
|
+
export {
|
|
76
|
+
D as Preview,
|
|
77
|
+
B as TOOL_DEFINITION,
|
|
78
|
+
H as TOOL_NAME,
|
|
79
|
+
z as default,
|
|
80
|
+
P as executeSetImageStyle,
|
|
81
|
+
N as plugin,
|
|
82
|
+
v as pluginCore
|
|
83
|
+
};
|
package/package.json
ADDED
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@gui-chat-plugin/set-image-style",
|
|
3
|
+
"version": "0.1.0",
|
|
4
|
+
"description": "Set image style modifier plugin for GUIChat",
|
|
5
|
+
"type": "module",
|
|
6
|
+
"main": "./dist/index.cjs",
|
|
7
|
+
"module": "./dist/index.js",
|
|
8
|
+
"types": "./dist/index.d.ts",
|
|
9
|
+
"exports": {
|
|
10
|
+
".": {
|
|
11
|
+
"types": "./dist/index.d.ts",
|
|
12
|
+
"import": "./dist/index.js",
|
|
13
|
+
"require": "./dist/index.cjs"
|
|
14
|
+
},
|
|
15
|
+
"./core": {
|
|
16
|
+
"types": "./dist/core/index.d.ts",
|
|
17
|
+
"import": "./dist/core.js",
|
|
18
|
+
"require": "./dist/core.cjs"
|
|
19
|
+
},
|
|
20
|
+
"./vue": {
|
|
21
|
+
"types": "./dist/vue/index.d.ts",
|
|
22
|
+
"import": "./dist/vue.js",
|
|
23
|
+
"require": "./dist/vue.cjs"
|
|
24
|
+
},
|
|
25
|
+
"./style.css": "./dist/style.css"
|
|
26
|
+
},
|
|
27
|
+
"files": [
|
|
28
|
+
"dist"
|
|
29
|
+
],
|
|
30
|
+
"scripts": {
|
|
31
|
+
"dev": "vite",
|
|
32
|
+
"build": "vite build && vue-tsc -p tsconfig.build.json --emitDeclarationOnly",
|
|
33
|
+
"typecheck": "vue-tsc --noEmit",
|
|
34
|
+
"lint": "eslint src demo"
|
|
35
|
+
},
|
|
36
|
+
"peerDependencies": {
|
|
37
|
+
"gui-chat-protocol": "^0.0.1",
|
|
38
|
+
"vue": "^3.5.0"
|
|
39
|
+
},
|
|
40
|
+
"devDependencies": {
|
|
41
|
+
"@tailwindcss/vite": "^4.1.18",
|
|
42
|
+
"@typescript-eslint/eslint-plugin": "^8.53.0",
|
|
43
|
+
"@typescript-eslint/parser": "^8.53.0",
|
|
44
|
+
"@vitejs/plugin-vue": "^6.0.3",
|
|
45
|
+
"eslint": "^9.39.2",
|
|
46
|
+
"eslint-plugin-vue": "^10.6.2",
|
|
47
|
+
"globals": "^17.0.0",
|
|
48
|
+
"gui-chat-protocol": "^0.0.1",
|
|
49
|
+
"tailwindcss": "^4.1.18",
|
|
50
|
+
"typescript": "~5.9.3",
|
|
51
|
+
"vite": "^7.3.1",
|
|
52
|
+
"vue": "^3.5.27",
|
|
53
|
+
"vue-eslint-parser": "^10.2.0",
|
|
54
|
+
"vue-tsc": "^3.2.2"
|
|
55
|
+
},
|
|
56
|
+
"keywords": [
|
|
57
|
+
"guichat",
|
|
58
|
+
"plugin",
|
|
59
|
+
"image",
|
|
60
|
+
"style"
|
|
61
|
+
],
|
|
62
|
+
"license": "MIT"
|
|
63
|
+
}
|