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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@govtechsg/sgds-web-component",
3
- "version": "3.24.1-rc.0",
3
+ "version": "3.24.1-rc.1",
4
4
  "description": "",
5
5
  "main": "./index.umd.js",
6
6
  "module": "./index.js",
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
 
6
6
  var lit = require('lit');
7
7
 
8
- var css_248z = lit.css`:host{--input-border-radius:var(--sgds-form-border-radius-md);--input-min-width:var(--sgds-dimension-160)}.form-control-container{min-width:var(--input-min-width)}:host(.quantity-toggle) input::-webkit-inner-spin-button{appearance:none;margin:0}:host(.quantity-toggle) input{text-align:center}.form-control-prefix,.form-control-suffix{color:var(--sgds-form-color-subtle);display:flex;flex-shrink:0;font-weight:var(--sgds-font-weight-semibold);gap:var(--sgds-gap-xs)}.form-control-group.quantity-toggle{padding:0}sgds-icon[role=button]{cursor:pointer}sgds-icon[role=button]:focus,sgds-icon[role=button]:focus-visible{outline:var(--sgds-form-outline-focus)}.form-control-row{align-items:center;display:flex;gap:var(--sgds-gap-sm)}`;
8
+ var css_248z = lit.css`:host{--input-border-radius:var(--sgds-form-border-radius-md);--input-min-width:var(--sgds-dimension-160)}.form-control-container{min-width:var(--input-min-width)}:host(.quantity-toggle) input::-webkit-inner-spin-button{appearance:none;margin:0}:host(.quantity-toggle) input{text-align:center}.form-control-prefix,.form-control-suffix{align-items:center;color:var(--sgds-form-color-subtle);display:flex;flex-shrink:0;font-weight:var(--sgds-font-weight-semibold);gap:var(--sgds-gap-xs);height:100%;justify-content:center}.form-control-prefix{border-right:var(--sgds-form-border-width-default) solid var(--sgds-border-color-muted);padding-right:var(--sgds-form-padding-x)}.form-control-suffix{border-left:var(--sgds-form-border-width-default) solid var(--sgds-border-color-muted);padding-left:var(--sgds-form-padding-x)}.form-control-group.quantity-toggle{padding:0}sgds-icon[role=button]{cursor:pointer}sgds-icon[role=button]:focus,sgds-icon[role=button]:focus-visible{outline:var(--sgds-form-outline-focus)}.form-control-row{align-items:center;display:flex;gap:var(--sgds-gap-sm)}`;
9
9
 
10
10
  exports["default"] = css_248z;
11
11
  //# sourceMappingURL=input.cjs.js.map
@@ -1,7 +1,7 @@
1
1
  'use client';
2
2
  import { css } from 'lit';
3
3
 
4
- var css_248z = css`:host{--input-border-radius:var(--sgds-form-border-radius-md);--input-min-width:var(--sgds-dimension-160)}.form-control-container{min-width:var(--input-min-width)}:host(.quantity-toggle) input::-webkit-inner-spin-button{appearance:none;margin:0}:host(.quantity-toggle) input{text-align:center}.form-control-prefix,.form-control-suffix{color:var(--sgds-form-color-subtle);display:flex;flex-shrink:0;font-weight:var(--sgds-font-weight-semibold);gap:var(--sgds-gap-xs)}.form-control-group.quantity-toggle{padding:0}sgds-icon[role=button]{cursor:pointer}sgds-icon[role=button]:focus,sgds-icon[role=button]:focus-visible{outline:var(--sgds-form-outline-focus)}.form-control-row{align-items:center;display:flex;gap:var(--sgds-gap-sm)}`;
4
+ var css_248z = css`:host{--input-border-radius:var(--sgds-form-border-radius-md);--input-min-width:var(--sgds-dimension-160)}.form-control-container{min-width:var(--input-min-width)}:host(.quantity-toggle) input::-webkit-inner-spin-button{appearance:none;margin:0}:host(.quantity-toggle) input{text-align:center}.form-control-prefix,.form-control-suffix{align-items:center;color:var(--sgds-form-color-subtle);display:flex;flex-shrink:0;font-weight:var(--sgds-font-weight-semibold);gap:var(--sgds-gap-xs);height:100%;justify-content:center}.form-control-prefix{border-right:var(--sgds-form-border-width-default) solid var(--sgds-border-color-muted);padding-right:var(--sgds-form-padding-x)}.form-control-suffix{border-left:var(--sgds-form-border-width-default) solid var(--sgds-border-color-muted);padding-left:var(--sgds-form-padding-x)}.form-control-group.quantity-toggle{padding:0}sgds-icon[role=button]{cursor:pointer}sgds-icon[role=button]:focus,sgds-icon[role=button]:focus-visible{outline:var(--sgds-form-outline-focus)}.form-control-row{align-items:center;display:flex;gap:var(--sgds-gap-sm)}`;
5
5
 
