@gui-chat-plugin/canvas 0.3.1 → 0.3.3

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/dist/style.css CHANGED
@@ -1 +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-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--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-50:oklch(97.1% .013 17.38);--color-red-300:oklch(80.8% .114 19.571);--color-blue-100:oklch(93.2% .032 255.585);--color-blue-500:oklch(62.3% .214 259.815);--color-blue-600:oklch(54.6% .245 262.881);--color-blue-700:oklch(48.8% .243 264.376);--color-gray-50:oklch(98.5% .002 247.839);--color-gray-100:oklch(96.7% .003 264.542);--color-gray-300:oklch(87.2% .01 258.338);--color-gray-400:oklch(70.7% .022 261.325);--color-gray-800:oklch(27.8% .033 256.848);--color-gray-900:oklch(21% .034 264.665);--color-white:#fff;--spacing:.25rem;--container-2xl:42rem;--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-lg:1.125rem;--text-lg--line-height:calc(1.75/1.125);--text-2xl:1.5rem;--text-2xl--line-height:calc(2/1.5);--font-weight-semibold:600;--font-weight-bold:700;--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{.container{width:100%}@media(min-width:40rem){.container{max-width:40rem}}@media(min-width:48rem){.container{max-width:48rem}}@media(min-width:64rem){.container{max-width:64rem}}@media(min-width:80rem){.container{max-width:80rem}}@media(min-width:96rem){.container{max-width:96rem}}.mx-auto{margin-inline:auto}.mb-4{margin-bottom:calc(var(--spacing)*4)}.mb-8{margin-bottom:calc(var(--spacing)*8)}.contents{display:contents}.flex{display:flex}.h-8{height:calc(var(--spacing)*8)}.h-auto{height:auto}.h-full{height:100%}.min-h-24{min-height:calc(var(--spacing)*24)}.min-h-screen{min-height:100vh}.w-8{width:calc(var(--spacing)*8)}.w-12{width:calc(var(--spacing)*12)}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.max-w-full{max-width:100%}.flex-1{flex:1}.flex-shrink-0{flex-shrink:0}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.resize{resize:both}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-1{gap:calc(var(--spacing)*1)}.gap-2{gap:calc(var(--spacing)*2)}.gap-4{gap:calc(var(--spacing)*4)}:where(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*4)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*4)*calc(1 - var(--tw-space-y-reverse)))}.overflow-hidden{overflow:hidden}.rounded{border-radius:.25rem}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-blue-500{border-color:var(--color-blue-500)}.border-gray-300{border-color:var(--color-gray-300)}.border-red-300{border-color:var(--color-red-300)}.bg-blue-100{background-color:var(--color-blue-100)}.bg-blue-600{background-color:var(--color-blue-600)}.bg-gray-50{background-color:var(--color-gray-50)}.bg-gray-100{background-color:var(--color-gray-100)}.bg-gray-800{background-color:var(--color-gray-800)}.bg-white{background-color:var(--color-white)}.p-4{padding:calc(var(--spacing)*4)}.p-8{padding:calc(var(--spacing)*8)}.px-4{padding-inline:calc(var(--spacing)*4)}.py-2{padding-block:calc(var(--spacing)*2)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.text-gray-400{color:var(--color-gray-400)}.text-gray-900{color:var(--color-gray-900)}.text-white{color:var(--color-white)}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px 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-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\:bg-blue-700:hover{background-color:var(--color-blue-700)}.hover\:bg-gray-50:hover{background-color:var(--color-gray-50)}.hover\:bg-red-50:hover{background-color:var(--color-red-50)}}@media(prefers-color-scheme:dark){.dark\:bg-gray-800{background-color:var(--color-gray-800)}.dark\:bg-gray-900{background-color:var(--color-gray-900)}.dark\:text-white{color:var(--color-white)}}}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@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}
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-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--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-50:oklch(97.1% .013 17.38);--color-red-300:oklch(80.8% .114 19.571);--color-blue-100:oklch(93.2% .032 255.585);--color-blue-500:oklch(62.3% .214 259.815);--color-blue-600:oklch(54.6% .245 262.881);--color-blue-700:oklch(48.8% .243 264.376);--color-gray-50:oklch(98.5% .002 247.839);--color-gray-100:oklch(96.7% .003 264.542);--color-gray-300:oklch(87.2% .01 258.338);--color-gray-400:oklch(70.7% .022 261.325);--color-gray-800:oklch(27.8% .033 256.848);--color-gray-900:oklch(21% .034 264.665);--color-white:#fff;--spacing:.25rem;--container-2xl:42rem;--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-lg:1.125rem;--text-lg--line-height:calc(1.75/1.125);--text-2xl:1.5rem;--text-2xl--line-height:calc(2/1.5);--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--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{.container{width:100%}@media(min-width:40rem){.container{max-width:40rem}}@media(min-width:48rem){.container{max-width:48rem}}@media(min-width:64rem){.container{max-width:64rem}}@media(min-width:80rem){.container{max-width:80rem}}@media(min-width:96rem){.container{max-width:96rem}}.mx-auto{margin-inline:auto}.mb-4{margin-bottom:calc(var(--spacing)*4)}.mb-8{margin-bottom:calc(var(--spacing)*8)}.contents{display:contents}.flex{display:flex}.h-8{height:calc(var(--spacing)*8)}.h-auto{height:auto}.h-full{height:100%}.min-h-24{min-height:calc(var(--spacing)*24)}.min-h-screen{min-height:100vh}.w-8{width:calc(var(--spacing)*8)}.w-12{width:calc(var(--spacing)*12)}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.max-w-full{max-width:100%}.flex-1{flex:1}.flex-shrink-0{flex-shrink:0}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.resize{resize:both}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-1{gap:calc(var(--spacing)*1)}.gap-2{gap:calc(var(--spacing)*2)}.gap-4{gap:calc(var(--spacing)*4)}:where(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*4)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*4)*calc(1 - var(--tw-space-y-reverse)))}.overflow-hidden{overflow:hidden}.rounded{border-radius:.25rem}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-blue-500{border-color:var(--color-blue-500)}.border-gray-300{border-color:var(--color-gray-300)}.border-red-300{border-color:var(--color-red-300)}.bg-blue-100{background-color:var(--color-blue-100)}.bg-blue-600{background-color:var(--color-blue-600)}.bg-gray-50{background-color:var(--color-gray-50)}.bg-gray-100{background-color:var(--color-gray-100)}.bg-gray-800{background-color:var(--color-gray-800)}.bg-white{background-color:var(--color-white)}.p-4{padding:calc(var(--spacing)*4)}.p-8{padding:calc(var(--spacing)*8)}.px-4{padding-inline:calc(var(--spacing)*4)}.py-1\.5{padding-block:calc(var(--spacing)*1.5)}.py-2{padding-block:calc(var(--spacing)*2)}.pt-2{padding-top:calc(var(--spacing)*2)}.pb-4{padding-bottom:calc(var(--spacing)*4)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.text-gray-400{color:var(--color-gray-400)}.text-gray-900{color:var(--color-gray-900)}.text-white{color:var(--color-white)}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px 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-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\:bg-blue-700:hover{background-color:var(--color-blue-700)}.hover\:bg-gray-50:hover{background-color:var(--color-gray-50)}.hover\:bg-red-50:hover{background-color:var(--color-red-50)}}@media(prefers-color-scheme:dark){.dark\:bg-gray-800{background-color:var(--color-gray-800)}.dark\:bg-gray-900{background-color:var(--color-gray-900)}.dark\:text-white{color:var(--color-white)}}}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@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}
@@ -2,6 +2,7 @@ import type { ToolResult } from "gui-chat-protocol/vue";
2
2
  import type { ImageToolData } from "../core/types";
