Skip to content

Commit 655beb5

Browse files
mattnoltingmattnolting
committed
feat(CC-batch-8): added batch 8 files
1 parent 2a9c798 commit 655beb5

10 files changed

Lines changed: 285 additions & 0 deletions

File tree

‎packages/code-connect/components/Slider/Slider.figma.tsx‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
import figma from '@figma/code-connect';
2+
import { Slider } from '@patternfly/react-core';
3+
4+
figma.connect(
5+
Slider,
6+
'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=3155-97956&t=IzSunfrnw18ti37Y-11',
7+
{
8+
props: {
9+
// boolean
10+
leftAction: figma.boolean('Left action'),
11+
minmaxValues: figma.boolean('Min/max values'),
12+
rightAction: figma.boolean('Right action'),
13+
valueInput: figma.boolean('Value input'),
14+
15+
// enum
16+
state: figma.enum('State', {
17+
Default: 'default',
18+
Active: 'active',
19+
Disabled: 'disabled',
20+
Hover: 'hover'
21+
}),
22+
type: figma.enum('Type', {
23+
Continuous: 'continuous',
24+
Discrete: 'discrete'
25+
})
26+
},
27+
example: (props) => (
28+
// Documentation for Slider can be found at https://www.patternfly.org/components/slider
29+
<Slider
30+
areCustomStepsContinuous={props.type === 'continuous'}
31+
isDisabled={props.state === 'disabled'}
32+
showBoundaries={props.minmaxValues}
33+
showTicks={props.type === 'discrete'}
34+
/>
35+
)
36+
}
37+
);

‎packages/code-connect/components/Spinner/Spinner.figma.tsx‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
import figma from '@figma/code-connect';
2+
import { Spinner } from '@patternfly/react-core';
3+
4+
figma.connect(
5+
Spinner,
6+
'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=790-332&t=IzSunfrnw18ti37Y-11',
7+
{
8+
props: {
9+
// enum
10+
size: figma.enum('Size', {
11+
sm: 'sm',
12+
md: 'md',
13+
lg: 'lg',
14+
xl: 'xl'
15+
})
16+
},
17+
example: (props) => (
18+
// Documentation for Spinner can be found at https://www.patternfly.org/components/spinner
19+
<Spinner aria-label="Loading..." size={props.size} />
20+
)
21+
}
22+
);

‎packages/code-connect/components/Splitter/Splitter.figma.tsx‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import figma from '@figma/code-connect';
2+
3+
figma.connect(
4+
'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=8034-8230&m=dev',
5+
{
6+
props: {
7+
// enum
8+
type: figma.enum('Type', {
9+
Overlay: 'overlay',
10+
Vertical: 'vertical'
11+
})
12+
},
13+
example: (props) => (
14+
// Documentation for Spinner can be found at https://www.patternfly.org/components/spinner
15+
<>{props.type}</>
16+
)
17+
}
18+
);

‎packages/code-connect/components/Tabs/HorizontalSubTabs.figma.tsx‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
import figma from '@figma/code-connect';
2+
import { Tabs } from '@patternfly/react-core';
3+
4+
figma.connect(
5+
Tabs,
6+
'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=14327-6583&m=dev',
7+
{
8+
props: {
9+
children: figma.children('*'),
10+
isBox: figma.enum('Type', {
11+
Boxed: false,
12+
'Boxed Light': true
13+
})
14+
},
15+
example: (props) => (
16+
<Tabs
17+
aria-label="Horizontal subtabs example"
18+
isSubtab={true}
19+
isBox={props.isBox}
20+
onSelect={() => {}}
21+
role="region"
22+
>
23+
{props.children}
24+
</Tabs>
25+
)
26+
}
27+
);

‎packages/code-connect/components/Tabs/HorizontalTab.figma.tsx‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
import figma from '@figma/code-connect';
2+
import { Tab, TabTitleText, Timestamp } from '@patternfly/react-core';
3+
4+
figma.connect(
5+
Timestamp,
6+
'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=14327-6161',
7+
{
8+
props: {
9+
// string
10+
tabText: figma.string('Tab Text'),
11+
12+
// enum
13+
isDisabled: figma.enum('State', {
14+
Disabled: true
15+
})
16+
},
17+
example: (props) => (
18+
<Tab
19+
isDisabled={props.isDisabled}
20+
eventKey={0}
21+
title={<TabTitleText>{props.tabText}</TabTitleText>}
22+
aria-label="Default content"
23+
>
24+
{props.tabText}
25+
</Tab>
26+
)
27+
}
28+
);

‎packages/code-connect/components/Tabs/HorizontalTabs.figma.tsx‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
import figma from '@figma/code-connect';
2+
import { Tabs } from '@patternfly/react-core';
3+
4+
figma.connect(
5+
Tabs,
6+
'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=14327-6503',
7+
{
8+
props: {
9+
children: figma.children('*'),
10+
isBox: figma.enum('Type', {
11+
Boxed: false,
12+
'Boxed Light': true
13+
})
14+
},
15+
example: (props) => (
16+
// Documentation for Tabs can be found at https://www.patternfly.org/components/tabs
17+
<Tabs onSelect={() => {}} isBox={props.isBox} aria-label="Tabs example" role="region">
18+
{props.children}
19+
</Tabs>
20+
)
21+
}
22+
);

