@runtypelabs/persona 3.6.0 → 3.7.0
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/index.cjs +44 -44
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +30 -0
- package/dist/index.d.ts +30 -0
- package/dist/index.global.js +67 -67
- package/dist/index.global.js.map +1 -1
- package/dist/index.js +44 -44
- package/dist/index.js.map +1 -1
- package/dist/theme-editor.cjs +514 -227
- package/dist/theme-editor.d.cts +32 -1
- package/dist/theme-editor.d.ts +32 -1
- package/dist/theme-editor.js +513 -227
- package/dist/theme-reference.cjs +1 -1
- package/dist/theme-reference.d.cts +19 -0
- package/dist/theme-reference.d.ts +19 -0
- package/dist/theme-reference.js +1 -1
- package/dist/widget.css +40 -0
- package/package.json +1 -1
- package/src/components/demo-carousel.ts +1 -1
- package/src/components/event-stream-view.test.ts +142 -0
- package/src/components/event-stream-view.ts +67 -28
- package/src/defaults.ts +15 -0
- package/src/scroll-to-bottom-defaults.test.ts +13 -0
- package/src/styles/widget.css +40 -0
- package/src/theme-editor/index.ts +1 -0
- package/src/theme-editor/role-mappings.ts +12 -0
- package/src/theme-editor/sections.test.ts +43 -0
- package/src/theme-editor/sections.ts +42 -0
- package/src/theme-reference.ts +8 -0
- package/src/types/theme.ts +10 -0
- package/src/types.ts +22 -0
- package/src/ui.scroll.test.ts +554 -0
- package/src/ui.ts +178 -83
- package/src/utils/auto-follow.test.ts +110 -0
- package/src/utils/auto-follow.ts +112 -0
- package/src/utils/theme.test.ts +34 -0
- package/src/utils/tokens.ts +49 -0
package/dist/theme-editor.d.cts
CHANGED
|
@@ -361,6 +361,13 @@ interface LabelButtonTokens {
|
|
|
361
361
|
fontSize?: string;
|
|
362
362
|
gap?: string;
|
|
363
363
|
}
|
|
364
|
+
/** Scroll-to-bottom pill chrome shared by transcript + event stream. */
|
|
365
|
+
interface ScrollToBottomTokens extends ComponentTokenSet {
|
|
366
|
+
size?: string;
|
|
367
|
+
gap?: string;
|
|
368
|
+
fontSize?: string;
|
|
369
|
+
iconSize?: string;
|
|
370
|
+
}
|
|
364
371
|
/** Toggle group chrome (used by createToggleGroup). */
|
|
365
372
|
interface ToggleGroupTokens {
|
|
366
373
|
/** Gap between toggle buttons. Default: 0 (connected). */
|
|
@@ -387,6 +394,8 @@ interface ComponentTokens {
|
|
|
387
394
|
iconButton?: IconButtonTokens;
|
|
388
395
|
/** Label button styling tokens. */
|
|
389
396
|
labelButton?: LabelButtonTokens;
|
|
397
|
+
/** Scroll-to-bottom indicator styling tokens. */
|
|
398
|
+
scrollToBottom?: ScrollToBottomTokens;
|
|
390
399
|
/** Toggle group styling tokens. */
|
|
391
400
|
toggleGroup?: ToggleGroupTokens;
|
|
392
401
|
/** Artifact toolbar, tab strip, and pane chrome. */
|
|
@@ -1063,10 +1072,31 @@ type AgentWidgetArtifactsFeature = {
|
|
|
1063
1072
|
defaultRenderer: () => HTMLElement;
|
|
1064
1073
|
}) => HTMLElement | null;
|
|
1065
1074
|
};
|
|
1075
|
+
type AgentWidgetScrollToBottomFeature = {
|
|
1076
|
+
/**
|
|
1077
|
+
* When true, Persona shows a scroll-to-bottom affordance when the user breaks
|
|
1078
|
+
* away from the latest transcript or event stream content.
|
|
1079
|
+
* @default true
|
|
1080
|
+
*/
|
|
1081
|
+
enabled?: boolean;
|
|
1082
|
+
/**
|
|
1083
|
+
* Lucide icon name used for the affordance.
|
|
1084
|
+
* @default "arrow-down"
|
|
1085
|
+
*/
|
|
1086
|
+
iconName?: string;
|
|
1087
|
+
/**
|
|
1088
|
+
* Optional label text shown next to the icon. Set to an empty string for an
|
|
1089
|
+
* icon-only affordance.
|
|
1090
|
+
* @default ""
|
|
1091
|
+
*/
|
|
1092
|
+
label?: string;
|
|
1093
|
+
};
|
|
1066
1094
|
type AgentWidgetFeatureFlags = {
|
|
1067
1095
|
showReasoning?: boolean;
|
|
1068
1096
|
showToolCalls?: boolean;
|
|
1069
1097
|
showEventStreamToggle?: boolean;
|
|
1098
|
+
/** Shared transcript + event stream scroll-to-bottom affordance. */
|
|
1099
|
+
scrollToBottom?: AgentWidgetScrollToBottomFeature;
|
|
1070
1100
|
/** Configuration for the Event Stream inspector view */
|
|
1071
1101
|
eventStream?: EventStreamConfig;
|
|
1072
1102
|
/** Optional artifact sidebar (split pane / mobile drawer) */
|
|
@@ -3788,6 +3818,7 @@ declare const ROLE_HEADER: RoleAssignmentOptions;
|
|
|
3788
3818
|
declare const ROLE_USER_MESSAGES: RoleAssignmentOptions;
|
|
3789
3819
|
declare const ROLE_ASSISTANT_MESSAGES: RoleAssignmentOptions;
|
|
3790
3820
|
declare const ROLE_PRIMARY_ACTIONS: RoleAssignmentOptions;
|
|
3821
|
+
declare const ROLE_SCROLL_TO_BOTTOM: RoleAssignmentOptions;
|
|
3791
3822
|
declare const ROLE_INPUT: RoleAssignmentOptions;
|
|
3792
3823
|
declare const ROLE_LINKS_FOCUS: RoleAssignmentOptions;
|
|
3793
3824
|
declare const ROLE_BORDERS: RoleAssignmentOptions;
|
|
@@ -3854,4 +3885,4 @@ declare function paletteColorPath(family: string, shade: string): string;
|
|
|
3854
3885
|
declare function resolveThemeColorPath(get: (path: string) => unknown, path: string, depth?: number): string;
|
|
3855
3886
|
declare function tokenRefDisplayName(path: string): string;
|
|
3856
3887
|
|
|
3857
|
-
export { ADVANCED_TOKENS_SECTION, ALL_ROLES, ALL_TABS, BRAND_PALETTE_SECTION, BUILT_IN_PRESETS, COLORS_SECTIONS, COLOR_FAMILIES, COMPONENTS_SECTIONS, COMPONENT_COLOR_SECTIONS, COMPONENT_SHAPE_SECTIONS, CONFIGURE_SECTIONS, CONFIGURE_SUB_GROUPS, type ColorScaleOptions, type CompareMode, type ConfigChangeListener, type ConfiguratorSnapshot, DEVICE_DIMENSIONS, type DetectedRoleAssignment, type FieldDef, type FieldType, HOME_SUGGESTION_CHIPS, INTERFACE_ROLES_SECTION, MOCK_BROWSER_CONTENT, MOCK_WORKSPACE_CONTENT, type OnChangeCallback, PALETTE_SECTION, PREVIEW_STORAGE_ADAPTER, type PreviewConfigOptions, type PreviewDevice, type PreviewLifecycleContext, type PreviewScene, type PreviewShellMode, type PreviewShellPalette, ROLE_ASSISTANT_MESSAGES, ROLE_BORDERS, ROLE_FAMILIES, ROLE_FAMILY_LABELS, ROLE_HEADER, ROLE_INPUT, ROLE_INTENSITIES, ROLE_LINKS_FOCUS, ROLE_PRIMARY_ACTIONS, ROLE_SURFACES, ROLE_USER_MESSAGES, type RoleAssignmentOptions, type RoleFamily, type RoleIntensity, type RoleTarget, type RoleTargetKind, SEMANTIC_COLORS_SECTION, SHADE_KEYS, SHELL_STYLE_ID, STATUS_COLORS_SECTION, STATUS_PALETTE_SECTION, STYLE_SECTIONS, STYLE_SECTIONS_V2, type SectionDef, type SectionPreset, type SelectOption, type SliderOptions, type SubGroupDef, THEME_EDITOR_PRESETS, THEME_SECTION, type TabDef, type ThemeEditorPreset, ThemeEditorState, type ThemePreviewHandle, type ThemePreviewOptions, type TokenRefOptions, ZOOM_MAX, ZOOM_MIN, applySceneConfig, applyShellTheme, buildPreviewConfig, buildShellCss, buildSrcdoc, convertFromPx, convertToPx, createPreviewMessages, createThemePreview, detectRoleAssignment, escapeHtml, findSection, formatCssValue, generateColorScale, getShellPalette, getThemeEditorPreset, hexToHsl, hslToHex, isValidHex, normalizeColorValue, paletteColorPath, parseCssValue, resolveRoleAssignment, resolveThemeColorPath, scopeSection, tokenRefDisplayName, wcagContrastRatio };
|
|
3888
|
+
export { ADVANCED_TOKENS_SECTION, ALL_ROLES, ALL_TABS, BRAND_PALETTE_SECTION, BUILT_IN_PRESETS, COLORS_SECTIONS, COLOR_FAMILIES, COMPONENTS_SECTIONS, COMPONENT_COLOR_SECTIONS, COMPONENT_SHAPE_SECTIONS, CONFIGURE_SECTIONS, CONFIGURE_SUB_GROUPS, type ColorScaleOptions, type CompareMode, type ConfigChangeListener, type ConfiguratorSnapshot, DEVICE_DIMENSIONS, type DetectedRoleAssignment, type FieldDef, type FieldType, HOME_SUGGESTION_CHIPS, INTERFACE_ROLES_SECTION, MOCK_BROWSER_CONTENT, MOCK_WORKSPACE_CONTENT, type OnChangeCallback, PALETTE_SECTION, PREVIEW_STORAGE_ADAPTER, type PreviewConfigOptions, type PreviewDevice, type PreviewLifecycleContext, type PreviewScene, type PreviewShellMode, type PreviewShellPalette, ROLE_ASSISTANT_MESSAGES, ROLE_BORDERS, ROLE_FAMILIES, ROLE_FAMILY_LABELS, ROLE_HEADER, ROLE_INPUT, ROLE_INTENSITIES, ROLE_LINKS_FOCUS, ROLE_PRIMARY_ACTIONS, ROLE_SCROLL_TO_BOTTOM, ROLE_SURFACES, ROLE_USER_MESSAGES, type RoleAssignmentOptions, type RoleFamily, type RoleIntensity, type RoleTarget, type RoleTargetKind, SEMANTIC_COLORS_SECTION, SHADE_KEYS, SHELL_STYLE_ID, STATUS_COLORS_SECTION, STATUS_PALETTE_SECTION, STYLE_SECTIONS, STYLE_SECTIONS_V2, type SectionDef, type SectionPreset, type SelectOption, type SliderOptions, type SubGroupDef, THEME_EDITOR_PRESETS, THEME_SECTION, type TabDef, type ThemeEditorPreset, ThemeEditorState, type ThemePreviewHandle, type ThemePreviewOptions, type TokenRefOptions, ZOOM_MAX, ZOOM_MIN, applySceneConfig, applyShellTheme, buildPreviewConfig, buildShellCss, buildSrcdoc, convertFromPx, convertToPx, createPreviewMessages, createThemePreview, detectRoleAssignment, escapeHtml, findSection, formatCssValue, generateColorScale, getShellPalette, getThemeEditorPreset, hexToHsl, hslToHex, isValidHex, normalizeColorValue, paletteColorPath, parseCssValue, resolveRoleAssignment, resolveThemeColorPath, scopeSection, tokenRefDisplayName, wcagContrastRatio };
|
package/dist/theme-editor.d.ts
CHANGED
|
@@ -361,6 +361,13 @@ interface LabelButtonTokens {
|
|
|
361
361
|
fontSize?: string;
|
|
362
362
|
gap?: string;
|
|
363
363
|
}
|
|
364
|
+
/** Scroll-to-bottom pill chrome shared by transcript + event stream. */
|
|
365
|
+
interface ScrollToBottomTokens extends ComponentTokenSet {
|
|
366
|
+
size?: string;
|
|
367
|
+
gap?: string;
|
|
368
|
+
fontSize?: string;
|
|
369
|
+
iconSize?: string;
|
|
370
|
+
}
|
|
364
371
|
/** Toggle group chrome (used by createToggleGroup). */
|
|
365
372
|
interface ToggleGroupTokens {
|
|
366
373
|
/** Gap between toggle buttons. Default: 0 (connected). */
|
|
@@ -387,6 +394,8 @@ interface ComponentTokens {
|
|
|
387
394
|
iconButton?: IconButtonTokens;
|
|
388
395
|
/** Label button styling tokens. */
|
|
389
396
|
labelButton?: LabelButtonTokens;
|
|
397
|
+
/** Scroll-to-bottom indicator styling tokens. */
|
|
398
|
+
scrollToBottom?: ScrollToBottomTokens;
|
|
390
399
|
/** Toggle group styling tokens. */
|
|
391
400
|
toggleGroup?: ToggleGroupTokens;
|
|
392
401
|
/** Artifact toolbar, tab strip, and pane chrome. */
|
|
@@ -1063,10 +1072,31 @@ type AgentWidgetArtifactsFeature = {
|
|
|
1063
1072
|
defaultRenderer: () => HTMLElement;
|
|
1064
1073
|
}) => HTMLElement | null;
|
|
1065
1074
|
};
|
|
1075
|
+
type AgentWidgetScrollToBottomFeature = {
|
|
1076
|
+
/**
|
|
1077
|
+
* When true, Persona shows a scroll-to-bottom affordance when the user breaks
|
|
1078
|
+
* away from the latest transcript or event stream content.
|
|
1079
|
+
* @default true
|
|
1080
|
+
*/
|
|
1081
|
+
enabled?: boolean;
|
|
1082
|
+
/**
|
|
1083
|
+
* Lucide icon name used for the affordance.
|
|
1084
|
+
* @default "arrow-down"
|
|
1085
|
+
*/
|
|
1086
|
+
iconName?: string;
|
|
1087
|
+
/**
|
|
1088
|
+
* Optional label text shown next to the icon. Set to an empty string for an
|
|
1089
|
+
* icon-only affordance.
|
|
1090
|
+
* @default ""
|
|
1091
|
+
*/
|
|
1092
|
+
label?: string;
|
|
1093
|
+
};
|
|
1066
1094
|
type AgentWidgetFeatureFlags = {
|
|
1067
1095
|
showReasoning?: boolean;
|
|
1068
1096
|
showToolCalls?: boolean;
|
|
1069
1097
|
showEventStreamToggle?: boolean;
|
|
1098
|
+
/** Shared transcript + event stream scroll-to-bottom affordance. */
|
|
1099
|
+
scrollToBottom?: AgentWidgetScrollToBottomFeature;
|
|
1070
1100
|
/** Configuration for the Event Stream inspector view */
|
|
1071
1101
|
eventStream?: EventStreamConfig;
|
|
1072
1102
|
/** Optional artifact sidebar (split pane / mobile drawer) */
|
|
@@ -3788,6 +3818,7 @@ declare const ROLE_HEADER: RoleAssignmentOptions;
|
|
|
3788
3818
|
declare const ROLE_USER_MESSAGES: RoleAssignmentOptions;
|
|
3789
3819
|
declare const ROLE_ASSISTANT_MESSAGES: RoleAssignmentOptions;
|
|
3790
3820
|
declare const ROLE_PRIMARY_ACTIONS: RoleAssignmentOptions;
|
|
3821
|
+
declare const ROLE_SCROLL_TO_BOTTOM: RoleAssignmentOptions;
|
|
3791
3822
|
declare const ROLE_INPUT: RoleAssignmentOptions;
|
|
3792
3823
|
declare const ROLE_LINKS_FOCUS: RoleAssignmentOptions;
|
|
3793
3824
|
declare const ROLE_BORDERS: RoleAssignmentOptions;
|
|
@@ -3854,4 +3885,4 @@ declare function paletteColorPath(family: string, shade: string): string;
|
|
|
3854
3885
|
declare function resolveThemeColorPath(get: (path: string) => unknown, path: string, depth?: number): string;
|
|
3855
3886
|
declare function tokenRefDisplayName(path: string): string;
|
|
3856
3887
|
|
|
3857
|
-
export { ADVANCED_TOKENS_SECTION, ALL_ROLES, ALL_TABS, BRAND_PALETTE_SECTION, BUILT_IN_PRESETS, COLORS_SECTIONS, COLOR_FAMILIES, COMPONENTS_SECTIONS, COMPONENT_COLOR_SECTIONS, COMPONENT_SHAPE_SECTIONS, CONFIGURE_SECTIONS, CONFIGURE_SUB_GROUPS, type ColorScaleOptions, type CompareMode, type ConfigChangeListener, type ConfiguratorSnapshot, DEVICE_DIMENSIONS, type DetectedRoleAssignment, type FieldDef, type FieldType, HOME_SUGGESTION_CHIPS, INTERFACE_ROLES_SECTION, MOCK_BROWSER_CONTENT, MOCK_WORKSPACE_CONTENT, type OnChangeCallback, PALETTE_SECTION, PREVIEW_STORAGE_ADAPTER, type PreviewConfigOptions, type PreviewDevice, type PreviewLifecycleContext, type PreviewScene, type PreviewShellMode, type PreviewShellPalette, ROLE_ASSISTANT_MESSAGES, ROLE_BORDERS, ROLE_FAMILIES, ROLE_FAMILY_LABELS, ROLE_HEADER, ROLE_INPUT, ROLE_INTENSITIES, ROLE_LINKS_FOCUS, ROLE_PRIMARY_ACTIONS, ROLE_SURFACES, ROLE_USER_MESSAGES, type RoleAssignmentOptions, type RoleFamily, type RoleIntensity, type RoleTarget, type RoleTargetKind, SEMANTIC_COLORS_SECTION, SHADE_KEYS, SHELL_STYLE_ID, STATUS_COLORS_SECTION, STATUS_PALETTE_SECTION, STYLE_SECTIONS, STYLE_SECTIONS_V2, type SectionDef, type SectionPreset, type SelectOption, type SliderOptions, type SubGroupDef, THEME_EDITOR_PRESETS, THEME_SECTION, type TabDef, type ThemeEditorPreset, ThemeEditorState, type ThemePreviewHandle, type ThemePreviewOptions, type TokenRefOptions, ZOOM_MAX, ZOOM_MIN, applySceneConfig, applyShellTheme, buildPreviewConfig, buildShellCss, buildSrcdoc, convertFromPx, convertToPx, createPreviewMessages, createThemePreview, detectRoleAssignment, escapeHtml, findSection, formatCssValue, generateColorScale, getShellPalette, getThemeEditorPreset, hexToHsl, hslToHex, isValidHex, normalizeColorValue, paletteColorPath, parseCssValue, resolveRoleAssignment, resolveThemeColorPath, scopeSection, tokenRefDisplayName, wcagContrastRatio };
|
|
3888
|
+
export { ADVANCED_TOKENS_SECTION, ALL_ROLES, ALL_TABS, BRAND_PALETTE_SECTION, BUILT_IN_PRESETS, COLORS_SECTIONS, COLOR_FAMILIES, COMPONENTS_SECTIONS, COMPONENT_COLOR_SECTIONS, COMPONENT_SHAPE_SECTIONS, CONFIGURE_SECTIONS, CONFIGURE_SUB_GROUPS, type ColorScaleOptions, type CompareMode, type ConfigChangeListener, type ConfiguratorSnapshot, DEVICE_DIMENSIONS, type DetectedRoleAssignment, type FieldDef, type FieldType, HOME_SUGGESTION_CHIPS, INTERFACE_ROLES_SECTION, MOCK_BROWSER_CONTENT, MOCK_WORKSPACE_CONTENT, type OnChangeCallback, PALETTE_SECTION, PREVIEW_STORAGE_ADAPTER, type PreviewConfigOptions, type PreviewDevice, type PreviewLifecycleContext, type PreviewScene, type PreviewShellMode, type PreviewShellPalette, ROLE_ASSISTANT_MESSAGES, ROLE_BORDERS, ROLE_FAMILIES, ROLE_FAMILY_LABELS, ROLE_HEADER, ROLE_INPUT, ROLE_INTENSITIES, ROLE_LINKS_FOCUS, ROLE_PRIMARY_ACTIONS, ROLE_SCROLL_TO_BOTTOM, ROLE_SURFACES, ROLE_USER_MESSAGES, type RoleAssignmentOptions, type RoleFamily, type RoleIntensity, type RoleTarget, type RoleTargetKind, SEMANTIC_COLORS_SECTION, SHADE_KEYS, SHELL_STYLE_ID, STATUS_COLORS_SECTION, STATUS_PALETTE_SECTION, STYLE_SECTIONS, STYLE_SECTIONS_V2, type SectionDef, type SectionPreset, type SelectOption, type SliderOptions, type SubGroupDef, THEME_EDITOR_PRESETS, THEME_SECTION, type TabDef, type ThemeEditorPreset, ThemeEditorState, type ThemePreviewHandle, type ThemePreviewOptions, type TokenRefOptions, ZOOM_MAX, ZOOM_MIN, applySceneConfig, applyShellTheme, buildPreviewConfig, buildShellCss, buildSrcdoc, convertFromPx, convertToPx, createPreviewMessages, createThemePreview, detectRoleAssignment, escapeHtml, findSection, formatCssValue, generateColorScale, getShellPalette, getThemeEditorPreset, hexToHsl, hslToHex, isValidHex, normalizeColorValue, paletteColorPath, parseCssValue, resolveRoleAssignment, resolveThemeColorPath, scopeSection, tokenRefDisplayName, wcagContrastRatio };
|