From 0e4acef8aff2ac0542f2ff5f7f35e15246fc3006 Mon Sep 17 00:00:00 2001 From: Bill Leoutsakos Date: Tue, 22 Sep 2026 10:57:34 -0700 Subject: [PATCH] refactor(ui): narrow local style forwarding and preview geometry --- .../custom-tool-code-field.tsx | 2 -- .../components/chat-content/chat-content.tsx | 4 +-- .../mcp-server-form-modal.tsx | 2 +- .../secret-value-field/secret-value-field.tsx | 7 +++-- .../env-var-dropdown/env-var-dropdown.tsx | 4 +-- .../components/tag-dropdown/tag-dropdown.tsx | 4 +-- apps/sim/lib/pptx-renderer/core/viewer.ts | 29 ++++++++++--------- 7 files changed, 27 insertions(+), 25 deletions(-) diff --git a/apps/sim/app/workspace/[workspaceId]/components/custom-tool-editor/custom-tool-code-field.tsx b/apps/sim/app/workspace/[workspaceId]/components/custom-tool-editor/custom-tool-code-field.tsx index 9290ca41b2b..a7a4bd9bd39 100644 --- a/apps/sim/app/workspace/[workspaceId]/components/custom-tool-editor/custom-tool-code-field.tsx +++ b/apps/sim/app/workspace/[workspaceId]/components/custom-tool-editor/custom-tool-code-field.tsx @@ -284,7 +284,6 @@ export function CustomToolCodeField({ }} className='w-64' style={{ - position: 'absolute', top: `${dropdownPosition.top}px`, left: `${dropdownPosition.left}px`, }} @@ -309,7 +308,6 @@ export function CustomToolCodeField({ }} className='w-64' style={{ - position: 'absolute', top: `${dropdownPosition.top}px`, left: `${dropdownPosition.left}px`, }} diff --git a/apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/chat-content/chat-content.tsx b/apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/chat-content/chat-content.tsx index ef9edea0bc2..958b6b893bf 100644 --- a/apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/chat-content/chat-content.tsx +++ b/apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/chat-content/chat-content.tsx @@ -264,7 +264,7 @@ const MARKDOWN_COMPONENTS = { th({ children, style }: ThProps) { return ( {children} @@ -274,7 +274,7 @@ const MARKDOWN_COMPONENTS = { td({ children, style }: TdProps) { return ( {children} diff --git a/apps/sim/app/workspace/[workspaceId]/settings/components/mcp/components/mcp-server-form-modal/mcp-server-form-modal.tsx b/apps/sim/app/workspace/[workspaceId]/settings/components/mcp/components/mcp-server-form-modal/mcp-server-form-modal.tsx index 5eae87e1eee..d1d3ceb4b4c 100644 --- a/apps/sim/app/workspace/[workspaceId]/settings/components/mcp/components/mcp-server-form-modal/mcp-server-form-modal.tsx +++ b/apps/sim/app/workspace/[workspaceId]/settings/components/mcp/components/mcp-server-form-modal/mcp-server-form-modal.tsx @@ -180,7 +180,7 @@ function FormattedInput({ onClose={envVarProps.onClose} className='w-full' maxHeight='200px' - style={{ position: 'absolute', top: '100%', left: 0, zIndex: 99999 }} + style={{ top: '100%', left: 0, zIndex: 99999 }} /> )} diff --git a/apps/sim/app/workspace/[workspaceId]/settings/components/secrets/components/secret-value-field/secret-value-field.tsx b/apps/sim/app/workspace/[workspaceId]/settings/components/secrets/components/secret-value-field/secret-value-field.tsx index 0e8dcfdacb2..a843694bfe8 100644 --- a/apps/sim/app/workspace/[workspaceId]/settings/components/secrets/components/secret-value-field/secret-value-field.tsx +++ b/apps/sim/app/workspace/[workspaceId]/settings/components/secrets/components/secret-value-field/secret-value-field.tsx @@ -11,8 +11,10 @@ const VIEWER_MASK_LENGTH = 10 type SecretValueFieldProps = Omit< ComponentProps<'input'>, - 'type' | 'value' | 'onChange' | 'readOnly' + 'type' | 'value' | 'onChange' | 'readOnly' | 'style' > & { + /** The chip owns field styling; callers use className for layout. */ + style?: never value: string onChange?: (value: string) => void /** @@ -47,7 +49,7 @@ export function SecretValueField({ readOnly = false, onFocus, onBlur, - style, + style: _style, className, ...props }: SecretValueFieldProps) { @@ -68,7 +70,6 @@ export function SecretValueField({ type='text' value={displayValue} readOnly - style={style} inputClassName={visuallyMaskEditableValue ? '[-webkit-text-security:disc]' : undefined} onChange={(event) => { if (editable) onChange?.(event.target.value) diff --git a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/editor/components/sub-block/components/env-var-dropdown/env-var-dropdown.tsx b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/editor/components/sub-block/components/env-var-dropdown/env-var-dropdown.tsx index 1d2139df30f..05d629563fb 100644 --- a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/editor/components/sub-block/components/env-var-dropdown/env-var-dropdown.tsx +++ b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/editor/components/sub-block/components/env-var-dropdown/env-var-dropdown.tsx @@ -33,7 +33,7 @@ interface EnvVarDropdownProps { /** Callback when the dropdown should close */ onClose?: () => void /** Custom styles for positioning */ - style?: React.CSSProperties + style?: Pick /** Workspace ID for loading workspace-specific environment variables */ workspaceId?: string /** Maximum height for the dropdown */ @@ -286,7 +286,7 @@ export const EnvVarDropdown: React.FC = ({
void /** Custom styles for positioning */ - style?: React.CSSProperties + style?: Pick /** Reference to the input element for caret positioning */ inputRef?: React.RefObject } @@ -1616,7 +1616,7 @@ export const TagDropdown: React.FC = ({