@kortix/ui 0.14.10 → 0.14.12

package/dist/session/tool/tools/image-gen-tool.js

@@ -162,6 +162,8 @@ const cappedWidth = (rect) => `min(100%, calc(${IMAGE_MAX_HEIGHT} * ${rect}))`;
  * Five or more images (R38): ONE grid of six columns whose rows are the
  * bento patterns (`imageGenGrid().rows`: 5 = 3+2, 8 = 4+4, …). Every tile sits
  * in the same grid, placed by line numbers, so a tile is never re-parented.
+ * A strip (portrait tiles, `imageGenGrid().strip`) uses this grid at any count,
+ * with twelve columns: each row is its tiles side by side, one track tall.
  *
  * The grid is as wide as its tallest row allows under the cap (`width`), and
  * each row is exactly `width / rects[k]` tall (`rects[k]` = its tile ratio ×
@@ -172,19 +174,21 @@ const cappedWidth = (rect) => `min(100%, calc(${IMAGE_MAX_HEIGHT} * ${rect}))`;
  * summed below 1, e.g. 16:9 tiles.) A two-track row subtracts the gap between
  * its tracks, so a large tile spanning both is the row's height.
  */
-function gridPlacement(rows, rects) {
+function gridPlacement(rows, rects, strip) {
     const width = `min(100cqw, ${IMAGE_MAX_HEIGHT} * ${Math.min(...rects)})`;
     const tracks = [];
     const places = [];
     rows.forEach((count, row) => {
         const track = tracks.length + 1;
         const height = `${width} / ${rects[row]}`;
-        if (count === 2)
+        if (strip || count === 2)
             tracks.push(`calc(${height})`);
         else
             tracks.push(`calc((${height} - var(--spacing)) / 2)`, `calc((${height} - var(--spacing)) / 2)`);
         for (let i = 0; i < count; i++) {
-            if (count === 2)
+            if (strip)
+                places.push({ gridColumn: `${1 + (12 / count) * i} / span ${12 / count}`, gridRow: `${track}` });
+            else if (count === 2)
                 places.push({ gridColumn: `${1 + 3 * i} / span 3`, gridRow: `${track}` });
             else if (count === 4)
                 places.push({ gridColumn: `${1 + 3 * (i % 2)} / span 3`, gridRow: `${track + Math.floor(i / 2)}` });
@@ -206,13 +210,17 @@ export function ImageGenTool({ call }) {
     const views = useMemo(() => (run ? run.map(sessionLogOpenCall) : [call]).map((one) => imageGenView(one, inTurn ? live : undefined)), [run, call, inTurn, live]);
     const grid = useMemo(() => imageGenGrid(views), [views]);
     const view = views[0];
-    const solo = views.length === 1 && view.images.length === 1;
+    // One tile: a lone image, or one left beside calls the image cap refused.
+    const solo = grid.tiles.length === 1;
     // One fix per card, even when several frames failed for the same reason.
     const repairable = views.find((one) => one.error?.connectModel)?.error ??
         views.flatMap((one) => one.images).find((image) => image.error?.connectModel)?.error;
     const action = repairable ? _jsx(ConnectAction, { code: repairable.code, provider: repairable.provider }) : null;
     // The card carries no prompt and no model (R29): the frames are the content,
     // their status (busy, loading, an error) the only text.
+    // The image cap refused every call before any request: nothing was asked for, so nothing to show.
+    if (!grid.tiles.length)
+        return null;
     if (views.length === 1 && !view.images.length) {
         // The whole call failed or stopped.
         return (_jsx("div", { className: "w-full max-w-md", children: _jsx(FailureNote, { error: view.error, action: action }) }));
@@ -236,14 +244,15 @@ export function ImageGenTool({ call }) {
         return (_jsxs("figure", { className: "flex w-full flex-col gap-2", children: [frame(grid.tiles[0]), action ? _jsx("div", { className: "flex flex-col items-start", children: action }) : null] }));
     }
     const count = grid.tiles.length;
-    const bento = grid.rows.length === 1 ? BENTO[count] : null;
+    const bento = !grid.strip && grid.rows.length === 1 ? BENTO[count] : null;
+    // A row's rectangle over its tile ratio: a strip row is its tiles side by side.
     const rowRects = grid.rows.map((size, row) => {
         const firstTile = grid.tiles[grid.rows.slice(0, row).reduce((sum, n) => sum + n, 0)];
-        return ratioValue(views[firstTile.call].aspectRatio) * BENTO[size].scale;
+        return ratioValue(views[firstTile.call].aspectRatio) * (grid.strip ? size : BENTO[size].scale);
     });
-    const placed = bento ? null : gridPlacement(grid.rows, rowRects);
+    const placed = bento ? null : gridPlacement(grid.rows, rowRects, grid.strip);
     return (
     // An inline-size container: the merged grid sizes its rows from its width (`cqw`).
-    _jsxs("figure", { className: cn('flex w-full flex-col gap-2', !bento && '@container'), children: [_jsx("div", { ...(bento ? { 'data-image-gen-bento': count } : { 'data-image-gen-grid': grid.rows.join('+') }), className: cn('grid min-h-0 w-full gap-1', bento ? bento.grid : 'grid-cols-6'), style: placed ? placed.style : { aspectRatio: rowRects[0], width: cappedWidth(rowRects[0]) }, children: grid.tiles.map((tile, i) => (_jsx("div", { "data-image-gen-tile": i, className: cn('min-h-0 min-w-0', bento && i === 0 && bento.first), style: placed?.places[i], children: frame(tile) }, tileKey(tile, i)))) }), action ? _jsx("div", { className: "flex flex-col items-start", children: action }) : null] }));
+    _jsxs("figure", { className: cn('flex w-full flex-col gap-2', !bento && '@container'), children: [_jsx("div", { ...(bento ? { 'data-image-gen-bento': count } : { 'data-image-gen-grid': grid.rows.join('+'), ...(grid.strip && { 'data-image-gen-strip': '' }) }), className: cn('grid min-h-0 w-full gap-1', bento ? bento.grid : grid.strip ? 'grid-cols-12' : 'grid-cols-6'), style: placed ? placed.style : { aspectRatio: rowRects[0], width: cappedWidth(rowRects[0]) }, children: grid.tiles.map((tile, i) => (_jsx("div", { "data-image-gen-tile": i, className: cn('min-h-0 min-w-0', bento && i === 0 && bento.first), style: placed?.places[i], children: frame(tile) }, tileKey(tile, i)))) }), action ? _jsx("div", { className: "flex flex-col items-start", children: action }) : null] }));
 }
 ToolRegistry.register('image-gen', ImageGenTool);

package/dist/session/turn/user-message.d.ts

@@ -18,10 +18,11 @@ export declare const BUBBLE_TEXT: string;
 export declare const BUBBLE_SURFACE: string;
 /**
  * Where a channel message came from, in the pill's hover card: the platform,
- * the channel or chat it was posted in, and who posted it. A Slack prompt
- * written before channel names were recorded carries a bare id (`C0DEV`); the
- * project's Slack bindings name it, read only while this card is open. A Teams
- * conversation id names nothing a person reads, so Teams shows no channel row.
+ * the channel or chat it was posted in (an email's subject, labelled Subject),
+ * and who posted it. A Slack prompt written before channel names were recorded
+ * carries a bare id (`C0DEV`); the project's Slack bindings name it, read only
+ * while this card is open. A Teams conversation id names nothing a person
+ * reads, so Teams shows no channel row.
  */
 export declare function ChannelOrigin({ info, platform }: {
     info: ChannelMessageInfo;

package/dist/session/turn/user-message.js

@@ -78,10 +78,11 @@ export const BUBBLE_TEXT = cn('text-[0.9rem] leading-[22px] font-medium', 'wrap-
 export const BUBBLE_SURFACE = cn('bg-muted text-foreground flex max-w-full flex-col px-3.5 py-2.5 select-none rounded-lg');
 /**
  * Where a channel message came from, in the pill's hover card: the platform,
- * the channel or chat it was posted in, and who posted it. A Slack prompt
- * written before channel names were recorded carries a bare id (`C0DEV`); the
- * project's Slack bindings name it, read only while this card is open. A Teams
- * conversation id names nothing a person reads, so Teams shows no channel row.
+ * the channel or chat it was posted in (an email's subject, labelled Subject),
+ * and who posted it. A Slack prompt written before channel names were recorded
+ * carries a bare id (`C0DEV`); the project's Slack bindings name it, read only
+ * while this card is open. A Teams conversation id names nothing a person
+ * reads, so Teams shows no channel row.
  */
 export function ChannelOrigin({ info, platform }) {
     const tI18nComplete = useTranslations('hardcodedUi.i18nComplete');
@@ -92,8 +93,9 @@ export function ChannelOrigin({ info, platform }) {
         ? data?.bindings.find((b) => b.platform === 'slack' && b.channelId === info.context)
         : undefined;
     const channel = info.platform === 'Teams' ? '' : (binding && slackConversationName(binding)) || info.context;
+    const place = info.platform === 'Email' ? tI18nComplete('text68971283841a') : tI18nComplete('textce4683e7013a');
     return (_jsx(SourceCard, { mark: _jsx(ChannelBrandMark, { platform: info.platform, className: "size-3.5 shrink-0" }), title: platform, rows: [
-            { label: tI18nComplete('textce4683e7013a'), value: channel },
+            { label: place, value: channel },
             { label: tI18nComplete('text218197693424'), value: info.userName },
         ] }));
 }