‎packages/code-connect/components/Tabs/VerticalTabs.figma.tsx‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
import figma from '@figma/code-connect';
2+
import { Tabs } from '@patternfly/react-core';
3+
4+
figma.connect(
5+
Tabs,
6+
'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=14327-6656',
7+
{
8+
props: {
9+
children: figma.children('*'),
10+
isBox: figma.enum('Type', {
11+
Boxed: false,
12+
'Boxed Light': true,
13+
'Inset Boxed': true
14+
}),
15+
inset: figma.enum('Type', {
16+
Inset: { default: 'insetMd' },
17+
'Inset Boxed': { default: 'insetMd' }
18+
})
19+
},
20+
example: (props) => (
21+
// Documentation for Tabs can be found at https://www.patternfly.org/components/tabs
22+
<Tabs isBox={props.isBox} isVertical={true} inset={props.inset} onSelect={() => {}} role="region">
23+
{props.children}
24+
</Tabs>
25+
)
26+
}
27+
);

‎packages/code-connect/components/TimeStamp/Timestamp.figma.tsx‎

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 { Timestamp } from '@patternfly/react-core';
3+
4+
figma.connect(
5+
Timestamp,
6+
'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=7472-6718',
7+
{
8+
props: {
9+
// string
10+
abbreviatedContent: figma.string('✏️ Abbreviated content'),
11+
defaultTimestampContent: figma.string('✏️ Default timestamp content'),
12+
numericContent: figma.string('✏️ Numeric content'),
13+
withoutDay: figma.string('✏️ Without day'),
14+
withoutTime: figma.string('✏️ Without time'),
15+
16+
// boolean
17+
tooltipUnderline: figma.boolean('With tooltip underline'),
18+
19+
// enum
20+
content: figma.enum('Format', {
21+
Default: figma.string('✏️ Default timestamp content'),
22+
'Without time': figma.string('✏️ Without time'),
23+
'Without day': figma.string('✏️ Without day'),
24+
Abbreviated: figma.string('✏️ Abbreviated content'),
25+
Numeric: figma.string('✏️ Numeric content')
26+
}),
27+
children: figma.children('*')
28+
},
29+
example: (props) => (
30+
// Documentation for Timestamp can be found at https://www.patternfly.org/components/timestamp
31+
<Timestamp date={props.content} tooltip={props.tooltipUnderline} />
32+
)
33+
}
34+
);

‎packages/code-connect/components/ToggleGroup/ToggleGroup.figma.tsx‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
import figma from '@figma/code-connect';
2+
import { ToggleGroup } from '@patternfly/react-core';
3+
4+
figma.connect(
5+
ToggleGroup,
6+
'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=7644-56919',
7+
{
8+
props: {
9+
// enum
10+
size: figma.enum('Size', {
11+
Default: 'default',
12+
Compact: 'compact'
13+
}),
14+
15+
// nested props
16+
leftItem: figma.nestedProps('Base components/Toggle groups parts', {
17+
text: figma.string('Text')
18+
}),
19+
middleItem1: figma.nestedProps('Base components/Toggle groups parts', {
20+
text: figma.string('Text')
21+
}),
22+
middleItem2: figma.nestedProps('Base components/Toggle groups parts', {
23+
text: figma.string('Text')
24+
}),
25+
rightItem: figma.nestedProps('Base components/Toggle groups parts', {
26+
text: figma.string('Text')
27+
}),
28+
29+
children: figma.children('*')
30+
},
31+
example: (props) => <ToggleGroup aria-label="Toggle group example">{props.children}</ToggleGroup>
32+
}
33+
);

‎packages/code-connect/components/Tooltip/Tooltip.figma.tsx‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
import figma from '@figma/code-connect';
2+
import { Tooltip } from '@patternfly/react-core';
3+
4+
figma.connect(
5+
Tooltip,
6+
'https://www.figma.com/design/aEBBvq0J3EPXxHvv6WgDx9/PatternFly-6--Components-Test?node-id=6598-70985',
7+
{
8+
props: {
9+
// string
10+
content: figma.string('Text'),
11+
12+
// enum
13+
position: figma.enum('Type', {
14+
'Bottom-left': 'bottom-start',
15+
'Bottom-middle': 'bottom',
16+
'Bottom-right': 'bottom-end',
17+
'Left-bottom': 'left-end',
18+
'Left-middle': 'left',
19+
'Left-top': 'left-start',
20+
'Right-bottom': 'right-end',
21+
'Right-middle': 'right',
22+
'Right-top': 'right-start',
23+
'Top-left': 'top-start',
24+
'Top-middle': 'top',
25+
'Top-right': 'top-end'
26+
}),
27+
28+
children: figma.children('*')
29+
},
30+
example: (props) => (
31+
// Documentation for Tooltip can be found at https://www.patternfly.org/components/tooltip
32+
<Tooltip content={props.content} position={props.position}>
33+
{props.children}
34+
</Tooltip>
35+
)
36+
}
37+
);

0 commit comments

Comments
 (0)