MML.mdx

name	route
MML	/mml

import { Playground, Props } from 'docz'; import { MML } from './MML.tsx';

MML

This component accepts an MML string and renders it as React components.

If there are any stateful tag, it will gather all the inital states and and expose them in MMLContext.

It also accepts custom convertor which allows you to exapand the default tags and add more compoennts.

Properties

Basic usage

Basic usage with stateful components

Confirm `} />

Callback support

If onSubmit callback return a promise, it will be awaited.

console.info(data)} source={` Submit `} />

Different use cases

Hi Jack, I'm painting John's house, looks like they also need some plumbing work, do any of these times work for you on Saturday? 9:30 10:00 11:30 Cancel `} />

Hi Jack, I'm painting John's house, looks like they also need some plumbing work, do any of these times work for you on Saturday? 9:30 10:00 11:30 Cancel `} />

Invalid MML string

In case of an error, you can override default Error component

{error}

} />

With card type

Shows the mml content inside a card like UI, see the Number component usage as a further example. It automatically wraps the mml components in a <div class="mml-card">...</div>.

Submit `} />