6
6
  export { css_248z as default };
7
7
  //# sourceMappingURL=input.js.map
@@ -31,8 +31,8 @@ var index$o = require('./icon/index.cjs.js');
31
31
  var index$p = require('./icon-button/index.cjs.js');
32
32
  var index$q = require('./icon-card/index.cjs.js');
33
33
  var index$r = require('./icon-list/index.cjs.js');
34
- var index$s = require('./image-card/index.cjs.js');
35
- var index$t = require('./input/index.cjs.js');
34
+ var index$s = require('./input/index.cjs.js');
35
+ var index$t = require('./image-card/index.cjs.js');
36
36
  var index$u = require('./link/index.cjs.js');
37
37
  var index$v = require('./mainnav-dropdown/index.cjs.js');
38
38
  var index$w = require('./mainnav-item/index.cjs.js');
@@ -107,8 +107,8 @@ exports.SgdsIcon = index$o["default"];
107
107
  exports.SgdsIconButton = index$p["default"];
108
108
  exports.SgdsIconCard = index$q["default"];
109
109
  exports.SgdsIconList = index$r["default"];
110
- exports.SgdsImageCard = index$s["default"];
111
- exports.SgdsInput = index$t["default"];
110
+ exports.SgdsInput = index$s["default"];
111
+ exports.SgdsImageCard = index$t["default"];
112
112
  exports.SgdsLink = index$u["default"];
113
113
  exports.SgdsMainnavDropdown = index$v["default"];
114
114
  exports.SgdsMainnavItem = index$w["default"];
package/react/index.d.ts CHANGED
@@ -26,8 +26,8 @@ export { default as SgdsIcon } from './icon';
26
26
  export { default as SgdsIconButton } from './icon-button';
27
27
  export { default as SgdsIconCard } from './icon-card';
28
28
  export { default as SgdsIconList } from './icon-list';
29
- export { default as SgdsImageCard } from './image-card';
30
29
  export { default as SgdsInput } from './input';
30
+ export { default as SgdsImageCard } from './image-card';
31
31
  export { default as SgdsLink } from './link';
32
32
  export { default as SgdsMainnavDropdown } from './mainnav-dropdown';
33
33
  export { default as SgdsMainnavItem } from './mainnav-item';
package/react/index.js CHANGED
@@ -27,8 +27,8 @@ export { default as SgdsIcon } from './icon/index.js';
27
27
  export { default as SgdsIconButton } from './icon-button/index.js';
28
28
  export { default as SgdsIconCard } from './icon-card/index.js';
29
29
  export { default as SgdsIconList } from './icon-list/index.js';
30
- export { default as SgdsImageCard } from './image-card/index.js';
31
30
  export { default as SgdsInput } from './input/index.js';
31
+ export { default as SgdsImageCard } from './image-card/index.js';
32
32
  export { default as SgdsLink } from './link/index.js';
33
33
  export { default as SgdsMainnavDropdown } from './mainnav-dropdown/index.js';
34
34
  export { default as SgdsMainnavItem } from './mainnav-item/index.js';
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
 
