Adding email icon x48, and updating Figma links for all components

.changeset/four-islands-admire.md

@@ -0,0 +1,7 @@
+---
+'@cypress-design/react-icon': minor
+'@cypress-design/vue-icon': minor
+'@cypress-design/icon-registry': minor
+---
+
+Adding email icon x48

components/Alert/ReadMe.md

@@ -22,4 +22,4 @@ Examples:
 - To attract attention to a specific note on the page.
 - To inform the user of a change in the system.
 
-[figma::Alert](https://www.figma.com/file/1WJ3GVQyMV5e7xVxPg3yID/Design-System%2C-v1.x---%40latest?type=design&node-id=1035-9923&t=31Ux0Tiv1c3LsT2Q-11)
+[figma::Alert](https://www.figma.com/design/ZZZ2it1HdjfHNefqxnWs8Q/Component---Alerts--v1.0--latest?node-id=901-2172)

components/Button/ReadMe.md

@@ -6,7 +6,7 @@ import { IconActionPlayLarge } from '@cypress-design/vue-icon'
 # Button
 
 <DemoWrapper>
-  <div class="flex gap-4 items-center">
+  <div class="flex items-center gap-4">
     <Button>
       Submit Form
     </Button>
@@ -20,4 +20,4 @@ A user clicking on the "Button" component triggers an action or event, such as s
 
 It also can be render as an anchor, to navigate between pages, when you use the `href` prop.
 
-[figma::Button](https://www.figma.com/file/1WJ3GVQyMV5e7xVxPg3yID/Design-System%2C-v1.x---%40latest?type=design&node-id=852-0&t=31Ux0Tiv1c3LsT2Q-11)
+[figma::Button](https://www.figma.com/design/YmbG6FTZ4tYlRbfTmNvwe3/Component---Buttons--v1.0----latest?node-id=901-2172)

components/Checkbox/ReadMe.md

@@ -11,4 +11,4 @@ import Checkbox from '@cypress-design/vue-checkbox'
 
 The checkbox component is used to allow the user to select one or more options from a list.
 
-[figma::Checkbox](https://www.figma.com/file/1WJ3GVQyMV5e7xVxPg3yID/Design-System%2C-v1.x---%40latest?node-id=1027-9825&t=Q3qySwk0qxyTEsyw-4)
+[figma::Checkbox](https://www.figma.com/design/1DRMyEt2idRzHMmV0NTA3O/Component---Inputs-v1.0----latest?node-id=5020-8283&t=8yNaQarZW10tZcQT-4)

components/Logo/ReadMe.md

@@ -12,7 +12,7 @@ import { CypressMark, CypressLockUp } from '@cypress-design/vue-logo'
     <div class="p-4">
       <CypressLockUp class="w-[119px] h-[48px]" variant="color-dark" />
     </div>
-    <div class="bg-gray-1000 p-4 rounded">
+    <div class="p-4 rounded bg-gray-1000">
       <CypressLockUp class="w-[119px] h-[48px]" variant="color-white" />
     </div>
   </div>
@@ -23,7 +23,7 @@ import { CypressMark, CypressLockUp } from '@cypress-design/vue-logo'
     <div class="p-4">
       <CypressMark class="w-[48px] h-[48px]" variant="color-dark" />
     </div>
-    <div class="p-4 bg-gray-1000 rounded">
+    <div class="p-4 rounded bg-gray-1000">
       <CypressMark class="w-[48px] h-[48px]" variant="color-white" />
     </div>
   </div>
@@ -33,4 +33,4 @@ The Cypress logo is a visual representation of the brand or product. It can be a
 
 For just the icon use the `CypressMark` component, and for the icon with the wordmark use the `CypressLockUp` component.
 
-[figma::Logo](https://www.figma.com/file/1WJ3GVQyMV5e7xVxPg3yID/Design-System?type=design&node-id=3125-4344&mode=design&t=Vy6yz2hD7pjlD3N1-4)
+[figma::Logo](https://www.figma.com/design/MInXXOFULhBbdflyvAdjdh/Component---Logos--v1.x----latest?node-id=7-36)

components/Modal/ReadMe.md

@@ -19,4 +19,4 @@ As a general rule, modals are used when a quick action is required by the user.
   <Button @click="visible = true">Open Modal</Button>
 </DemoWrapper>
 
-[figma::Modal](https://www.figma.com/file/1WJ3GVQyMV5e7xVxPg3yID/Design-System%2C-v1.x---%40latest?type=design&node-id=11381-16819&t=eTHkHYIn7QpvUPjI-4)
+[figma::Modal](https://www.figma.com/design/P2y83Xt0FE5QBIYRnQjlA5/Component---Modals--v1.0----latest?node-id=901-2172)

components/StatusIcon/ReadMe.md

@@ -36,4 +36,4 @@ The status icon component is used to display a status icon.
 
 Status Icons are defined in the `Icons` page of our Figma Design System.
 
-[figma::Icons](https://www.figma.com/file/1WJ3GVQyMV5e7xVxPg3yID/Design-System%2C-v1.x---%40latest?type=design&node-id=969-9732&t=31Ux0Tiv1c3LsT2Q-11)
+[figma::Icons](https://www.figma.com/design/1WJ3GVQyMV5e7xVxPg3yID/Design-System?node-id=6814-10840&t=Xw29fKu9ZdgvIJki-4)

components/Tabs/ReadMe.md

@@ -29,4 +29,4 @@ const types = ['default', 'indigo-light', 'dark-small', 'dark-large', 'underline
   </template>
 </DemoWrapper>
 
-[figma::Tabs](https://www.figma.com/file/1WJ3GVQyMV5e7xVxPg3yID/Design-System%2C-v1.x---%40latest?type=design&node-id=1259-10337&t=31Ux0Tiv1c3LsT2Q-11)
+[figma::Tabs](https://www.figma.com/design/gXOfcQAuy7JunKRSjoQEg4/Component---Tabs--v1.0--latest?node-id=901-2172)

components/Tag/ReadMe.md

@@ -7,10 +7,10 @@ import Tag from '@cypress-design/vue-tag'
 
 <DemoWrapper>
 	<Tag color="jade" class="px-[8px]">Tag</Tag>
-  <div class="flex flex-row flex-wrap items-start justify-center bg-gray-700 gap-6 mt-5">
-    <div v-for="size of Object.keys(CssSize)" class="flex flex-col items-center gap-3 justify-center my-4 p-4 bg-white rounded-lg">
+  <div class="flex flex-row flex-wrap items-start justify-center gap-6 mt-5 bg-gray-700">
+    <div v-for="size of Object.keys(CssSize)" class="flex flex-col items-center justify-center gap-3 p-4 my-4 bg-white rounded-lg">
       <h3 class="text-right">{{size}}</h3>
-      <div v-for="color of Object.keys(CssColor)" class="flex gap-4 items-center justify-stretch">
+      <div v-for="color of Object.keys(CssColor)" class="flex items-center gap-4 justify-stretch">
         <div class="flex items-center justify-center">
           <Tag :size="size" :color="color">
             {{color}}
@@ -36,4 +36,4 @@ import Tag from '@cypress-design/vue-tag'
   </div>
 </DemoWrapper>
 
-[figma::Tag](https://www.figma.com/file/1WJ3GVQyMV5e7xVxPg3yID/Design-System%2C-v1.x---%40latest?node-id=1950-2659&t=XOxzeAZJ0mBFwEHV-4)
+[figma::Tag](https://www.figma.com/design/lzeVuPUHRi3RWzD0mhr3M7/Component---Tags--v1.0--latest?node-id=901-2172)

components/Tooltip/ReadMe.md

@@ -19,4 +19,4 @@ import Tooltip from '@cypress-design/vue-tooltip'
 Use the tooltip component to display a message when the user hovers over an element.
 For accessibility, it also triggers on focus.
 
-[figma::Tooltip](https://www.figma.com/file/1WJ3GVQyMV5e7xVxPg3yID/Design-System%2C-v1.x---%40latest?node-id=12423-23450&t=Q3qySwk0qxyTEsyw-4)
+[figma::Tooltip](https://www.figma.com/design/HDdGELnzXrEdg5qgC4SrAz/Component---Tooltips--v1.0--latest?node-id=901-2172)