Getting Started

A quick tutorial on how to get up and running with Micode UI

Implementing a simple Button

1. Install Micode UI

Install the Micode UI from your command line

pnpm i @micode-ui/react

2. Use it

import { Button } from '@micode-ui/react';
const Page = () => {
  return <Button>I'm a button!</Button>;
};

Props

The props will be shown as the example that follows. Notice that in this example, the interface is extending ComponentProps of ButtonContainer, which is a radix-ui styled button, which can receive all props that a normal HTML button can, but can also receive all radix-ui props like as and css.

interface ButtonProps extends ComponentProps<typeof ButtonContainer> {
  as?: ElementType; // Default: 'button';
  loading?: boolean; // Default: false;
  css?: CSS;
}

The css property works just like the radix-ui native property, but it also includes some additional properties, described at Additional Styling

Introduction Additional Styling