This PR was created by [GitStart](https://gitstart.com/) to address the requirements from this ticket: [TWNTY-7535](https://clients.gitstart.com/twenty/5449/tickets/TWNTY-7535). --- ### Description. Migrate link components to `twenty-ui` \ \ Fixes #7535 --------- Co-authored-by: gitstart-twenty <gitstart-twenty@users.noreply.github.com> Co-authored-by: gitstart-twenty <140154534+gitstart-twenty@users.noreply.github.com> Co-authored-by: Charles Bochet <charles@twenty.com>
36 lines
966 B
Plaintext
36 lines
966 B
Plaintext
---
|
|
title: Toggle
|
|
icon: TbToggleRight
|
|
image: /images/user-guide/table-views/table.png
|
|
---
|
|
|
|
<ArticleTabs label1="Usage" label2="Props">
|
|
<ArticleTab>
|
|
|
|
<SandpackEditor content={`import { Toggle } from "twenty-ui";
|
|
|
|
export const MyComponent = () => {
|
|
return (
|
|
<Toggle
|
|
value = {true}
|
|
onChange = {()=>console.log('On Change event')}
|
|
color="green"
|
|
toggleSize = "medium"
|
|
/>
|
|
);
|
|
};`} />
|
|
|
|
</ArticleTab>
|
|
<ArticleTab>
|
|
|
|
<ArticlePropsTable options={[
|
|
['value', 'boolean', 'The current state of the toggle', '`false`'],
|
|
['onChange', 'function', 'Callback function triggered when the toggle state changes', ''],
|
|
['color', 'string', 'Color of the toggle when it\'s in the "on" state. If not provided, it uses the theme\'s blue color', ''],
|
|
['toggleSize', 'string', 'Size of the toggle, affecting both height and weight. Has two options: `small` and `medium`', 'medium']
|
|
]} />
|
|
|
|
</ArticleTab>
|
|
</ArticleTabs>
|
|
|
|
<ArticleEditContent></ArticleEditContent> |