function findComponent(
  typeName: string,
  typeId?: number
): ParamComponentType & { typeId?: number }

import { findComponent } from "@/lib/input-map";

// Simple type lookup
const { component: AccountComponent } = findComponent("AccountId");
// Returns: Account component

// Complex type with typeId
const { component: VectorComponent, typeId } = findComponent("Vec<Balance>", 123);
// Returns: Vector component with typeId for nested type resolution

// Unknown type falls back to Text
const { component: TextComponent } = findComponent("SomeUnknownType");
// Returns: Text component

findComponent("AccountId");              // -> Account (exact match, priority 100)
findComponent("AccountIdOf<T>");         // -> Account (regex match, priority 100)
findComponent("Balance");                // -> Balance (exact match, priority 95)
findComponent("Compact<Balance>");       // -> Balance (exact match, priority 95)
findComponent("BalanceOf<T>");           // -> Balance (regex match, priority 95)
findComponent("H160");                   // -> Hash160 (exact match, priority 82)
findComponent("H512");                   // -> Hash512 (exact match, priority 78)
findComponent("Vec<u8>");               // -> Bytes (exact match, priority 75)
findComponent("[u8; 32]");              // -> VectorFixed (regex match, priority 43)
findComponent("BTreeMap<u32, u64>");    // -> BTreeMap (regex match, priority 42)
findComponent("BTreeSet<AccountId>");   // -> BTreeSet (regex match, priority 41)
findComponent("Vec<AccountId>");        // -> Vector (regex match, priority 40)
findComponent("Option<Balance>");       // -> Option (regex match, priority 45)
findComponent("UnknownType");           // -> Text (fallback)

interface ComponentRegistration {
  component: React.ComponentType<any>;  // The React component
  schema: any;                          // Zod validation schema
  patterns: (string | RegExp)[];        // Matching patterns
  priority: number;                     // Higher = checked first
}

const registry: ComponentRegistration[] = [
  {
    component: Account,
    schema: Account.schema,
    patterns: ["AccountId", "AccountId32", "MultiAddress", /^AccountId/],
    priority: 100,
  },
  {
    component: Balance,
    schema: Balance.schema,
    patterns: ["Balance", "BalanceOf", /^Balance/],
    priority: 95,
  },
  // ... more registrations
];

import { findComponent } from "@/lib/input-map";

function ParameterInput({ field, client, onChange }) {
  const { component: Component, schema } = findComponent(
    field.typeName,
    field.typeId
  );

  return (
    <Component
      client={client}
      name={field.name}
      label={field.name}
      description={field.typeName}
      typeId={field.typeId}
      onChange={onChange}
    />
  );
}

// In Option component
function Option({ typeId, client, children, ...props }) {
  // If no children provided, resolve inner type from registry
  const innerType = useMemo(() => {
    if (children) return children;
    if (!client || !typeId) return null;

    const typeInfo = client.registry.findType(typeId);
    // Extract inner type and find its component
    const innerTypeId = typeInfo.typeDef.value.typeParam;
    const innerTypeName = client.registry.findType(innerTypeId).path?.join("::");

    return findComponent(innerTypeName, innerTypeId);
  }, [children, client, typeId]);

  // Render inner component
}

// components/params/inputs/my-custom.tsx
import { z } from "zod";
import type { ParamInputProps } from "../types";

const schema = z.string();

export function MyCustom({ name, label, onChange, ...props }: ParamInputProps) {
  return (
    <div>
      {/* Your input UI */}
    </div>
  );
}

MyCustom.schema = schema;

import { MyCustom } from "@/components/params/inputs/my-custom";

const registry: ComponentRegistration[] = [
  // Add before lower-priority entries
  {
    component: MyCustom,
    schema: MyCustom.schema,
    patterns: ["MyCustomType", /^MyCustom/],
    priority: 85,  // Choose appropriate priority
  },
  // ... existing entries
];