6
6
  var lit = require('lit');
7
7
 
8
- var css_248z = lit.css`.form-control-container{display:flex;flex-direction:column;gap:var(--sgds-form-gap-md)}.m-width-160{min-width:var(--sgds-dimension-160)}.m-width-256{min-width:var(--sgds-dimension-256)}.form-label{color:var(--sgds-form-color-default);font-size:var(--sgds-font-size-label-md);font-weight:var(--sgds-font-weight-semibold)}.form-control-group{align-items:center;background-color:var(--sgds-form-surface-default);border:var(--sgds-form-border-width-default) solid var(--sgds-border-color-default);border-radius:var(--input-border-radius,var(--sgds-form-border-radius-md));display:flex;gap:var(--sgds-form-gap-md);height:var(--sgds-dimension-48);justify-content:center;overflow:hidden;padding:0 var(--sgds-form-padding-x);transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;width:-webkit-fill-available;width:-moz-available}.form-control{appearance:none;background-clip:padding-box;background:none;border:none;color:var(--sgds-form-color-default);display:block;flex-grow:1;font-family:var(--sgds-font-family-brand);font-size:var(--sgds-font-size-label-md);line-height:var(--sgds-line-height-xs);min-width:0;outline:none;padding:0;width:100%}.form-clearable{color:var(--sgds-color-subtle);cursor:pointer}@media (prefers-reduced-motion:reduce){.form-control-group{transition:none}}.form-control-group:not(.disabled):not(.is-invalid):not(.readonly):not(:focus-within):hover{outline:var(--sgds-form-border-width-thick) solid var(--sgds-border-color-emphasis);outline-offset:var(--sgds-form-outline-offset-focus)}.form-control-group:not(.disabled):not(.is-invalid):focus-within{outline:var(--sgds-form-outline-focus);outline-offset:var(--sgds-form-outline-offset-focus)}.form-control-container.disabled{opacity:var(--sgds-opacity-40)}.form-control-group.disabled{background-color:var(--sgds-form-surface-muted);cursor:not-allowed}.form-control-group.readonly{background-color:var(--sgds-form-surface-raised)}.form-control-group.is-invalid:not(.disabled){border:var(--sgds-form-border-width-default) solid var(--sgds-form-danger-border-color-default)}.form-control-group:not(.disabled).is-invalid:focus-within{outline:var(--sgds-border-width-2) solid var(--sgds-form-danger-color-default);outline-offset:var(--sgds-form-outline-offset-focus)}`;
8
+ var css_248z = lit.css`.form-control-container{display:flex;flex-direction:column;gap:var(--sgds-form-gap-md)}.m-width-160{min-width:var(--sgds-dimension-160)}.m-width-256{min-width:var(--sgds-dimension-256)}.form-label{color:var(--sgds-form-color-default);font-size:var(--sgds-font-size-label-md);font-weight:var(--sgds-font-weight-semibold)}.form-control-group{align-items:center;background-color:var(--sgds-form-surface-default);border:var(--sgds-form-border-width-default) solid var(--sgds-border-color-default);border-radius:var(--input-border-radius,var(--sgds-form-border-radius-md));display:flex;gap:var(--sgds-form-gap-xl);height:var(--sgds-dimension-48);justify-content:center;overflow:hidden;padding:0 var(--sgds-form-padding-x);transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;width:-webkit-fill-available;width:-moz-available}.form-control{appearance:none;background-clip:padding-box;background:none;border:none;color:var(--sgds-form-color-default);display:block;flex-grow:1;font-family:var(--sgds-font-family-brand);font-size:var(--sgds-font-size-label-md);line-height:var(--sgds-line-height-xs);min-width:0;outline:none;padding:0;width:100%}.form-clearable{color:var(--sgds-color-subtle);cursor:pointer}@media (prefers-reduced-motion:reduce){.form-control-group{transition:none}}.form-control-group:not(.disabled):not(.is-invalid):not(.readonly):not(:focus-within):hover{outline:var(--sgds-form-border-width-thick) solid var(--sgds-border-color-emphasis);outline-offset:var(--sgds-form-outline-offset-focus)}.form-control-group:not(.disabled):not(.is-invalid):focus-within{outline:var(--sgds-form-outline-focus);outline-offset:var(--sgds-form-outline-offset-focus)}.form-control-container.disabled{opacity:var(--sgds-opacity-40)}.form-control-group.disabled{background-color:var(--sgds-form-surface-muted);cursor:not-allowed}.form-control-group.readonly{background-color:var(--sgds-form-surface-raised)}.form-control-group.is-invalid:not(.disabled){border:var(--sgds-form-border-width-default) solid var(--sgds-form-danger-border-color-default)}.form-control-group:not(.disabled).is-invalid:focus-within{outline:var(--sgds-border-width-2) solid var(--sgds-form-danger-color-default);outline-offset:var(--sgds-form-outline-offset-focus)}`;
9
9
 
