Type Alias: RFieldStringifier()<T>

type RFieldStringifier<T> = (value: T) => string | VNode;

A function type that converts any value into a string or VNode representation for display purposes. This is the core abstraction that makes all Resourceful field components generic and reusable across different data types.

The function can return either:

• A plain string for simple text representation
• A VNode for rich content with styling, icons, badges, etc.

The component automatically handles both return types appropriately:

• For HTML attributes (like title): Converts VNodes to plain text
• For content rendering: Displays VNodes as rich content, strings as text

Type Parameters

Type Parameter	Default type	Description
T	any	The type of value being stringified (defaults to any for maximum flexibility)

Parameters

Parameter	Type	Description
value	T	The value to be converted for display

Returns

string | VNode

Either a string or VNode representation of the value

Example

// Simple string stringifier for typed data
const userStringifier: RFieldStringifier<User> = (user) => user.name;

// Generic stringifier for any data type
const genericStringifier: RFieldStringifier = (value) => String(value);

// Rich VNode stringifier with type safety
const richUserStringifier: RFieldStringifier<User> = (user) =>
  h("div", { class: "user-display" }, [
    h(VAvatar, { size: "small", src: user.avatar }),
    h("span", { class: "user-name" }, user.name),
    h(VChip, { size: "x-small", color: user.role }, user.role),
  ]);

// Number formatting with locale support
const currencyStringifier: RFieldStringifier<number> = (amount) =>
  new Intl.NumberFormat("en-US", { style: "currency", currency: "USD" }).format(
    amount,
  );