diff --git a/figma_connect/badge.figma.tsx b/figma_connect/badge.figma.tsx
index 2ee3af74..b4205e43 100644
--- a/figma_connect/badge.figma.tsx
+++ b/figma_connect/badge.figma.tsx
@@ -5,13 +5,13 @@ import figma from '@figma/code-connect';
 
 figma.connect('https://www.figma.com/design/BrXOVNTglDWg03DL7ZZeW1/Teamshares-UI?node-id=8564-8&t=4UIXwDXcsJSneX8X-4', {
   props: {
-    number: figma.string('✏️ number'),
     variant: figma.enum('variant', {
       red: 'red',
       gray: 'gray'
-    })
+    }),
+    number: figma.string('✏️ number')
   },
-  example: ({ number, variant }) => {
-    return <sl-badge number={number} variant={variant}></sl-badge>;
+  example: ({ variant, number }) => {
+    return <sl-badge variant={variant} number={number}></sl-badge>;
   }
 });
diff --git a/figma_connect/button.figma.tsx b/figma_connect/button.figma.tsx
index a6f507c7..33a6fa9a 100644
--- a/figma_connect/button.figma.tsx
+++ b/figma_connect/button.figma.tsx
@@ -25,10 +25,6 @@ figma.connect(
       }),
       outline: figma.boolean('outline?'),
       circle: figma.boolean('circle?'),
-      circleIcon: figma.boolean('circle?', {
-        true: figma.children('Icon*'),
-        false: undefined
-      }),
       prefix: figma.boolean('prefix?', {
         true: figma.children('Prefix*'),
         false: undefined
@@ -37,14 +33,18 @@ figma.connect(
         true: undefined,
         false: figma.string('✏️ label')
       }),
+      circleIcon: figma.boolean('circle?', {
+        true: figma.children('Icon*'),
+        false: undefined
+      }),
       suffix: figma.boolean('suffix?', {
         true: figma.children('Suffix*'),
         false: undefined
       })
     },
