API Reference

List of exports available from react-twc package.

twc

Builds a twc component.

import { twc } from "react-twc";
 
const Title = twc.h2`font-bold`;

createTwc

Create a custom instance of twc.

import { createTwc } from "react-twc";
import { twMerge } from "tailwind-merge";
 
const twx = createTwc({
  compose: twMerge,
  shouldForwardProp: (prop) => prop[0] !== "_",
});

Options

• compose: The compose function to use. Defaults to clsx.
• shouldForwardProp: The function to use to determine if a prop should be forwarded to the underlying component. Defaults to prop => prop[0] !== "$".
• forwardAsChild: A boolean to determine if the asChild prop should be forwarded to the underlying component. Defaults to false.

cx

Concatenates class names (an alias of clsx (opens in a new tab)).

import { cx } from "react-twc";
 
const className = cx(classes);

TwcComponentProps<Component, Compose = typeof clsx>

Returns props accepted by a twc component. Similar to React.ComponentProps<"button"> with asChild prop and className type from clsx.

import type { TwcComponentProps } from "react-twc";
 
type ButtonProps = TwcComponentProps<"button">;