mirror of
https://github.com/openswarm-ai/openswarm.git
synced 2026-09-28 20:44:50 +02:00
[eric] canvas: the collapsed pill's question widget gets a real width and can never render narrower than its content
This commit is contained in:
@@ -13,6 +13,9 @@ const DEFAULT_W = 320;
|
||||
const FAMILY_WIDTHS: Array<[RegExp, number]> = [
|
||||
[/table|chart|gallery|carousel|terminal|code|diff/i, 560],
|
||||
[/map|image|video|post/i, 460],
|
||||
// question/ask carries option rows with multi-sentence descriptions plus its own composer; at the
|
||||
// 320 fallback it rendered visibly cut off (Eric's 1.7.8-exp.3 screenshot, 2026-08-14).
|
||||
[/question|ask/i, 560],
|
||||
[/stats|plan|links|order|preferences/i, 380],
|
||||
];
|
||||
|
||||
@@ -85,7 +88,9 @@ function PillArtifactFrame({ name, children }: Props): React.ReactElement {
|
||||
onPointerDown={(e: React.PointerEvent) => e.stopPropagation()}
|
||||
onClick={(e: React.MouseEvent) => e.stopPropagation()}
|
||||
onDoubleClick={(e: React.MouseEvent) => e.stopPropagation()}
|
||||
sx={{ position: 'relative', width, maxWidth: '90vw', '&:hover .osw-artifact-grip': { opacity: 1 } }}
|
||||
// minWidth min-content: a stored or family width narrower than what the widget can actually
|
||||
// shrink to must widen the frame, never cut the widget; clipping is not a size option.
|
||||
sx={{ position: 'relative', width, minWidth: 'min-content', maxWidth: '90vw', '&:hover .osw-artifact-grip': { opacity: 1 } }}
|
||||
>
|
||||
{children}
|
||||
<Box
|
||||
|
||||
@@ -0,0 +1,20 @@
|
||||
// Run: npm test (frontend/scripts/run-tests.mjs)
|
||||
//
|
||||
// Eric's 1.7.8-exp.3 screenshot: the collapsed pill's question widget rendered visibly cut off,
|
||||
// because "question" matched no family rule and fell to the 320px fallback while its option rows
|
||||
// carry multi-sentence descriptions plus a composer. The frame must give ask-shaped widgets the
|
||||
// wide family, and the width table stays ordered so the specific rules win before the fallback.
|
||||
import { test } from 'node:test';
|
||||
import assert from 'node:assert/strict';
|
||||
import { defaultWidthFor } from './PillArtifactFrame.tsx';
|
||||
|
||||
test('question and ask widgets get the wide family, not the 320 fallback', () => {
|
||||
assert.equal(defaultWidthFor('question'), 560);
|
||||
assert.equal(defaultWidthFor('question-flow'), 560);
|
||||
assert.equal(defaultWidthFor('ask'), 560);
|
||||
});
|
||||
|
||||
test('tables keep their width and unknown names keep the fallback', () => {
|
||||
assert.equal(defaultWidthFor('data-table'), 560);
|
||||
assert.equal(defaultWidthFor('weather-widget'), 320);
|
||||
});
|
||||
Reference in New Issue
Block a user