import {CommandPalette, MinimalPage} from "ui";
import {ArgsTable, Canvas, Meta, Story} from "@storybook/addon-docs";
<Meta title="Components/Sections/CommandPalette/old" component={CommandPalette}/>
export const Template = (args) => (
<MinimalPage pageTitle="Command Palette" pageDescription="" commandPrompt>
<p> Press command + k or ctrl + k in order to open the command palette.</p>
<CommandPalette {...args} />
</MinimalPage>
);
# CommandPalette
Description of a CommandPalette
## Props
<ArgsTable story="Empty"/>
## Examples
<Canvas>
<Story
name="Empty"
args={{
startOpen: false,
onType: (value) => {
return value;
},
onSelect: (value) => {
return value;
},
options: [],
loading: false,
}}
>
{Template.bind({})}
</Story>
</Canvas>
<Canvas>
<Story
name="Full"
args={{
startOpen: false,
onType: (value) => {
return value;
},
onSelect: (value) => {
return value;
},
options: [
{
id: "1",
title: "Test 1",
description: `Multi line string
Text wrap Test
testtesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttest
`,
},
{
id: "2",
title: "Test 2",
description: "test",
},
{
id: "3",
title: "Test 3",
description: "test",
},
{
id: "4",
title: "Test 4",
description: "test",
},
{
id: "5",
title: "Test 5",
description: "test",
},
{
id: "6",
title: "Test 6",
description: "test",
},
{
id: "7",
title: "Test 7",
description: "test",
},
{
id: "8",
title: "Test 8",
description: "test",
},
{
id: "9",
title: "Test 9",
description: "test",
},
{
id: "10",
title: "Test 10",
description: "test",
},
{
id: "11",
title: "Test 11",
description: "test",
},
{
id: "12",
title: "Test 12",
description: "test",
},
{
id: "13",
title: "Test 13",
description: "test",
},
{
id: "14",
title: "Test 14",
description: "test",
}, {
id: "15",
title: "Test 15",
description: "test",
},
{
id: "15",
title: "Test 15",
description: "test",
},
],
loading: false,
}}
>
{Template.bind({})}
</Story>
</Canvas>
<Canvas>
<Story
name="Error"
args={{
startOpen: false,
onType: (value) => {
return value;
},
onSelect: (value) => {
return value;
},
options: [],
error: "There was an error.",
loading: false,
}}
>
{Template.bind({})}
</Story>
</Canvas>
