From 9fb31370d70aa31dd2fffa5c3d1c5e349bb7cd48 Mon Sep 17 00:00:00 2001
From: Charles de Dreuille <charles.dedreuille@gmail.com>
Date: Thu, 5 Dec 2024 13:04:41 +0000
Subject: [PATCH] Cleanup API report

Signed-off-by: Charles de Dreuille <charles.dedreuille@gmail.com>
---
 packages/canon/report.api.md                  | 40 ++-----------------
 packages/canon/src/components/Grid/Grid.tsx   | 30 ++++++--------
 .../canon/src/components/Inline/Inline.tsx    | 22 +++++-----
 packages/canon/src/components/Stack/Stack.tsx | 20 +++++-----
 4 files changed, 40 insertions(+), 72 deletions(-)

diff --git a/packages/canon/report.api.md b/packages/canon/report.api.md
index 9cc4035a5e..5a80802cc6 100644
--- a/packages/canon/report.api.md
+++ b/packages/canon/report.api.md
@@ -179,29 +179,14 @@ export type Gap = Space | Partial<Record<Breakpoint, Space>>;
 
 // @public (undocumented)
 export const Grid: {
-  ({
-    children,
-    columns,
-    gap,
-    className,
-    style,
-    ...restProps
-  }: GridProps): DetailedReactHTMLElement<
+  (props: GridProps): DetailedReactHTMLElement<
     {
       className: string;
       style: CSSProperties | undefined;
     },
     HTMLElement
   >;
-  Item: ({
-    children,
-    rowSpan,
-    colSpan,
-    start,
-    end,
-    className,
-    style,
-  }: GridItemProps) => DetailedReactHTMLElement<
+  Item: (props: GridItemProps) => DetailedReactHTMLElement<
     {
       className: string;
       style: CSSProperties | undefined;
@@ -266,16 +251,7 @@ export type IconNames =
   | 'trash';
 
 // @public (undocumented)
-export const Inline: ({
-  as,
-  children,
-  align,
-  alignY,
-  gap,
-  className,
-  style,
-  ...restProps
-}: InlineProps) => DetailedReactHTMLElement<
+export const Inline: (props: InlineProps) => DetailedReactHTMLElement<
   {
     className: string;
     style: CSSProperties | undefined;
@@ -420,15 +396,7 @@ export interface SpaceProps {
 }
 
 // @public (undocumented)
-export const Stack: ({
-  as,
-  children,
-  align,
-  gap,
-  className,
-  style,
-  ...restProps
-}: StackProps) => DetailedReactHTMLElement<
+export const Stack: (props: StackProps) => DetailedReactHTMLElement<
   {
     className: string;
     style: CSSProperties | undefined;
diff --git a/packages/canon/src/components/Grid/Grid.tsx b/packages/canon/src/components/Grid/Grid.tsx
index f320d4f7f5..8e426ff49b 100644
--- a/packages/canon/src/components/Grid/Grid.tsx
+++ b/packages/canon/src/components/Grid/Grid.tsx
@@ -19,14 +19,16 @@ import { GridItemProps, GridProps } from './types';
 import { gridItemSprinkles, gridSprinkles } from './sprinkles.css';
 
 /** @public */
-export const Grid = ({
-  children,
-  columns,
-  gap = 'xs',
-  className,
-  style,
-  ...restProps
-}: GridProps) => {
+export const Grid = (props: GridProps) => {
+  const {
+    children,
+    columns,
+    gap = 'xs',
+    className,
+    style,
+    ...restProps
+  } = props;
+
   const sprinklesClassName = gridSprinkles({
     ...restProps,
     gap,
@@ -47,15 +49,9 @@ export const Grid = ({
   );
 };
 
-const GridItem = ({
-  children,
-  rowSpan,
-  colSpan,
-  start,
-  end,
-  className,
-  style,
-}: GridItemProps) => {
+const GridItem = (props: GridItemProps) => {
+  const { children, rowSpan, colSpan, start, end, className, style } = props;
+
   const sprinklesClassName = gridItemSprinkles({
     rowSpan,
     colSpan,
diff --git a/packages/canon/src/components/Inline/Inline.tsx b/packages/canon/src/components/Inline/Inline.tsx
index 1adcd01b92..a46d4dc948 100644
--- a/packages/canon/src/components/Inline/Inline.tsx
+++ b/packages/canon/src/components/Inline/Inline.tsx
@@ -33,16 +33,18 @@ const alignToFlexAlignY = (align: InlineProps['align']) => {
 };
 
 /** @public */
-export const Inline = ({
-  as = 'div',
-  children,
-  align = 'left',
-  alignY = 'top',
-  gap = 'xs',
-  className,
-  style,
-  ...restProps
-}: InlineProps) => {
+export const Inline = (props: InlineProps) => {
+  const {
+    as = 'div',
+    children,
+    align = 'left',
+    alignY = 'top',
+    gap = 'xs',
+    className,
+    style,
+    ...restProps
+  } = props;
+
   // Generate the list of class names
   const sprinklesClassName = inlineSprinkles({
     ...restProps,
diff --git a/packages/canon/src/components/Stack/Stack.tsx b/packages/canon/src/components/Stack/Stack.tsx
index f2a9a3f93d..85a67db05d 100644
--- a/packages/canon/src/components/Stack/Stack.tsx
+++ b/packages/canon/src/components/Stack/Stack.tsx
@@ -26,15 +26,17 @@ const alignToFlexAlign = (align: StackProps['align']) => {
 };
 
 /** @public */
-export const Stack = ({
-  as = 'div',
-  children,
-  align = 'left',
-  gap = 'xs',
-  className,
-  style,
-  ...restProps
-}: StackProps) => {
+export const Stack = (props: StackProps) => {
+  const {
+    as = 'div',
+    children,
+    align = 'left',
+    gap = 'xs',
+    className,
+    style,
+    ...restProps
+  } = props;
+
   // Transform the align prop
   const flexAlign = alignToFlexAlign(align);