-    example: ({ variant, size, outline, circle, disabled, prefix, label, circleIcon, suffix }) => {
+    example: ({ variant, size, disabled, outline, circle, prefix, label, circleIcon, suffix }) => {
       return (
-        <sl-button variant={variant} size={size} outline={outline} circle={circle} disabled={disabled}>
+        <sl-button variant={variant} size={size} disabled={disabled} outline={outline} circle={circle}>
           {prefix}
           {label}
           {circleIcon}
diff --git a/figma_connect/icon-button.figma.tsx b/figma_connect/icon-button.figma.tsx
index 8200fc85..79748505 100644
--- a/figma_connect/icon-button.figma.tsx
+++ b/figma_connect/icon-button.figma.tsx
@@ -7,19 +7,19 @@ figma.connect(
   'https://www.figma.com/design/BrXOVNTglDWg03DL7ZZeW1/Teamshares-UI?node-id=2621-1914&t=NUUDTGV2YnFjzS2O-4',
   {
     props: {
-      name: figma.nestedProps('Icon for Button  ❇️', {
-        iconName: figma.string('icon-name')
-      }),
       size: figma.enum('size', {
         'small (16px)': 'text-base',
         'large (24px)': 'text-2xl'
       }),
       disabled: figma.enum('state', {
         disabled: true
+      }),
+      name: figma.nestedProps('❇️ Icon for Button', {
+        iconName: figma.string('icon-name')
       })
     },
-    example: ({ size, name, disabled }) => {
-      return <sl-icon-button library="fa" class={size} name={name.iconName} disabled={disabled}></sl-icon-button>;
+    example: ({ size, disabled, name }) => {
+      return <sl-icon-button library="fa" class={size} disabled={disabled} name={name.iconName}></sl-icon-button>;
     }
   }
 );
diff --git a/figma_connect/icon.figma.tsx b/figma_connect/icon.figma.tsx
index d5eb4abc..cbf574c0 100644
--- a/figma_connect/icon.figma.tsx
+++ b/figma_connect/icon.figma.tsx
@@ -8,7 +8,6 @@ figma.connect(
   'https://www.figma.com/design/BrXOVNTglDWg03DL7ZZeW1/Teamshares-UI?node-id=6593-16323&t=DaTJhUJKLkDLJ0Zl-4',
   {
     props: {
-      iconName: figma.string('icon-name'),
       style: figma.enum('style', {
         solid: 'fas-',
         regular: undefined,
@@ -31,10 +30,11 @@ figma.connect(
         '8x': 'text-9xl',
         '9x': 'text-[144px]',
         '10x': 'text-[160px]'
-      })
+      }),
+      iconName: figma.string('icon-name')
     },
-    example: ({ style, iconName, scale }) => {
-      return <sl-icon library="fa" style={style} name={iconName} class={scale}></sl-icon>;
+    example: ({ style, scale, iconName }) => {
+      return <sl-icon library="fa" style={style} class={scale} name={iconName}></sl-icon>;
     }
   }
 );
@@ -44,30 +44,13 @@ figma.connect(
   'https://www.figma.com/design/BrXOVNTglDWg03DL7ZZeW1/Teamshares-UI?node-id=12989-18337&t=XQ5ktD0B254PC5m2-4',
   {
     props: {
-      iconName: figma.string('icon-name'),
       style: figma.enum('style', {
         solid: 'fas-',
         regular: undefined,
         light: 'fal-',
         thin: 'fat-'
       }),
-      scale: figma.enum('scale', {
-        '.75x': 'text-xs',
-        '.875x': 'text-sm',
-        '1x': 'text-base',
-        '1.25x': 'text-xl',
-        '1.5x': 'text-2xl',
-        '2x': 'text-[32px]',
-        '2.5x': 'text-[40px]',
-        '3x': 'text-5xl',
-        '4x': 'text-[64px]',
-        '5x': 'text-[80px]',
-        '6x': 'text-8xl',
-        '7x': 'text-[112px]',
-        '8x': 'text-9xl',
-        '9x': 'text-[144px]',
-        '10x': 'text-[160px]'
-      })
+      iconName: figma.string('icon-name')
     },
     example: ({ style, iconName }) => {
       return <sl-icon slot="prefix" library="fa" style={style} name={iconName}></sl-icon>;
@@ -80,30 +63,13 @@ figma.connect(
   'https://www.figma.com/design/BrXOVNTglDWg03DL7ZZeW1/Teamshares-UI?node-id=12991-2572&t=1cV1fw0FXz0L8Pr3-4',
   {
     props: {
-      iconName: figma.string('icon-name'),
       style: figma.enum('style', {
         solid: 'fas-',
         regular: undefined,
         light: 'fal-',
         thin: 'fat-'
       }),
-      scale: figma.enum('scale', {
-        '.75x': 'text-xs',
-        '.875x': 'text-sm',
-        '1x': 'text-base',
-        '1.25x': 'text-xl',
-        '1.5x': 'text-2xl',
-        '2x': 'text-[32px]',
-        '2.5x': 'text-[40px]',
-        '3x': 'text-5xl',
-        '4x': 'text-[64px]',
-        '5x': 'text-[80px]',
-        '6x': 'text-8xl',
-        '7x': 'text-[112px]',
-        '8x': 'text-9xl',
-        '9x': 'text-[144px]',
-        '10x': 'text-[160px]'
-      })
+      iconName: figma.string('icon-name')
     },
     example: ({ style, iconName }) => {
       return <sl-icon slot="suffix" library="fa" style={style} name={iconName}></sl-icon>;
@@ -117,30 +83,13 @@ figma.connect(
   'https://www.figma.com/design/BrXOVNTglDWg03DL7ZZeW1/Teamshares-UI?node-id=13295-17509&t=6MS2mSbs4kwWAQ5V-4',
   {
     props: {
-      iconName: figma.string('icon-name'),
       style: figma.enum('style', {
         solid: 'fas-',
         regular: undefined,
         light: 'fal-',
         thin: 'fat-'
       }),
-      scale: figma.enum('scale', {
-        '.75x': 'text-xs',
-        '.875x': 'text-sm',
-        '1x': 'text-base',
-        '1.25x': 'text-xl',
-        '1.5x': 'text-2xl',
-        '2x': 'text-[32px]',
-        '2.5x': 'text-[40px]',
-        '3x': 'text-5xl',
-        '4x': 'text-[64px]',
-        '5x': 'text-[80px]',
-        '6x': 'text-8xl',
-        '7x': 'text-[112px]',
-        '8x': 'text-9xl',
-        '9x': 'text-[144px]',
-        '10x': 'text-[160px]'
-      })
+      iconName: figma.string('icon-name')
     },
     example: ({ style, iconName }) => {
       return <sl-icon library="fa" style={style} name={iconName}></sl-icon>;
diff --git a/figma_connect/switch.figma.tsx b/figma_connect/switch.figma.tsx
index 7bd3d636..a6fb73a8 100644
--- a/figma_connect/switch.figma.tsx
+++ b/figma_connect/switch.figma.tsx
@@ -16,24 +16,24 @@ figma.connect(
         medium: 'medium',
         small: 'small'
       }),
-      checked: figma.boolean('checked?'),
       disabled: figma.enum('state', {
         disabled: true
       }),
+      checked: figma.boolean('checked?'),
       label: figma.string('✏️ label'),
       helpText: figma.boolean('help text?', {
         true: figma.string('✏️ help text'),
         false: undefined
       })
     },
-    example: ({ labelPosition, helpText, size, checked, disabled, label }) => {
+    example: ({ labelPosition, size, disabled, checked, label, helpText }) => {
       return (
         <sl-switch
           label-position={labelPosition}
-          help-text={helpText}
           size={size}
-          checked={checked}
           disabled={disabled}
+          checked={checked}
+          help-text={helpText}
         >
           {label}
         </sl-switch>
@@ -51,17 +51,17 @@ figma.connect(
         medium: 'medium',
         small: 'small'
       }),
-      checked: figma.boolean('checked?'),
       disabled: figma.enum('state', {
         disabled: true
       }),
+      checked: figma.boolean('checked?'),
       helpText: figma.boolean('help text?', {
         true: figma.string('✏️ help text'),
         false: undefined
       })
     },
-    example: ({ helpText, size, checked, disabled }) => {
-      return <sl-switch help-text={helpText} size={size} checked={checked} disabled={disabled}></sl-switch>;
+    example: ({ size, disabled, checked, helpText }) => {
+      return <sl-switch size={size} disabled={disabled} checked={checked} help-text={helpText}></sl-switch>;
     }
   }
 );
diff --git a/figma_connect/tag.figma.tsx b/figma_connect/tag.figma.tsx
index a5f4b613..b068bdec 100644
--- a/figma_connect/tag.figma.tsx
+++ b/figma_connect/tag.figma.tsx
@@ -27,10 +27,10 @@ figma.connect(
         medium: 'medium',
         large: 'large'
       }),
-      removable: figma.boolean('removable?'),
-      content: figma.string('✏️ content')
+      content: figma.string('✏️ content'),
+      removable: figma.boolean('removable?')
     },
-    example: ({ removable, content, variant, size }) => {
+    example: ({ variant, size, content, removable }) => {
       return (
         <sl-tag variant={variant} size={size} removable={removable}>
           {content}
diff --git a/figma_connect/textarea.figma.tsx b/figma_connect/textarea.figma.tsx
index 705f7a0c..aef758e5 100644
--- a/figma_connect/textarea.figma.tsx
+++ b/figma_connect/textarea.figma.tsx
@@ -19,6 +19,7 @@ figma.connect(
         true: figma.string('✏️ label'),
         false: undefined
       }),
+      required: figma.boolean('required?'),
       tooltip: figma.boolean('tooltip?', {
         true: '{Include tooltip text here}',
         false: undefined
@@ -31,30 +32,28 @@ figma.connect(
         true: figma.string('✏️ help text'),
         false: undefined
       }),
-      required: figma.boolean('required?'),
       resize: figma.boolean('resize?', {
         true: undefined,
         false: 'none'
       })
     },
-    example: ({ rows, label, tooltip, contextNote, helpText, required, resize, disabled }) => {
+    example: ({ disabled, rows, label, required, tooltip, contextNote, helpText, resize }) => {
       return (
-        /* When rendering with ts_form_for */
         /* = ts_form_for ... do |f|
-        /* .. = f.input :field,
+        /* .. = f.input :foo,
         /* .. as: :text,
         /* .. input_html: {
         /* .... { attribute: value,
-        /* ...... attribute: value, }  */
+        /* ...... attribute: value }  */
         <sl-textarea
+          disabled={disabled}
           rows={rows}
           label={label}
+          required={required}
           label-tooltip={tooltip}
           context-note={contextNote}
           help-text={helpText}
-          required={required}
           resize={resize}
-          disabled={disabled}
         ></sl-textarea>
       );
     }