Skip to content

Commit d082d8c

Browse files
committed
feat(CC-batch-4): moved directory, updated for review
1 parent 72bd8f5 commit d082d8c

15 files changed

+363
-0
lines changed
Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
import { DataList } from '@patternfly/react-core';
2+
import figma from '@figma/code-connect';
3+
4+
/**
5+
* PatternFly DataList component integration for Figma Code Connect
6+
*/
7+
8+
figma.connect(
9+
DataList,
10+
'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=6649-80542&m=dev',
11+
{
12+
props: {
13+
// enum
14+
isCompact: figma.enum('Size', { Compact: true }),
15+
isExpanded: figma.boolean('Expandable'),
16+
17+
children: figma.children('*')
18+
},
19+
example: (props) => <DataList isExpanded={props.isExpanded} isCompact={props.isCompact}>{props.children}</DataList>
20+
}
21+
);
Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
import figma from '@figma/code-connect';
2+
import { DataListItem } from '@patternfly/react-core';
3+
4+
/**
5+
* PatternFly DataListItem component integration for Figma Code Connect
6+
*/
7+
8+
figma.connect(
9+
DataListItem,
10+
'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=6649-69488&m=dev',
11+
{
12+
props: {
13+
// boolean
14+
showLeftControls: figma.boolean('Show Left controls'),
15+
showRightActions: figma.boolean('Show right actions'),
16+
isSelected: figma.boolean('Selected'),
17+
isExpanded: figma.boolean('Expanded'),
18+
19+
// enum
20+
isCompact: figma.enum('Size', { Compact: true }),
21+
22+
children: figma.children('*')
23+
},
24+
example: (props) => (
25+
<DataListItem selected={props.isSelected} isExpanded={props.isExpanded} isCompact={props.isCompact}>
26+
{props.children}
27+
</DataListItem>
28+
)
29+
}
30+
);
Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import { DescriptionList } from '@patternfly/react-core';
2+
import figma from '@figma/code-connect';
3+
4+
/**
5+
* PatternFly DescriptionList component integration for Figma Code Connect
6+
*/
7+
8+
figma.connect(
9+
DescriptionList,
10+
'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=1121-3946&m=dev',
11+
{
12+
props: {
13+
// enum
14+
isCompact: figma.enum('Spacing', { Compact: true }),
15+
isFluid: figma.enum('Orientation', { 'Horizontal - Fluid': true }),
16+
isHorizontal: figma.enum('Orientation', {
17+
'Horizontal - Fixed': true,
18+
'Horizontal - Fluid': true
19+
}),
20+
21+
children: figma.children('*')
22+
},
23+
example: (props) => (
24+
<DescriptionList isFluid={props.isFluid} isCompact={props.isCompact} isHorizontal={props.isHorizontal}>
25+
{props.children}
26+
</DescriptionList>
27+
)
28+
}
29+
);
Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import figma from '@figma/code-connect';
2+
import { DescriptionListGroup, DescriptionListDescription } from '@patternfly/react-core';
3+
4+
figma.connect(
5+
DescriptionListGroup,
6+
'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=1121-3571&m=dev',
7+
{
8+
props: {
9+
// string
10+
content: figma.string('✏️ Content'),
11+
12+
// enum
13+
type: figma.enum('Type', {
14+
Vertical: 'vertical',
15+
'Horizontal fluid': 'horizontal-fluid',
16+
'Horizontal fixed': 'horizontal-fixed'
17+
}),
18+
19+
// instance
20+
swapLabel: figma.instance('Swap label'),
21+
22+
children: figma.children('*')
23+
},
24+
25+
example: (props) => (
26+
<DescriptionListGroup>
27+
{props.children}
28+
<DescriptionListDescription>{props.content}</DescriptionListDescription>
29+
</DescriptionListGroup>
30+
)
31+
}
32+
);
Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
import figma from '@figma/code-connect';
2+
import { DescriptionListTerm } from '@patternfly/react-core';
3+
4+
figma.connect(
5+
DescriptionListTerm,
6+
'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=1121-3453&m=dev',
7+
{
8+
props: {
9+
icon: figma.boolean('Icon ⎆'),
10+
termHelpUnderline: figma.boolean('Term help underline'),
11+
label: figma.string('✏️ Label'),
12+
inlineEditToggle: figma.boolean('Inline edit toggle')
13+
},
14+
example: (props) => (
15+
<DescriptionListTerm
16+
icon={props.icon}
17+
underline={props.termHelpUnderline}
18+
label={props.label}
19+
inlineEditToggle={props.inlineEditToggle}
20+
/>
21+
)
22+
}
23+
);
Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import { Divider } from '@patternfly/react-core';
2+
import figma from '@figma/code-connect';
3+
4+
figma.connect(
5+
Divider,
6+
'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6%3A-Components-Test?node-id=2764-6708&m=dev',
7+
{
8+
props: {
9+
/**
10+
* TODO: This is a good example of how properties in Figma and props in React would benefit from naming consistency
11+
* React is looking for orientation, figma is defining orientation as 'Direction'
12+
*/
13+
isHorizontal: figma.enum('Direction', {
14+
Horizontal: { default: 'horizontal' }
15+
}),
16+
/**
17+
* TODO: Figma allows optional insets, but default to insetMd
18+
*/
19+
inset: figma.boolean('With insets', {
20+
true: { default: 'insetMd' }
21+
})
22+
},
23+
example: (props) => <Divider orientation={props.isHorizontal} inset={props.inset} />
24+
}
25+
);
Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
import figma from '@figma/code-connect';
2+
import { Drawer } from '@patternfly/react-core';
3+
4+
/**
5+
* PatternFly Drawer component integration for Figma Code Connect
6+
*/
7+
8+
const main = {
9+
title: 'teste'
10+
};
11+
12+
figma.connect(
13+
Drawer,
14+
'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=8034-7676&t=IzSunfrnw18ti37Y-11',
15+
{
16+
props: {
17+
// boolean
18+
isExpanded: figma.boolean('Show Footer actions'),
19+
isInline: figma.enum('Type', { Inline: true }),
20+
isResizable: figma.boolean('Is resizable'),
21+
isStatic: figma.boolean('Has action icon'),
22+
23+
// enum
24+
isLeft: figma.enum('Position', { Left: 'start' }),
25+
26+
children: figma.children('*')
27+
},
28+
example: (props) => (
29+
<Drawer isExpanded={props.isExpanded} isInline={props.isInline} isStatic={props.isStatic} position={props.isLeft}>
30+
{props.children}
31+
</Drawer>
32+
)
33+
}
34+
);
Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import figma from '@figma/code-connect';
2+
import { DrawerContent } from '@patternfly/react-core';
3+
4+
/**
5+
* PatternFly DrawerTabs component integration for Figma Code Connect
6+
*/
7+
8+
figma.connect(
9+
DrawerContent,
10+
'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=35627-47890&m=dev',
11+
{
12+
props: {
13+
children: figma.children('*')
14+
},
15+
example: (props) => <DrawerContent>{props.children}</DrawerContent>
16+
}
17+
);
Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import figma from '@figma/code-connect';
2+
import { DrawerContent } from '@patternfly/react-core';
3+
4+
/**
5+
* PatternFly DrawerMain component integration for Figma Code Connect
6+
*/
7+
8+
figma.connect(
9+
DrawerContent,
10+
'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=35586-211216&m=dev',
11+
{
12+
props: {
13+
children: figma.children('*')
14+
},
15+
example: (props) => <DrawerContent>{props.children}</DrawerContent>
16+
}
17+
);
Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
import figma from '@figma/code-connect';
2+
import { DualListSelectorPane } from '@patternfly/react-core';
3+
4+
/**
5+
* PatternFly DualListSelectorHeader component integration for Figma Code Connect
6+
*/
7+
8+
figma.connect(
9+
DualListSelectorPane,
10+
'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=21279-116172&m=dev',
11+
{
12+
props: {
13+
// string
14+
headerText: figma.string('Header text'),
15+
itemInformation: figma.string('Item information'),
16+
17+
children: figma.children('*')
18+
},
19+
example: (props) => <DualListSelectorPane title={props.headerText}>{props.children}</DualListSelectorPane>
20+
}
21+
);

0 commit comments

Comments
 (0)