10
10
  exports["default"] = css_248z;
11
11
  //# sourceMappingURL=form-text-control.cjs.js.map
@@ -1,7 +1,7 @@
1
1
  'use client';
2
2
  import { css } from 'lit';
3
3
 
4
- var css_248z = css`.form-control-container{display:flex;flex-direction:column;gap:var(--sgds-form-gap-md)}.m-width-160{min-width:var(--sgds-dimension-160)}.m-width-256{min-width:var(--sgds-dimension-256)}.form-label{color:var(--sgds-form-color-default);font-size:var(--sgds-font-size-label-md);font-weight:var(--sgds-font-weight-semibold)}.form-control-group{align-items:center;background-color:var(--sgds-form-surface-default);border:var(--sgds-form-border-width-default) solid var(--sgds-border-color-default);border-radius:var(--input-border-radius,var(--sgds-form-border-radius-md));display:flex;gap:var(--sgds-form-gap-md);height:var(--sgds-dimension-48);justify-content:center;overflow:hidden;padding:0 var(--sgds-form-padding-x);transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;width:-webkit-fill-available;width:-moz-available}.form-control{appearance:none;background-clip:padding-box;background:none;border:none;color:var(--sgds-form-color-default);display:block;flex-grow:1;font-family:var(--sgds-font-family-brand);font-size:var(--sgds-font-size-label-md);line-height:var(--sgds-line-height-xs);min-width:0;outline:none;padding:0;width:100%}.form-clearable{color:var(--sgds-color-subtle);cursor:pointer}@media (prefers-reduced-motion:reduce){.form-control-group{transition:none}}.form-control-group:not(.disabled):not(.is-invalid):not(.readonly):not(:focus-within):hover{outline:var(--sgds-form-border-width-thick) solid var(--sgds-border-color-emphasis);outline-offset:var(--sgds-form-outline-offset-focus)}.form-control-group:not(.disabled):not(.is-invalid):focus-within{outline:var(--sgds-form-outline-focus);outline-offset:var(--sgds-form-outline-offset-focus)}.form-control-container.disabled{opacity:var(--sgds-opacity-40)}.form-control-group.disabled{background-color:var(--sgds-form-surface-muted);cursor:not-allowed}.form-control-group.readonly{background-color:var(--sgds-form-surface-raised)}.form-control-group.is-invalid:not(.disabled){border:var(--sgds-form-border-width-default) solid var(--sgds-form-danger-border-color-default)}.form-control-group:not(.disabled).is-invalid:focus-within{outline:var(--sgds-border-width-2) solid var(--sgds-form-danger-color-default);outline-offset:var(--sgds-form-outline-offset-focus)}`;
4
+ var css_248z = css`.form-control-container{display:flex;flex-direction:column;gap:var(--sgds-form-gap-md)}.m-width-160{min-width:var(--sgds-dimension-160)}.m-width-256{min-width:var(--sgds-dimension-256)}.form-label{color:var(--sgds-form-color-default);font-size:var(--sgds-font-size-label-md);font-weight:var(--sgds-font-weight-semibold)}.form-control-group{align-items:center;background-color:var(--sgds-form-surface-default);border:var(--sgds-form-border-width-default) solid var(--sgds-border-color-default);border-radius:var(--input-border-radius,var(--sgds-form-border-radius-md));display:flex;gap:var(--sgds-form-gap-xl);height:var(--sgds-dimension-48);justify-content:center;overflow:hidden;padding:0 var(--sgds-form-padding-x);transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;width:-webkit-fill-available;width:-moz-available}.form-control{appearance:none;background-clip:padding-box;background:none;border:none;color:var(--sgds-form-color-default);display:block;flex-grow:1;font-family:var(--sgds-font-family-brand);font-size:var(--sgds-font-size-label-md);line-height:var(--sgds-line-height-xs);min-width:0;outline:none;padding:0;width:100%}.form-clearable{color:var(--sgds-color-subtle);cursor:pointer}@media (prefers-reduced-motion:reduce){.form-control-group{transition:none}}.form-control-group:not(.disabled):not(.is-invalid):not(.readonly):not(:focus-within):hover{outline:var(--sgds-form-border-width-thick) solid var(--sgds-border-color-emphasis);outline-offset:var(--sgds-form-outline-offset-focus)}.form-control-group:not(.disabled):not(.is-invalid):focus-within{outline:var(--sgds-form-outline-focus);outline-offset:var(--sgds-form-outline-offset-focus)}.form-control-container.disabled{opacity:var(--sgds-opacity-40)}.form-control-group.disabled{background-color:var(--sgds-form-surface-muted);cursor:not-allowed}.form-control-group.readonly{background-color:var(--sgds-form-surface-raised)}.form-control-group.is-invalid:not(.disabled){border:var(--sgds-form-border-width-default) solid var(--sgds-form-danger-border-color-default)}.form-control-group:not(.disabled).is-invalid:focus-within{outline:var(--sgds-border-width-2) solid var(--sgds-form-danger-color-default);outline-offset:var(--sgds-form-outline-offset-focus)}`;
5
5
 
