When property names are known at development time, use direct property access (e.g., object.property) over computed property access (e.g., object[propertyName]). This approach enhances code readability, enables better IDE autocompletion, improves type checking, and makes the code more maintainable.

Example - Instead of:

output[propName] = clsx(
  defaultProps?.[propName] as string,
  props?.[propName] as string,
);

output[propName] = {
  ...(defaultProps?.[propName] ?? ({} as React.CSSProperties)),
  ...(props?.[propName] ?? ({} as React.CSSProperties)),
};

Prefer:

output.className = clsx(
  defaultProps.className,
  props.className,
);

output.style = {
  ...defaultProps.style,
  ...props.style,
};

This approach eliminates unnecessary dynamic property access, type assertions, and optional chaining when the property name is statically known. Code becomes more concise and the intent is clearer.