@govtechsg/sgds-web-component 3.24.1-rc.0 → 3.24.1-rc.1

package/custom-elements.json

@@ -11398,1353 +11398,1353 @@
     },
     {
       "kind": "javascript-module",
-      "path": "src/components/ImageCard/sgds-image-card.ts",
+      "path": "src/components/Input/sgds-input.ts",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "SgdsImageCard",
+          "name": "SgdsInput",
           "slots": [
             {
-              "description": "The content area of the card, placed directly under the title. Accepts any HTML or custom elements.",
-              "name": "default"
+              "description": "The slot for leading icon of text input",
+              "name": "icon"
             },
             {
-              "description": "Accepts an image or svg element of the card. Only a single element is allowed to be passed in.",
-              "name": "image"
+              "description": "The slot for trailing icon of text input. When present, it overrides valid icon and loading spinner rendered when valid prop or loading prop are true",
+              "name": "trailing-icon"
             },
             {
-              "description": "Accepts an element for a badge, positioned at the top-left corner of the image.",
-              "name": "image-badge"
-            },
+              "description": "The slot for call to action of the text input. It is recommended to use sgds-icon-button within this slot",
+              "name": "action"
+            }
+          ],
+          "members": [
             {
-              "description": "Accepts an element for an overflow or contextual menu, positioned at the top-right corner of the image. Typically used for action menu.",
-              "name": "image-action"
+              "kind": "field",
+              "name": "type",
+              "type": {
+                "text": "| \"email\"\n    | \"number\"\n    | \"password\"\n    | \"search\"\n    | \"tel\"\n    | \"text\"\n    | \"time\"\n    | \"url\"\n    | \"datetime-local\""
+              },
+              "default": "\"text\"",
+              "attribute": "type",
+              "reflects": true
             },
             {
-              "description": "Accepts any content to be displayed at the top of the subtitle. Commonly used for badges, status indicators, or decorative elements.",
-              "name": "upper"
+              "kind": "field",
+              "name": "prefix",
+              "type": {
+                "text": "string"
+              },
+              "description": "The prefix of the input",
+              "attribute": "prefix"
             },
             {
-              "description": "The subtitle of the card",
-              "name": "subtitle"
+              "kind": "field",
+              "name": "suffix",
+              "type": {
+                "text": "string"
+              },
+              "description": "The suffix of the input",
+              "attribute": "suffix"
             },
             {
-              "description": "The title of the card",
-              "name": "title"
+              "kind": "field",
+              "name": "minlength",
+              "type": {
+                "text": "number"
+              },
+              "description": "Sets the minimum length of the input",
+              "attribute": "minlength",
+              "reflects": true
             },
             {
-              "description": "The paragrapher text of the card",
-              "name": "description"
+              "kind": "field",
+              "name": "maxlength",
+              "type": {
+                "text": "number"
+              },
+              "description": "Sets the maximum length of the input",
+              "attribute": "maxlength",
+              "reflects": true
             },
             {
-              "description": "Accepts any additional content to be displayed below the card description, such as badges, metadata, or supplementary information.",
-              "name": "lower"
+              "kind": "field",
+              "name": "min",
+              "type": {
+                "text": "number"
+              },
+              "description": "The input's minimum value. Only applies number input types.",
+              "attribute": "min"
             },
             {
-              "description": "Footer area of the card. Accepts links, actions, or any custom content.",
-              "name": "footer"
+              "kind": "field",
+              "name": "max",
+              "type": {
+                "text": "number"
+              },
+              "description": "The input's maximum value. Only applies number input types.",
+              "attribute": "max"
             },
-            {
-              "description": "(@deprecated) Deprecated since 3.3.2 in favour of `footer` slot. Legacy slot for anchor elements. Use `footer` instead.",
-              "name": "link"
-            }
-          ],
-          "members": [
             {
               "kind": "field",
-              "name": "footerNode",
+              "name": "placeholder",
               "type": {
-                "text": "HTMLElement[]"
+                "text": "string"
               },
-              "privacy": "private"
+              "default": "\"placeholder\"",
+              "description": "The input's placeholder text.",
+              "attribute": "placeholder",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "linkNode",
+              "name": "pattern",
               "type": {
-                "text": "HTMLAnchorElement[] | SgdsLink[]"
+                "text": "string"
               },
-              "privacy": "private"
+              "description": "A pattern to validate input against.",
+              "attribute": "pattern"
             },
             {
               "kind": "field",
-              "name": "noPadding",
+              "name": "autofocus",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Removes the card's internal padding when set to true.",
-              "attribute": "noPadding",
+              "description": "Autofocus the input",
+              "attribute": "autofocus",
               "reflects": true
             },
             {
               "kind": "field",
-              "name": "imagePosition",
+              "name": "readonly",
               "type": {
-                "text": "CardImagePosition"
+                "text": "boolean"
               },
-              "default": "\"before\"",
-              "description": "Sets the image position of the card. Available options: `before`, `after`",
-              "attribute": "imagePosition",
+              "default": "false",
+              "description": "Makes the input readonly.",
+              "attribute": "readonly",
               "reflects": true
             },
             {
               "kind": "field",
-              "name": "imageAdjustment",
+              "name": "autocomplete",
               "type": {
-                "text": "CardImageAdjustment"
+                "text": "string"
               },
-              "default": "\"default\"",
-              "description": "Controls how the image is sized and aligned within the card. Available options: `default`, `padding around`, `aspect ratio`",
-              "attribute": "imageAdjustment",
+              "default": "\"on\"",
+              "description": "Controlling of autocomplete behaviour",
+              "attribute": "autocomplete",
               "reflects": true
             },
             {
               "kind": "field",
-              "name": "linkSlotItems",
+              "name": "step",
               "type": {
-                "text": "HTMLAnchorElement | null"
+                "text": "number | \"any\""
               },
-              "privacy": "private"
+              "description": "Specifies the granularity that the value must adhere to, or the special value `any` which means no stepping is\nimplied, allowing any numeric value. Only applies to number input types.",
+              "attribute": "step"
             },
             {
               "kind": "field",
-              "name": "footerSlotItems",
+              "name": "hasFeedback",
               "type": {
-                "text": "HTMLAnchorElement | null"
+                "text": "\"style\" | \"text\" | \"both\""
               },
-              "privacy": "private"
+              "description": "Allows invalidFeedback, invalid and valid styles to be visible with the input",
+              "attribute": "hasFeedback",
+              "reflects": true
             },
             {
-              "kind": "method",
-              "name": "handleImgSlotChange",
-              "parameters": [
-                {
-                  "name": "e",
-                  "type": {
-                    "text": "Event"
-                  }
-                }
-              ],
-              "type": {}
+              "kind": "field",
+              "name": "invalidFeedback",
+              "type": {
+                "text": "string"
+              },
+              "description": "Feedback text for error state when validated",
+              "attribute": "invalidFeedback",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "stretchedLink",
+              "name": "defaultValue",
+              "type": {
+                "text": "string"
+              },
+              "default": "\"\"",
+              "description": "Gets or sets the default value used to reset this element. The initial value corresponds to the one originally specified in the HTML that created this element."
+            },
+            {
+              "kind": "field",
+              "name": "valid",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Extends the link passed in either `footer` or `link`(deprecated) slot.",
-              "attribute": "stretchedLink",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "CardElement",
-                "module": "src/base/card-element.ts"
-              }
+              "description": "Marks the component as valid.",
+              "attribute": "valid",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "disabled",
+              "name": "loading",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Disables the card",
-              "attribute": "disabled",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "CardElement",
-                "module": "src/base/card-element.ts"
-              }
+              "description": "Marks the component as loading.",
+              "attribute": "loading",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "hideBorder",
+              "name": "required",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "When true, hides the default border of the card.",
-              "attribute": "hideBorder",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "CardElement",
-                "module": "src/base/card-element.ts"
-              }
+              "description": "Makes the input a required field.",
+              "attribute": "required",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "tinted",
+              "name": "noValidate",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "When true, applies a tinted background color to the card.",
-              "attribute": "tinted",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "CardElement",
-                "module": "src/base/card-element.ts"
-              }
+              "description": "Disables native and sgds validation for the input.",
+              "attribute": "noValidate",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "orientation",
+              "name": "value",
               "type": {
-                "text": "CardOrientation"
+                "text": "string"
               },