6
6
  export { css_248z as default };
7
7
  //# sourceMappingURL=form-text-control.js.map
@@ -1,6 +1,6 @@
1
1
  import { css } from 'lit';
2
2
 
3
- var css_248z = css`.form-control-container{display:flex;flex-direction:column;gap:var(--sgds-form-gap-md)}.m-width-160{min-width:var(--sgds-dimension-160)}.m-width-256{min-width:var(--sgds-dimension-256)}.form-label{color:var(--sgds-form-color-default);font-size:var(--sgds-font-size-label-md);font-weight:var(--sgds-font-weight-semibold)}.form-control-group{align-items:center;background-color:var(--sgds-form-surface-default);border:var(--sgds-form-border-width-default) solid var(--sgds-border-color-default);border-radius:var(--input-border-radius,var(--sgds-form-border-radius-md));display:flex;gap:var(--sgds-form-gap-md);height:var(--sgds-dimension-48);justify-content:center;overflow:hidden;padding:0 var(--sgds-form-padding-x);transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;width:-webkit-fill-available;width:-moz-available}.form-control{appearance:none;background-clip:padding-box;background:none;border:none;color:var(--sgds-form-color-default);display:block;flex-grow:1;font-family:var(--sgds-font-family-brand);font-size:var(--sgds-font-size-label-md);line-height:var(--sgds-line-height-xs);min-width:0;outline:none;padding:0;width:100%}.form-clearable{color:var(--sgds-color-subtle);cursor:pointer}@media (prefers-reduced-motion:reduce){.form-control-group{transition:none}}.form-control-group:not(.disabled):not(.is-invalid):not(.readonly):not(:focus-within):hover{outline:var(--sgds-form-border-width-thick) solid var(--sgds-border-color-emphasis);outline-offset:var(--sgds-form-outline-offset-focus)}.form-control-group:not(.disabled):not(.is-invalid):focus-within{outline:var(--sgds-form-outline-focus);outline-offset:var(--sgds-form-outline-offset-focus)}.form-control-container.disabled{opacity:var(--sgds-opacity-40)}.form-control-group.disabled{background-color:var(--sgds-form-surface-muted);cursor:not-allowed}.form-control-group.readonly{background-color:var(--sgds-form-surface-raised)}.form-control-group.is-invalid:not(.disabled){border:var(--sgds-form-border-width-default) solid var(--sgds-form-danger-border-color-default)}.form-control-group:not(.disabled).is-invalid:focus-within{outline:var(--sgds-border-width-2) solid var(--sgds-form-danger-color-default);outline-offset:var(--sgds-form-outline-offset-focus)}`;
3
+ var css_248z = css`.form-control-container{display:flex;flex-direction:column;gap:var(--sgds-form-gap-md)}.m-width-160{min-width:var(--sgds-dimension-160)}.m-width-256{min-width:var(--sgds-dimension-256)}.form-label{color:var(--sgds-form-color-default);font-size:var(--sgds-font-size-label-md);font-weight:var(--sgds-font-weight-semibold)}.form-control-group{align-items:center;background-color:var(--sgds-form-surface-default);border:var(--sgds-form-border-width-default) solid var(--sgds-border-color-default);border-radius:var(--input-border-radius,var(--sgds-form-border-radius-md));display:flex;gap:var(--sgds-form-gap-xl);height:var(--sgds-dimension-48);justify-content:center;overflow:hidden;padding:0 var(--sgds-form-padding-x);transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;width:-webkit-fill-available;width:-moz-available}.form-control{appearance:none;background-clip:padding-box;background:none;border:none;color:var(--sgds-form-color-default);display:block;flex-grow:1;font-family:var(--sgds-font-family-brand);font-size:var(--sgds-font-size-label-md);line-height:var(--sgds-line-height-xs);min-width:0;outline:none;padding:0;width:100%}.form-clearable{color:var(--sgds-color-subtle);cursor:pointer}@media (prefers-reduced-motion:reduce){.form-control-group{transition:none}}.form-control-group:not(.disabled):not(.is-invalid):not(.readonly):not(:focus-within):hover{outline:var(--sgds-form-border-width-thick) solid var(--sgds-border-color-emphasis);outline-offset:var(--sgds-form-outline-offset-focus)}.form-control-group:not(.disabled):not(.is-invalid):focus-within{outline:var(--sgds-form-outline-focus);outline-offset:var(--sgds-form-outline-offset-focus)}.form-control-container.disabled{opacity:var(--sgds-opacity-40)}.form-control-group.disabled{background-color:var(--sgds-form-surface-muted);cursor:not-allowed}.form-control-group.readonly{background-color:var(--sgds-form-surface-raised)}.form-control-group.is-invalid:not(.disabled){border:var(--sgds-form-border-width-default) solid var(--sgds-form-danger-border-color-default)}.form-control-group:not(.disabled).is-invalid:focus-within{outline:var(--sgds-border-width-2) solid var(--sgds-form-danger-color-default);outline-offset:var(--sgds-form-outline-offset-focus)}`;
4
4
 
