@christianriedl/utils 1.0.147 → 1.0.149

package/dist/iOpenAI.d.ts

@@ -17,10 +17,11 @@ export interface IResultContent {
 export interface IResultOutput {
     id: string;
     queries?: string[];
+    result?: string;
     results?: any[];
     role?: 'assistant';
     status?: 'in_progress' | 'completed' | 'incomplete';
-    type: 'message' | 'file_search_call' | 'mcp_call' | 'function_call';
+    type: 'message' | 'file_search_call' | 'mcp_call' | 'function_call' | 'image_generation';
     content?: IResultContent[];
 }
 export interface IResponseResult {
@@ -28,6 +29,7 @@ export interface IResponseResult {
     output?: IResultOutput[];
     text?: string;
     error?: string;
+    image?: string;
     json?: any;
     usage?: {
         inputTokens: number;
@@ -41,7 +43,7 @@ export interface ISchema {
     schema?: Dictionary<unknown>;
 }
 export interface ITool {
-    type: 'mcp' | 'file_search' | 'web_search_preview' | 'web_search_preview_2025_03_11' | 'function';
+    type: 'mcp' | 'file_search' | 'web_search_preview' | 'web_search_preview_2025_03_11' | 'function' | 'image_generation';
 }
 export interface IMcpTool extends ITool {
     type: 'mcp';
@@ -64,6 +66,15 @@ export interface IWebSearchLocation {
     country?: string | null;
     region?: string | null;
 }
+export interface IImageGenerationTool extends ITool {
+    type: 'image_generation';
+    background?: 'transparent' | 'opaque' | 'auto';
+    input_fidelity?: 'low' | 'high';
+    model?: string;
+    output_format?: 'jpeg' | 'png' | 'webp';
+    quality?: 'low' | 'medium' | 'high' | 'auto';
+    size?: '1024x1024' | '1024x1536' | '1536x1024' | 'auto';
+}
 export interface IWebSearchTool extends ITool {
     type: 'web_search_preview' | 'web_search_preview_2025_03_11';
     search_context_size?: 'low' | 'medium' | 'high';
@@ -114,6 +125,7 @@ export interface IOpenAIServiceWithTools extends IOpenAIService {
     addMcpTool(tool: IMcpTool): void;
     addFileSearchTool(label: string, tool: IFileSearchTool): 'notfound' | 'exists' | 'changed';
     addWebSearchTool(label: string, tool: IWebSearchTool): void;
+    addImageGenerationTool(label: string, tool: IImageGenerationTool): void;
     addFunctionTool(tool: IFunctionTool, toolFunction: ToolFunction): void;
     getToolFunctions(tool: string): Promise<IResponseResult>;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@christianriedl/utils",
-  "version": "1.0.147",
+  "version": "1.0.149",
   "description": "Interfaces, local storage, service worker, configuration, application state",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/src/components/OpenAI.vue

@@ -32,6 +32,7 @@
     const tools = ref(props.tools);
     const filter = ref<IOpenAIFilter | undefined>(undefined);
     const tooltips = computed(() => tools.value ? 'Tools: ' + tools.value.join(',') : 'No Tools');
+    const imageSrc = ref('');
 
     onUnmounted(() => {
 	openAI.clearContext();
@@ -50,6 +51,7 @@
 	    camera.value = undefined;
 	    isCamera.value = false;
 	}
+	imageSrc.value = '';
 	if (imageUrl.value) {
 	    answer = await openAI.response(question.value, undefined, imageUrl.value);
 	    imageUrl.value = "";
@@ -62,6 +64,9 @@
 		answer = await openAI.response(question.value, undefined, undefined, undefined, filter.value);
 	    }
 	}
+	if (answer && answer.image) {
+	    imageSrc.value = answer.image;
+	}
 	if (answer && answer.text) {
 	    emits('result', answer.text);
 	    if (openAI.options.outputFormat == 'markdown') {
@@ -213,6 +218,7 @@
 	<v-row v-else v-for="(line, index) in replyLines" :key=index dense align="center">
 	    <v-col cols="12">{{line}}</v-col>
 	</v-row>
+	<v-img v-if="imageSrc" :src="imageSrc"></v-img>
 	<v-dialog v-model="showConfig" :fullscreen="isMobile">
 	    <OpenAIConfig :tools="tools" :ismobile="isMobile" @use="onUse" @back="showConfig=false"></OpenAIConfig>
 	</v-dialog>

package/src/components/OpenAIConfig.vue

@@ -429,6 +429,35 @@
 		    <v-checkbox v-model="use[key]" label="Use" hide-details density="compact" @update:modelValue="onUseChange"></v-checkbox>
 		</v-col>
 	    </v-row>
+	    <v-row v-if="tool.type == 'image_generation'" dense align="center">
+		<v-col cols="1">
+		    <v-text-field :model-value="key" type="string" hide-details disabled label="image_generation" density="compact" @change="onToolChange"></v-text-field>
+		</v-col>
+		<v-col cols="2">
+		    <v-text-field v-model="tool.model" type="string" hide-details :clearable="canClear" label="Model" density="compact" @change="onToolChange"></v-text-field>
+		</v-col>
+		<v-col cols="2">
+		    <v-select v-model="tool.input_fidelity" :items="['low', 'high' ]" hide-details density="compact"
+		      label="Fidelity" @update:modelValue="onToolChange">
+		    </v-select>
+		</v-col>
+		<v-col cols="2">
+		    <v-select v-model="tool.quality" :items="['auto', 'low', 'medium', 'high' ]" hide-details density="compact"
+		      label="Quality" @update:modelValue="onToolChange">
+		    </v-select>
+		</v-col>
+		<v-col cols="3">
+		    <v-select v-model="tool.size" :items="['auto', '1024x1024', '1024x1536', '1536x1024' ]" hide-details density="compact"
+		      label="Size" @update:modelValue="onToolChange">
+		    </v-select>
+		</v-col>
+		<v-col cols="1">
+		    <v-btn icon="$delete" variant="tonal" @click.stop.prevent="onDelete(key)"></v-btn>
+		</v-col>
+		<v-col cols="1">
+		    <v-checkbox v-model="use[key]" label="Use" hide-details density="compact" @update:modelValue="onUseChange"></v-checkbox>
+		</v-col>
+	    </v-row>
 	    <v-row v-if="tool.type.startsWith('web_search')" dense align="center">
 		<v-col cols="1">
 		    <v-text-field :model-value="key" type="string" hide-details disabled label="file_search" density="compact" @change="onToolChange"></v-text-field>

package/src/components/OpenAIFilter.vue

@@ -81,22 +81,6 @@
 	<h4>Tools and FileSearch filter</h4>
 	<v-row dense>
 	    <v-col cols="4">
-		<!--
-		<v-table density="compact">
-		    <thead>
-			<tr>
-			    <th class="font-weight-bold">Tool use</th>
-			</tr>
-		    </thead>
-		    <tbody>
-			<tr v-for="(tool,key) in tools" :key="key">
-			    <td>
-				<v-checkbox density="compact" hide-details v-model="tools[key]" :label="key.toString()"></v-checkbox>
-			    </td>
-			</tr>
-		    </tbody>
-		</v-table>
-		-->
 		<v-row dense class="font-weight-bold">
 		    <v-col cols="4">Tool Use</v-col>
 		</v-row>
@@ -108,23 +92,6 @@
 		</v-row>
 	    </v-col>
 	    <v-col cols="8">
-		<!--
-		<v-table density="compact">
-		    <thead>
-			<tr>
-			    <th class="font-weight-bold" style="width:35%">Name</th>
-			    <th class="font-weight-bold" style="width:35%">Value</th>
-			    <th class="font-weight-bold" style="width:30%">Op</th>
-			</tr>
-		    </thead>
-		    <tbody>
-			<settings-line v-for="(item, index) in items" :key="item.name" :item="item" :op="operators[item.name]"
-				       :operations="index < numvs ? opsvs : opsfile" @change="onChange(item, true)"
-				       @clear="onChange(item, false)" @operation="(op) => onOperation(item, op)">
-			</settings-line>
-		    </tbody>
-		</v-table>
-		-->
 		<v-row dense class="font-weight-bold">
 		    <v-col cols="6">Name</v-col>
 		    <v-col cols="4">Value</v-col>
@@ -139,8 +106,8 @@
 	</v-row>
 	<v-row dense>
 	    <v-col cols="12">
-		<v-btn @click="onBack()">BACK<v-icon icon="$back"></v-icon></v-btn>
-		<v-btn @click="emits('config')">CONFIG<v-icon icon="$settings"></v-icon></v-btn>
+		<v-btn class="bg-office" @click="onBack()">BACK<v-icon icon="$back"></v-icon></v-btn>
+		<v-btn class="bg-office" @click="emits('config')">CONFIG<v-icon icon="$settings"></v-icon></v-btn>
 	    </v-col>
 	</v-row>
     </v-container>

package/src/components/OpenAIMetaData.vue

@@ -33,25 +33,6 @@
 <template>
     <v-container fluid class="bg-office">
 	<h4>{{header}}</h4>
-	<!--
-    <v-table>
-	<thead>
-	    <tr>
-		<th class="font-weight-bold" style="width:50%">Name</th>
-		<th class="font-weight-bold" style="width:50%">Value</th>
-	    </tr>
-	</thead>
-	<tbody>
-	    <settings-line v-for="item in items" :key="item.name" :item="item" @change="onChange(item, true)" clearable @clear="onChange(item, false)"></settings-line>
-	    <tr>
-		<td>
-		    <v-btn @click="onBack">BACK</v-btn>
-		</td>
-		<td></td>
-	    </tr>
-	</tbody>
-    </v-table>
-    -->
 	<v-row dense class="font-weight-bold">
 	    <v-col cols="6">Topic</v-col>
 	    <v-col cols="6">Parameter</v-col>

package/src/components/SettingsLine.vue

@@ -29,26 +29,6 @@
 </script>
 
 <template>
-    <!--
-    <tr v-if="isVisible" class="settingsline">
-        <td >{{description}}</td>
-        <td>
-            <v-switch v-if="isBoolean" v-model="item.value" :disabled="isDisabled" density="compact" hide-details color="primary"
-                            :append-icon="props.clearable ? '$clear' : undefined" @update:modelValue="onChange" @click:append="onClear"></v-switch>
-            <v-text-field v-if="isString" v-model="item.value" :disabled="isDisabled" :clearable="props.clearable" density="compact"
-                            hide-details type="string" @update:modelValue="onChange" @click:clear="onClear"></v-text-field>
-            <v-text-field v-if="isNumber" v-model="item.value" :disabled="isDisabled" :clearable="props.clearable" density="compact"
-                            hide-details type="number"  @update:modelValue="onChange" @click:clear="onClear"></v-text-field>
-            <v-select v-if="isEnum" name="enum" density="compact" v-model="item.value" :disabled="isDisabled" :clearable="props.clearable"
-                            :items="enumValues" persistent-hint @update:modelValue="onChange" @click:clear="onClear" dense solo hide-details single-line>
-            </v-select>
-        </td>
-        <td v-if="props.operations">
-            <v-select density="compact" v-model="operation" :items="props.operations" persistent-hint @update:modelValue="onChangeOperation" dense solo hide-details single-line>
-            </v-select>
-        </td>
-    </tr>
-    -->
     <v-row dense v-if="isVisible">
         <v-col cols="6">{{description}}</v-col>
         <v-col cols="props.operations ? 4 : 6">

package/src/views/SettingsPage.vue

@@ -62,19 +62,6 @@
 <template>
     <v-container fluid :style="heightStyle">
         <h2>Settings</h2>
-        <!--
-    <v-table>
-        <thead>
-            <tr>
-                <th class="font-weight-bold" style="width:50%">Topic</th>
-                <th class="font-weight-bold" style="width:50%">Parameter</th>
-            </tr>
-        </thead>
-        <tbody>
-            <settings-line v-for="config in appConfig.items" :key="config.name" :item="config" :scopes="scopes" @change="onChange(config)"></settings-line>
-        </tbody>
-    </v-table>
-     -->
         <v-row dense class="font-weight-bold">
             <v-col cols="6">Topic</v-col>
             <v-col cols="6">Parameter</v-col>