@genesislcap/rapid-design-system 14.209.3-alpha-afba6ee.0 → 14.210.0

package/dist/custom-elements.json

@@ -716,6 +716,29 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/_config/index.ts",
+      "declarations": [],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./tokens"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./values"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "src/accordion/accordion.stories.ts",
@@ -904,29 +927,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "src/_config/index.ts",
-      "declarations": [],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "*",
-          "declaration": {
-            "name": "*",
-            "package": "./tokens"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "*",
-          "declaration": {
-            "name": "*",
-            "package": "./values"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "src/accordion-item/accordion-item.styles.ts",
@@ -3875,7 +3875,7 @@
     },
     {
       "kind": "javascript-module",
-      "path": "src/avatar/avatar.stories.ts",
+      "path": "src/badge/badge.stories.ts",
       "declarations": [
         {
           "kind": "variable",
@@ -3883,23 +3883,31 @@
           "type": {
             "text": "Meta"
           },
-          "default": "{\n  title: 'Avatar',\n  component: 'rapid-avatar',\n}"
+          "default": "{\n  title: 'Badge',\n  component: 'rapid-badge',\n}"
         },
         {
           "kind": "variable",
-          "name": "Default",
+          "name": "All",
           "type": {
             "text": "StoryObj"
           },
-          "default": "{\n  args: {\n    src: 'https://avataaars.io/?avatarStyle=Circle&topType=LongHairStraight&accessoriesType=Blank&hairColor=BrownDark&facialHairType=Blank&clotheType=BlazerShirt&eyeType=Default&eyebrowType=Default&mouthType=Default&skinColor=Light',\n    link: '#',\n    alt: \"Annie's profile image\",\n    shape: 'circle',\n    initials: 'AJ',\n    name: 'Annie James',\n    fill: 'accent-primary',\n    fillColor: '#196fe6',\n  },\n  argTypes: {\n    shape: {\n      control: 'select',\n      options: ['circle', 'square'],\n    },\n    fillColor: {\n      control: 'color',\n    },\n  },\n  render: ({ initials, link, alt, shape, fill, name, fillColor }) => html`\n    <div style=\"${wrapperStyle}  --avatar-fill-${fill}: ${fillColor}\">\n      <rapid-avatar alt=\"${alt}\" link=\"${link}\" shape=\"${shape}\" fill=\"${fill}\" name=\"${name}\">\n        ${initials}\n      </rapid-avatar>\n    </div>\n  `,\n}"
+          "default": "{\n  render: () => html`\n    <div style=\"${wrapperStyle}\">\n      ${repeat(\n        badges,\n        (item) => item,\n        (item) => html`\n          <rapid-badge fill=\"${item}\" color=\"text\">Rapid Badge</rapid-badge>\n        `,\n      )}\n    </div>\n  `,\n}"
         },
         {
           "kind": "variable",
-          "name": "WithImage",
+          "name": "Primary",
           "type": {
             "text": "StoryObj"
           },
-          "default": "{\n  args: {\n    avatarSource:\n      'https://avataaars.io/?avatarStyle=Circle&topType=LongHairStraight&accessoriesType=Blank&hairColor=BrownDark&facialHairType=Blank&clotheType=BlazerShirt&eyeType=Default&eyebrowType=Default&mouthType=Default&skinColor=Light',\n    link: '#',\n    alt: \"Annie's profile image\",\n    shape: 'circle',\n    initials: 'AJ',\n    name: 'Annie James',\n    fill: 'accent-primary',\n    fillColor: '#196fe6',\n  },\n  argTypes: {\n    shape: {\n      control: 'select',\n      options: ['circle', 'square'],\n    },\n    fillColor: {\n      control: 'color',\n    },\n  },\n  render: ({ avatarSource, link, alt, shape, fill, fillColor }) => html`\n    <div style=\"${wrapperStyle}   --avatar-fill-${fill}: ${fillColor}\">\n      <rapid-avatar\n        src=\"${avatarSource}\"\n        alt=\"${alt}\"\n        link=\"${link}\"\n        shape=\"${shape}\"\n        fill=\"${fill}\"\n      ></rapid-avatar>\n    </div>\n  `,\n}"
+          "default": "{\n  args: {\n    fill: 'primary',\n    badgeText: 'Rapid Badge',\n    badgeText2: '12',\n  },\n  argTypes: {\n    fill: {\n      control: 'select',\n      options: badges,\n    },\n  },\n  render: ({ fill, badgeText, badgeText2 }) => html`\n    <div style=\"${wrapperStyle}\">\n      <rapid-badge fill=\"${fill}\" color=\"text\">${badgeText}</rapid-badge>\n      <rapid-badge fill=\"${fill}\" color=\"text\">${badgeText2}</rapid-badge>\n    </div>\n  `,\n}"
+        },
+        {
+          "kind": "variable",
+          "name": "Neutral",
+          "type": {
+            "text": "StoryObj"
+          },
+          "default": "{\n  args: {\n    fill: 'neutral',\n    badgeText: 'Rapid Badge',\n    badgeText2: '12',\n  },\n  argTypes: {\n    fill: {\n      control: 'select',\n      options: badges,\n    },\n  },\n  render: ({ fill, badgeText, badgeText2 }) => html`\n    <div style=\"${wrapperStyle}\">\n      <rapid-badge fill=\"${fill}\" color=\"text\">${badgeText}</rapid-badge>\n      <rapid-badge fill=\"${fill}\" color=\"text\">${badgeText2}</rapid-badge>\n    </div>\n  `,\n}"
         }
       ],
       "exports": [
@@ -3908,34 +3916,42 @@
           "name": "default",
           "declaration": {
             "name": "meta",
-            "module": "src/avatar/avatar.stories.ts"
+            "module": "src/badge/badge.stories.ts"
           }
         },
         {
           "kind": "js",
-          "name": "Default",
+          "name": "All",
           "declaration": {
-            "name": "Default",
-            "module": "src/avatar/avatar.stories.ts"
+            "name": "All",
+            "module": "src/badge/badge.stories.ts"
           }
         },
         {
           "kind": "js",
-          "name": "WithImage",
+          "name": "Primary",
           "declaration": {
-            "name": "WithImage",
-            "module": "src/avatar/avatar.stories.ts"
+            "name": "Primary",
+            "module": "src/badge/badge.stories.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "Neutral",
+          "declaration": {
+            "name": "Neutral",
+            "module": "src/badge/badge.stories.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/avatar/avatar.styles.ts",
+      "path": "src/badge/badge.styles.ts",
       "declarations": [
         {
           "kind": "function",
-          "name": "rapidAvatarStyles",
+          "name": "rapidBadgeStyles",
           "return": {
             "type": {
               "text": "ElementStyles"
@@ -3960,24 +3976,24 @@
       "exports": [
         {
           "kind": "js",
-          "name": "rapidAvatarStyles",
+          "name": "rapidBadgeStyles",
           "declaration": {
-            "name": "rapidAvatarStyles",
-            "module": "src/avatar/avatar.styles.ts"
+            "name": "rapidBadgeStyles",
+            "module": "src/badge/badge.styles.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/avatar/avatar.template.ts",
+      "path": "src/badge/badge.template.ts",
       "declarations": [
         {
           "kind": "function",
-          "name": "rapidAvatarTemplate",
+          "name": "rapidBadgeTemplate",
           "return": {
             "type": {
-              "text": "ViewTemplate<Avatar>"
+              "text": "ViewTemplate<Badge>"
             }
           },
           "parameters": [
@@ -3999,27 +4015,27 @@
       "exports": [
         {
           "kind": "js",
-          "name": "rapidAvatarTemplate",
+          "name": "rapidBadgeTemplate",
           "declaration": {
-            "name": "rapidAvatarTemplate",
-            "module": "src/avatar/avatar.template.ts"
+            "name": "rapidBadgeTemplate",
+            "module": "src/badge/badge.template.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/avatar/avatar.ts",
+      "path": "src/badge/badge.ts",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "Avatar",
+          "name": "Badge",
           "superclass": {
-            "name": "FoundationAvatar",
+            "name": "FoundationBadge",
             "package": "@genesislcap/foundation-ui"
           },
-          "tagName": "%%prefix%%-avatar",
+          "tagName": "%%prefix%%-badge",
           "customElement": true,
           "attributes": [
             {
@@ -4027,11 +4043,11 @@
               "type": {
                 "text": "string"
               },
-              "description": "Indicates the Avatar should have a color fill.",
+              "description": "Indicates the badge should have a filled style.",
               "fieldName": "fill",
               "inheritedFrom": {
-                "name": "Avatar",
-                "module": "src/avatar/avatar.ts"
+                "name": "Badge",
+                "module": "src/badge/badge.ts"
               }
             },
             {
@@ -4039,35 +4055,22 @@
               "type": {
                 "text": "string"
               },
-              "description": "Indicates the Avatar should have a text color.",
+              "description": "Indicates the badge should have a filled style.",
               "fieldName": "color",
               "inheritedFrom": {
-                "name": "Avatar",
-                "module": "src/avatar/avatar.ts"
-              }
-            },
-            {
-              "name": "link",
-              "type": {
-                "text": "string"
-              },
-              "description": "Indicates the Avatar should have url link",
-              "fieldName": "link",
-              "inheritedFrom": {
-                "name": "Avatar",
-                "module": "src/avatar/avatar.ts"
+                "name": "Badge",
+                "module": "src/badge/badge.ts"
               }
             },
             {
-              "name": "shape",
               "type": {
-                "text": "AvatarShape"
+                "text": "boolean"
               },
-              "description": "Indicates the Avatar shape should be. By default it will be set to \"circle\".",
-              "fieldName": "shape",
+              "description": "Indicates the element should be circular",
+              "fieldName": "circular",
               "inheritedFrom": {
-                "name": "Avatar",
-                "module": "src/avatar/avatar.ts"
+                "name": "Badge",
+                "module": "src/badge/badge.ts"
               }
             }
           ],
@@ -4079,10 +4082,10 @@
                 "text": "string"
               },
               "privacy": "public",
-              "description": "Indicates the Avatar should have a color fill.",
+              "description": "Indicates the badge should have a filled style.",
               "inheritedFrom": {
-                "name": "Avatar",
-                "module": "src/avatar/avatar.ts"
+                "name": "Badge",
+                "module": "src/badge/badge.ts"
               }
             },
             {
@@ -4092,36 +4095,32 @@
                 "text": "string"
               },
               "privacy": "public",
-              "description": "Indicates the Avatar should have a text color.",
+              "description": "Indicates the badge should have a filled style.",
               "inheritedFrom": {
-                "name": "Avatar",
-                "module": "src/avatar/avatar.ts"
+                "name": "Badge",
+                "module": "src/badge/badge.ts"
               }
             },
             {
               "kind": "field",
-              "name": "link",
+              "name": "circular",
               "type": {
-                "text": "string"
+                "text": "boolean"
               },
               "privacy": "public",
-              "description": "Indicates the Avatar should have url link",
+              "description": "Indicates the element should be circular",
               "inheritedFrom": {
-                "name": "Avatar",
-                "module": "src/avatar/avatar.ts"
+                "name": "Badge",
+                "module": "src/badge/badge.ts"
               }
             },
             {
               "kind": "field",
-              "name": "shape",
-              "type": {
-                "text": "AvatarShape"
-              },
+              "name": "generateBadgeStyle",
               "privacy": "public",
-              "description": "Indicates the Avatar shape should be. By default it will be set to \"circle\".",
               "inheritedFrom": {
-                "name": "Avatar",
-                "module": "src/avatar/avatar.ts"
+                "name": "Badge",
+                "module": "src/badge/badge.ts"
               }
             },
             {
@@ -4133,8 +4132,8 @@
               "privacy": "private",
               "default": "void 0",
               "inheritedFrom": {
-                "name": "Avatar",
-                "module": "src/avatar/avatar.ts"
+                "name": "Badge",
+                "module": "src/badge/badge.ts"
               }
             },
             {
@@ -4146,8 +4145,8 @@
               "privacy": "public",
               "description": "A property which resolves the ComponentPresentation instance\nfor the current component.",
               "inheritedFrom": {
-                "name": "Avatar",
-                "module": "src/avatar/avatar.ts"
+                "name": "Badge",
+                "module": "src/badge/badge.ts"
               }
             },
             {
@@ -4159,8 +4158,8 @@
               "privacy": "public",
               "description": "Sets the template of the element instance. When undefined,\nthe element will attempt to resolve the template from\nthe associated presentation or custom element definition.",
               "inheritedFrom": {
-                "name": "Avatar",
-                "module": "src/avatar/avatar.ts"
+                "name": "Badge",
+                "module": "src/badge/badge.ts"
               }
             },
             {
@@ -4173,8 +4172,8 @@
                 }
               },
               "inheritedFrom": {
-                "name": "Avatar",
-                "module": "src/avatar/avatar.ts"
+                "name": "Badge",
+                "module": "src/badge/badge.ts"
               }
             },
             {
@@ -4186,8 +4185,8 @@
               "privacy": "public",
               "description": "Sets the default styles for the element instance. When undefined,\nthe element will attempt to resolve default styles from\nthe associated presentation or custom element definition.",
               "inheritedFrom": {
-                "name": "Avatar",
-                "module": "src/avatar/avatar.ts"
+                "name": "Badge",
+                "module": "src/badge/badge.ts"
               }
             },
             {
@@ -4200,8 +4199,8 @@
                 }
               },
               "inheritedFrom": {
-                "name": "Avatar",
-                "module": "src/avatar/avatar.ts"
+                "name": "Badge",
+                "module": "src/badge/badge.ts"
               }
             },
             {
@@ -4231,39 +4230,39 @@
               ],
               "description": "Defines an element registry function with a set of element definition defaults.",
               "inheritedFrom": {
-                "name": "Avatar",
-                "module": "src/avatar/avatar.ts"
+                "name": "Badge",
+                "module": "src/badge/badge.ts"
               }
             }
           ]
         },
         {
           "kind": "variable",
-          "name": "rapidAvatar"
+          "name": "rapidBadge"
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "Avatar",
+          "name": "Badge",
           "declaration": {
-            "name": "Avatar",
-            "module": "src/avatar/avatar.ts"
+            "name": "Badge",
+            "module": "src/badge/badge.ts"
           }
         },
         {
           "kind": "js",
-          "name": "rapidAvatar",
+          "name": "rapidBadge",
           "declaration": {
-            "name": "rapidAvatar",
-            "module": "src/avatar/avatar.ts"
+            "name": "rapidBadge",
+            "module": "src/badge/badge.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/avatar/index.ts",
+      "path": "src/badge/index.ts",
       "declarations": [],
       "exports": [
         {
@@ -4271,7 +4270,7 @@
           "name": "*",
           "declaration": {
             "name": "*",
-            "package": "./avatar"
+            "package": "./badge"
           }
         },
         {
@@ -4279,7 +4278,7 @@
           "name": "*",
           "declaration": {
             "name": "*",
-            "package": "./avatar.styles"
+            "package": "./badge.styles"
           }
         },
         {
@@ -4287,14 +4286,14 @@
           "name": "*",
           "declaration": {
             "name": "*",
-            "package": "./avatar.template"
+            "package": "./badge.template"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/badge/badge.stories.ts",
+      "path": "src/avatar/avatar.stories.ts",
       "declarations": [
         {
           "kind": "variable",
@@ -4302,31 +4301,23 @@
           "type": {
             "text": "Meta"
           },
-          "default": "{\n  title: 'Badge',\n  component: 'rapid-badge',\n}"
-        },
-        {
-          "kind": "variable",
-          "name": "All",
-          "type": {
-            "text": "StoryObj"
-          },
-          "default": "{\n  render: () => html`\n    <div style=\"${wrapperStyle}\">\n      ${repeat(\n        badges,\n        (item) => item,\n        (item) => html`\n          <rapid-badge fill=\"${item}\" color=\"text\">Rapid Badge</rapid-badge>\n        `,\n      )}\n    </div>\n  `,\n}"
+          "default": "{\n  title: 'Avatar',\n  component: 'rapid-avatar',\n}"
         },
         {
           "kind": "variable",
-          "name": "Primary",
+          "name": "Default",
           "type": {
             "text": "StoryObj"
           },
-          "default": "{\n  args: {\n    fill: 'primary',\n    badgeText: 'Rapid Badge',\n    badgeText2: '12',\n  },\n  argTypes: {\n    fill: {\n      control: 'select',\n      options: badges,\n    },\n  },\n  render: ({ fill, badgeText, badgeText2 }) => html`\n    <div style=\"${wrapperStyle}\">\n      <rapid-badge fill=\"${fill}\" color=\"text\">${badgeText}</rapid-badge>\n      <rapid-badge fill=\"${fill}\" color=\"text\">${badgeText2}</rapid-badge>\n    </div>\n  `,\n}"
+          "default": "{\n  args: {\n    src: 'https://avataaars.io/?avatarStyle=Circle&topType=LongHairStraight&accessoriesType=Blank&hairColor=BrownDark&facialHairType=Blank&clotheType=BlazerShirt&eyeType=Default&eyebrowType=Default&mouthType=Default&skinColor=Light',\n    link: '#',\n    alt: \"Annie's profile image\",\n    shape: 'circle',\n    initials: 'AJ',\n    name: 'Annie James',\n    fill: 'accent-primary',\n    fillColor: '#196fe6',\n  },\n  argTypes: {\n    shape: {\n      control: 'select',\n      options: ['circle', 'square'],\n    },\n    fillColor: {\n      control: 'color',\n    },\n  },\n  render: ({ initials, link, alt, shape, fill, name, fillColor }) => html`\n    <div style=\"${wrapperStyle}  --avatar-fill-${fill}: ${fillColor}\">\n      <rapid-avatar alt=\"${alt}\" link=\"${link}\" shape=\"${shape}\" fill=\"${fill}\" name=\"${name}\">\n        ${initials}\n      </rapid-avatar>\n    </div>\n  `,\n}"
         },
         {
           "kind": "variable",
-          "name": "Neutral",
+          "name": "WithImage",
           "type": {
             "text": "StoryObj"
           },
-          "default": "{\n  args: {\n    fill: 'neutral',\n    badgeText: 'Rapid Badge',\n    badgeText2: '12',\n  },\n  argTypes: {\n    fill: {\n      control: 'select',\n      options: badges,\n    },\n  },\n  render: ({ fill, badgeText, badgeText2 }) => html`\n    <div style=\"${wrapperStyle}\">\n      <rapid-badge fill=\"${fill}\" color=\"text\">${badgeText}</rapid-badge>\n      <rapid-badge fill=\"${fill}\" color=\"text\">${badgeText2}</rapid-badge>\n    </div>\n  `,\n}"
+          "default": "{\n  args: {\n    avatarSource:\n      'https://avataaars.io/?avatarStyle=Circle&topType=LongHairStraight&accessoriesType=Blank&hairColor=BrownDark&facialHairType=Blank&clotheType=BlazerShirt&eyeType=Default&eyebrowType=Default&mouthType=Default&skinColor=Light',\n    link: '#',\n    alt: \"Annie's profile image\",\n    shape: 'circle',\n    initials: 'AJ',\n    name: 'Annie James',\n    fill: 'accent-primary',\n    fillColor: '#196fe6',\n  },\n  argTypes: {\n    shape: {\n      control: 'select',\n      options: ['circle', 'square'],\n    },\n    fillColor: {\n      control: 'color',\n    },\n  },\n  render: ({ avatarSource, link, alt, shape, fill, fillColor }) => html`\n    <div style=\"${wrapperStyle}   --avatar-fill-${fill}: ${fillColor}\">\n      <rapid-avatar\n        src=\"${avatarSource}\"\n        alt=\"${alt}\"\n        link=\"${link}\"\n        shape=\"${shape}\"\n        fill=\"${fill}\"\n      ></rapid-avatar>\n    </div>\n  `,\n}"
         }
       ],
       "exports": [
@@ -4335,42 +4326,34 @@
           "name": "default",
           "declaration": {
             "name": "meta",
-            "module": "src/badge/badge.stories.ts"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "All",
-          "declaration": {
-            "name": "All",
-            "module": "src/badge/badge.stories.ts"
+            "module": "src/avatar/avatar.stories.ts"
           }
         },
         {
           "kind": "js",
-          "name": "Primary",
+          "name": "Default",
           "declaration": {
-            "name": "Primary",
-            "module": "src/badge/badge.stories.ts"
+            "name": "Default",
+            "module": "src/avatar/avatar.stories.ts"
           }
         },
         {
           "kind": "js",
-          "name": "Neutral",
+          "name": "WithImage",
           "declaration": {
-            "name": "Neutral",
-            "module": "src/badge/badge.stories.ts"
+            "name": "WithImage",
+            "module": "src/avatar/avatar.stories.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/badge/badge.styles.ts",
+      "path": "src/avatar/avatar.styles.ts",
       "declarations": [
         {
           "kind": "function",
-          "name": "rapidBadgeStyles",
+          "name": "rapidAvatarStyles",
           "return": {
             "type": {
               "text": "ElementStyles"
@@ -4395,24 +4378,24 @@
       "exports": [
         {
           "kind": "js",
-          "name": "rapidBadgeStyles",
+          "name": "rapidAvatarStyles",
           "declaration": {
-            "name": "rapidBadgeStyles",
-            "module": "src/badge/badge.styles.ts"
+            "name": "rapidAvatarStyles",
+            "module": "src/avatar/avatar.styles.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/badge/badge.template.ts",
+      "path": "src/avatar/avatar.template.ts",
       "declarations": [
         {
           "kind": "function",
-          "name": "rapidBadgeTemplate",
+          "name": "rapidAvatarTemplate",
           "return": {
             "type": {
-              "text": "ViewTemplate<Badge>"
+              "text": "ViewTemplate<Avatar>"
             }
           },
           "parameters": [
@@ -4434,27 +4417,27 @@
       "exports": [
         {
           "kind": "js",
-          "name": "rapidBadgeTemplate",
+          "name": "rapidAvatarTemplate",
           "declaration": {
-            "name": "rapidBadgeTemplate",
-            "module": "src/badge/badge.template.ts"
+            "name": "rapidAvatarTemplate",
+            "module": "src/avatar/avatar.template.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/badge/badge.ts",
+      "path": "src/avatar/avatar.ts",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "Badge",
+          "name": "Avatar",
           "superclass": {
-            "name": "FoundationBadge",
+            "name": "FoundationAvatar",
             "package": "@genesislcap/foundation-ui"
           },
-          "tagName": "%%prefix%%-badge",
+          "tagName": "%%prefix%%-avatar",
           "customElement": true,
           "attributes": [
             {
@@ -4462,11 +4445,11 @@
               "type": {
                 "text": "string"
               },
-              "description": "Indicates the badge should have a filled style.",
+              "description": "Indicates the Avatar should have a color fill.",
               "fieldName": "fill",
               "inheritedFrom": {
-                "name": "Badge",
-                "module": "src/badge/badge.ts"
+                "name": "Avatar",
+                "module": "src/avatar/avatar.ts"
               }
             },
             {
@@ -4474,22 +4457,35 @@
               "type": {
                 "text": "string"
               },
-              "description": "Indicates the badge should have a filled style.",
+              "description": "Indicates the Avatar should have a text color.",
               "fieldName": "color",
               "inheritedFrom": {
-                "name": "Badge",
-                "module": "src/badge/badge.ts"
+                "name": "Avatar",
+                "module": "src/avatar/avatar.ts"
+              }
+            },
+            {
+              "name": "link",
+              "type": {
+                "text": "string"
+              },
+              "description": "Indicates the Avatar should have url link",
+              "fieldName": "link",
+              "inheritedFrom": {
+                "name": "Avatar",
+                "module": "src/avatar/avatar.ts"
               }
             },
             {
+              "name": "shape",
               "type": {
-                "text": "boolean"
+                "text": "AvatarShape"
               },
-              "description": "Indicates the element should be circular",
-              "fieldName": "circular",
+              "description": "Indicates the Avatar shape should be. By default it will be set to \"circle\".",
+              "fieldName": "shape",
               "inheritedFrom": {
-                "name": "Badge",
-                "module": "src/badge/badge.ts"
+                "name": "Avatar",
+                "module": "src/avatar/avatar.ts"
               }
             }
           ],
@@ -4501,10 +4497,10 @@
                 "text": "string"
               },
               "privacy": "public",
-              "description": "Indicates the badge should have a filled style.",
+              "description": "Indicates the Avatar should have a color fill.",
               "inheritedFrom": {
-                "name": "Badge",
-                "module": "src/badge/badge.ts"
+                "name": "Avatar",
+                "module": "src/avatar/avatar.ts"
               }
             },
             {
@@ -4514,32 +4510,36 @@
                 "text": "string"
               },
               "privacy": "public",
-              "description": "Indicates the badge should have a filled style.",
+              "description": "Indicates the Avatar should have a text color.",
               "inheritedFrom": {
-                "name": "Badge",
-                "module": "src/badge/badge.ts"
+                "name": "Avatar",
+                "module": "src/avatar/avatar.ts"
               }
             },
             {
               "kind": "field",
-              "name": "circular",
+              "name": "link",
               "type": {
-                "text": "boolean"
+                "text": "string"
               },
               "privacy": "public",
-              "description": "Indicates the element should be circular",
+              "description": "Indicates the Avatar should have url link",
               "inheritedFrom": {
-                "name": "Badge",
-                "module": "src/badge/badge.ts"
+                "name": "Avatar",
+                "module": "src/avatar/avatar.ts"
               }
             },
             {
               "kind": "field",
-              "name": "generateBadgeStyle",
+              "name": "shape",
+              "type": {
+                "text": "AvatarShape"
+              },
               "privacy": "public",
+              "description": "Indicates the Avatar shape should be. By default it will be set to \"circle\".",
               "inheritedFrom": {
-                "name": "Badge",
-                "module": "src/badge/badge.ts"
+                "name": "Avatar",
+                "module": "src/avatar/avatar.ts"
               }
             },
             {
@@ -4551,8 +4551,8 @@
               "privacy": "private",
               "default": "void 0",
               "inheritedFrom": {
-                "name": "Badge",
-                "module": "src/badge/badge.ts"
+                "name": "Avatar",
+                "module": "src/avatar/avatar.ts"
               }
             },
             {
@@ -4564,8 +4564,8 @@
               "privacy": "public",
               "description": "A property which resolves the ComponentPresentation instance\nfor the current component.",
               "inheritedFrom": {
-                "name": "Badge",
-                "module": "src/badge/badge.ts"
+                "name": "Avatar",
+                "module": "src/avatar/avatar.ts"
               }
             },
             {
@@ -4577,8 +4577,8 @@
               "privacy": "public",
               "description": "Sets the template of the element instance. When undefined,\nthe element will attempt to resolve the template from\nthe associated presentation or custom element definition.",
               "inheritedFrom": {
-                "name": "Badge",
-                "module": "src/badge/badge.ts"
+                "name": "Avatar",
+                "module": "src/avatar/avatar.ts"
               }
             },
             {
@@ -4591,8 +4591,8 @@
                 }
               },
               "inheritedFrom": {
-                "name": "Badge",
-                "module": "src/badge/badge.ts"
+                "name": "Avatar",
+                "module": "src/avatar/avatar.ts"
               }
             },
             {
@@ -4604,8 +4604,8 @@
               "privacy": "public",
               "description": "Sets the default styles for the element instance. When undefined,\nthe element will attempt to resolve default styles from\nthe associated presentation or custom element definition.",
               "inheritedFrom": {
-                "name": "Badge",
-                "module": "src/badge/badge.ts"
+                "name": "Avatar",
+                "module": "src/avatar/avatar.ts"
               }
             },
             {
@@ -4618,8 +4618,8 @@
                 }
               },
               "inheritedFrom": {
-                "name": "Badge",
-                "module": "src/badge/badge.ts"
+                "name": "Avatar",
+                "module": "src/avatar/avatar.ts"
               }
             },
             {
@@ -4649,39 +4649,39 @@
               ],
               "description": "Defines an element registry function with a set of element definition defaults.",
               "inheritedFrom": {
-                "name": "Badge",
-                "module": "src/badge/badge.ts"
+                "name": "Avatar",
+                "module": "src/avatar/avatar.ts"
               }
             }
           ]
         },
         {
           "kind": "variable",
-          "name": "rapidBadge"
+          "name": "rapidAvatar"
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "Badge",
+          "name": "Avatar",
           "declaration": {
-            "name": "Badge",
-            "module": "src/badge/badge.ts"
+            "name": "Avatar",
+            "module": "src/avatar/avatar.ts"
           }
         },
         {
           "kind": "js",
-          "name": "rapidBadge",
+          "name": "rapidAvatar",
           "declaration": {
-            "name": "rapidBadge",
-            "module": "src/badge/badge.ts"
+            "name": "rapidAvatar",
+            "module": "src/avatar/avatar.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/badge/index.ts",
+      "path": "src/avatar/index.ts",
       "declarations": [],
       "exports": [
         {
@@ -4689,7 +4689,7 @@
           "name": "*",
           "declaration": {
             "name": "*",
-            "package": "./badge"
+            "package": "./avatar"
           }
         },
         {
@@ -4697,7 +4697,7 @@
           "name": "*",
           "declaration": {
             "name": "*",
-            "package": "./badge.styles"
+            "package": "./avatar.styles"
           }
         },
         {
@@ -4705,7 +4705,7 @@
           "name": "*",
           "declaration": {
             "name": "*",
-            "package": "./badge.template"
+            "package": "./avatar.template"
           }
         }
       ]
@@ -15466,6 +15466,14 @@
             "text": "StoryObj"
           },
           "default": "{\n  render: () => html`\n    <div style=\"${wrapperStyle}\">\n      <rapid-icon name=\"glasses\" size=\"1x\"></rapid-icon>\n      <rapid-icon name=\"amazon\" size=\"2x\" variant=\"brand\"></rapid-icon>\n      <rapid-icon name=\"amazon-pay\" size=\"3x\" variant=\"brand\"></rapid-icon>\n      <rapid-icon name=\"apple\" size=\"4x\" variant=\"brand\"></rapid-icon>\n      <rapid-icon name=\"chrome\" size=\"5x\" variant=\"brand\"></rapid-icon>\n      <rapid-icon name=\"ambulance\" size=\"xs\"></rapid-icon>\n      <rapid-icon name=\"angry\" size=\"1x\"></rapid-icon>\n      <rapid-icon variant=\"regular\" name=\"angry\" size=\"sm\"></rapid-icon>\n      <rapid-icon name=\"address-book\" size=\"lg\"></rapid-icon>\n      <rapid-icon variant=\"regular\" name=\"address-book\" size=\"xl\"></rapid-icon>\n      <rapid-icon name=\"bookmark\" size=\"2xl;\"></rapid-icon>\n      <rapid-icon variant=\"regular\" name=\"bookmark\" size=\"2xs\"></rapid-icon>\n    </div>\n  `,\n}"
+        },
+        {
+          "kind": "variable",
+          "name": "IconTooltips",
+          "type": {
+            "text": "StoryObj"
+          },
+          "default": "{\n  render: () => html`\n    <div style=\"${wrapperStyle}\">\n      <rapid-icon tooltip=\"Rapid Icon Tooltip with dynamic ID\"></rapid-icon>\n      <rapid-icon\n        tooltip=\"Rapid Icon Tooltip with custom ID\"\n        tooltip-id=\"custom-tooltip-id\"\n      ></rapid-icon>\n      <rapid-icon error tooltip=\"Rapid Icon Tooltip with error\"></rapid-icon>\n    </div>\n  `,\n}"
         }
       ],
       "exports": [
@@ -15492,6 +15500,14 @@
             "name": "Multiple",
             "module": "src/icon/icon.stories.ts"
           }
+        },
+        {
+          "kind": "js",
+          "name": "IconTooltips",
+          "declaration": {
+            "name": "IconTooltips",
+            "module": "src/icon/icon.stories.ts"
+          }
         }
       ]
     },
@@ -15534,6 +15550,27 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/icon/icon.template.ts",
+      "declarations": [
+        {
+          "kind": "variable",
+          "name": "rapidIconTemplate",
+          "default": "html<Icon>`\n  ${getPrefixedIcon('rapid')}\n`"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "rapidIconTemplate",
+          "declaration": {
+            "name": "rapidIconTemplate",
+            "module": "src/icon/icon.template.ts"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "src/icon/icon.ts",
@@ -15549,6 +15586,40 @@
           "tagName": "%%prefix%%-icon",
           "customElement": true,
           "attributes": [
+            {
+              "name": "tooltip-id",
+              "type": {
+                "text": "string"
+              },
+              "fieldName": "tooltipId",
+              "inheritedFrom": {
+                "name": "Icon",
+                "module": "src/icon/icon.ts"
+              }
+            },
+            {
+              "name": "tooltip",
+              "type": {
+                "text": "string"
+              },
+              "fieldName": "tooltip",
+              "inheritedFrom": {
+                "name": "Icon",
+                "module": "src/icon/icon.ts"
+              }
+            },
+            {
+              "name": "error",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "fieldName": "isError",
+              "inheritedFrom": {
+                "name": "Icon",
+                "module": "src/icon/icon.ts"
+              }
+            },
             {
               "name": "name",
               "type": {
@@ -15599,9 +15670,9 @@
             },
             {
               "kind": "field",
-              "name": "name",
+              "name": "uuid",
               "type": {
-                "text": "IconName"
+                "text": "UUID"
               },
               "inheritedFrom": {
                 "name": "Icon",
@@ -15609,22 +15680,11 @@
               }
             },
             {
-              "kind": "method",
-              "name": "nameChanged",
-              "parameters": [
-                {
-                  "name": "oldValue",
-                  "type": {
-                    "text": "string"
-                  }
-                },
-                {
-                  "name": "newValue",
-                  "type": {
-                    "text": "string"
-                  }
-                }
-              ],
+              "kind": "field",
+              "name": "tooltipId",
+              "type": {
+                "text": "string"
+              },
               "inheritedFrom": {
                 "name": "Icon",
                 "module": "src/icon/icon.ts"
@@ -15632,23 +15692,79 @@
             },
             {
               "kind": "field",
-              "name": "size",
+              "name": "tooltip",
               "type": {
-                "text": "FaSize"
+                "text": "string"
               },
-              "default": "'sm'",
               "inheritedFrom": {
                 "name": "Icon",
                 "module": "src/icon/icon.ts"
               }
             },
             {
-              "kind": "method",
-              "name": "sizeChanged",
-              "parameters": [
-                {
-                  "name": "oldValue",
-                  "type": {
+              "kind": "field",
+              "name": "isError",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "inheritedFrom": {
+                "name": "Icon",
+                "module": "src/icon/icon.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "name",
+              "type": {
+                "text": "IconName"
+              },
+              "inheritedFrom": {
+                "name": "Icon",
+                "module": "src/icon/icon.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "nameChanged",
+              "parameters": [
+                {
+                  "name": "oldValue",
+                  "type": {
+                    "text": "string"
+                  }
+                },
+                {
+                  "name": "newValue",
+                  "type": {
+                    "text": "string"
+                  }
+                }
+              ],
+              "inheritedFrom": {
+                "name": "Icon",
+                "module": "src/icon/icon.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "size",
+              "type": {
+                "text": "FaSize"
+              },
+              "default": "'sm'",
+              "inheritedFrom": {
+                "name": "Icon",
+                "module": "src/icon/icon.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "sizeChanged",
+              "parameters": [
+                {
+                  "name": "oldValue",
+                  "type": {
                     "text": "string"
                   }
                 },
@@ -15698,6 +15814,14 @@
                 "module": "src/icon/icon.ts"
               }
             },
+            {
+              "kind": "method",
+              "name": "getDefualtTooltipConfig",
+              "inheritedFrom": {
+                "name": "Icon",
+                "module": "src/icon/icon.ts"
+              }
+            },
             {
               "kind": "method",
               "name": "loadIcon",
@@ -20939,203 +21063,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "src/progress-ring/index.ts",
-      "declarations": [],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "*",
-          "declaration": {
-            "name": "*",
-            "package": "./progress-ring"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "*",
-          "declaration": {
-            "name": "*",
-            "package": "./progress-ring.styles"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "*",
-          "declaration": {
-            "name": "*",
-            "package": "./progress-ring.template"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/progress-ring/progress-ring.stories.ts",
-      "declarations": [
-        {
-          "kind": "variable",
-          "name": "meta",
-          "type": {
-            "text": "Meta"
-          },
-          "default": "{\n  title: 'Progress Ring',\n  component: 'rapid-progress-ring',\n}"
-        },
-        {
-          "kind": "variable",
-          "name": "Default",
-          "type": {
-            "text": "StoryObj"
-          },
-          "default": "{\n  args: {\n    value: '80',\n  },\n  render: ({ value }) => html`\n    <div style=\"width: 100%;\">\n      <rapid-progress-ring value=\"${value}\"></rapid-progress-ring>\n    </div>\n  `,\n}"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "meta",
-            "module": "src/progress-ring/progress-ring.stories.ts"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "Default",
-          "declaration": {
-            "name": "Default",
-            "module": "src/progress-ring/progress-ring.stories.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/progress-ring/progress-ring.styles.ts",
-      "declarations": [
-        {
-          "kind": "function",
-          "name": "rapidProgressRingStyles",
-          "return": {
-            "type": {
-              "text": "ElementStyles"
-            }
-          },
-          "parameters": [
-            {
-              "name": "context",
-              "type": {
-                "text": "ElementDefinitionContext"
-              }
-            },
-            {
-              "name": "definition",
-              "type": {
-                "text": "ProgressRingOptions"
-              }
-            }
-          ]
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "rapidProgressRingStyles",
-          "declaration": {
-            "name": "rapidProgressRingStyles",
-            "module": "src/progress-ring/progress-ring.styles.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/progress-ring/progress-ring.template.ts",
-      "declarations": [
-        {
-          "kind": "function",
-          "name": "rapidProgressRingTemplate",
-          "parameters": [
-            {
-              "name": "context",
-              "type": {
-                "text": "ElementDefinitionContext"
-              }
-            },
-            {
-              "name": "definition",
-              "type": {
-                "text": "ProgressRingOptions"
-              }
-            }
-          ]
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "rapidProgressRingTemplate",
-          "declaration": {
-            "name": "rapidProgressRingTemplate",
-            "module": "src/progress-ring/progress-ring.template.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/progress-ring/progress-ring.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "ProgressRing",
-          "superclass": {
-            "name": "FoundationProgressRing",
-            "package": "@genesislcap/foundation-ui"
-          }
-        },
-        {
-          "kind": "variable",
-          "name": "defaultrapidProgressRingConfig",
-          "type": {
-            "text": "object"
-          },
-          "default": "{}"
-        },
-        {
-          "kind": "variable",
-          "name": "rapidProgressRing"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "ProgressRing",
-          "declaration": {
-            "name": "ProgressRing",
-            "module": "src/progress-ring/progress-ring.ts"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "defaultrapidProgressRingConfig",
-          "declaration": {
-            "name": "defaultrapidProgressRingConfig",
-            "module": "src/progress-ring/progress-ring.ts"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "rapidProgressRing",
-          "declaration": {
-            "name": "rapidProgressRing",
-            "module": "src/progress-ring/progress-ring.ts"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "src/radio/index.ts",
@@ -22240,6 +22167,203 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/progress-ring/index.ts",
+      "declarations": [],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./progress-ring"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./progress-ring.styles"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./progress-ring.template"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/progress-ring/progress-ring.stories.ts",
+      "declarations": [
+        {
+          "kind": "variable",
+          "name": "meta",
+          "type": {
+            "text": "Meta"
+          },
+          "default": "{\n  title: 'Progress Ring',\n  component: 'rapid-progress-ring',\n}"
+        },
+        {
+          "kind": "variable",
+          "name": "Default",
+          "type": {
+            "text": "StoryObj"
+          },
+          "default": "{\n  args: {\n    value: '80',\n  },\n  render: ({ value }) => html`\n    <div style=\"width: 100%;\">\n      <rapid-progress-ring value=\"${value}\"></rapid-progress-ring>\n    </div>\n  `,\n}"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "meta",
+            "module": "src/progress-ring/progress-ring.stories.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "Default",
+          "declaration": {
+            "name": "Default",
+            "module": "src/progress-ring/progress-ring.stories.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/progress-ring/progress-ring.styles.ts",
+      "declarations": [
+        {
+          "kind": "function",
+          "name": "rapidProgressRingStyles",
+          "return": {
+            "type": {
+              "text": "ElementStyles"
+            }
+          },
+          "parameters": [
+            {
+              "name": "context",
+              "type": {
+                "text": "ElementDefinitionContext"
+              }
+            },
+            {
+              "name": "definition",
+              "type": {
+                "text": "ProgressRingOptions"
+              }
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "rapidProgressRingStyles",
+          "declaration": {
+            "name": "rapidProgressRingStyles",
+            "module": "src/progress-ring/progress-ring.styles.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/progress-ring/progress-ring.template.ts",
+      "declarations": [
+        {
+          "kind": "function",
+          "name": "rapidProgressRingTemplate",
+          "parameters": [
+            {
+              "name": "context",
+              "type": {
+                "text": "ElementDefinitionContext"
+              }
+            },
+            {
+              "name": "definition",
+              "type": {
+                "text": "ProgressRingOptions"
+              }
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "rapidProgressRingTemplate",
+          "declaration": {
+            "name": "rapidProgressRingTemplate",
+            "module": "src/progress-ring/progress-ring.template.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/progress-ring/progress-ring.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "ProgressRing",
+          "superclass": {
+            "name": "FoundationProgressRing",
+            "package": "@genesislcap/foundation-ui"
+          }
+        },
+        {
+          "kind": "variable",
+          "name": "defaultrapidProgressRingConfig",
+          "type": {
+            "text": "object"
+          },
+          "default": "{}"
+        },
+        {
+          "kind": "variable",
+          "name": "rapidProgressRing"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "ProgressRing",
+          "declaration": {
+            "name": "ProgressRing",
+            "module": "src/progress-ring/progress-ring.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "defaultrapidProgressRingConfig",
+          "declaration": {
+            "name": "defaultrapidProgressRingConfig",
+            "module": "src/progress-ring/progress-ring.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "rapidProgressRing",
+          "declaration": {
+            "name": "rapidProgressRing",
+            "module": "src/progress-ring/progress-ring.ts"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "src/router/index.ts",