5
5
  export { css_248z as default };
6
6
  //# sourceMappingURL=form-text-control.js.map
package/types/react.d.ts CHANGED
@@ -800,27 +800,6 @@ export interface SgdsIconListProps extends SgdsBaseProps {
800
800
  size?: "sm" | "md" | "lg";
801
801
  }
802
802
 
803
- // ── ImageCard ─────────────────────────────────────────────────────────────
804
-
805
- export interface SgdsImageCardProps extends SgdsBaseProps {
806
- /** Removes the card's internal padding when set to true. */
807
- noPadding?: boolean;
808
- /** Sets the image position of the card. Available options: `before`, `after` */
809
- imagePosition?: CardImagePosition;
810
- /** Controls how the image is sized and aligned within the card. Available options: `default`, `padding around`, `aspect ratio` */
811
- imageAdjustment?: CardImageAdjustment;
812
- /** Extends the link passed in either `footer` or `link`(deprecated) slot. */
813
- stretchedLink?: boolean;
814
- /** Disables the card */
815
- disabled?: boolean;
816
- /** When true, hides the default border of the card. */
817
- hideBorder?: boolean;
818
- /** When true, applies a tinted background color to the card. */
819
- tinted?: boolean;
820
- /** Sets the orientation of the card. Available options: `vertical`, `horizontal` */
821
- orientation?: CardOrientation;
822
- }
823
-
824
803
  // ── Input ─────────────────────────────────────────────────────────────
