-
Notifications
You must be signed in to change notification settings - Fork 74
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: figma code connect for atom components
- Loading branch information
1 parent
8b9e845
commit 8822840
Showing
16 changed files
with
346 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,22 @@ | ||
import React from 'react'; | ||
import { Badge } from '@/index'; | ||
import figma from '@figma/code-connect'; | ||
|
||
figma.connect(Badge, 'https://www.figma.com/design/w8sqBtJpvq86D06UE7gN0T/MDS---Web?node-id=41-0&m=dev', { | ||
imports: ["import { Badge } from '@innovaccer/design-system'"], | ||
props: { | ||
appearance: figma.enum('Appearance', { | ||
Jal: 'primary', | ||
Stone: 'secondary', | ||
Neem: 'success', | ||
Haldi: 'warning', | ||
Mirch: 'alert', | ||
Tawak: 'accent1', | ||
Nimbu: 'accent4', | ||
Neel: 'accent3', | ||
Jamun: 'accent2', | ||
}), | ||
subtle: figma.boolean('Subtle'), | ||
}, | ||
example: (props) => <Badge {...props}>badge</Badge>, | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,29 @@ | ||
import React from 'react'; | ||
import { Message, LinkButton } from '@/index'; | ||
import figma from '@figma/code-connect'; | ||
|
||
figma.connect(Message, 'https://www.figma.com/design/w8sqBtJpvq86D06UE7gN0T/MDS---Web?node-id=444-1446&m=dev', { | ||
imports: ["import { Message, LinkButton } from '@innovaccer/design-system'"], | ||
props: { | ||
appearance: figma.enum('Appearance', { | ||
Info: 'info', | ||
Success: 'success', | ||
Warning: 'warning', | ||
Alert: 'alert', | ||
}), | ||
title: figma.enum('Title', { | ||
true: 'Title goes here', | ||
false: undefined, | ||
}), | ||
actions: figma.boolean('Actions', { | ||
true: ( | ||
<> | ||
<LinkButton>Action 1</LinkButton> | ||
<LinkButton className="ml-5">Action 2</LinkButton> | ||
</> | ||
), | ||
false: undefined, | ||
}), | ||
}, | ||
example: (props) => <Message description="Message goes here" {...props} />, | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,21 @@ | ||
import React from 'react'; | ||
import { MetaList } from '@/index'; | ||
import figma from '@figma/code-connect'; | ||
|
||
figma.connect(MetaList, 'https://www.figma.com/design/w8sqBtJpvq86D06UE7gN0T/MDS---Web?node-id=4384-30464&m=dev', { | ||
imports: ["import { MetaList } from '@innovaccer/design-system'"], | ||
props: { | ||
size: figma.enum('Size', { | ||
Regular: 'regular', | ||
Small: 'small', | ||
}), | ||
list: figma.enum('Icon left', { | ||
true: [ | ||
{ icon: 'assessment', label: 'Meta data' }, | ||
{ icon: 'assessment', label: 'Meta data' }, | ||
], | ||
false: [{ label: 'Meta data' }, { label: 'Meta data' }], | ||
}), | ||
}, | ||
example: (props) => <MetaList {...props} />, | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,23 @@ | ||
import React from 'react'; | ||
import { MetricInput } from '@/index'; | ||
import figma from '@figma/code-connect'; | ||
|
||
figma.connect(MetricInput, 'https://www.figma.com/design/w8sqBtJpvq86D06UE7gN0T/MDS---Web?node-id=572-1969&m=dev', { | ||
imports: ["import { MetricInput } from '@innovaccer/design-system'"], | ||
props: { | ||
size: figma.enum('Size', { | ||
Regular: 'regular', | ||
Large: 'large', | ||
}), | ||
prefix: figma.enum('Prefix', { | ||
true: 'Prefix', | ||
false: undefined, | ||
}), | ||
suffix: figma.enum('Suffix', { | ||
true: 'Suffix', | ||
false: undefined, | ||
}), | ||
showActionButton: figma.boolean('Actions'), | ||
}, | ||
example: (props) => <MetricInput {...props} />, | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,22 @@ | ||
import React from 'react'; | ||
import { Pills } from '@/index'; | ||
import figma from '@figma/code-connect'; | ||
|
||
figma.connect(Pills, 'https://www.figma.com/design/w8sqBtJpvq86D06UE7gN0T/MDS---Web?node-id=39-763&m=dev', { | ||
imports: ["import { Pills } from '@innovaccer/design-system'"], | ||
props: { | ||
appearance: figma.enum('Appearance', { | ||
Jal: 'primary', | ||
Stone: 'secondary', | ||
Neem: 'success', | ||
Haldi: 'warning', | ||
Mirch: 'alert', | ||
Tawak: 'accent1', | ||
Nimbu: 'accent4', | ||
Neel: 'accent3', | ||
Jamun: 'accent2', | ||
}), | ||
subtle: figma.boolean('Subtle'), | ||
}, | ||
example: (props) => <Pills {...props}>PILL</Pills>, | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,18 @@ | ||
import React from 'react'; | ||
import { PlaceholderImage } from '@/index'; | ||
import figma from '@figma/code-connect'; | ||
|
||
figma.connect( | ||
PlaceholderImage, | ||
'https://www.figma.com/design/w8sqBtJpvq86D06UE7gN0T/MDS---Web?node-id=441-1652&m=dev', | ||
{ | ||
imports: ["import { PlaceholderImage } from '@innovaccer/design-system'"], | ||
props: { | ||
round: figma.enum('Shape', { | ||
Round: true, | ||
Square: false, | ||
}), | ||
}, | ||
example: (props) => <PlaceholderImage {...props} />, | ||
} | ||
); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,26 @@ | ||
import React from 'react'; | ||
import { ProgressBar } from '@/index'; | ||
import figma from '@figma/code-connect'; | ||
|
||
figma.connect(ProgressBar, 'https://www.figma.com/design/w8sqBtJpvq86D06UE7gN0T/MDS---Web?node-id=441-1443&m=dev', { | ||
imports: ["import { ProgressBar } from '@innovaccer/design-system'"], | ||
props: { | ||
size: figma.enum('Size', { | ||
Regular: 'regular', | ||
Small: 'small', | ||
}), | ||
value: figma.enum('Percentage', { | ||
'10%': 10, | ||
'20%': 20, | ||
'30%': 30, | ||
'40%': 40, | ||
'50%': 50, | ||
'60%': 60, | ||
'70%': 70, | ||
'80%': 80, | ||
'90%': 90, | ||
'100%': 100, | ||
}), | ||
}, | ||
example: (props) => <ProgressBar {...props} />, | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,21 @@ | ||
import React from 'react'; | ||
import { ProgressRing } from '@/index'; | ||
import figma from '@figma/code-connect'; | ||
|
||
figma.connect(ProgressRing, 'https://www.figma.com/design/w8sqBtJpvq86D06UE7gN0T/MDS---Web?node-id=441-1502&m=dev', { | ||
imports: ["import { ProgressRing } from '@innovaccer/design-system'"], | ||
props: { | ||
size: figma.enum('Size', { | ||
Small: 'small', | ||
Regular: 'regular', | ||
Large: 'regular', | ||
}), | ||
value: figma.enum('Percentage', { | ||
'25%': 25, | ||
'50%': 50, | ||
'75%': 75, | ||
'100%': 100, | ||
}), | ||
}, | ||
example: (props) => <ProgressRing {...props} />, | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,23 @@ | ||
import React from 'react'; | ||
import { Radio } from '@/index'; | ||
import figma from '@figma/code-connect'; | ||
|
||
figma.connect(Radio, 'https://www.figma.com/design/w8sqBtJpvq86D06UE7gN0T/MDS---Web?node-id=97-632&m=dev', { | ||
imports: ["import { Radio } from '@innovaccer/design-system'"], | ||
props: { | ||
checked: figma.boolean('Selected'), | ||
disabled: figma.enum('State', { | ||
Default: undefined, | ||
Hover: undefined, | ||
Active: undefined, | ||
Focus: undefined, | ||
Disabled: true, | ||
}), | ||
size: figma.enum('Size', { | ||
Regular: 'regular', | ||
Small: 'tiny', | ||
}), | ||
error: figma.boolean('Error'), | ||
}, | ||
example: (props) => <Radio name="name of radio" value="value of radio" {...props} />, | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,14 @@ | ||
import React from 'react'; | ||
import { RangeSlider } from '@/index'; | ||
import figma from '@figma/code-connect'; | ||
|
||
figma.connect(RangeSlider, 'https://www.figma.com/design/w8sqBtJpvq86D06UE7gN0T/MDS---Web?node-id=1614-10717&m=dev', { | ||
imports: ["import { RangeSlider } from '@innovaccer/design-system'"], | ||
props: { | ||
disabled: figma.enum('State', { | ||
Default: undefined, | ||
Disabled: true, | ||
}), | ||
}, | ||
example: (props) => <RangeSlider defaultValue={[2, 4]} {...props} />, | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,32 @@ | ||
import React from 'react'; | ||
import { SelectionCard, Icon, Text } from '@/index'; | ||
import figma from '@figma/code-connect'; | ||
|
||
figma.connect( | ||
SelectionCard, | ||
'https://www.figma.com/design/w8sqBtJpvq86D06UE7gN0T/MDS---Web?node-id=30071-131561&m=dev', | ||
{ | ||
imports: ["import { SelectionCard, Icon, Text } from '@innovaccer/design-system'"], | ||
props: { | ||
selected: figma.boolean('Selected'), | ||
disabled: figma.enum('State', { | ||
Default: undefined, | ||
Hover: undefined, | ||
Active: undefined, | ||
Focus: undefined, | ||
Disabled: true, | ||
}), | ||
}, | ||
example: (props) => ( | ||
<SelectionCard id="test" {...props}> | ||
<div className="d-flex flex-column align-items-center justify-content-center p-6 text-align-center"> | ||
<Icon className="mb-4" name="events" size={24} /> | ||
<Text className="mb-2" weight="strong"> | ||
Title | ||
</Text> | ||
<Text appearance="subtle">Description goes here</Text> | ||
</div> | ||
</SelectionCard> | ||
), | ||
} | ||
); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,14 @@ | ||
import React from 'react'; | ||
import { Slider } from '@/index'; | ||
import figma from '@figma/code-connect'; | ||
|
||
figma.connect(Slider, 'https://www.figma.com/design/w8sqBtJpvq86D06UE7gN0T/MDS---Web?node-id=1042-897&m=dev', { | ||
imports: ["import { Slider } from '@innovaccer/design-system'"], | ||
props: { | ||
disabled: figma.enum('State', { | ||
Default: undefined, | ||
Disabled: true, | ||
}), | ||
}, | ||
example: (props) => <Slider defaultValue={5} {...props} />, | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
import React from 'react'; | ||
import { Spinner } from '@/index'; | ||
import figma from '@figma/code-connect'; | ||
|
||
figma.connect(Spinner, 'https://www.figma.com/design/w8sqBtJpvq86D06UE7gN0T/MDS---Web?node-id=441-1582&m=dev', { | ||
imports: ["import { Spinner } from '@innovaccer/design-system'"], | ||
props: { | ||
size: figma.enum('Size', { | ||
Small: 'small', | ||
Regular: 'medium', | ||
Large: 'large', | ||
}), | ||
}, | ||
example: (props) => <Spinner {...props} />, | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,17 @@ | ||
import React from 'react'; | ||
import { StatusHint } from '@/index'; | ||
import figma from '@figma/code-connect'; | ||
|
||
figma.connect(StatusHint, 'https://www.figma.com/design/w8sqBtJpvq86D06UE7gN0T/MDS---Web?node-id=20-25&m=dev', { | ||
imports: ["import { StatusHint } from '@innovaccer/design-system'"], | ||
props: { | ||
appearance: figma.enum('Appearance', { | ||
Default: 'default', | ||
Info: 'info', | ||
Success: 'success', | ||
Warning: 'warning', | ||
Alert: 'alert', | ||
}), | ||
}, | ||
example: (props) => <StatusHint {...props}> Status Hint</StatusHint>, | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,22 @@ | ||
import React from 'react'; | ||
import { Switch } from '@/index'; | ||
import figma from '@figma/code-connect'; | ||
|
||
figma.connect(Switch, 'https://www.figma.com/design/w8sqBtJpvq86D06UE7gN0T/MDS---Web?node-id=47-469&m=dev', { | ||
imports: ["import { Switch } from '@innovaccer/design-system'"], | ||
props: { | ||
size: figma.enum('Size', { | ||
Regular: 'regular', | ||
Small: 'tiny', | ||
}), | ||
disabled: figma.enum('State', { | ||
Default: undefined, | ||
Hover: undefined, | ||
Active: undefined, | ||
Focus: undefined, | ||
Disabled: true, | ||
}), | ||
checked: figma.boolean('On'), | ||
}, | ||
example: (props) => <Switch name="Name of switch" value="Value of switch" {...props} />, | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,27 @@ | ||
import React from 'react'; | ||
import { Toast } from '@/index'; | ||
import figma from '@figma/code-connect'; | ||
|
||
figma.connect(Toast, 'https://www.figma.com/design/w8sqBtJpvq86D06UE7gN0T/MDS---Web?node-id=694-632&m=dev', { | ||
imports: ["import { Toast } from '@innovaccer/design-system'"], | ||
props: { | ||
appearance: figma.enum('Appearance', { | ||
Info: 'info', | ||
Success: 'success', | ||
Warning: 'warning', | ||
Alert: 'alert', | ||
}), | ||
message: figma.enum('Description', { | ||
true: 'Description goes here', | ||
false: undefined, | ||
}), | ||
actions: figma.enum('Actions', { | ||
true: [ | ||
{ label: 'Action', onClick: function () {} }, | ||
{ label: 'Action', onClick: function () {} }, | ||
], | ||
false: undefined, | ||
}), | ||
}, | ||
example: (props) => <Toast title="Title goes here" {...props} />, | ||
}); |