adilallo
84 lines
1.6 KiB
JavaScript
84 lines
1.6 KiB
JavaScript
import Chip from "../../app/components/controls/Chip";
|
|
|
|
export default {
|
|
title: "Components/Controls/Chip",
|
|
component: Chip,
|
|
parameters: {
|
|
layout: "centered",
|
|
},
|
|
argTypes: {
|
|
label: {
|
|
control: "text",
|
|
description: "Text displayed inside the chip",
|
|
},
|
|
state: {
|
|
control: "select",
|
|
options: ["unselected", "selected", "disabled", "custom"],
|
|
description: "Visual state of the chip",
|
|
},
|
|
palette: {
|
|
control: "select",
|
|
options: ["default", "inverse"],
|
|
description: "Color palette of the chip",
|
|
},
|
|
size: {
|
|
control: "select",
|
|
options: ["s", "m"],
|
|
description: "Size of the chip",
|
|
},
|
|
disabled: {
|
|
control: "boolean",
|
|
description: "Override the disabled behaviour independently of state",
|
|
},
|
|
onClick: { action: "clicked" },
|
|
onRemove: { action: "removed" },
|
|
onCheck: { action: "checked" },
|
|
onClose: { action: "closed" },
|
|
},
|
|
};
|
|
|
|
export const Default = {
|
|
args: {
|
|
label: "Worker cooperative",
|
|
state: "unselected",
|
|
palette: "default",
|
|
size: "m",
|
|
},
|
|
};
|
|
|
|
export const Selected = {
|
|
args: {
|
|
label: "Worker cooperative",
|
|
state: "selected",
|
|
palette: "default",
|
|
size: "m",
|
|
},
|
|
};
|
|
|
|
export const Disabled = {
|
|
args: {
|
|
label: "Worker cooperative",
|
|
state: "disabled",
|
|
palette: "default",
|
|
size: "m",
|
|
},
|
|
};
|
|
|
|
export const Inverse = {
|
|
args: {
|
|
label: "Worker cooperative",
|
|
state: "selected",
|
|
palette: "inverse",
|
|
size: "m",
|
|
},
|
|
};
|
|
|
|
export const Small = {
|
|
args: {
|
|
label: "Worker cooperative",
|
|
state: "unselected",
|
|
palette: "default",
|
|
size: "s",
|
|
},
|
|
};
|