3
3
  type __VLS_Props = {
4
4
  selectedResult: ToolResult<ImageToolData> | null;
5
+ sendTextMessage?: (text: string) => void;
5
6
  };
6
7
  declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
7
8
  updateResult: (result: ToolResult<ImageToolData, unknown>) => any;
package/dist/vue.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const d=require("./core.cjs"),e=require("vue"),S=require("vue-drawing-canvas"),V={class:"w-full h-full flex flex-col bg-white"},T={class:"flex-shrink-0 p-4 border-b bg-gray-50"},M={class:"flex items-center justify-between gap-4"},O={class:"flex items-center gap-4"},B={class:"flex items-center gap-2"},D={class:"flex gap-1"},F=["onClick"],$={class:"flex items-center gap-2"},j={class:"flex-1 p-4 overflow-hidden"},y=e.defineComponent({__name:"View",props:{selectedResult:{}},emits:["updateResult"],setup(u,{emit:f}){const n=u,E=f,o=e.ref(null),p=e.ref(""),l=e.ref(5),s=e.ref("#000000"),h=e.ref([]),i=e.ref(800),c=e.ref(600),w=e.ref(0),b=()=>{if(n.selectedResult?.viewState?.drawingState){const t=n.selectedResult.viewState.drawingState;l.value=t.brushSize||5,s.value=t.brushColor||"#000000",i.value=t.canvasWidth||800,c.value=t.canvasHeight||600,t.strokes?h.value=t.strokes:h.value=[]}else h.value=[]};b();const C=async()=>{if(o.value)try{o.value.undo(),setTimeout(v,50)}catch(t){console.warn("Undo operation failed:",t)}},N=async()=>{if(o.value)try{o.value.redo(),setTimeout(v,50)}catch(t){console.warn("Redo operation failed:",t)}},R=()=>{if(o.value)try{o.value.reset(),v()}catch(t){console.warn("Clear operation failed:",t)}},_=()=>{v()},v=async()=>{if(o.value&&n.selectedResult)try{const t=await o.value.save(),a={strokes:o.value.getAllStrokes(),brushSize:l.value,brushColor:s.value,canvasWidth:i.value,canvasHeight:c.value},m={...n.selectedResult,data:{prompt:n.selectedResult.data?.prompt||"",imageData:t},viewState:{drawingState:a}};E("updateResult",m)}catch(t){console.error("Failed to save drawing state:",t)}};e.watch(()=>n.selectedResult,()=>{b()},{immediate:!1}),e.watch([l,s],()=>{v()}),e.watch([i,c],()=>{w.value++});const g=()=>{const t=o.value?.$el?.parentElement;if(t){const r=t.getBoundingClientRect(),a=Math.floor(r.width),m=Math.floor(a*9/16);(a!==i.value||m!==c.value)&&(i.value=a,c.value=m)}};return e.onMounted(async()=>{await e.nextTick(),g(),window.addEventListener("resize",g)}),e.onUnmounted(()=>{window.removeEventListener("resize",g)}),(t,r)=>(e.openBlock(),e.createElementBlock("div",V,[e.createElementVNode("div",T,[e.createElementVNode("div",M,[e.createElementVNode("div",O,[e.createElementVNode("div",B,[e.createElementVNode("div",D,[(e.openBlock(),e.createElementBlock(e.Fragment,null,e.renderList([2,5,10,20],a=>e.createElementVNode("button",{key:a,onClick:m=>l.value=a,class:e.normalizeClass(["w-8 h-8 rounded border-2 transition-colors",l.value===a?"border-blue-500 bg-blue-100":"border-gray-300 bg-white hover:bg-gray-50"])},[e.createElementVNode("div",{class:e.normalizeClass("bg-gray-800 rounded-full mx-auto"),style:e.normalizeStyle({width:Math.max(2,a*1)+"px",height:Math.max(2,a*1)+"px"})},null,4)],10,F)),64))])]),e.createElementVNode("div",$,[e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":r[0]||(r[0]=a=>s.value=a),type:"color",class:"w-12 h-8 rounded border border-gray-300"},null,512),[[e.vModelText,s.value]])])]),e.createElementVNode("div",{class:"flex items-center gap-1"},[e.createElementVNode("button",{onClick:C,class:"w-8 h-8 flex items-center justify-center rounded border-2 border-gray-300 bg-white hover:bg-gray-50",title:"Undo"}," ↩ "),e.createElementVNode("button",{onClick:N,class:"w-8 h-8 flex items-center justify-center rounded border-2 border-gray-300 bg-white hover:bg-gray-50",title:"Redo"}," ↪ "),e.createElementVNode("button",{onClick:R,class:"w-8 h-8 flex items-center justify-center rounded border-2 border-red-300 bg-white hover:bg-red-50",title:"Clear"}," 🗑 ")])])]),e.createElementVNode("div",j,[(e.openBlock(),e.createBlock(e.unref(S),{ref_key:"canvasRef",ref:o,key:`${u.selectedResult?.uuid||"default"}-${w.value}`,image:p.value,"onUpdate:image":r[1]||(r[1]=a=>p.value=a),width:i.value,height:c.value,"stroke-type":"dash","line-cap":"round","line-join":"round","fill-shape":!1,eraser:!1,lineWidth:l.value,color:s.value,"background-color":"#FFFFFF","background-image":void 0,watermark:void 0,"initial-image":h.value,saveAs:"png",styles:{border:"1px solid #ddd",borderRadius:"8px"},lock:!1,onMouseup:_,onTouchend:_},null,8,["image","width","height","lineWidth","color","initial-image"]))])]))}}),I={class:"min-h-24 flex items-center justify-center"},L=["src"],P={key:1,class:"text-gray-400 text-sm"},k=e.defineComponent({__name:"Preview",props:{result:{}},setup(u){return(f,n)=>(e.openBlock(),e.createElementBlock("div",I,[u.result.data?.imageData?(e.openBlock(),e.createElementBlock("img",{key:0,src:u.result.data.imageData,class:"max-w-full h-auto rounded",alt:"Canvas drawing"},null,8,L)):(e.openBlock(),e.createElementBlock("div",P,"No drawing yet"))]))}}),x={...d.pluginCore,viewComponent:y,previewComponent:k},W={plugin:x};exports.SYSTEM_PROMPT=d.SYSTEM_PROMPT;exports.TOOL_DEFINITION=d.TOOL_DEFINITION;exports.TOOL_NAME=d.TOOL_NAME;exports.executeOpenCanvas=d.executeOpenCanvas;exports.pluginCore=d.pluginCore;exports.Preview=k;exports.View=y;exports.default=W;exports.plugin=x;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const u=require("./core.cjs"),e=require("vue"),T=require("vue-drawing-canvas"),M={class:"w-full h-full flex flex-col bg-white"},B={class:"flex-shrink-0 p-4 border-b bg-gray-50"},O={class:"flex items-center justify-between gap-4"},F={class:"flex items-center gap-4"},D={class:"flex items-center gap-2"},I={class:"flex gap-1"},$=["onClick"],L={class:"flex items-center gap-2"},j={class:"flex-1 p-4 overflow-hidden"},A={class:"flex-shrink-0 px-4 pt-2 pb-4 flex gap-2 border-t bg-gray-50"},P=["onClick"],k=e.defineComponent({__name:"View",props:{selectedResult:{},sendTextMessage:{type:Function}},emits:["updateResult"],setup(v,{emit:p}){const n=v,C=p,E=[{label:"Ghibli",prompt:"Convert this drawing into a Studio Ghibli style image using editImage."},{label:"Ukiyoe",prompt:"Convert this drawing into a Japanese Ukiyo-e woodblock print style using editImage."},{label:"Suibokuga",prompt:"Convert this drawing into a Japanese Suibokuga ink wash painting style using editImage."},{label:"American Comic",prompt:"Convert this drawing into a classic American superhero comic book style using editImage — bold ink outlines, flat vivid colors, halftone shading, and dynamic composition typical of mid-20th century American comics."}],S=t=>{n.sendTextMessage?.(t)},o=e.ref(null),f=e.ref(""),l=e.ref(5),s=e.ref("#000000"),m=e.ref([]),i=e.ref(800),c=e.ref(600),b=e.ref(0),w=()=>{if(n.selectedResult?.viewState?.drawingState){const t=n.selectedResult.viewState.drawingState;l.value=t.brushSize||5,s.value=t.brushColor||"#000000",i.value=t.canvasWidth||800,c.value=t.canvasHeight||600,t.strokes?m.value=t.strokes:m.value=[]}else m.value=[]};w();const N=async()=>{if(o.value)try{o.value.undo(),setTimeout(g,50)}catch(t){console.warn("Undo operation failed:",t)}},R=async()=>{if(o.value)try{o.value.redo(),setTimeout(g,50)}catch(t){console.warn("Redo operation failed:",t)}},V=()=>{if(o.value)try{o.value.reset(),g()}catch(t){console.warn("Clear operation failed:",t)}},y=()=>{g()},g=async()=>{if(o.value&&n.selectedResult)try{const t=await o.value.save(),a={strokes:o.value.getAllStrokes(),brushSize:l.value,brushColor:s.value,canvasWidth:i.value,canvasHeight:c.value},d={...n.selectedResult,data:{prompt:n.selectedResult.data?.prompt||"",imageData:t},viewState:{drawingState:a}};C("updateResult",d)}catch(t){console.error("Failed to save drawing state:",t)}};e.watch(()=>n.selectedResult,()=>{w()},{immediate:!1}),e.watch([l,s],()=>{g()}),e.watch([i,c],()=>{b.value++});const h=()=>{const t=o.value?.$el?.parentElement;if(t){const r=t.getBoundingClientRect(),a=Math.floor(r.width)-32,d=Math.floor(a*9/16);(a!==i.value||d!==c.value)&&(i.value=a,c.value=d)}};return e.onMounted(async()=>{await e.nextTick(),h(),window.addEventListener("resize",h)}),e.onUnmounted(()=>{window.removeEventListener("resize",h)}),(t,r)=>(e.openBlock(),e.createElementBlock("div",M,[e.createElementVNode("div",B,[e.createElementVNode("div",O,[e.createElementVNode("div",F,[e.createElementVNode("div",D,[e.createElementVNode("div",I,[(e.openBlock(),e.createElementBlock(e.Fragment,null,e.renderList([2,5,10,20],a=>e.createElementVNode("button",{key:a,onClick:d=>l.value=a,class:e.normalizeClass(["w-8 h-8 rounded border-2 transition-colors",l.value===a?"border-blue-500 bg-blue-100":"border-gray-300 bg-white hover:bg-gray-50"])},[e.createElementVNode("div",{class:e.normalizeClass("bg-gray-800 rounded-full mx-auto"),style:e.normalizeStyle({width:Math.max(2,a*1)+"px",height:Math.max(2,a*1)+"px"})},null,4)],10,$)),64))])]),e.createElementVNode("div",L,[e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":r[0]||(r[0]=a=>s.value=a),type:"color",class:"w-12 h-8 rounded border border-gray-300"},null,512),[[e.vModelText,s.value]])])]),e.createElementVNode("div",{class:"flex items-center gap-1"},[e.createElementVNode("button",{onClick:N,class:"w-8 h-8 flex items-center justify-center rounded border-2 border-gray-300 bg-white hover:bg-gray-50",title:"Undo"}," ↩ "),e.createElementVNode("button",{onClick:R,class:"w-8 h-8 flex items-center justify-center rounded border-2 border-gray-300 bg-white hover:bg-gray-50",title:"Redo"}," ↪ "),e.createElementVNode("button",{onClick:V,class:"w-8 h-8 flex items-center justify-center rounded border-2 border-red-300 bg-white hover:bg-red-50",title:"Clear"}," 🗑 ")])])]),e.createElementVNode("div",j,[(e.openBlock(),e.createBlock(e.unref(T),{ref_key:"canvasRef",ref:o,key:`${v.selectedResult?.uuid||"default"}-${b.value}`,image:f.value,"onUpdate:image":r[1]||(r[1]=a=>f.value=a),width:i.value,height:c.value,"stroke-type":"dash","line-cap":"round","line-join":"round","fill-shape":!1,eraser:!1,lineWidth:l.value,color:s.value,"background-color":"#FFFFFF","background-image":void 0,watermark:void 0,"initial-image":m.value,saveAs:"png",styles:{border:"1px solid #ddd",borderRadius:"8px"},lock:!1,onMouseup:y,onTouchend:y},null,8,["image","width","height","lineWidth","color","initial-image"]))]),e.createElementVNode("div",A,[(e.openBlock(),e.createElementBlock(e.Fragment,null,e.renderList(E,a=>e.createElementVNode("button",{key:a.label,onClick:d=>S(a.prompt),class:"px-4 py-1.5 rounded border-2 border-gray-300 bg-white hover:bg-gray-50 text-sm font-medium transition-colors"},e.toDisplayString(a.label),9,P)),64))])]))}}),U={class:"min-h-24 flex items-center justify-center"},W=["src"],z={key:1,class:"text-gray-400 text-sm"},_=e.defineComponent({__name:"Preview",props:{result:{}},setup(v){return(p,n)=>(e.openBlock(),e.createElementBlock("div",U,[v.result.data?.imageData?(e.openBlock(),e.createElementBlock("img",{key:0,src:v.result.data.imageData,class:"max-w-full h-auto rounded",alt:"Canvas drawing"},null,8,W)):(e.openBlock(),e.createElementBlock("div",z,"No drawing yet"))]))}}),x={...u.pluginCore,viewComponent:k,previewComponent:_},H={plugin:x};exports.SYSTEM_PROMPT=u.SYSTEM_PROMPT;exports.TOOL_DEFINITION=u.TOOL_DEFINITION;exports.TOOL_NAME=u.TOOL_NAME;exports.executeOpenCanvas=u.executeOpenCanvas;exports.pluginCore=u.pluginCore;exports.Preview=_;exports.View=k;exports.default=H;exports.plugin=x;
package/dist/vue.js CHANGED
@@ -1,207 +1,222 @@
1
- import { pluginCore as E } from "./core.js";
2
- import { SYSTEM_PROMPT as ce, TOOL_DEFINITION as de, TOOL_NAME as ue, executeOpenCanvas as ve } from "./core.js";
3
- import { defineComponent as R, ref as o, watch as p, onMounted as F, nextTick as $, onUnmounted as O, createElementBlock as m, openBlock as u, createElementVNode as a, Fragment as j, renderList as W, normalizeClass as C, normalizeStyle as L, withDirectives as N, vModelText as U, createBlock as V, unref as z } from "vue";
4
- import B from "vue-drawing-canvas";
5
- const H = { class: "w-full h-full flex flex-col bg-white" }, I = { class: "flex-shrink-0 p-4 border-b bg-gray-50" }, P = { class: "flex items-center justify-between gap-4" }, A = { class: "flex items-center gap-4" }, K = { class: "flex items-center gap-2" }, Y = { class: "flex gap-1" }, q = ["onClick"], G = { class: "flex items-center gap-2" }, J = { class: "flex-1 p-4 overflow-hidden" }, Q = /* @__PURE__ */ R({
1
+ import { pluginCore as O } from "./core.js";
2
+ import { SYSTEM_PROMPT as he, TOOL_DEFINITION as me, TOOL_NAME as pe, executeOpenCanvas as be } from "./core.js";
3
+ import { defineComponent as M, ref as n, watch as f, onMounted as U, nextTick as j, onUnmounted as A, openBlock as r, createElementBlock as g, createElementVNode as a, Fragment as C, renderList as S, normalizeClass as R, normalizeStyle as W, withDirectives as L, vModelText as N, createBlock as V, unref as z, toDisplayString as B } from "vue";
4
+ import H from "vue-drawing-canvas";
5
+ const P = { class: "w-full h-full flex flex-col bg-white" }, G = { class: "flex-shrink-0 p-4 border-b bg-gray-50" }, J = { class: "flex items-center justify-between gap-4" }, K = { class: "flex items-center gap-4" }, Y = { class: "flex items-center gap-2" }, q = { class: "flex gap-1" }, Q = ["onClick"], X = { class: "flex items-center gap-2" }, Z = { class: "flex-1 p-4 overflow-hidden" }, ee = { class: "flex-shrink-0 px-4 pt-2 pb-4 flex gap-2 border-t bg-gray-50" }, te = ["onClick"], ae = /* @__PURE__ */ M({
6
6
  __name: "View",
7
7
  props: {
8
- selectedResult: {}
8
+ selectedResult: {},
9
+ sendTextMessage: { type: Function }
9
10
  },
10
11
  emits: ["updateResult"],
11
- setup(v, { emit: b }) {
12
- const n = v, S = b, s = o(null), y = o(""), l = o(5), i = o("#000000"), f = o([]), c = o(800), d = o(600), x = o(0), _ = () => {
13
- if (n.selectedResult?.viewState?.drawingState) {
14
- const e = n.selectedResult.viewState.drawingState;
15
- l.value = e.brushSize || 5, i.value = e.brushColor || "#000000", c.value = e.canvasWidth || 800, d.value = e.canvasHeight || 600, e.strokes ? f.value = e.strokes : f.value = [];
12
+ setup(h, { emit: w }) {
13
+ const s = h, T = w, D = [
14
+ { label: "Ghibli", prompt: "Convert this drawing into a Studio Ghibli style image using editImage." },
15
+ { label: "Ukiyoe", prompt: "Convert this drawing into a Japanese Ukiyo-e woodblock print style using editImage." },
16
+ { label: "Suibokuga", prompt: "Convert this drawing into a Japanese Suibokuga ink wash painting style using editImage." },
17
+ { label: "American Comic", prompt: "Convert this drawing into a classic American superhero comic book style using editImage — bold ink outlines, flat vivid colors, halftone shading, and dynamic composition typical of mid-20th century American comics." }
18
+ ], F = (e) => {
19
+ s.sendTextMessage?.(e);
20
+ }, o = n(null), y = n(""), l = n(5), c = n("#000000"), p = n([]), d = n(800), u = n(600), x = n(0), k = () => {
21
+ if (s.selectedResult?.viewState?.drawingState) {
22
+ const e = s.selectedResult.viewState.drawingState;
23
+ l.value = e.brushSize || 5, c.value = e.brushColor || "#000000", d.value = e.canvasWidth || 800, u.value = e.canvasHeight || 600, e.strokes ? p.value = e.strokes : p.value = [];
16
24
  } else
17
- f.value = [];
25
+ p.value = [];
18
26
  };
19
- _();
20
- const M = async () => {
21
- if (s.value)
27
+ k();
28
+ const E = async () => {
29
+ if (o.value)
22
30
  try {
23
- s.value.undo(), setTimeout(h, 50);
31
+ o.value.undo(), setTimeout(m, 50);
24
32
  } catch (e) {
25
33
  console.warn("Undo operation failed:", e);
26
34
  }
27
- }, T = async () => {
28
- if (s.value)
35
+ }, $ = async () => {
36
+ if (o.value)
29
37
  try {
30
- s.value.redo(), setTimeout(h, 50);
38
+ o.value.redo(), setTimeout(m, 50);
31
39
  } catch (e) {
32
40
  console.warn("Redo operation failed:", e);
33
41
  }
34
- }, D = () => {
35
- if (s.value)
42
+ }, I = () => {
43
+ if (o.value)
36
44
  try {
37
- s.value.reset(), h();
45
+ o.value.reset(), m();
38
46
  } catch (e) {
39
47
  console.warn("Clear operation failed:", e);
40
48
  }
41
- }, k = () => {
42
- h();
43
- }, h = async () => {
44
- if (s.value && n.selectedResult)
49
+ }, _ = () => {
50
+ m();
51
+ }, m = async () => {
52
+ if (o.value && s.selectedResult)
45
53
  try {
46
- const e = await s.value.save(), t = {
47
- strokes: s.value.getAllStrokes(),
54
+ const e = await o.value.save(), t = {
55
+ strokes: o.value.getAllStrokes(),
48
56
  brushSize: l.value,
49
- brushColor: i.value,
50
- canvasWidth: c.value,
51
- canvasHeight: d.value
52
- }, g = {
53
- ...n.selectedResult,
57
+ brushColor: c.value,
58
+ canvasWidth: d.value,
59
+ canvasHeight: u.value
60
+ }, v = {
61
+ ...s.selectedResult,
54
62
  data: {
55
- prompt: n.selectedResult.data?.prompt || "",
63
+ prompt: s.selectedResult.data?.prompt || "",
56
64
  imageData: e
57
65
  },
58
66
  viewState: {
59
67
  drawingState: t
60
68
  }
61
69
  };
62
- S("updateResult", g);
70
+ T("updateResult", v);
63
71
  } catch (e) {
64
72
  console.error("Failed to save drawing state:", e);
65
73
  }
66
74
  };
67
- p(
68
- () => n.selectedResult,
75
+ f(
76
+ () => s.selectedResult,
69
77
  () => {
70
- _();
78
+ k();
71
79
  },
72
80
  { immediate: !1 }
73
- ), p([l, i], () => {
74
- h();
75
- }), p([c, d], () => {
81
+ ), f([l, c], () => {
82
+ m();
83
+ }), f([d, u], () => {
76
84
  x.value++;
77
85
  });
78
- const w = () => {
79
- const e = s.value?.$el?.parentElement;
86
+ const b = () => {
87
+ const e = o.value?.$el?.parentElement;
80
88
  if (e) {
81
- const r = e.getBoundingClientRect(), t = Math.floor(r.width), g = Math.floor(t * 9 / 16);
82
- (t !== c.value || g !== d.value) && (c.value = t, d.value = g);
89
+ const i = e.getBoundingClientRect(), t = Math.floor(i.width) - 32, v = Math.floor(t * 9 / 16);
90
+ (t !== d.value || v !== u.value) && (d.value = t, u.value = v);
83
91
  }
84
92
  };
85
- return F(async () => {
86
- await $(), w(), window.addEventListener("resize", w);
87
- }), O(() => {
88
- window.removeEventListener("resize", w);
89
- }), (e, r) => (u(), m("div", H, [
90
- a("div", I, [
91
- a("div", P, [
92
- a("div", A, [
93
- a("div", K, [
94
- a("div", Y, [
95
- (u(), m(j, null, W([2, 5, 10, 20], (t) => a("button", {
93
+ return U(async () => {
94
+ await j(), b(), window.addEventListener("resize", b);
95
+ }), A(() => {
96
+ window.removeEventListener("resize", b);
97
+ }), (e, i) => (r(), g("div", P, [
98
+ a("div", G, [
99
+ a("div", J, [
100
+ a("div", K, [
101
+ a("div", Y, [
102
+ a("div", q, [
103
+ (r(), g(C, null, S([2, 5, 10, 20], (t) => a("button", {
96
104
  key: t,
97
- onClick: (g) => l.value = t,
98
- class: C([
105
+ onClick: (v) => l.value = t,
106
+ class: R([
99
107
  "w-8 h-8 rounded border-2 transition-colors",
100
108
  l.value === t ? "border-blue-500 bg-blue-100" : "border-gray-300 bg-white hover:bg-gray-50"
101
109
  ])
102
110
  }, [
103
111
  a("div", {
104
- class: C("bg-gray-800 rounded-full mx-auto"),
105
- style: L({
112
+ class: R("bg-gray-800 rounded-full mx-auto"),
113
+ style: W({
106
114
  width: Math.max(2, t * 1) + "px",
107
115
  height: Math.max(2, t * 1) + "px"
108
116
  })
109
117
  }, null, 4)
110
- ], 10, q)), 64))
118
+ ], 10, Q)), 64))
111
119
  ])
112
120
  ]),
113
- a("div", G, [
114
- N(a("input", {
115
- "onUpdate:modelValue": r[0] || (r[0] = (t) => i.value = t),
121
+ a("div", X, [
122
+ L(a("input", {
123
+ "onUpdate:modelValue": i[0] || (i[0] = (t) => c.value = t),
116
124
  type: "color",
117
125
  class: "w-12 h-8 rounded border border-gray-300"
118
126
  }, null, 512), [
119
- [U, i.value]
127
+ [N, c.value]
120
128
  ])
121
129
  ])
122
130
  ]),
123
131
  a("div", { class: "flex items-center gap-1" }, [
124
132
  a("button", {
125
- onClick: M,
133
+ onClick: E,
126
134
  class: "w-8 h-8 flex items-center justify-center rounded border-2 border-gray-300 bg-white hover:bg-gray-50",
127
135
  title: "Undo"
128
136
  }, " ↩ "),
129
137
  a("button", {
130
- onClick: T,
138
+ onClick: $,
131
139
  class: "w-8 h-8 flex items-center justify-center rounded border-2 border-gray-300 bg-white hover:bg-gray-50",
132
140
  title: "Redo"
133
141
  }, " ↪ "),
134
142
  a("button", {
135
- onClick: D,
143
+ onClick: I,
136
144
  class: "w-8 h-8 flex items-center justify-center rounded border-2 border-red-300 bg-white hover:bg-red-50",
137
145
  title: "Clear"
138
146
  }, " 🗑 ")
139
147
  ])
140
148
  ])
141
149
  ]),
142
- a("div", J, [
143
- (u(), V(z(B), {
150
+ a("div", Z, [
151
+ (r(), V(z(H), {
144
152
  ref_key: "canvasRef",
145
- ref: s,
146
- key: `${v.selectedResult?.uuid || "default"}-${x.value}`,
153
+ ref: o,
154
+ key: `${h.selectedResult?.uuid || "default"}-${x.value}`,
147
155
  image: y.value,
148
- "onUpdate:image": r[1] || (r[1] = (t) => y.value = t),
149
- width: c.value,
150
- height: d.value,
156
+ "onUpdate:image": i[1] || (i[1] = (t) => y.value = t),
157
+ width: d.value,
158
+ height: u.value,
151
159
  "stroke-type": "dash",
152
160
  "line-cap": "round",
153
161
  "line-join": "round",
154
162
  "fill-shape": !1,
155
163
  eraser: !1,
156
164
  lineWidth: l.value,
157
- color: i.value,
165
+ color: c.value,
158
166
  "background-color": "#FFFFFF",
159
167
  "background-image": void 0,
160
168
  watermark: void 0,
161
- "initial-image": f.value,
169
+ "initial-image": p.value,
162
170
  saveAs: "png",
163
171
  styles: {
164
172
  border: "1px solid #ddd",
165
173
  borderRadius: "8px"
166
174
  },
167
175
  lock: !1,
168
- onMouseup: k,
169
- onTouchend: k
176
+ onMouseup: _,
177
+ onTouchend: _
170
178
  }, null, 8, ["image", "width", "height", "lineWidth", "color", "initial-image"]))
179
+ ]),
180
+ a("div", ee, [
181
+ (r(), g(C, null, S(D, (t) => a("button", {
182
+ key: t.label,
183
+ onClick: (v) => F(t.prompt),
184
+ class: "px-4 py-1.5 rounded border-2 border-gray-300 bg-white hover:bg-gray-50 text-sm font-medium transition-colors"
185
+ }, B(t.label), 9, te)), 64))
171
186
  ])
172
187
  ]));
173
188
  }
174
- }), X = { class: "min-h-24 flex items-center justify-center" }, Z = ["src"], ee = {
189
+ }), oe = { class: "min-h-24 flex items-center justify-center" }, se = ["src"], ne = {
175
190
  key: 1,
176
191
  class: "text-gray-400 text-sm"
177
- }, te = /* @__PURE__ */ R({
192
+ }, ie = /* @__PURE__ */ M({
178
193
  __name: "Preview",
179
194
  props: {
180
195
  result: {}
181
196
  },
182
- setup(v) {
183
- return (b, n) => (u(), m("div", X, [
184
- v.result.data?.imageData ? (u(), m("img", {
197
+ setup(h) {
198
+ return (w, s) => (r(), g("div", oe, [
199
+ h.result.data?.imageData ? (r(), g("img", {
185
200
  key: 0,
186
- src: v.result.data.imageData,
201
+ src: h.result.data.imageData,
187
202
  class: "max-w-full h-auto rounded",
188
203
  alt: "Canvas drawing"
189
- }, null, 8, Z)) : (u(), m("div", ee, "No drawing yet"))
204
+ }, null, 8, se)) : (r(), g("div", ne, "No drawing yet"))
190
205
  ]));
191
206
  }
192
- }), ae = {
193
- ...E,
194
- viewComponent: Q,
195
- previewComponent: te
196
- }, re = { plugin: ae };
207
+ }), re = {
208
+ ...O,
209
+ viewComponent: ae,
210
+ previewComponent: ie
211
+ }, ue = { plugin: re };
197
212
  export {
198
- te as Preview,
199
- ce as SYSTEM_PROMPT,
200
- de as TOOL_DEFINITION,
201
- ue as TOOL_NAME,
202
- Q as View,
203
- re as default,
204
- ve as executeOpenCanvas,
205
- ae as plugin,
206
- E as pluginCore
213
+ ie as Preview,
214
+ he as SYSTEM_PROMPT,
215
+ me as TOOL_DEFINITION,
216
+ pe as TOOL_NAME,
217
+ ae as View,
218
+ ue as default,
219
+ be as executeOpenCanvas,
220
+ re as plugin,
221
+ O as pluginCore
207
222
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gui-chat-plugin/canvas",
3
- "version": "0.3.1",
3
+ "version": "0.3.3",
4
4
  "description": "Drawing canvas plugin for GUIChat",
5
5
  "type": "module",
6
6
  "main": "./dist/index.cjs",