From 6acee03722d1746f83e22adcb03152bb67e43cbe Mon Sep 17 00:00:00 2001 From: Rich Kummer Date: Mon, 6 Oct 2025 16:41:36 -0400 Subject: [PATCH 1/3] add first selections --- .../EmptyStates/EmptyState.figma.tsx | 44 +++++++++++++++++++ 1 file changed, 44 insertions(+) create mode 100644 packages/ibm-products/src/components/EmptyStates/EmptyState.figma.tsx diff --git a/packages/ibm-products/src/components/EmptyStates/EmptyState.figma.tsx b/packages/ibm-products/src/components/EmptyStates/EmptyState.figma.tsx new file mode 100644 index 00000000000..ba4c048df37 --- /dev/null +++ b/packages/ibm-products/src/components/EmptyStates/EmptyState.figma.tsx @@ -0,0 +1,44 @@ +/** + * Copyright IBM Corp. 2025, 2025 + * + * This source code is licensed under the Apache-2.0 license found in the + * LICENSE file in the root directory of this source tree. + */ + +import React from 'react'; +import { EmptyState } from './EmptyState'; +import figma from '@figma/code-connect'; + +figma.connect( + EmptyState, + 'https://www.figma.com/design/0F9dKH2abAd7gSfvnacfWf/-v11--IBM-Products-%E2%80%93-Carbon-Design-System?node-id=420-2434&t=lbewdWdJ4JB5izcw-4', + { + props: { + action: figma.boolean('Button'), + link: figma.boolean('Link'), + size: figma.enum('Size', { + Large: 'lg', + Small: 'sm', + }), + illustrationPosition: figma.enum('Illustration position', { + Top: 'top', + Right: 'right', + Left: 'left', + Bottom: 'bottom' + }), + title: figma.string('Title text'), + subtitle: figma.string('Subtitle text'), + }, + example: (props) => ( + + + ), + } +); From a5d50bfcc958a97e7b5889a4e28b66978bc9e148 Mon Sep 17 00:00:00 2001 From: Rich Kummer Date: Mon, 13 Oct 2025 13:42:35 -0400 Subject: [PATCH 2/3] Missing props --- .../EmptyStates/EmptyState.figma.tsx | 25 +++++++++++++++++-- 1 file changed, 23 insertions(+), 2 deletions(-) diff --git a/packages/ibm-products/src/components/EmptyStates/EmptyState.figma.tsx b/packages/ibm-products/src/components/EmptyStates/EmptyState.figma.tsx index ba4c048df37..db90e4492df 100644 --- a/packages/ibm-products/src/components/EmptyStates/EmptyState.figma.tsx +++ b/packages/ibm-products/src/components/EmptyStates/EmptyState.figma.tsx @@ -8,14 +8,30 @@ import React from 'react'; import { EmptyState } from './EmptyState'; import figma from '@figma/code-connect'; +import { Add } from '@carbon/icons-react'; figma.connect( EmptyState, 'https://www.figma.com/design/0F9dKH2abAd7gSfvnacfWf/-v11--IBM-Products-%E2%80%93-Carbon-Design-System?node-id=420-2434&t=lbewdWdJ4JB5izcw-4', { props: { - action: figma.boolean('Button'), - link: figma.boolean('Link'), + action: figma.boolean('Button', { + true: { + text: 'Button', + onClick: () => console.log("clicked empty state action button'),"), + renderIcon: (props) => , + iconDescription: 'Add icon', + }, + false: undefined, + }), + link: figma.boolean('Link', { + true: { + text: 'Link', + href: 'https://www.carbondesignsystem.com', + target: '_blank', + }, + false: undefined, + }), size: figma.enum('Size', { Large: 'lg', Small: 'sm', @@ -26,6 +42,10 @@ figma.connect( Left: 'left', Bottom: 'bottom' }), + illustration: figma.boolean('Illustration', { + true: './path/to/illustration.svg', + false: undefined, + }), title: figma.string('Title text'), subtitle: figma.string('Subtitle text'), }, @@ -35,6 +55,7 @@ figma.connect( subtitle={props.subtitle} size={props.size} illustrationPosition={props.illustrationPosition} + illustration={props.illustration} action={props.action} link={props.link} > From 1917266c21efc0b232b59f2786093e0bbfe34955 Mon Sep 17 00:00:00 2001 From: Rich Kummer Date: Mon, 13 Oct 2025 17:02:23 -0400 Subject: [PATCH 3/3] fix: prettier formatting --- .../EmptyStates/EmptyState.figma.tsx | 31 +++++++++---------- 1 file changed, 15 insertions(+), 16 deletions(-) diff --git a/packages/ibm-products/src/components/EmptyStates/EmptyState.figma.tsx b/packages/ibm-products/src/components/EmptyStates/EmptyState.figma.tsx index db90e4492df..6691621f526 100644 --- a/packages/ibm-products/src/components/EmptyStates/EmptyState.figma.tsx +++ b/packages/ibm-products/src/components/EmptyStates/EmptyState.figma.tsx @@ -17,21 +17,21 @@ figma.connect( props: { action: figma.boolean('Button', { true: { - text: 'Button', - onClick: () => console.log("clicked empty state action button'),"), - renderIcon: (props) => , - iconDescription: 'Add icon', - }, - false: undefined, - }), + text: 'Button', + onClick: () => console.log("clicked empty state action button'),"), + renderIcon: (props) => , + iconDescription: 'Add icon', + }, + false: undefined, + }), link: figma.boolean('Link', { true: { - text: 'Link', - href: 'https://www.carbondesignsystem.com', - target: '_blank', - }, - false: undefined, - }), + text: 'Link', + href: 'https://www.carbondesignsystem.com', + target: '_blank', + }, + false: undefined, + }), size: figma.enum('Size', { Large: 'lg', Small: 'sm', @@ -40,7 +40,7 @@ figma.connect( Top: 'top', Right: 'right', Left: 'left', - Bottom: 'bottom' + Bottom: 'bottom', }), illustration: figma.boolean('Illustration', { true: './path/to/illustration.svg', @@ -58,8 +58,7 @@ figma.connect( illustration={props.illustration} action={props.action} link={props.link} - > - + > ), } );