825
804
 
826
805
  export interface SgdsInputProps extends SgdsBaseProps {
@@ -902,6 +881,27 @@ implied, allowing any numeric value. Only applies to number input types. */
902
881
  onSgdsValid?: SgdsEventHandler;
903
882
  }
904
883
 
884
+ // ── ImageCard ─────────────────────────────────────────────────────────────
885
+
886
+ export interface SgdsImageCardProps extends SgdsBaseProps {
887
+ /** Removes the card's internal padding when set to true. */
888
+ noPadding?: boolean;
889
+ /** Sets the image position of the card. Available options: `before`, `after` */
890
+ imagePosition?: CardImagePosition;
891
+ /** Controls how the image is sized and aligned within the card. Available options: `default`, `padding around`, `aspect ratio` */
892
+ imageAdjustment?: CardImageAdjustment;
893
+ /** Extends the link passed in either `footer` or `link`(deprecated) slot. */
894
+ stretchedLink?: boolean;
895
+ /** Disables the card */
896
+ disabled?: boolean;
897
+ /** When true, hides the default border of the card. */
898
+ hideBorder?: boolean;
899
+ /** When true, applies a tinted background color to the card. */
900
+ tinted?: boolean;
901
+ /** Sets the orientation of the card. Available options: `vertical`, `horizontal` */
902
+ orientation?: CardOrientation;
903
+ }
904
+
905
905
  // ── Link ─────────────────────────────────────────────────────────────
906
906
 
907
907
  export interface SgdsLinkProps extends SgdsBaseProps {
@@ -1745,8 +1745,8 @@ declare module "react" {
1745
1745
  "sgds-icon-button": React.DetailedHTMLProps<SgdsIconButtonProps, HTMLElement>;
1746
1746
  "sgds-icon-card": React.DetailedHTMLProps<SgdsIconCardProps, HTMLElement>;
1747
1747
  "sgds-icon-list": React.DetailedHTMLProps<SgdsIconListProps, HTMLElement>;
1748
- "sgds-image-card": React.DetailedHTMLProps<SgdsImageCardProps, HTMLElement>;
1749
1748
  "sgds-input": React.DetailedHTMLProps<SgdsInputProps, HTMLElement>;
1749
+ "sgds-image-card": React.DetailedHTMLProps<SgdsImageCardProps, HTMLElement>;
1750
1750
  "sgds-link": React.DetailedHTMLProps<SgdsLinkProps, HTMLElement>;
1751
1751
  "sgds-mainnav-dropdown": React.DetailedHTMLProps<SgdsMainnavDropdownProps, HTMLElement>;
1752
1752
  "sgds-mainnav-item": React.DetailedHTMLProps<SgdsMainnavItemProps, HTMLElement>;
@@ -1828,8 +1828,8 @@ declare global {
1828
1828
  "sgds-icon-button": HTMLElement;
1829
1829
  "sgds-icon-card": HTMLElement;
1830
1830
  "sgds-icon-list": HTMLElement;
1831
- "sgds-image-card": HTMLElement;
1832
1831
  "sgds-input": HTMLElement;
1832
+ "sgds-image-card": HTMLElement;
1833
1833
  "sgds-link": HTMLElement;
1834
1834
  "sgds-mainnav-dropdown": HTMLElement;
1835
1835
  "sgds-mainnav-item": HTMLElement;