simstudioai · waleedlatif1 · Aug 11, 2026 · Aug 11, 2026
diff --git a/...paceId]/w/[workflowId]/components/connection-block-selector/connection-block-selector.tsx b/...paceId]/w/[workflowId]/components/connection-block-selector/connection-block-selector.tsx
@@ -1,10 +1,10 @@
 'use client'
 
 import { useCallback, useDeferredValue, useEffect, useMemo, useRef, useState } from 'react'
-import { Button, cn, X } from '@sim/emcn'
+import { Button, cn } from '@sim/emcn'
+import { Search, X } from '@sim/emcn/icons'
 import { WorkflowBlockBorder, type WorkflowBorderPort } from '@sim/workflow-renderer'
 import { Command } from 'cmdk'
-import { Search } from 'lucide-react'
 import { useParams } from 'next/navigation'
 import { usePostHog } from 'posthog-js/react'
 import { Handle, type NodeProps, Position } from 'reactflow'

diff --git a/...m/app/workspace/[workspaceId]/w/[workflowId]/components/workflow-block/workflow-block.tsx b/...m/app/workspace/[workspaceId]/w/[workflowId]/components/workflow-block/workflow-block.tsx
@@ -1,29 +1,29 @@
 import { type ComponentType, Fragment, memo, useCallback, useEffect, useMemo, useRef } from 'react'
-import {
-  BLOCK_DIMENSIONS,
-  CanvasSentenceView,
-  SubBlockRowView,
-  WorkflowBlockView,
-} from '@sim/workflow-renderer'
-import { wouldCreateCycle } from '@sim/workflow-types/workflow'
-import { isEqual } from 'es-toolkit'
 import {
   ArrowLeftRight,
   ArrowUpDown,
-  Braces,
   Clock,
   Globe,
-  Hash,
-  KeyRound,
+  Key,
   ListFilter,
   MessageSquareText,
   Paperclip,
   SkipForward,
   SlidersHorizontal,
   Sparkles,
   ToggleLeft,
+  TypeJson,
+  TypeNumber,
   Wrench,
-} from 'lucide-react'
+} from '@sim/emcn/icons'
+import {
+  BLOCK_DIMENSIONS,
+  CanvasSentenceView,
+  SubBlockRowView,
+  WorkflowBlockView,
+} from '@sim/workflow-renderer'
+import { wouldCreateCycle } from '@sim/workflow-types/workflow'
+import { isEqual } from 'es-toolkit'
 import { useParams } from 'next/navigation'
 import { usePostHog } from 'posthog-js/react'
 import { type NodeProps, useStore as useReactFlowStore, useUpdateNodeInternals } from 'reactflow'
