studio/cunningham
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

✨(react) add icon to Button

Browse Source 
The DS does not offer an icons set yet but it seems important to
already provide a support for external icons in Button.
This commit is contained in:
Nathan Vasse
2023-01-16 11:17:27 +01:00
committed by NathanVss
parent 9fa0ff8ad3
commit 05f9252029
5 changed files with 111 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
packages/react/src/components/Button/index.stories.tsx
View File

@@ -33,3 +33,54 @@ Disabled.args = {
color: "primary",
disabled: true,
};
export const Danger = Template.bind({});
Danger.args = {
children: "Danger",
color: "danger",
};
export const IconLeft = Template.bind({});
IconLeft.args = {
children: "Icon",
icon: (
<svg
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
fill="currentColor"
fillRule="evenodd"
clipRule="evenodd"
d="M17.8724 10.0166H13.248L16.6251 4.07749C16.9258 3.54846 16.2447 3.01176 15.8005 3.42755L6.57343 12.0655C6.22192 12.3946 6.45489 12.9838 6.93615 12.9838H11.5606L8.18353 18.9229C7.88275 19.4519 8.56335 19.9886 9.00746 19.5728L18.2352 10.9349C18.5867 10.6058 18.3537 10.0166 17.8724 10.0166Z"
/>
</svg>
),
color: "primary",
};
export const IconRight = Template.bind({});
IconRight.args = {
children: "Icon",
iconPosition: "right",
icon: (
<svg
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
fill="currentColor"
fillRule="evenodd"
clipRule="evenodd"
d="M17.8724 10.0166H13.248L16.6251 4.07749C16.9258 3.54846 16.2447 3.01176 15.8005 3.42755L6.57343 12.0655C6.22192 12.3946 6.45489 12.9838 6.93615 12.9838H11.5606L8.18353 18.9229C7.88275 19.4519 8.56335 19.9886 9.00746 19.5728L18.2352 10.9349C18.5867 10.6058 18.3537 10.0166 17.8724 10.0166Z"
/>
</svg>
),
color: "primary",
};