-              "default": "\"vertical\"",
-              "description": "Sets the orientation of the card. Available options: `vertical`, `horizontal`",
-              "attribute": "orientation",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "CardElement",
-                "module": "src/base/card-element.ts"
-              }
+              "default": "\"\"",
+              "description": "The input's value attribute.",
+              "attribute": "value",
+              "reflects": true
             },
             {
-              "kind": "method",
-              "name": "handleTitleSlotChange",
-              "parameters": [
-                {
-                  "name": "e",
-                  "type": {
-                    "text": "Event"
-                  }
-                }
-              ],
-              "type": {},
-              "inheritedFrom": {
-                "name": "CardElement",
-                "module": "src/base/card-element.ts"
-              }
+              "kind": "field",
+              "name": "_isTouched",
+              "type": {
+                "text": "boolean"
+              },
+              "privacy": "protected",
+              "default": "false"
+            },
+            {
+              "kind": "field",
+              "name": "_showPassword",
+              "type": {
+                "text": "boolean"
+              },
+              "privacy": "private",
+              "default": "false"
             },
             {
               "kind": "method",
-              "name": "_forwardAnchorAttributes",
-              "privacy": "protected",
+              "name": "focus",
+              "privacy": "public",
               "parameters": [
                 {
-                  "name": "anchor",
+                  "name": "options",
+                  "optional": true,
                   "type": {
-                    "text": "HTMLAnchorElement | null"
+                    "text": "FocusOptions"
                   }
                 }
               ],
-              "type": {},
-              "inheritedFrom": {
-                "name": "CardElement",
-                "module": "src/base/card-element.ts"
-              }
+              "description": "Sets focus on the input.",
+              "type": {}
             },
             {
               "kind": "method",
-              "name": "warnLinkSlotMisused",
-              "parameters": [
-                {
-                  "name": "e",
-                  "type": {
-                    "text": "Event"
-                  }
+              "name": "blur",
+              "privacy": "public",
+              "description": "Sets blur on the input.",
+              "type": {}
+            },
+            {
+              "kind": "method",
+              "name": "reportValidity",
+              "privacy": "public",
+              "return": {
+                "type": {
+                  "text": "boolean"
                 }
-              ],
-              "type": {},
-              "inheritedFrom": {
-                "name": "CardElement",
-                "module": "src/base/card-element.ts"
-              }
+              },
+              "description": "Checks for validity. Under the hood, HTMLFormElement's reportValidity method calls this method to check for component's validity state\nNote that the native error popup is prevented for SGDS form components by default. Instead the validation message shows up in the feedback container of SgdsInput",
+              "type": {}
             },
             {
               "kind": "method",
-              "name": "emit",
+              "name": "checkValidity",
+              "privacy": "public",
+              "return": {
+                "type": {
+                  "text": "boolean"
+                }
+              },
+              "description": "Checks for validity without any native error popup message",
+              "type": {}
+            },
+            {
+              "kind": "method",
+              "name": "setValidity",
+              "privacy": "public",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
               "parameters": [
                 {
-                  "name": "name",
+                  "name": "flags",
+                  "optional": true,
+                  "type": {
+                    "text": "ValidityStateFlags"
+                  }
+                },
+                {
+                  "name": "message",
+                  "optional": true,
                   "type": {
                     "text": "string"
                   }
                 },
                 {
-                  "name": "options",
+                  "name": "anchor",
                   "optional": true,
                   "type": {
-                    "text": "CustomEventInit<T>"
+                    "text": "HTMLElement"
                   }
                 }
               ],
-              "description": "Emits a custom event with more convenient defaults.",
-              "type": {},
-              "inheritedFrom": {
-                "name": "SgdsElement",
-                "module": "src/base/sgds-element.ts"
-              }
+              "description": "Checks for validity without any native error popup message",
+              "type": {}
+            },
+            {
+              "kind": "field",
+              "name": "validity",
+              "type": {
+                "text": "ValidityState"
+              },
+              "privacy": "public",
+              "description": "Returns the ValidityState object"
+            },
+            {
+              "kind": "field",
+              "name": "validationMessage",
+              "privacy": "public",
+              "description": "Returns the validation message based on the ValidityState",
+              "type": {}
             },
             {
               "kind": "method",
-              "name": "define",
-              "static": true,
+              "name": "_handleFocus",
+              "privacy": "protected",
+              "type": {}
+            },
+            {
+              "kind": "method",
+              "name": "_handleBlur",
+              "privacy": "protected",
+              "type": {}
+            },
+            {
+              "kind": "method",
+              "name": "_handleClick",
+              "privacy": "private",
+              "type": {}
+            },
+            {
+              "kind": "method",
+              "name": "_handleChange",
+              "privacy": "protected",
               "parameters": [
                 {
-                  "name": "name",
+                  "name": "e",
                   "type": {
-                    "text": "string"
+                    "text": "Event"
                   }
-                },
-                {
-                  "name": "elementConstructor",
-                  "default": "this"
-                },
+                }
+              ],
+              "type": {}
+            },
+            {
+              "kind": "method",
+              "name": "_handleInputChange",
+              "privacy": "protected",
+              "parameters": [
                 {
-                  "name": "options",
-                  "default": "{}",
+                  "name": "e",
                   "type": {
-                    "text": "ElementDefinitionOptions"
+                    "text": "Event"
                   }
                 }
               ],
-              "type": {},
-              "inheritedFrom": {
-                "name": "SgdsElement",
-                "module": "src/base/sgds-element.ts"
-              }
-            }
-          ],
-          "attributes": [
+              "type": {}
+            },
             {
-              "name": "noPadding",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Removes the card's internal padding when set to true.",
-              "fieldName": "noPadding"
+              "kind": "method",
+              "name": "_handleDisabledChange",
+              "type": {}
             },
             {
-              "name": "imagePosition",
-              "type": {
-                "text": "CardImagePosition"
-              },
-              "default": "\"before\"",
-              "description": "Sets the image position of the card. Available options: `before`, `after`",
-              "fieldName": "imagePosition"
+              "kind": "method",
+              "name": "_renderInput",
+              "privacy": "protected",
+              "type": {}
             },
             {
-              "name": "imageAdjustment",
-              "type": {
-                "text": "CardImageAdjustment"
-              },
-              "default": "\"default\"",
-              "description": "Controls how the image is sized and aligned within the card. Available options: `default`, `padding around`, `aspect ratio`",
-              "fieldName": "imageAdjustment"
+              "kind": "method",
+              "name": "_renderPasswordToggle",
+              "privacy": "protected",
+              "type": {}
             },
             {
-              "name": "stretchedLink",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Extends the link passed in either `footer` or `link`(deprecated) slot.",
-              "fieldName": "stretchedLink",
-              "inheritedFrom": {
-                "name": "CardElement",
-                "module": "src/base/card-element.ts"
-              }
+              "kind": "method",
+              "name": "_inputType",
+              "privacy": "protected",
+              "type": {}
             },
             {
-              "name": "disabled",
+              "kind": "method",
+              "name": "_renderFeedback",
+              "privacy": "protected",
+              "type": {}
+            },
+            {
+              "kind": "method",
+              "name": "_renderLabel",
+              "privacy": "protected",
+              "type": {}
+            },
+            {
+              "kind": "method",
+              "name": "_renderHintText",
+              "privacy": "protected",
+              "type": {}
+            },
+            {
+              "kind": "field",
+              "name": "label",
               "type": {
-                "text": "boolean"
+                "text": "string"
               },
-              "default": "false",
-              "description": "Disables the card",
-              "fieldName": "disabled",
+              "default": "\"\"",
+              "description": "The input's label",
+              "attribute": "label",
+              "reflects": true,
               "inheritedFrom": {
-                "name": "CardElement",
-                "module": "src/base/card-element.ts"
+                "name": "FormControlElement",
+                "module": "src/base/form-control-element.ts"
               }
             },
             {
-              "name": "hideBorder",
-              "type": {
-                "text": "boolean"
+              "kind": "field",
+              "name": "hintText",
+              "type": {
+                "text": "string"
               },
-              "default": "false",
-              "description": "When true, hides the default border of the card.",
-              "fieldName": "hideBorder",
+              "default": "\"\"",
+              "description": "The input's hint text",
+              "attribute": "hintText",
+              "reflects": true,
               "inheritedFrom": {
-                "name": "CardElement",
-                "module": "src/base/card-element.ts"
+                "name": "FormControlElement",
+                "module": "src/base/form-control-element.ts"
               }
             },
             {
-              "name": "tinted",
+              "kind": "field",
+              "name": "name",
+              "type": {
+                "text": "string"
+              },
+              "description": "The input's name attribute",
+              "attribute": "name",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "FormControlElement",
+                "module": "src/base/form-control-element.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "disabled",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "When true, applies a tinted background color to the card.",
-              "fieldName": "tinted",
+              "description": "Disables the input.",
+              "attribute": "disabled",
+              "reflects": true,
               "inheritedFrom": {
-                "name": "CardElement",
-                "module": "src/base/card-element.ts"
+                "name": "FormControlElement",
+                "module": "src/base/form-control-element.ts"
               }
             },
             {
-              "name": "orientation",
+              "kind": "field",
+              "name": "invalid",
               "type": {
-                "text": "CardOrientation"
+                "text": "boolean"
               },
-              "default": "\"vertical\"",
-              "description": "Sets the orientation of the card. Available options: `vertical`, `horizontal`",
-              "fieldName": "orientation",
+              "default": "false",
+              "description": "Marks the component as invalid. Replace the pseudo :invalid selector for absent in custom elements",
+              "attribute": "invalid",
+              "reflects": true,
               "inheritedFrom": {
-                "name": "CardElement",
-                "module": "src/base/card-element.ts"
+                "name": "FormControlElement",
+                "module": "src/base/form-control-element.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "_controlId",
+              "privacy": "protected",
+              "type": {},
+              "inheritedFrom": {
+                "name": "FormControlElement",
+                "module": "src/base/form-control-element.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "_labelId",
+              "privacy": "protected",
+              "type": {},
+              "inheritedFrom": {
+                "name": "FormControlElement",
+                "module": "src/base/form-control-element.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "setInvalid",
+              "privacy": "public",
+              "parameters": [
+                {
+                  "name": "bool",
+                  "type": {
+                    "text": "boolean"
+                  }
+                }
+              ],
+              "description": "Programatically sets the invalid state of the input. Pass in boolean value in the argument",
+              "type": {},
+              "inheritedFrom": {
+                "name": "FormControlElement",
+                "module": "src/base/form-control-element.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "emit",
+              "parameters": [
+                {
+                  "name": "name",
+                  "type": {
+                    "text": "string"
+                  }
+                },
+                {
+                  "name": "options",
+                  "optional": true,
+                  "type": {
+                    "text": "CustomEventInit<T>"
+                  }
+                }
+              ],
+              "description": "Emits a custom event with more convenient defaults.",
+              "type": {},
+              "inheritedFrom": {
+                "name": "SgdsElement",
+                "module": "src/base/sgds-element.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "define",
+              "static": true,
+              "parameters": [
+                {
+                  "name": "name",
+                  "type": {
+                    "text": "string"
+                  }
+                },
+                {
+                  "name": "elementConstructor",
+                  "default": "this"
+                },
+                {
+                  "name": "options",
+                  "default": "{}",
+                  "type": {
+                    "text": "ElementDefinitionOptions"
+                  }
+                }
+              ],
+              "type": {},
+              "inheritedFrom": {
+                "name": "SgdsElement",
+                "module": "src/base/sgds-element.ts"
               }
             }
           ],
-          "superclass": {
-            "name": "CardElement",
-            "module": "/src/base/card-element"
-          },
-          "summary": "Image cards can be used for headers and footers, a wide variety of content, contain contextual background colors and images.",
-          "tagName": "sgds-image-card",
-          "customElement": true,
-          "modulePath": "src/components/ImageCard/sgds-image-card.ts",
-          "cssProperties": [],
-          "cssParts": [],
-          "cssStates": [],
-          "events": []
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "SgdsImageCard",
-          "declaration": {
-            "name": "SgdsImageCard",
-            "module": "src/components/ImageCard/sgds-image-card.ts"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "SgdsImageCard",
-            "module": "src/components/ImageCard/sgds-image-card.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/components/Input/sgds-input.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "SgdsInput",
-          "slots": [
+          "events": [
             {
-              "description": "The slot for leading icon of text input",
-              "name": "icon"
+              "description": "Emitted when an alteration to the control's value is committed by the user.",
+              "name": "sgds-change",
+              "reactName": "onSgdsChange"
             },
             {
-              "description": "The slot for trailing icon of text input. When present, it overrides valid icon and loading spinner rendered when valid prop or loading prop are true",
-              "name": "trailing-icon"
+              "description": "Emitted when the control receives input and its value changes.",
+              "name": "sgds-input",
+              "reactName": "onSgdsInput"
             },
             {
-              "description": "The slot for call to action of the text input. It is recommended to use sgds-icon-button within this slot",
-              "name": "action"
+              "description": "Emitted when input is in focus.",
+              "name": "sgds-focus",
+              "reactName": "onSgdsFocus"
+            },
+            {
+              "description": "Emitted when input is not in focus.",
+              "name": "sgds-blur",
+              "reactName": "onSgdsBlur"
+            },
+            {
+              "description": "Emitted when input is invalid",
+              "name": "sgds-invalid",
+              "reactName": "onSgdsInvalid"
+            },
+            {
+              "description": "Emitted when input is valid",
+              "name": "sgds-valid",
+              "reactName": "onSgdsValid"
             }
           ],
-          "members": [
+          "attributes": [
             {
-              "kind": "field",
               "name": "type",
               "type": {
                 "text": "| \"email\"\n    | \"number\"\n    | \"password\"\n    | \"search\"\n    | \"tel\"\n    | \"text\"\n    | \"time\"\n    | \"url\"\n    | \"datetime-local\""
               },
               "default": "\"text\"",
-              "attribute": "type",
-              "reflects": true
+              "fieldName": "type"
             },
             {
-              "kind": "field",
               "name": "prefix",
               "type": {
                 "text": "string"
               },
               "description": "The prefix of the input",
-              "attribute": "prefix"
+              "fieldName": "prefix"
             },
             {
-              "kind": "field",
               "name": "suffix",
               "type": {
                 "text": "string"
               },
               "description": "The suffix of the input",
-              "attribute": "suffix"
+              "fieldName": "suffix"
             },
             {
-              "kind": "field",
               "name": "minlength",
               "type": {
                 "text": "number"
               },
               "description": "Sets the minimum length of the input",
-              "attribute": "minlength",
-              "reflects": true
+              "fieldName": "minlength"
             },
             {
-              "kind": "field",
               "name": "maxlength",
               "type": {
                 "text": "number"
               },
               "description": "Sets the maximum length of the input",
-              "attribute": "maxlength",
-              "reflects": true
+              "fieldName": "maxlength"
             },
             {
-              "kind": "field",
               "name": "min",
               "type": {
                 "text": "number"
               },
               "description": "The input's minimum value. Only applies number input types.",
-              "attribute": "min"
+              "fieldName": "min"
             },
             {
-              "kind": "field",
               "name": "max",
               "type": {
                 "text": "number"
               },
               "description": "The input's maximum value. Only applies number input types.",
-              "attribute": "max"
+              "fieldName": "max"
             },
             {
-              "kind": "field",
               "name": "placeholder",
               "type": {
                 "text": "string"
               },
               "default": "\"placeholder\"",
               "description": "The input's placeholder text.",
-              "attribute": "placeholder",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "pattern",
-              "type": {
-                "text": "string"
-              },
-              "description": "A pattern to validate input against.",
-              "attribute": "pattern"
-            },
-            {
-              "kind": "field",
-              "name": "autofocus",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Autofocus the input",
-              "attribute": "autofocus",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "readonly",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Makes the input readonly.",
-              "attribute": "readonly",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "autocomplete",
-              "type": {
-                "text": "string"
-              },
-              "default": "\"on\"",
-              "description": "Controlling of autocomplete behaviour",
-              "attribute": "autocomplete",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "step",
-              "type": {
-                "text": "number | \"any\""
-              },
-              "description": "Specifies the granularity that the value must adhere to, or the special value `any` which means no stepping is\nimplied, allowing any numeric value. Only applies to number input types.",
-              "attribute": "step"
-            },
-            {
-              "kind": "field",
-              "name": "hasFeedback",
-              "type": {
-                "text": "\"style\" | \"text\" | \"both\""
-              },
-              "description": "Allows invalidFeedback, invalid and valid styles to be visible with the input",
-              "attribute": "hasFeedback",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "invalidFeedback",
-              "type": {
-                "text": "string"
-              },
-              "description": "Feedback text for error state when validated",
-              "attribute": "invalidFeedback",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "defaultValue",
-              "type": {
-                "text": "string"
-              },
-              "default": "\"\"",
-              "description": "Gets or sets the default value used to reset this element. The initial value corresponds to the one originally specified in the HTML that created this element."
-            },
-            {
-              "kind": "field",
-              "name": "valid",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Marks the component as valid.",
-              "attribute": "valid",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "loading",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Marks the component as loading.",
-              "attribute": "loading",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "required",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Makes the input a required field.",
-              "attribute": "required",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "noValidate",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Disables native and sgds validation for the input.",
-              "attribute": "noValidate",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "value",
-              "type": {
-                "text": "string"
-              },
-              "default": "\"\"",
-              "description": "The input's value attribute.",
-              "attribute": "value",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "_isTouched",
-              "type": {
-                "text": "boolean"
-              },
-              "privacy": "protected",
-              "default": "false"
-            },
-            {
-              "kind": "field",
-              "name": "_showPassword",
-              "type": {
-                "text": "boolean"
-              },
-              "privacy": "private",
-              "default": "false"
-            },
-            {
-              "kind": "method",
-              "name": "focus",
-              "privacy": "public",
-              "parameters": [
-                {
-                  "name": "options",
-                  "optional": true,
-                  "type": {
-                    "text": "FocusOptions"
-                  }
-                }
-              ],
-              "description": "Sets focus on the input.",
-              "type": {}
-            },
-            {
-              "kind": "method",
-              "name": "blur",
-              "privacy": "public",
-              "description": "Sets blur on the input.",
-              "type": {}
-            },
-            {
-              "kind": "method",
-              "name": "reportValidity",
-              "privacy": "public",
-              "return": {
-                "type": {
-                  "text": "boolean"
-                }
-              },
-              "description": "Checks for validity. Under the hood, HTMLFormElement's reportValidity method calls this method to check for component's validity state\nNote that the native error popup is prevented for SGDS form components by default. Instead the validation message shows up in the feedback container of SgdsInput",
-              "type": {}
-            },
-            {
-              "kind": "method",
-              "name": "checkValidity",
-              "privacy": "public",
-              "return": {
-                "type": {
-                  "text": "boolean"
-                }
-              },
-              "description": "Checks for validity without any native error popup message",
-              "type": {}
-            },
-            {
-              "kind": "method",
-              "name": "setValidity",
-              "privacy": "public",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "flags",
-                  "optional": true,
-                  "type": {
-                    "text": "ValidityStateFlags"
-                  }
-                },
-                {
-                  "name": "message",
-                  "optional": true,
-                  "type": {
-                    "text": "string"
-                  }
-                },
-                {
-                  "name": "anchor",
-                  "optional": true,
-                  "type": {
-                    "text": "HTMLElement"
-                  }
-                }
-              ],
-              "description": "Checks for validity without any native error popup message",
-              "type": {}
-            },
-            {
-              "kind": "field",
-              "name": "validity",
-              "type": {
-                "text": "ValidityState"
-              },
-              "privacy": "public",
-              "description": "Returns the ValidityState object"
-            },
-            {
-              "kind": "field",
-              "name": "validationMessage",
-              "privacy": "public",
-              "description": "Returns the validation message based on the ValidityState",
-              "type": {}
+              "fieldName": "placeholder"
             },
             {
-              "kind": "method",
-              "name": "_handleFocus",
-              "privacy": "protected",
-              "type": {}
+              "name": "pattern",
+              "type": {
+                "text": "string"
+              },
+              "description": "A pattern to validate input against.",
+              "fieldName": "pattern"
             },
             {
-              "kind": "method",
-              "name": "_handleBlur",
-              "privacy": "protected",
-              "type": {}
+              "name": "autofocus",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Autofocus the input",
+              "fieldName": "autofocus"
             },
             {
-              "kind": "method",
-              "name": "_handleClick",
-              "privacy": "private",
-              "type": {}
+              "name": "readonly",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Makes the input readonly.",
+              "fieldName": "readonly"
             },
             {
-              "kind": "method",
-              "name": "_handleChange",
-              "privacy": "protected",
-              "parameters": [
-                {
-                  "name": "e",
-                  "type": {
-                    "text": "Event"
-                  }
-                }
-              ],
-              "type": {}
+              "name": "autocomplete",
+              "type": {
+                "text": "string"
+              },
+              "default": "\"on\"",
+              "description": "Controlling of autocomplete behaviour",
+              "fieldName": "autocomplete"
             },
             {
-              "kind": "method",
-              "name": "_handleInputChange",
-              "privacy": "protected",
-              "parameters": [
-                {
-                  "name": "e",
-                  "type": {
-                    "text": "Event"
-                  }
-                }
-              ],
-              "type": {}
+              "name": "step",
+              "type": {
+                "text": "number | \"any\""
+              },
+              "description": "Specifies the granularity that the value must adhere to, or the special value `any` which means no stepping is\nimplied, allowing any numeric value. Only applies to number input types.",
+              "fieldName": "step"
             },
             {
-              "kind": "method",
-              "name": "_handleDisabledChange",
-              "type": {}
+              "name": "hasFeedback",
+              "type": {
+                "text": "\"style\" | \"text\" | \"both\""
+              },
+              "description": "Allows invalidFeedback, invalid and valid styles to be visible with the input",
+              "fieldName": "hasFeedback"
             },
             {
-              "kind": "method",
-              "name": "_renderInput",
-              "privacy": "protected",
-              "type": {}
+              "name": "invalidFeedback",
+              "type": {
+                "text": "string"
+              },
+              "description": "Feedback text for error state when validated",
+              "fieldName": "invalidFeedback"
             },
             {
-              "kind": "method",
-              "name": "_renderPasswordToggle",
-              "privacy": "protected",
-              "type": {}
+              "name": "valid",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Marks the component as valid.",
+              "fieldName": "valid"
             },
             {
-              "kind": "method",
-              "name": "_inputType",
-              "privacy": "protected",
-              "type": {}
+              "name": "loading",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Marks the component as loading.",
+              "fieldName": "loading"
             },
             {
-              "kind": "method",
-              "name": "_renderFeedback",
-              "privacy": "protected",
-              "type": {}
+              "name": "required",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Makes the input a required field.",
+              "fieldName": "required"
             },
             {
-              "kind": "method",
-              "name": "_renderLabel",
-              "privacy": "protected",
-              "type": {}
+              "name": "noValidate",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Disables native and sgds validation for the input.",
+              "fieldName": "noValidate"
             },
             {
-              "kind": "method",
-              "name": "_renderHintText",
-              "privacy": "protected",
-              "type": {}
+              "name": "value",
+              "type": {
+                "text": "string"
+              },
+              "default": "\"\"",
+              "description": "The input's value attribute.",
+              "fieldName": "value"
             },
             {
-              "kind": "field",
               "name": "label",
               "type": {
                 "text": "string"
               },
               "default": "\"\"",
               "description": "The input's label",
-              "attribute": "label",
-              "reflects": true,
+              "fieldName": "label",
               "inheritedFrom": {
                 "name": "FormControlElement",
                 "module": "src/base/form-control-element.ts"
               }
             },
             {
-              "kind": "field",
               "name": "hintText",
               "type": {
                 "text": "string"
               },
               "default": "\"\"",
               "description": "The input's hint text",
-              "attribute": "hintText",
-              "reflects": true,
+              "fieldName": "hintText",
               "inheritedFrom": {
                 "name": "FormControlElement",
                 "module": "src/base/form-control-element.ts"
               }
             },
             {
-              "kind": "field",
               "name": "name",
               "type": {
                 "text": "string"
               },
               "description": "The input's name attribute",
-              "attribute": "name",
-              "reflects": true,
+              "fieldName": "name",
               "inheritedFrom": {
                 "name": "FormControlElement",
                 "module": "src/base/form-control-element.ts"
               }
             },
             {
-              "kind": "field",
               "name": "disabled",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
               "description": "Disables the input.",
-              "attribute": "disabled",
-              "reflects": true,
+              "fieldName": "disabled",
               "inheritedFrom": {
                 "name": "FormControlElement",
                 "module": "src/base/form-control-element.ts"
               }
             },
             {
-              "kind": "field",
               "name": "invalid",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
               "description": "Marks the component as invalid. Replace the pseudo :invalid selector for absent in custom elements",
-              "attribute": "invalid",
-              "reflects": true,
-              "inheritedFrom": {
-                "name": "FormControlElement",
-                "module": "src/base/form-control-element.ts"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "_controlId",
-              "privacy": "protected",
-              "type": {},
-              "inheritedFrom": {
-                "name": "FormControlElement",
-                "module": "src/base/form-control-element.ts"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "_labelId",
-              "privacy": "protected",
-              "type": {},
-              "inheritedFrom": {
-                "name": "FormControlElement",
-                "module": "src/base/form-control-element.ts"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "setInvalid",
-              "privacy": "public",
-              "parameters": [
-                {
-                  "name": "bool",
-                  "type": {
-                    "text": "boolean"
-                  }
-                }
-              ],
-              "description": "Programatically sets the invalid state of the input. Pass in boolean value in the argument",
-              "type": {},
-              "inheritedFrom": {
-                "name": "FormControlElement",
-                "module": "src/base/form-control-element.ts"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "emit",
-              "parameters": [
-                {
-                  "name": "name",
-                  "type": {
-                    "text": "string"
-                  }
-                },
-                {
-                  "name": "options",
-                  "optional": true,
-                  "type": {
-                    "text": "CustomEventInit<T>"
-                  }
-                }
-              ],
-              "description": "Emits a custom event with more convenient defaults.",
-              "type": {},
-              "inheritedFrom": {
-                "name": "SgdsElement",
-                "module": "src/base/sgds-element.ts"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "define",
-              "static": true,
-              "parameters": [
-                {
-                  "name": "name",
-                  "type": {
-                    "text": "string"
-                  }
-                },
-                {
-                  "name": "elementConstructor",
-                  "default": "this"
-                },
-                {
-                  "name": "options",
-                  "default": "{}",
-                  "type": {
-                    "text": "ElementDefinitionOptions"
-                  }
-                }
-              ],
-              "type": {},
+              "fieldName": "invalid",
               "inheritedFrom": {
-                "name": "SgdsElement",
-                "module": "src/base/sgds-element.ts"
+                "name": "FormControlElement",
+                "module": "src/base/form-control-element.ts"
               }
             }
           ],
-          "events": [
+          "mixins": [
             {
-              "description": "Emitted when an alteration to the control's value is committed by the user.",
-              "name": "sgds-change",
-              "reactName": "onSgdsChange"
+              "name": "SgdsFormValidatorMixin",
+              "module": "/src/utils/validatorMixin"
+            }
+          ],
+          "superclass": {
+            "name": "FormControlElement",
+            "module": "/src/base/form-control-element"
+          },
+          "summary": "Text inputs allow your users to enter letters, numbers and symbols on a single line.",
+          "tagName": "sgds-input",
+          "customElement": true,
+          "modulePath": "src/components/Input/sgds-input.ts",
+          "cssProperties": [],
+          "cssParts": [],
+          "cssStates": []
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "SgdsInput",
+          "declaration": {
+            "name": "SgdsInput",
+            "module": "src/components/Input/sgds-input.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "SgdsInput",
+            "module": "src/components/Input/sgds-input.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/components/ImageCard/sgds-image-card.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "SgdsImageCard",
+          "slots": [
+            {
+              "description": "The content area of the card, placed directly under the title. Accepts any HTML or custom elements.",
+              "name": "default"
             },
             {
-              "description": "Emitted when the control receives input and its value changes.",
-              "name": "sgds-input",
-              "reactName": "onSgdsInput"
+              "description": "Accepts an image or svg element of the card. Only a single element is allowed to be passed in.",
+              "name": "image"
             },
             {
-              "description": "Emitted when input is in focus.",
-              "name": "sgds-focus",
-              "reactName": "onSgdsFocus"
+              "description": "Accepts an element for a badge, positioned at the top-left corner of the image.",
+              "name": "image-badge"
             },
             {
-              "description": "Emitted when input is not in focus.",
-              "name": "sgds-blur",
-              "reactName": "onSgdsBlur"
+              "description": "Accepts an element for an overflow or contextual menu, positioned at the top-right corner of the image. Typically used for action menu.",
+              "name": "image-action"
             },
             {
-              "description": "Emitted when input is invalid",
-              "name": "sgds-invalid",
-              "reactName": "onSgdsInvalid"
+              "description": "Accepts any content to be displayed at the top of the subtitle. Commonly used for badges, status indicators, or decorative elements.",
+              "name": "upper"
             },
             {
-              "description": "Emitted when input is valid",
-              "name": "sgds-valid",
-              "reactName": "onSgdsValid"
-            }
-          ],
-          "attributes": [
+              "description": "The subtitle of the card",
+              "name": "subtitle"
+            },
             {
-              "name": "type",
-              "type": {
-                "text": "| \"email\"\n    | \"number\"\n    | \"password\"\n    | \"search\"\n    | \"tel\"\n    | \"text\"\n    | \"time\"\n    | \"url\"\n    | \"datetime-local\""
-              },
-              "default": "\"text\"",
-              "fieldName": "type"
+              "description": "The title of the card",
+              "name": "title"
             },
             {
-              "name": "prefix",
-              "type": {
-                "text": "string"
-              },
-              "description": "The prefix of the input",
-              "fieldName": "prefix"
+              "description": "The paragrapher text of the card",
+              "name": "description"
             },
             {
-              "name": "suffix",
-              "type": {
-                "text": "string"
-              },
-              "description": "The suffix of the input",
-              "fieldName": "suffix"
+              "description": "Accepts any additional content to be displayed below the card description, such as badges, metadata, or supplementary information.",
+              "name": "lower"
             },
             {
-              "name": "minlength",
-              "type": {
-                "text": "number"
-              },
-              "description": "Sets the minimum length of the input",
-              "fieldName": "minlength"
+              "description": "Footer area of the card. Accepts links, actions, or any custom content.",
+              "name": "footer"
             },
             {
-              "name": "maxlength",
+              "description": "(@deprecated) Deprecated since 3.3.2 in favour of `footer` slot. Legacy slot for anchor elements. Use `footer` instead.",
+              "name": "link"
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "footerNode",
               "type": {
-                "text": "number"
+                "text": "HTMLElement[]"
               },
-              "description": "Sets the maximum length of the input",
-              "fieldName": "maxlength"
+              "privacy": "private"
             },
             {
-              "name": "min",
+              "kind": "field",
+              "name": "linkNode",
               "type": {
-                "text": "number"
+                "text": "HTMLAnchorElement[] | SgdsLink[]"
               },
-              "description": "The input's minimum value. Only applies number input types.",
-              "fieldName": "min"
+              "privacy": "private"
             },
             {
-              "name": "max",
+              "kind": "field",
+              "name": "noPadding",
               "type": {
-                "text": "number"
+                "text": "boolean"
               },
-              "description": "The input's maximum value. Only applies number input types.",
-              "fieldName": "max"
+              "default": "false",
+              "description": "Removes the card's internal padding when set to true.",
+              "attribute": "noPadding",
+              "reflects": true
             },
             {
-              "name": "placeholder",
+              "kind": "field",
+              "name": "imagePosition",
               "type": {
-                "text": "string"
+                "text": "CardImagePosition"
               },
-              "default": "\"placeholder\"",
-              "description": "The input's placeholder text.",
-              "fieldName": "placeholder"
+              "default": "\"before\"",
+              "description": "Sets the image position of the card. Available options: `before`, `after`",
+              "attribute": "imagePosition",
+              "reflects": true
             },
             {
-              "name": "pattern",
+              "kind": "field",
+              "name": "imageAdjustment",
               "type": {
-                "text": "string"
+                "text": "CardImageAdjustment"
               },
-              "description": "A pattern to validate input against.",
-              "fieldName": "pattern"
+              "default": "\"default\"",
+              "description": "Controls how the image is sized and aligned within the card. Available options: `default`, `padding around`, `aspect ratio`",
+              "attribute": "imageAdjustment",
+              "reflects": true
             },
             {
-              "name": "autofocus",
+              "kind": "field",
+              "name": "linkSlotItems",
               "type": {
-                "text": "boolean"
+                "text": "HTMLAnchorElement | null"
               },
-              "default": "false",
-              "description": "Autofocus the input",
-              "fieldName": "autofocus"
+              "privacy": "private"
             },
             {
-              "name": "readonly",
+              "kind": "field",
+              "name": "footerSlotItems",
               "type": {
-                "text": "boolean"
+                "text": "HTMLAnchorElement | null"
               },
-              "default": "false",
-              "description": "Makes the input readonly.",
-              "fieldName": "readonly"
+              "privacy": "private"
             },
             {
-              "name": "autocomplete",
-              "type": {
-                "text": "string"
-              },
-              "default": "\"on\"",
-              "description": "Controlling of autocomplete behaviour",
-              "fieldName": "autocomplete"
+              "kind": "method",
+              "name": "handleImgSlotChange",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ],
+              "type": {}
             },
             {
-              "name": "step",
+              "kind": "field",
+              "name": "stretchedLink",
               "type": {
-                "text": "number | \"any\""
+                "text": "boolean"
               },
-              "description": "Specifies the granularity that the value must adhere to, or the special value `any` which means no stepping is\nimplied, allowing any numeric value. Only applies to number input types.",
-              "fieldName": "step"
+              "default": "false",
+              "description": "Extends the link passed in either `footer` or `link`(deprecated) slot.",
+              "attribute": "stretchedLink",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "CardElement",
+                "module": "src/base/card-element.ts"
+              }
             },
             {
-              "name": "hasFeedback",
+              "kind": "field",
+              "name": "disabled",
               "type": {
-                "text": "\"style\" | \"text\" | \"both\""
+                "text": "boolean"
               },
-              "description": "Allows invalidFeedback, invalid and valid styles to be visible with the input",
-              "fieldName": "hasFeedback"
+              "default": "false",
+              "description": "Disables the card",
+              "attribute": "disabled",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "CardElement",
+                "module": "src/base/card-element.ts"
+              }
             },
             {
-              "name": "invalidFeedback",
+              "kind": "field",
+              "name": "hideBorder",
               "type": {
-                "text": "string"
+                "text": "boolean"
               },
-              "description": "Feedback text for error state when validated",
-              "fieldName": "invalidFeedback"
+              "default": "false",
+              "description": "When true, hides the default border of the card.",
+              "attribute": "hideBorder",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "CardElement",
+                "module": "src/base/card-element.ts"
+              }
             },
             {
-              "name": "valid",
+              "kind": "field",
+              "name": "tinted",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Marks the component as valid.",
-              "fieldName": "valid"
+              "description": "When true, applies a tinted background color to the card.",
+              "attribute": "tinted",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "CardElement",
+                "module": "src/base/card-element.ts"
+              }
             },
             {
-              "name": "loading",
+              "kind": "field",
+              "name": "orientation",
               "type": {
-                "text": "boolean"
+                "text": "CardOrientation"
               },
-              "default": "false",
-              "description": "Marks the component as loading.",
-              "fieldName": "loading"
+              "default": "\"vertical\"",
+              "description": "Sets the orientation of the card. Available options: `vertical`, `horizontal`",
+              "attribute": "orientation",
+              "reflects": true,
+              "inheritedFrom": {
+                "name": "CardElement",
+                "module": "src/base/card-element.ts"
+              }
             },
             {
-              "name": "required",
+              "kind": "method",
+              "name": "handleTitleSlotChange",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ],
+              "type": {},
+              "inheritedFrom": {
+                "name": "CardElement",
+                "module": "src/base/card-element.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "_forwardAnchorAttributes",
+              "privacy": "protected",
+              "parameters": [
+                {
+                  "name": "anchor",
+                  "type": {
+                    "text": "HTMLAnchorElement | null"
+                  }
+                }
+              ],
+              "type": {},
+              "inheritedFrom": {
+                "name": "CardElement",
+                "module": "src/base/card-element.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "warnLinkSlotMisused",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ],
+              "type": {},
+              "inheritedFrom": {
+                "name": "CardElement",
+                "module": "src/base/card-element.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "emit",
+              "parameters": [
+                {
+                  "name": "name",
+                  "type": {
+                    "text": "string"
+                  }
+                },
+                {
+                  "name": "options",
+                  "optional": true,
+                  "type": {
+                    "text": "CustomEventInit<T>"
+                  }
+                }
+              ],
+              "description": "Emits a custom event with more convenient defaults.",
+              "type": {},
+              "inheritedFrom": {
+                "name": "SgdsElement",
+                "module": "src/base/sgds-element.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "define",
+              "static": true,
+              "parameters": [
+                {
+                  "name": "name",
+                  "type": {
+                    "text": "string"
+                  }
+                },
+                {
+                  "name": "elementConstructor",
+                  "default": "this"
+                },
+                {
+                  "name": "options",
+                  "default": "{}",
+                  "type": {
+                    "text": "ElementDefinitionOptions"
+                  }
+                }
+              ],
+              "type": {},
+              "inheritedFrom": {
+                "name": "SgdsElement",
+                "module": "src/base/sgds-element.ts"
+              }
+            }
+          ],
+          "attributes": [
+            {
+              "name": "noPadding",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Makes the input a required field.",
-              "fieldName": "required"
+              "description": "Removes the card's internal padding when set to true.",
+              "fieldName": "noPadding"
             },
             {
-              "name": "noValidate",
+              "name": "imagePosition",
               "type": {
-                "text": "boolean"
+                "text": "CardImagePosition"
               },
-              "default": "false",
-              "description": "Disables native and sgds validation for the input.",
-              "fieldName": "noValidate"
+              "default": "\"before\"",
+              "description": "Sets the image position of the card. Available options: `before`, `after`",
+              "fieldName": "imagePosition"
             },
             {
-              "name": "value",
+              "name": "imageAdjustment",
               "type": {
-                "text": "string"
+                "text": "CardImageAdjustment"
               },
-              "default": "\"\"",
-              "description": "The input's value attribute.",
-              "fieldName": "value"
+              "default": "\"default\"",
+              "description": "Controls how the image is sized and aligned within the card. Available options: `default`, `padding around`, `aspect ratio`",
+              "fieldName": "imageAdjustment"
             },
             {
-              "name": "label",
+              "name": "stretchedLink",
               "type": {
-                "text": "string"
+                "text": "boolean"
               },
-              "default": "\"\"",
-              "description": "The input's label",
-              "fieldName": "label",
+              "default": "false",
+              "description": "Extends the link passed in either `footer` or `link`(deprecated) slot.",
+              "fieldName": "stretchedLink",
               "inheritedFrom": {
-                "name": "FormControlElement",
-                "module": "src/base/form-control-element.ts"
+                "name": "CardElement",
+                "module": "src/base/card-element.ts"
               }
             },
             {
-              "name": "hintText",
+              "name": "disabled",
               "type": {
-                "text": "string"
+                "text": "boolean"
               },
-              "default": "\"\"",
-              "description": "The input's hint text",
-              "fieldName": "hintText",
+              "default": "false",
+              "description": "Disables the card",
+              "fieldName": "disabled",
               "inheritedFrom": {
-                "name": "FormControlElement",
-                "module": "src/base/form-control-element.ts"
+                "name": "CardElement",
+                "module": "src/base/card-element.ts"
               }
             },
             {
-              "name": "name",
+              "name": "hideBorder",
               "type": {
-                "text": "string"
+                "text": "boolean"
               },
-              "description": "The input's name attribute",
-              "fieldName": "name",
+              "default": "false",
+              "description": "When true, hides the default border of the card.",
+              "fieldName": "hideBorder",
               "inheritedFrom": {
-                "name": "FormControlElement",
-                "module": "src/base/form-control-element.ts"
+                "name": "CardElement",
+                "module": "src/base/card-element.ts"
               }
             },
             {
-              "name": "disabled",
+              "name": "tinted",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Disables the input.",
-              "fieldName": "disabled",
+              "description": "When true, applies a tinted background color to the card.",
+              "fieldName": "tinted",
               "inheritedFrom": {
-                "name": "FormControlElement",
-                "module": "src/base/form-control-element.ts"
+                "name": "CardElement",
+                "module": "src/base/card-element.ts"
               }
             },
             {
-              "name": "invalid",
+              "name": "orientation",
               "type": {
-                "text": "boolean"
+                "text": "CardOrientation"
               },
-              "default": "false",
-              "description": "Marks the component as invalid. Replace the pseudo :invalid selector for absent in custom elements",
-              "fieldName": "invalid",
+              "default": "\"vertical\"",
+              "description": "Sets the orientation of the card. Available options: `vertical`, `horizontal`",
+              "fieldName": "orientation",
               "inheritedFrom": {
-                "name": "FormControlElement",
-                "module": "src/base/form-control-element.ts"
+                "name": "CardElement",
+                "module": "src/base/card-element.ts"
               }
             }
           ],
-          "mixins": [
-            {
-              "name": "SgdsFormValidatorMixin",
-              "module": "/src/utils/validatorMixin"
-            }
-          ],
           "superclass": {
-            "name": "FormControlElement",
-            "module": "/src/base/form-control-element"
+            "name": "CardElement",
+            "module": "/src/base/card-element"
           },
-          "summary": "Text inputs allow your users to enter letters, numbers and symbols on a single line.",
-          "tagName": "sgds-input",
+          "summary": "Image cards can be used for headers and footers, a wide variety of content, contain contextual background colors and images.",
+          "tagName": "sgds-image-card",
           "customElement": true,
-          "modulePath": "src/components/Input/sgds-input.ts",
+          "modulePath": "src/components/ImageCard/sgds-image-card.ts",
           "cssProperties": [],
           "cssParts": [],
-          "cssStates": []
+          "cssStates": [],
+          "events": []
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "SgdsInput",
+          "name": "SgdsImageCard",
           "declaration": {
-            "name": "SgdsInput",
-            "module": "src/components/Input/sgds-input.ts"
+            "name": "SgdsImageCard",
+            "module": "src/components/ImageCard/sgds-image-card.ts"
           }
         },
         {
           "kind": "js",
           "name": "default",
           "declaration": {
-            "name": "SgdsInput",
-            "module": "src/components/Input/sgds-input.ts"
+            "name": "SgdsImageCard",
+            "module": "src/components/ImageCard/sgds-image-card.ts"
           }
         }
       ]
@@ -27963,7 +27963,7 @@
   "package": {
     "name": "@govtechsg/sgds-web-component",
     "description": "",
-    "version": "3.24.1-rc.0",
+    "version": "3.24.1-rc.1",
     "author": "GovTechSG",
     "license": "MIT"
   }