@@ -129,22 +129,22 @@ const SUBBLOCK_META_ICONS_BY_ID: Record<string, MetaIcon> = {
   filterCriteria: ListFilter,
   sortBuilder: ArrowUpDown,
   sort: ArrowUpDown,
-  limit: Hash,
+  limit: TypeNumber,
   offset: SkipForward,
-  rowId: KeyRound,
+  rowId: Key,
   url: Globe,
   method: ArrowLeftRight,
-  body: Braces,
-  data: Braces,
+  body: TypeJson,
+  data: TypeJson,
 }
 
 /** Leading icons for compact meta rows, keyed by subblock type. */
 const SUBBLOCK_META_ICONS_BY_TYPE: Record<string, MetaIcon> = {
-  code: Braces,
+  code: TypeJson,
   'messages-input': MessageSquareText,
   'tool-input': Wrench,
   'skill-input': Sparkles,
-  'oauth-input': KeyRound,
+  'oauth-input': Key,
   switch: ToggleLeft,
   'file-upload': Paperclip,
   'time-input': Clock,

diff --git a/packages/emcn/src/icons/index.ts b/packages/emcn/src/icons/index.ts
@@ -93,6 +93,7 @@ export { LogOut } from './log-out'
 export { Mail } from './mail'
 export { ManageWorkspace } from './manage-workspace'
 export { Menu } from './menu'
+export { MessageSquareText } from './message-square-text'
 export { Mic } from './mic'
 export { MicOff } from './mic-off'
 export { Minus } from './minus'
@@ -131,7 +132,9 @@ export { Share } from './share'
 export { ShieldCheck } from './shield-check'
 export { Shuffle } from './shuffle'
 export { Sim } from './sim'
+export { SkipForward } from './skip-forward'
 export { Slash } from './slash'
+export { SlidersHorizontal } from './sliders-horizontal'
 export { Sparkles } from './sparkles'
 export { Split } from './split'
 export { Sprout } from './sprout'
@@ -147,6 +150,7 @@ export { TerminalWindow } from './terminal-window'
 export { TextQuote } from './text-quote'
 export { ThumbsDown } from './thumbs-down'
 export { ThumbsUp } from './thumbs-up'
+export { ToggleLeft } from './toggle-left'
 export { Trash } from './trash'
 export { TriangleAlert } from './triangle-alert'
 export { TypeBoolean } from './type-boolean'

diff --git a/packages/emcn/src/icons/message-square-text.tsx b/packages/emcn/src/icons/message-square-text.tsx
@@ -0,0 +1,27 @@
+import type { SVGProps } from 'react'
+
+/**
+ * MessageSquareText icon component - speech bubble with two lines of text
+ * @param props - SVG properties including className, fill, etc.
+ */
+export function MessageSquareText(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      width='24'
+      height='24'
+      viewBox='-1 -2 24 24'
+      fill='none'
+      stroke='currentColor'
+      strokeWidth='1.55'
+      strokeLinecap='round'
+      strokeLinejoin='round'
+      xmlns='http://www.w3.org/2000/svg'
+      aria-hidden='true'
+      {...props}
+    >
+      <path d='M17.99 12.33A1.72 1.72 0 0 1 16.27 14.05H5.95L2.51 17.49V3.73A1.72 1.72 0 0 1 4.23 2.01H16.27A1.72 1.72 0 0 1 17.99 3.73Z' />
+      <path d='M5.95 6.31H11.11' />
+      <path d='M5.95 9.75H14.55' />
+    </svg>
+  )
+}
diff --git a/packages/emcn/src/icons/skip-forward.tsx b/packages/emcn/src/icons/skip-forward.tsx
@@ -0,0 +1,26 @@
+import type { SVGProps } from 'react'
+
+/**
+ * SkipForward icon component - right-facing triangle against an end bar
+ * @param props - SVG properties including className, fill, etc.
+ */
+export function SkipForward(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      width='24'
+      height='24'
+      viewBox='-1 -2 24 24'
+      fill='none'
+      stroke='currentColor'
+      strokeWidth='1.55'
+      strokeLinecap='round'
+      strokeLinejoin='round'
+      xmlns='http://www.w3.org/2000/svg'
+      aria-hidden='true'
+      {...props}
+    >
+      <path d='M4.23 2.87L12.83 9.75L4.23 16.63Z' />
+      <path d='M16.27 3.73V15.77' />
+    </svg>
+  )
+}
diff --git a/packages/emcn/src/icons/sliders-horizontal.tsx b/packages/emcn/src/icons/sliders-horizontal.tsx
@@ -0,0 +1,33 @@
+import type { SVGProps } from 'react'
+
+/**
+ * SlidersHorizontal icon component - three horizontal tracks, each broken by a handle
+ * @param props - SVG properties including className, fill, etc.
+ */
+export function SlidersHorizontal(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      width='24'
+      height='24'
+      viewBox='-1 -2 24 24'
+      fill='none'
+      stroke='currentColor'
+      strokeWidth='1.55'
+      strokeLinecap='round'
+      strokeLinejoin='round'
+      xmlns='http://www.w3.org/2000/svg'
+      aria-hidden='true'
+      {...props}
+    >
+      <path d='M11.97 2.87H17.99' />
+      <path d='M2.51 2.87H8.53' />
+      <path d='M10.25 9.75H17.99' />
+      <path d='M2.51 9.75H6.81' />
+      <path d='M13.69 16.63H17.99' />
+      <path d='M2.51 16.63H10.25' />
+      <path d='M11.97 1.15V4.59' />
+      <path d='M6.81 8.03V11.47' />
+      <path d='M13.69 14.91V18.35' />
+    </svg>
+  )
+}
diff --git a/packages/emcn/src/icons/toggle-left.tsx b/packages/emcn/src/icons/toggle-left.tsx
@@ -0,0 +1,26 @@
+import type { SVGProps } from 'react'
+
+/**
+ * ToggleLeft icon component - pill track with the knob resting on the left
+ * @param props - SVG properties including className, fill, etc.
+ */
+export function ToggleLeft(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      width='24'
+      height='24'
+      viewBox='-1 -2 24 24'
+      fill='none'
+      stroke='currentColor'
+      strokeWidth='1.55'
+      strokeLinecap='round'
+      strokeLinejoin='round'
+      xmlns='http://www.w3.org/2000/svg'
+      aria-hidden='true'
+      {...props}
+    >
+      <rect x='1.65' y='3.73' width='17.2' height='12.04' rx='6.02' />
+      <circle cx='7.67' cy='9.75' r='2.58' />
+    </svg>
+  )
+}