llms-py 3.0.7__py3-none-any.whl → 3.0.9__py3-none-any.whl

llms/ui/App.mjs

@@ -31,7 +31,7 @@ const LeftBar = {
 const LeftPanel = {
     template: `
         <div v-if="component" class="flex flex-col h-full border-r border-gray-200 dark:border-gray-700">
-            <button type="button" class="absolute top-2 right-2 p-1 rounded-md text-gray-500 hover:bg-gray-100 dark:hover:bg-gray-700 lg:hidden z-20">
+            <button type="button" @click="$ctx.toggleLayout('left',false)" class="absolute top-2 right-2 p-1 rounded-md text-gray-500 hover:bg-gray-100 dark:hover:bg-gray-700 lg:hidden z-20">
                 <svg class="size-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/></svg>
             </button>
             <component :is="component" />

llms/ui/ai.mjs

@@ -6,7 +6,7 @@ const headers = { 'Accept': 'application/json' }
 const prefsKey = 'llms.prefs'
 
 export const o = {
-    version: '3.0.7',
+    version: '3.0.9',
     base,
     prefsKey,
     welcome: 'Welcome to llms.py',

llms/ui/app.css

@@ -20,8 +20,10 @@
     --color-red-900: oklch(39.6% 0.141 25.723);
     --color-orange-100: oklch(95.4% 0.038 75.164);
     --color-orange-200: oklch(90.1% 0.076 70.697);
+    --color-orange-300: oklch(83.7% 0.128 66.29);
     --color-orange-400: oklch(75% 0.183 55.934);
     --color-orange-600: oklch(64.6% 0.222 41.116);
+    --color-orange-700: oklch(55.3% 0.195 38.402);
     --color-orange-800: oklch(47% 0.157 37.304);
     --color-orange-900: oklch(40.8% 0.123 38.172);
     --color-yellow-50: oklch(98.7% 0.026 102.212);
@@ -91,6 +93,7 @@
     --color-purple-700: oklch(49.6% 0.265 301.924);
     --color-purple-800: oklch(43.8% 0.218 303.724);
     --color-purple-900: oklch(38.1% 0.176 304.987);
+    --color-fuchsia-50: oklch(97.7% 0.017 320.058);
     --color-fuchsia-100: oklch(95.2% 0.037 318.852);
     --color-fuchsia-200: oklch(90.3% 0.076 319.62);
     --color-fuchsia-300: oklch(83.3% 0.145 321.434);
@@ -484,12 +487,6 @@
   .z-100 {
     z-index: 100;
   }
-  .z-\[100\] {
-    z-index: 100;
-  }
-  .z-\[101\] {
-    z-index: 101;
-  }
   .col-span-2 {
     grid-column: span 2 / span 2;
   }
@@ -538,6 +535,9 @@
   .mx-2 {
     margin-inline: calc(var(--spacing) * 2);
   }
+  .mx-4 {
+    margin-inline: calc(var(--spacing) * 4);
+  }
   .mx-auto {
     margin-inline: auto;
   }
@@ -616,6 +616,9 @@
   .mr-16 {
     margin-right: calc(var(--spacing) * 16);
   }
+  .-mb-4 {
+    margin-bottom: calc(var(--spacing) * -4);
+  }
   .-mb-px {
     margin-bottom: -1px;
   }
@@ -806,6 +809,9 @@
   .h-\[37px\] {
     height: 37px;
   }
+  .h-auto {
+    height: auto;
+  }
   .h-full {
     height: 100%;
   }
@@ -827,9 +833,15 @@
   .max-h-96 {
     max-height: calc(var(--spacing) * 96);
   }
+  .max-h-\[80vh\] {
+    max-height: 80vh;
+  }
   .max-h-\[90vh\] {
     max-height: 90vh;
   }
+  .max-h-\[200px\] {
+    max-height: 200px;
+  }
   .max-h-\[calc\(90vh-140px\)\] {
     max-height: calc(90vh - 140px);
   }
@@ -902,6 +914,9 @@
   .w-80 {
     width: calc(var(--spacing) * 80);
   }
+  .w-auto {
+    width: auto;
+  }
   .w-full {
     width: 100%;
   }
@@ -941,6 +956,9 @@
   .max-w-\[140px\] {
     max-width: 140px;
   }
+  .max-w-\[200px\] {
+    max-width: 200px;
+  }
   .max-w-\[400px\] {
     max-width: 400px;
   }
@@ -953,12 +971,18 @@
   .max-w-lg {
     max-width: var(--container-lg);
   }
+  .max-w-md {
+    max-width: var(--container-md);
+  }
   .max-w-none {
     max-width: none;
   }
   .max-w-sm {
     max-width: var(--container-sm);
   }
+  .max-w-xl {
+    max-width: var(--container-xl);
+  }
   .max-w-xs {
     max-width: var(--container-xs);
   }
@@ -1087,6 +1111,9 @@
   .-rotate-12 {
     rotate: calc(12deg * -1);
   }
+  .-rotate-90 {
+    rotate: calc(90deg * -1);
+  }
   .rotate-12 {
     rotate: 12deg;
   }
@@ -1123,6 +1150,9 @@
   .cursor-text {
     cursor: text;
   }
+  .cursor-zoom-in {
+    cursor: zoom-in;
+  }
   .resize {
     resize: both;
   }
@@ -1445,6 +1475,9 @@
     --tw-border-style: none;
     border-style: none;
   }
+  .border-blue-100 {
+    border-color: var(--color-blue-100);
+  }
   .border-blue-200 {
     border-color: var(--color-blue-200);
   }
@@ -1484,6 +1517,9 @@
   .border-green-200 {
     border-color: var(--color-green-200);
   }
+  .border-green-300 {
+    border-color: var(--color-green-300);
+  }
   .border-green-400 {
     border-color: var(--color-green-400);
   }
@@ -1604,6 +1640,9 @@
   .bg-cyan-600 {
     background-color: var(--color-cyan-600);
   }
+  .bg-fuchsia-50 {
+    background-color: var(--color-fuchsia-50);
+  }
   .bg-fuchsia-100 {
     background-color: var(--color-fuchsia-100);
   }
@@ -1622,6 +1661,12 @@
       background-color: color-mix(in oklab, var(--color-gray-50) 30%, transparent);
     }
   }
+  .bg-gray-50\/50 {
+    background-color: color-mix(in srgb, oklch(98.5% 0.002 247.839) 50%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-gray-50) 50%, transparent);
+    }
+  }
   .bg-gray-100 {
     background-color: var(--color-gray-100);
   }
@@ -1811,6 +1856,10 @@
     --tw-gradient-from: transparent;
     --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
   }
+  .from-white {
+    --tw-gradient-from: var(--color-white);
+    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
+  }
   .from-yellow-200 {
     --tw-gradient-from: var(--color-yellow-200);
     --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
@@ -2093,6 +2142,12 @@
   .pl-5 {
     padding-left: calc(var(--spacing) * 5);
   }
+  .pl-6 {
+    padding-left: calc(var(--spacing) * 6);
+  }
+  .pl-7 {
+    padding-left: calc(var(--spacing) * 7);
+  }
   .pl-9 {
     padding-left: calc(var(--spacing) * 9);
   }
@@ -2291,6 +2346,9 @@
   .text-cyan-600 {
     color: var(--color-cyan-600);
   }
+  .text-fuchsia-700 {
+    color: var(--color-fuchsia-700);
+  }
   .text-fuchsia-800 {
     color: var(--color-fuchsia-800);
   }
@@ -2351,6 +2409,12 @@
   .text-indigo-700 {
     color: var(--color-indigo-700);
   }
+  .text-orange-600 {
+    color: var(--color-orange-600);
+  }
+  .text-orange-700 {
+    color: var(--color-orange-700);
+  }
   .text-orange-800 {
     color: var(--color-orange-800);
   }
@@ -2399,12 +2463,6 @@
   .text-white {
     color: var(--color-white);
   }
-  .text-white\/70 {
-    color: color-mix(in srgb, #fff 70%, transparent);
-    @supports (color: color-mix(in lab, red, red)) {
-      color: color-mix(in oklab, var(--color-white) 70%, transparent);
-    }
-  }
   .text-yellow-100 {
     color: var(--color-yellow-100);
   }
@@ -2868,6 +2926,13 @@
       }
     }
   }
+  .group-hover\:text-gray-900 {
+    &:is(:where(.group):hover *) {
+      @media (hover: hover) {
+        color: var(--color-gray-900);
+      }
+    }
+  }
   .group-hover\:opacity-75 {
     &:is(:where(.group):hover *) {
       @media (hover: hover) {
@@ -3222,6 +3287,13 @@
       }
     }
   }
+  .hover\:bg-fuchsia-100 {
+    &:hover {
+      @media (hover: hover) {
+        background-color: var(--color-fuchsia-100);
+      }
+    }
+  }
   .hover\:bg-fuchsia-600 {
     &:hover {
       @media (hover: hover) {
@@ -3558,17 +3630,17 @@
       }
     }
   }
-  .hover\:text-white {
+  .hover\:underline {
     &:hover {
       @media (hover: hover) {
-        color: var(--color-white);
+        text-decoration-line: underline;
       }
     }
   }
-  .hover\:underline {
+  .hover\:opacity-90 {
     &:hover {
       @media (hover: hover) {
-        text-decoration-line: underline;
+        opacity: 90%;
       }
     }
   }
@@ -4253,6 +4325,11 @@
       flex-direction: row;
     }
   }
+  .md\:items-center {
+    @media (width >= 48rem) {
+      align-items: center;
+    }
+  }
   .md\:gap-10 {
     @media (width >= 48rem) {
       gap: calc(var(--spacing) * 10);
@@ -4730,6 +4807,14 @@
       background-color: var(--color-cyan-600);
     }
   }
+  .dark\:bg-fuchsia-900\/20 {
+    &:where(.dark, .dark *) {
+      background-color: color-mix(in srgb, oklch(40.1% 0.17 325.612) 20%, transparent);
+      @supports (color: color-mix(in lab, red, red)) {
+        background-color: color-mix(in oklab, var(--color-fuchsia-900) 20%, transparent);
+      }
+    }
+  }
   .dark\:bg-fuchsia-900\/40 {
     &:where(.dark, .dark *) {
       background-color: color-mix(in srgb, oklch(40.1% 0.17 325.612) 40%, transparent);
@@ -4831,6 +4916,14 @@
       background-color: var(--color-green-900);
     }
   }
+  .dark\:bg-green-900\/20 {
+    &:where(.dark, .dark *) {
+      background-color: color-mix(in srgb, oklch(39.3% 0.095 152.535) 20%, transparent);
+      @supports (color: color-mix(in lab, red, red)) {
+        background-color: color-mix(in oklab, var(--color-green-900) 20%, transparent);
+      }
+    }
+  }
   .dark\:bg-green-900\/30 {
     &:where(.dark, .dark *) {
       background-color: color-mix(in srgb, oklch(39.3% 0.095 152.535) 30%, transparent);
@@ -4880,6 +4973,14 @@
       background-color: var(--color-orange-900);
     }
   }
+  .dark\:bg-orange-900\/50 {
+    &:where(.dark, .dark *) {
+      background-color: color-mix(in srgb, oklch(40.8% 0.123 38.172) 50%, transparent);
+      @supports (color: color-mix(in lab, red, red)) {
+        background-color: color-mix(in oklab, var(--color-orange-900) 50%, transparent);
+      }
+    }
+  }
   .dark\:bg-purple-600 {
     &:where(.dark, .dark *) {
       background-color: var(--color-purple-600);
@@ -4979,6 +5080,12 @@
       --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
     }
   }
+  .dark\:from-gray-800 {
+    &:where(.dark, .dark *) {
+      --tw-gradient-from: var(--color-gray-800);
+      --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
+    }
+  }
   .dark\:from-green-900\/20 {
     &:where(.dark, .dark *) {
       --tw-gradient-from: color-mix(in srgb, oklch(39.3% 0.095 152.535) 20%, transparent);
@@ -5175,6 +5282,16 @@
       color: var(--color-orange-200);
     }
   }
+  .dark\:text-orange-300 {
+    &:where(.dark, .dark *) {
+      color: var(--color-orange-300);
+    }
+  }
+  .dark\:text-orange-400 {
+    &:where(.dark, .dark *) {
+      color: var(--color-orange-400);
+    }
+  }
   .dark\:text-purple-100 {
     &:where(.dark, .dark *) {
       color: var(--color-purple-100);
@@ -5225,6 +5342,11 @@
       color: var(--color-white);
     }
   }
+  .dark\:text-yellow-400 {
+    &:where(.dark, .dark *) {
+      color: var(--color-yellow-400);
+    }
+  }
   .dark\:placeholder-gray-400 {
     &:where(.dark, .dark *) {
       &::placeholder {
@@ -5285,6 +5407,15 @@
       }
     }
   }
+  .dark\:group-hover\:text-gray-100 {
+    &:where(.dark, .dark *) {
+      &:is(:where(.group):hover *) {
+        @media (hover: hover) {
+          color: var(--color-gray-100);
+        }
+      }
+    }
+  }
   .dark\:group-hover\:text-gray-500 {
     &:where(.dark, .dark *) {
       &:is(:where(.group):hover *) {
@@ -5445,6 +5576,18 @@
       }
     }
   }
+  .dark\:hover\:bg-fuchsia-900\/40 {
+    &:where(.dark, .dark *) {
+      &:hover {
+        @media (hover: hover) {
+          background-color: color-mix(in srgb, oklch(40.1% 0.17 325.612) 40%, transparent);
+          @supports (color: color-mix(in lab, red, red)) {
+            background-color: color-mix(in oklab, var(--color-fuchsia-900) 40%, transparent);
+          }
+        }
+      }
+    }
+  }
   .dark\:hover\:bg-gray-200 {
     &:where(.dark, .dark *) {
       &:hover {
@@ -5532,6 +5675,18 @@
       }
     }
   }
+  .dark\:hover\:bg-green-900\/40 {
+    &:where(.dark, .dark *) {
+      &:hover {
+        @media (hover: hover) {
+          background-color: color-mix(in srgb, oklch(39.3% 0.095 152.535) 40%, transparent);
+          @supports (color: color-mix(in lab, red, red)) {
+            background-color: color-mix(in oklab, var(--color-green-900) 40%, transparent);
+          }
+        }
+      }
+    }
+  }
   .dark\:hover\:bg-indigo-700 {
     &:where(.dark, .dark *) {
       &:hover {
@@ -6231,6 +6386,35 @@
     overflow-x: auto;
     padding: 1em;
   }
+  .tool-description pre {
+    background-color: #f8fafc !important;
+    color: #1f2937 !important;
+    border: 1px solid #e2e8f0;
+    border-radius: 0.5rem;
+    padding: 0.75rem 1rem;
+    margin: 0.75rem 0;
+    overflow-x: auto;
+  }
+  .tool-description code {
+    color: inherit !important;
+  }
+  .tool-description code.hljs {
+    background: transparent !important;
+    padding: 0;
+    font-size: 0.85em;
+    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+  }
+  .dark .tool-description pre {
+    background-color: #1f2937 !important;
+    border-color: #374151;
+    color: #e5e7eb !important;
+  }
+  .dark .tool-description code {
+    color: inherit !important;
+  }
+  .dark .tool-description code.hljs {
+    color: #e5e7eb;
+  }
   .message pre {
     max-width: 100%;
     min-width: auto;
@@ -6429,21 +6613,33 @@
     .message pre {
       max-width: 500px !important;
     }
+    .has-iframes {
+      min-width: 640px;
+    }
   }
   @media (min-width: 768px) {
     .message pre {
       max-width: 600px !important;
     }
+    .has-iframes {
+      min-width: 640px;
+    }
   }
   @media (min-width: 1024px) {
     .message pre, .message .prose pre {
       max-width: 700px !important;
     }
+    .has-iframes {
+      min-width: 740px;
+    }
   }
   @media (min-width: 1280px) {
     .message pre, .message .prose pre {
       max-width: 800px !important;
     }
+    .has-iframes {
+      min-width: 840px;
+    }
   }
 }
 @property --tw-border-spacing-x {

llms/ui/ctx.mjs

@@ -1,7 +1,7 @@
 
 import { reactive, markRaw } from 'vue'
 import { EventBus, humanize, combinePaths } from "@servicestack/client"
-import { storageObject } from './utils.mjs'
+import { storageObject, isHtml } from './utils.mjs'
 
 export class ExtensionScope {
     constructor(ctx, id) {
@@ -174,7 +174,8 @@ export class AppContext {
     async init() {
         Object.assign(this.state, await this.ai.init(this))
         Object.assign(this.fmt, {
-            markdown: this.renderMarkdown.bind(this)
+            markdown: this.renderMarkdown.bind(this),
+            content: this.renderContent.bind(this),
         })
     }
     setGlobals(globals) {
@@ -334,6 +335,9 @@ export class AppContext {
         this.state.error = null
     }
 
+    resolveUrl(url) {
+        return this.ai.resolveUrl(url)
+    }
     async getJson(url, options) {
         return await this.ai.getJson(url, options)
     }
@@ -396,4 +400,13 @@ export class AppContext {
         // }
         return this.marked.parse(content || '')
     }
-}
+
+    renderContent(content) {
+        // Check for HTML tags to detect HTML content
+        if (isHtml(content)) {
+            // If this is HTML content, return it in an iframe so it doesn't break the page
+            return `<iframe src="data:text/html;charset=utf-8,${encodeURIComponent(content)}"></iframe>`
+        }
+        return this.renderMarkdown(content)
+    }
+}

llms/ui/index.mjs

@@ -9,7 +9,7 @@ import ChatModule from './modules/chat/index.mjs'
 import ModelSelectorModule from './modules/model-selector.mjs'
 import IconsModule from './modules/icons.mjs'
 import { utilsFunctions, utilsFormatters } from './utils.mjs'
-import { marked, markdownFormatters } from './markdown.mjs'
+import { marked } from './markdown.mjs'
 import { AppContext } from './ctx.mjs'
 
 const Components = {