@sebgroup/green-core-ng 2.37.4 → 3.1.0

package/generated/alert/alert.component.d.ts

@@ -31,6 +31,15 @@ export declare class GdsAlertComponent implements OnInit, OnChanges, AfterViewIn
     /** The text for the action button, if provided.
   If not set, no action button will be rendered. */
     buttonLabel?: GdsAlert['buttonLabel'];
+    /** Force the element to perform a synchronous first render and apply style expression properties in `connectedCallback`.
+  
+  This guarantees that the child DOM always remains projected in DOM, since the element will attach the shadowRoot and
+  run the first render pass in the same event loop cycle, and that declarative layout will be applied once slotted DOM
+  is projected.
+  
+  Note: This will cause the first render pass to be blocking. Use sparingly and only when necessary, such as when the
+  element needs to be measured synchronously after being added to the DOM. */
+    syncFirstRender?: GdsAlert['syncFirstRender'];
     /** Fired when alert is dismissed */
     gdsClose: EventEmitter<CustomEvent<any>>;
     /** Fired when action button is clicked */
@@ -39,6 +48,7 @@ export declare class GdsAlertComponent implements OnInit, OnChanges, AfterViewIn
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsAlertComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsAlertComponent, "gds-alert", never, { "variant": { "alias": "variant"; "required": false; }; "label": { "alias": "label"; "required": false; }; "role": { "alias": "role"; "required": false; }; "dismissible": { "alias": "dismissible"; "required": false; }; "timeout": { "alias": "timeout"; "required": false; }; "buttonLabel": { "alias": "buttonLabel"; "required": false; }; }, { "gdsClose": "gdsClose"; "gdsAction": "gdsAction"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GdsAlertComponent, "gds-alert", never, { "variant": { "alias": "variant"; "required": false; }; "label": { "alias": "label"; "required": false; }; "role": { "alias": "role"; "required": false; }; "dismissible": { "alias": "dismissible"; "required": false; }; "timeout": { "alias": "timeout"; "required": false; }; "buttonLabel": { "alias": "buttonLabel"; "required": false; }; "syncFirstRender": { "alias": "syncFirstRender"; "required": false; }; }, { "gdsClose": "gdsClose"; "gdsAction": "gdsAction"; }, never, ["*"], true, never>;
     static ngAcceptInputType_dismissible: unknown;
+    static ngAcceptInputType_syncFirstRender: unknown;
 }

package/generated/backdrop/backdrop.component.d.ts

@@ -12,10 +12,20 @@ export declare class GdsBackdropComponent implements OnInit, OnChanges, AfterVie
     get element(): GdsBackdrop;
     constructor();
     show?: GdsBackdrop['show'];
+    /** Force the element to perform a synchronous first render and apply style expression properties in `connectedCallback`.
+  
+  This guarantees that the child DOM always remains projected in DOM, since the element will attach the shadowRoot and
+  run the first render pass in the same event loop cycle, and that declarative layout will be applied once slotted DOM
+  is projected.
+  
+  Note: This will cause the first render pass to be blocking. Use sparingly and only when necessary, such as when the
+  element needs to be measured synchronously after being added to the DOM. */
+    syncFirstRender?: GdsBackdrop['syncFirstRender'];
     ngOnInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsBackdropComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsBackdropComponent, "gds-backdrop", never, { "show": { "alias": "show"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GdsBackdropComponent, "gds-backdrop", never, { "show": { "alias": "show"; "required": false; }; "syncFirstRender": { "alias": "syncFirstRender"; "required": false; }; }, {}, never, ["*"], true, never>;
     static ngAcceptInputType_show: unknown;
+    static ngAcceptInputType_syncFirstRender: unknown;
 }

package/generated/badge/badge.component.d.ts

@@ -69,13 +69,23 @@ export declare class GdsBadgeComponent implements OnInit, OnChanges, AfterViewIn
     /** Style Expression Property that controls the `order` property.
   Supports all valid CSS `order` values. */
     order?: GdsBadge['order'];
+    /** Force the element to perform a synchronous first render and apply style expression properties in `connectedCallback`.
+  
+  This guarantees that the child DOM always remains projected in DOM, since the element will attach the shadowRoot and
+  run the first render pass in the same event loop cycle, and that declarative layout will be applied once slotted DOM
+  is projected.
+  
+  Note: This will cause the first render pass to be blocking. Use sparingly and only when necessary, such as when the
+  element needs to be measured synchronously after being added to the DOM. */
+    syncFirstRender?: GdsBadge['syncFirstRender'];
     ngOnInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsBadgeComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsBadgeComponent, "gds-badge", never, { "variant": { "alias": "variant"; "required": false; }; "size": { "alias": "size"; "required": false; }; "notification": { "alias": "notification"; "required": false; }; "rounded": { "alias": "rounded"; "required": false; }; "mainSlotOccupied": { "alias": "mainSlotOccupied"; "required": false; }; "leadSlotOccupied": { "alias": "leadSlotOccupied"; "required": false; }; "width": { "alias": "width"; "required": false; }; "minWidth": { "alias": "minWidth"; "required": false; }; "maxWidth": { "alias": "maxWidth"; "required": false; }; "inlineSize": { "alias": "inlineSize"; "required": false; }; "minInlineSize": { "alias": "minInlineSize"; "required": false; }; "maxInlineSize": { "alias": "maxInlineSize"; "required": false; }; "margin": { "alias": "margin"; "required": false; }; "marginInline": { "alias": "marginInline"; "required": false; }; "marginBlock": { "alias": "marginBlock"; "required": false; }; "alignSelf": { "alias": "alignSelf"; "required": false; }; "justifySelf": { "alias": "justifySelf"; "required": false; }; "placeSelf": { "alias": "placeSelf"; "required": false; }; "gridColumn": { "alias": "gridColumn"; "required": false; }; "gridRow": { "alias": "gridRow"; "required": false; }; "gridArea": { "alias": "gridArea"; "required": false; }; "flex": { "alias": "flex"; "required": false; }; "order": { "alias": "order"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GdsBadgeComponent, "gds-badge", never, { "variant": { "alias": "variant"; "required": false; }; "size": { "alias": "size"; "required": false; }; "notification": { "alias": "notification"; "required": false; }; "rounded": { "alias": "rounded"; "required": false; }; "mainSlotOccupied": { "alias": "mainSlotOccupied"; "required": false; }; "leadSlotOccupied": { "alias": "leadSlotOccupied"; "required": false; }; "width": { "alias": "width"; "required": false; }; "minWidth": { "alias": "minWidth"; "required": false; }; "maxWidth": { "alias": "maxWidth"; "required": false; }; "inlineSize": { "alias": "inlineSize"; "required": false; }; "minInlineSize": { "alias": "minInlineSize"; "required": false; }; "maxInlineSize": { "alias": "maxInlineSize"; "required": false; }; "margin": { "alias": "margin"; "required": false; }; "marginInline": { "alias": "marginInline"; "required": false; }; "marginBlock": { "alias": "marginBlock"; "required": false; }; "alignSelf": { "alias": "alignSelf"; "required": false; }; "justifySelf": { "alias": "justifySelf"; "required": false; }; "placeSelf": { "alias": "placeSelf"; "required": false; }; "gridColumn": { "alias": "gridColumn"; "required": false; }; "gridRow": { "alias": "gridRow"; "required": false; }; "gridArea": { "alias": "gridArea"; "required": false; }; "flex": { "alias": "flex"; "required": false; }; "order": { "alias": "order"; "required": false; }; "syncFirstRender": { "alias": "syncFirstRender"; "required": false; }; }, {}, never, ["*"], true, never>;
     static ngAcceptInputType_notification: unknown;
     static ngAcceptInputType_rounded: unknown;
     static ngAcceptInputType_mainSlotOccupied: unknown;
     static ngAcceptInputType_leadSlotOccupied: unknown;
+    static ngAcceptInputType_syncFirstRender: unknown;
 }

package/generated/blur/blur.component.d.ts

@@ -1,17 +1,29 @@
-import { OnInit } from '@angular/core';
+import { OnInit, OnChanges, AfterViewInit, SimpleChanges } from '@angular/core';
 import { GdsBlur } from '@sebgroup/green-core/components/blur/blur.component.js';
 import * as i0 from "@angular/core";
 /**
  * Angular wrapper for the gds-blur web component
  *
  */
-export declare class GdsBlurComponent implements OnInit {
+export declare class GdsBlurComponent implements OnInit, OnChanges, AfterViewInit {
     private elementRef;
     private zone;
     private cdr;
     get element(): GdsBlur;
     constructor();
+    /** Force the element to perform a synchronous first render and apply style expression properties in `connectedCallback`.
+  
+  This guarantees that the child DOM always remains projected in DOM, since the element will attach the shadowRoot and
+  run the first render pass in the same event loop cycle, and that declarative layout will be applied once slotted DOM
+  is projected.
+  
+  Note: This will cause the first render pass to be blocking. Use sparingly and only when necessary, such as when the
+  element needs to be measured synchronously after being added to the DOM. */
+    syncFirstRender?: GdsBlur['syncFirstRender'];
     ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsBlurComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsBlurComponent, "gds-blur", never, {}, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GdsBlurComponent, "gds-blur", never, { "syncFirstRender": { "alias": "syncFirstRender"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ngAcceptInputType_syncFirstRender: unknown;
 }

package/generated/breadcrumb/breadcrumb.component.d.ts

@@ -27,6 +27,15 @@ export declare class GdsBreadcrumbComponent implements OnInit, OnChanges, AfterV
     label?: GdsBreadcrumb['label'];
     /** When true, the breadcrumb item will render as an overflow menu instead of a regular link. */
     overflow?: GdsBreadcrumb['overflow'];
+    /** Force the element to perform a synchronous first render and apply style expression properties in `connectedCallback`.
+  
+  This guarantees that the child DOM always remains projected in DOM, since the element will attach the shadowRoot and
+  run the first render pass in the same event loop cycle, and that declarative layout will be applied once slotted DOM
+  is projected.
+  
+  Note: This will cause the first render pass to be blocking. Use sparingly and only when necessary, such as when the
+  element needs to be measured synchronously after being added to the DOM. */
+    syncFirstRender?: GdsBreadcrumb['syncFirstRender'];
     /**
      * Prevent the browser from following the href when RouterLink handles
      * navigation. RouterLink calls Router.navigateByUrl() for all elements,
@@ -46,6 +55,7 @@ export declare class GdsBreadcrumbComponent implements OnInit, OnChanges, AfterV
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsBreadcrumbComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsBreadcrumbComponent, "gds-breadcrumb", never, { "href": { "alias": "href"; "required": false; }; "target": { "alias": "target"; "required": false; }; "rel": { "alias": "rel"; "required": false; }; "label": { "alias": "label"; "required": false; }; "overflow": { "alias": "overflow"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GdsBreadcrumbComponent, "gds-breadcrumb", never, { "href": { "alias": "href"; "required": false; }; "target": { "alias": "target"; "required": false; }; "rel": { "alias": "rel"; "required": false; }; "label": { "alias": "label"; "required": false; }; "overflow": { "alias": "overflow"; "required": false; }; "syncFirstRender": { "alias": "syncFirstRender"; "required": false; }; }, {}, never, ["*"], true, never>;
     static ngAcceptInputType_overflow: unknown;
+    static ngAcceptInputType_syncFirstRender: unknown;
 }

package/generated/breadcrumbs/breadcrumbs.component.d.ts

@@ -68,9 +68,19 @@ export declare class GdsBreadcrumbsComponent implements OnInit, OnChanges, After
     /** Style Expression Property that controls the `margin-block` property.
   Only accepts space tokens. */
     marginBlock?: GdsBreadcrumbs['margin-block'];
+    /** Force the element to perform a synchronous first render and apply style expression properties in `connectedCallback`.
+  
+  This guarantees that the child DOM always remains projected in DOM, since the element will attach the shadowRoot and
+  run the first render pass in the same event loop cycle, and that declarative layout will be applied once slotted DOM
+  is projected.
+  
+  Note: This will cause the first render pass to be blocking. Use sparingly and only when necessary, such as when the
+  element needs to be measured synchronously after being added to the DOM. */
+    syncFirstRender?: GdsBreadcrumbs['syncFirstRender'];
     ngOnInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsBreadcrumbsComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsBreadcrumbsComponent, "gds-breadcrumbs", never, { "size": { "alias": "size"; "required": false; }; "label": { "alias": "label"; "required": false; }; "alignSelf": { "alias": "alignSelf"; "required": false; }; "justifySelf": { "alias": "justifySelf"; "required": false; }; "placeSelf": { "alias": "placeSelf"; "required": false; }; "gridColumn": { "alias": "gridColumn"; "required": false; }; "gridRow": { "alias": "gridRow"; "required": false; }; "gridArea": { "alias": "gridArea"; "required": false; }; "flex": { "alias": "flex"; "required": false; }; "order": { "alias": "order"; "required": false; }; "width": { "alias": "width"; "required": false; }; "minWidth": { "alias": "minWidth"; "required": false; }; "maxWidth": { "alias": "maxWidth"; "required": false; }; "inlineSize": { "alias": "inlineSize"; "required": false; }; "minInlineSize": { "alias": "minInlineSize"; "required": false; }; "maxInlineSize": { "alias": "maxInlineSize"; "required": false; }; "margin": { "alias": "margin"; "required": false; }; "marginInline": { "alias": "marginInline"; "required": false; }; "marginBlock": { "alias": "marginBlock"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GdsBreadcrumbsComponent, "gds-breadcrumbs", never, { "size": { "alias": "size"; "required": false; }; "label": { "alias": "label"; "required": false; }; "alignSelf": { "alias": "alignSelf"; "required": false; }; "justifySelf": { "alias": "justifySelf"; "required": false; }; "placeSelf": { "alias": "placeSelf"; "required": false; }; "gridColumn": { "alias": "gridColumn"; "required": false; }; "gridRow": { "alias": "gridRow"; "required": false; }; "gridArea": { "alias": "gridArea"; "required": false; }; "flex": { "alias": "flex"; "required": false; }; "order": { "alias": "order"; "required": false; }; "width": { "alias": "width"; "required": false; }; "minWidth": { "alias": "minWidth"; "required": false; }; "maxWidth": { "alias": "maxWidth"; "required": false; }; "inlineSize": { "alias": "inlineSize"; "required": false; }; "minInlineSize": { "alias": "minInlineSize"; "required": false; }; "maxInlineSize": { "alias": "maxInlineSize"; "required": false; }; "margin": { "alias": "margin"; "required": false; }; "marginInline": { "alias": "marginInline"; "required": false; }; "marginBlock": { "alias": "marginBlock"; "required": false; }; "syncFirstRender": { "alias": "syncFirstRender"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ngAcceptInputType_syncFirstRender: unknown;
 }

package/generated/button/button.component.d.ts

@@ -100,6 +100,15 @@ export declare class GdsButtonComponent extends GdsFormControlBase {
     /** Get or set the value of the form control. */
     value?: GdsButton['value'];
     name?: GdsButton['name'];
+    /** Force the element to perform a synchronous first render and apply style expression properties in `connectedCallback`.
+  
+  This guarantees that the child DOM always remains projected in DOM, since the element will attach the shadowRoot and
+  run the first render pass in the same event loop cycle, and that declarative layout will be applied once slotted DOM
+  is projected.
+  
+  Note: This will cause the first render pass to be blocking. Use sparingly and only when necessary, such as when the
+  element needs to be measured synchronously after being added to the DOM. */
+    syncFirstRender?: GdsButton['syncFirstRender'];
     /** Fired when the button is clicked. */
     click: EventEmitter<MouseEvent>;
     /**
@@ -122,8 +131,9 @@ export declare class GdsButtonComponent extends GdsFormControlBase {
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsButtonComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsButtonComponent, "gds-button", never, { "width": { "alias": "width"; "required": false; }; "minWidth": { "alias": "minWidth"; "required": false; }; "maxWidth": { "alias": "maxWidth"; "required": false; }; "inlineSize": { "alias": "inlineSize"; "required": false; }; "minInlineSize": { "alias": "minInlineSize"; "required": false; }; "maxInlineSize": { "alias": "maxInlineSize"; "required": false; }; "margin": { "alias": "margin"; "required": false; }; "marginInline": { "alias": "marginInline"; "required": false; }; "marginBlock": { "alias": "marginBlock"; "required": false; }; "alignSelf": { "alias": "alignSelf"; "required": false; }; "justifySelf": { "alias": "justifySelf"; "required": false; }; "placeSelf": { "alias": "placeSelf"; "required": false; }; "gridColumn": { "alias": "gridColumn"; "required": false; }; "gridRow": { "alias": "gridRow"; "required": false; }; "gridArea": { "alias": "gridArea"; "required": false; }; "flex": { "alias": "flex"; "required": false; }; "order": { "alias": "order"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "justifyContent": { "alias": "justifyContent"; "required": false; }; "type": { "alias": "type"; "required": false; }; "rank": { "alias": "rank"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "size": { "alias": "size"; "required": false; }; "label": { "alias": "label"; "required": false; }; "wrapped": { "alias": "wrapped"; "required": false; }; "href": { "alias": "href"; "required": false; }; "target": { "alias": "target"; "required": false; }; "rel": { "alias": "rel"; "required": false; }; "download": { "alias": "download"; "required": false; }; "validator": { "alias": "validator"; "required": false; }; "required": { "alias": "required"; "required": false; }; "errorMessage": { "alias": "errorMessage"; "required": false; }; "invalid": { "alias": "invalid"; "required": false; }; "value": { "alias": "value"; "required": false; }; "name": { "alias": "name"; "required": false; }; }, { "click": "click"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GdsButtonComponent, "gds-button", never, { "width": { "alias": "width"; "required": false; }; "minWidth": { "alias": "minWidth"; "required": false; }; "maxWidth": { "alias": "maxWidth"; "required": false; }; "inlineSize": { "alias": "inlineSize"; "required": false; }; "minInlineSize": { "alias": "minInlineSize"; "required": false; }; "maxInlineSize": { "alias": "maxInlineSize"; "required": false; }; "margin": { "alias": "margin"; "required": false; }; "marginInline": { "alias": "marginInline"; "required": false; }; "marginBlock": { "alias": "marginBlock"; "required": false; }; "alignSelf": { "alias": "alignSelf"; "required": false; }; "justifySelf": { "alias": "justifySelf"; "required": false; }; "placeSelf": { "alias": "placeSelf"; "required": false; }; "gridColumn": { "alias": "gridColumn"; "required": false; }; "gridRow": { "alias": "gridRow"; "required": false; }; "gridArea": { "alias": "gridArea"; "required": false; }; "flex": { "alias": "flex"; "required": false; }; "order": { "alias": "order"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "justifyContent": { "alias": "justifyContent"; "required": false; }; "type": { "alias": "type"; "required": false; }; "rank": { "alias": "rank"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "size": { "alias": "size"; "required": false; }; "label": { "alias": "label"; "required": false; }; "wrapped": { "alias": "wrapped"; "required": false; }; "href": { "alias": "href"; "required": false; }; "target": { "alias": "target"; "required": false; }; "rel": { "alias": "rel"; "required": false; }; "download": { "alias": "download"; "required": false; }; "validator": { "alias": "validator"; "required": false; }; "required": { "alias": "required"; "required": false; }; "errorMessage": { "alias": "errorMessage"; "required": false; }; "invalid": { "alias": "invalid"; "required": false; }; "value": { "alias": "value"; "required": false; }; "name": { "alias": "name"; "required": false; }; "syncFirstRender": { "alias": "syncFirstRender"; "required": false; }; }, { "click": "click"; }, never, ["*"], true, never>;
     static ngAcceptInputType_disabled: unknown;
     static ngAcceptInputType_wrapped: unknown;
     static ngAcceptInputType_required: unknown;
+    static ngAcceptInputType_syncFirstRender: unknown;
 }

package/generated/calendar/calendar.component.d.ts

@@ -42,6 +42,15 @@ export declare class GdsCalendarComponent implements OnInit, OnChanges, AfterVie
     label?: GdsCalendar['label'];
     /** A template function to customize the accessible date label. */
     dateLabelTemplate?: GdsCalendar['dateLabelTemplate'];
+    /** Force the element to perform a synchronous first render and apply style expression properties in `connectedCallback`.
+  
+  This guarantees that the child DOM always remains projected in DOM, since the element will attach the shadowRoot and
+  run the first render pass in the same event loop cycle, and that declarative layout will be applied once slotted DOM
+  is projected.
+  
+  Note: This will cause the first render pass to be blocking. Use sparingly and only when necessary, such as when the
+  element needs to be measured synchronously after being added to the DOM. */
+    syncFirstRender?: GdsCalendar['syncFirstRender'];
     /** Fired when a date is selected. */
     change: EventEmitter<Event>;
     /** Fired when focus is changed. Can be cancelled using `event.preventDefault()`. */
@@ -50,9 +59,10 @@ export declare class GdsCalendarComponent implements OnInit, OnChanges, AfterVie
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsCalendarComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsCalendarComponent, "gds-calendar", never, { "value": { "alias": "value"; "required": false; }; "min": { "alias": "min"; "required": false; }; "max": { "alias": "max"; "required": false; }; "focusedDate": { "alias": "focusedDate"; "required": false; }; "disabledWeekends": { "alias": "disabledWeekends"; "required": false; }; "disabledDates": { "alias": "disabledDates"; "required": false; }; "focusedMonth": { "alias": "focusedMonth"; "required": false; }; "focusedYear": { "alias": "focusedYear"; "required": false; }; "size": { "alias": "size"; "required": false; }; "showWeekNumbers": { "alias": "showWeekNumbers"; "required": false; }; "hideExtraneousDays": { "alias": "hideExtraneousDays"; "required": false; }; "hideDayNames": { "alias": "hideDayNames"; "required": false; }; "customizedDates": { "alias": "customizedDates"; "required": false; }; "label": { "alias": "label"; "required": false; }; "dateLabelTemplate": { "alias": "dateLabelTemplate"; "required": false; }; }, { "change": "change"; "gdsDateFocused": "gdsDateFocused"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GdsCalendarComponent, "gds-calendar", never, { "value": { "alias": "value"; "required": false; }; "min": { "alias": "min"; "required": false; }; "max": { "alias": "max"; "required": false; }; "focusedDate": { "alias": "focusedDate"; "required": false; }; "disabledWeekends": { "alias": "disabledWeekends"; "required": false; }; "disabledDates": { "alias": "disabledDates"; "required": false; }; "focusedMonth": { "alias": "focusedMonth"; "required": false; }; "focusedYear": { "alias": "focusedYear"; "required": false; }; "size": { "alias": "size"; "required": false; }; "showWeekNumbers": { "alias": "showWeekNumbers"; "required": false; }; "hideExtraneousDays": { "alias": "hideExtraneousDays"; "required": false; }; "hideDayNames": { "alias": "hideDayNames"; "required": false; }; "customizedDates": { "alias": "customizedDates"; "required": false; }; "label": { "alias": "label"; "required": false; }; "dateLabelTemplate": { "alias": "dateLabelTemplate"; "required": false; }; "syncFirstRender": { "alias": "syncFirstRender"; "required": false; }; }, { "change": "change"; "gdsDateFocused": "gdsDateFocused"; }, never, ["*"], true, never>;
     static ngAcceptInputType_disabledWeekends: unknown;
     static ngAcceptInputType_showWeekNumbers: unknown;
     static ngAcceptInputType_hideExtraneousDays: unknown;
     static ngAcceptInputType_hideDayNames: unknown;
+    static ngAcceptInputType_syncFirstRender: unknown;
 }

package/generated/card/card.component.d.ts

@@ -6,7 +6,7 @@ import * as i0 from "@angular/core";
  * A container for content representing a single entity. e.g. a contact, article, or task.
 
 `gds-card` inherits all properties from `gds-div`, but comes with some predefined defaults
-and a shortcut property for specifiying different card variants.
+and a shortcut property for specifying different card variants.
  */
 export declare class GdsCardComponent implements OnInit, OnChanges, AfterViewInit {
     private elementRef;
@@ -14,11 +14,6 @@ export declare class GdsCardComponent implements OnInit, OnChanges, AfterViewIni
     private cdr;
     get element(): GdsCard;
     constructor();
-    /** Shortcut for setting the border, background and text color of the card to the specified color variant, such as 'primary', 'secondary', 'tertiary', etc.
-  
-  You can find all available variants in the L2 section of the [Color System documentation page](./?path=/docs/style-colors--docs)
-  
-  Supports Style Expression syntax for setting the value responsively. */
     variant?: GdsCard['variant'];
     /** Style Expression Property that controls the `padding` property.
   Only accepts space tokens. */
@@ -227,9 +222,19 @@ export declare class GdsCardComponent implements OnInit, OnChanges, AfterViewIni
     /** Style Expression Property that controls the `pointer-events` property.
   Supports all valid CSS `pointer-events` values. */
     pointerEvents?: GdsCard['pointer-events'];
+    /** Force the element to perform a synchronous first render and apply style expression properties in `connectedCallback`.
+  
+  This guarantees that the child DOM always remains projected in DOM, since the element will attach the shadowRoot and
+  run the first render pass in the same event loop cycle, and that declarative layout will be applied once slotted DOM
+  is projected.
+  
+  Note: This will cause the first render pass to be blocking. Use sparingly and only when necessary, such as when the
+  element needs to be measured synchronously after being added to the DOM. */
+    syncFirstRender?: GdsCard['syncFirstRender'];
     ngOnInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsCardComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsCardComponent, "gds-card", never, { "variant": { "alias": "variant"; "required": false; }; "padding": { "alias": "padding"; "required": false; }; "width": { "alias": "width"; "required": false; }; "minWidth": { "alias": "minWidth"; "required": false; }; "maxWidth": { "alias": "maxWidth"; "required": false; }; "inlineSize": { "alias": "inlineSize"; "required": false; }; "minInlineSize": { "alias": "minInlineSize"; "required": false; }; "maxInlineSize": { "alias": "maxInlineSize"; "required": false; }; "height": { "alias": "height"; "required": false; }; "minHeight": { "alias": "minHeight"; "required": false; }; "maxHeight": { "alias": "maxHeight"; "required": false; }; "blockSize": { "alias": "blockSize"; "required": false; }; "minBlockSize": { "alias": "minBlockSize"; "required": false; }; "maxBlockSize": { "alias": "maxBlockSize"; "required": false; }; "margin": { "alias": "margin"; "required": false; }; "marginInline": { "alias": "marginInline"; "required": false; }; "marginBlock": { "alias": "marginBlock"; "required": false; }; "paddingInline": { "alias": "paddingInline"; "required": false; }; "paddingBlock": { "alias": "paddingBlock"; "required": false; }; "alignSelf": { "alias": "alignSelf"; "required": false; }; "justifySelf": { "alias": "justifySelf"; "required": false; }; "placeSelf": { "alias": "placeSelf"; "required": false; }; "gridColumn": { "alias": "gridColumn"; "required": false; }; "gridRow": { "alias": "gridRow"; "required": false; }; "gridArea": { "alias": "gridArea"; "required": false; }; "flex": { "alias": "flex"; "required": false; }; "order": { "alias": "order"; "required": false; }; "position": { "alias": "position"; "required": false; }; "transform": { "alias": "transform"; "required": false; }; "inset": { "alias": "inset"; "required": false; }; "display": { "alias": "display"; "required": false; }; "level": { "alias": "level"; "required": false; }; "color": { "alias": "color"; "required": false; }; "background": { "alias": "background"; "required": false; }; "border": { "alias": "border"; "required": false; }; "borderColor": { "alias": "borderColor"; "required": false; }; "borderWidth": { "alias": "borderWidth"; "required": false; }; "borderStyle": { "alias": "borderStyle"; "required": false; }; "borderRadius": { "alias": "borderRadius"; "required": false; }; "boxShadow": { "alias": "boxShadow"; "required": false; }; "opacity": { "alias": "opacity"; "required": false; }; "overflow": { "alias": "overflow"; "required": false; }; "boxSizing": { "alias": "boxSizing"; "required": false; }; "zIndex": { "alias": "zIndex"; "required": false; }; "font": { "alias": "font"; "required": false; }; "fontWeight": { "alias": "fontWeight"; "required": false; }; "textAlign": { "alias": "textAlign"; "required": false; }; "textWrap": { "alias": "textWrap"; "required": false; }; "overflowWrap": { "alias": "overflowWrap"; "required": false; }; "whiteSpace": { "alias": "whiteSpace"; "required": false; }; "gap": { "alias": "gap"; "required": false; }; "alignItems": { "alias": "alignItems"; "required": false; }; "alignContent": { "alias": "alignContent"; "required": false; }; "justifyContent": { "alias": "justifyContent"; "required": false; }; "justifyItems": { "alias": "justifyItems"; "required": false; }; "flexDirection": { "alias": "flexDirection"; "required": false; }; "flexWrap": { "alias": "flexWrap"; "required": false; }; "placeItems": { "alias": "placeItems"; "required": false; }; "placeContent": { "alias": "placeContent"; "required": false; }; "aspectRatio": { "alias": "aspectRatio"; "required": false; }; "cursor": { "alias": "cursor"; "required": false; }; "pointerEvents": { "alias": "pointerEvents"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GdsCardComponent, "gds-card", never, { "variant": { "alias": "variant"; "required": false; }; "padding": { "alias": "padding"; "required": false; }; "width": { "alias": "width"; "required": false; }; "minWidth": { "alias": "minWidth"; "required": false; }; "maxWidth": { "alias": "maxWidth"; "required": false; }; "inlineSize": { "alias": "inlineSize"; "required": false; }; "minInlineSize": { "alias": "minInlineSize"; "required": false; }; "maxInlineSize": { "alias": "maxInlineSize"; "required": false; }; "height": { "alias": "height"; "required": false; }; "minHeight": { "alias": "minHeight"; "required": false; }; "maxHeight": { "alias": "maxHeight"; "required": false; }; "blockSize": { "alias": "blockSize"; "required": false; }; "minBlockSize": { "alias": "minBlockSize"; "required": false; }; "maxBlockSize": { "alias": "maxBlockSize"; "required": false; }; "margin": { "alias": "margin"; "required": false; }; "marginInline": { "alias": "marginInline"; "required": false; }; "marginBlock": { "alias": "marginBlock"; "required": false; }; "paddingInline": { "alias": "paddingInline"; "required": false; }; "paddingBlock": { "alias": "paddingBlock"; "required": false; }; "alignSelf": { "alias": "alignSelf"; "required": false; }; "justifySelf": { "alias": "justifySelf"; "required": false; }; "placeSelf": { "alias": "placeSelf"; "required": false; }; "gridColumn": { "alias": "gridColumn"; "required": false; }; "gridRow": { "alias": "gridRow"; "required": false; }; "gridArea": { "alias": "gridArea"; "required": false; }; "flex": { "alias": "flex"; "required": false; }; "order": { "alias": "order"; "required": false; }; "position": { "alias": "position"; "required": false; }; "transform": { "alias": "transform"; "required": false; }; "inset": { "alias": "inset"; "required": false; }; "display": { "alias": "display"; "required": false; }; "level": { "alias": "level"; "required": false; }; "color": { "alias": "color"; "required": false; }; "background": { "alias": "background"; "required": false; }; "border": { "alias": "border"; "required": false; }; "borderColor": { "alias": "borderColor"; "required": false; }; "borderWidth": { "alias": "borderWidth"; "required": false; }; "borderStyle": { "alias": "borderStyle"; "required": false; }; "borderRadius": { "alias": "borderRadius"; "required": false; }; "boxShadow": { "alias": "boxShadow"; "required": false; }; "opacity": { "alias": "opacity"; "required": false; }; "overflow": { "alias": "overflow"; "required": false; }; "boxSizing": { "alias": "boxSizing"; "required": false; }; "zIndex": { "alias": "zIndex"; "required": false; }; "font": { "alias": "font"; "required": false; }; "fontWeight": { "alias": "fontWeight"; "required": false; }; "textAlign": { "alias": "textAlign"; "required": false; }; "textWrap": { "alias": "textWrap"; "required": false; }; "overflowWrap": { "alias": "overflowWrap"; "required": false; }; "whiteSpace": { "alias": "whiteSpace"; "required": false; }; "gap": { "alias": "gap"; "required": false; }; "alignItems": { "alias": "alignItems"; "required": false; }; "alignContent": { "alias": "alignContent"; "required": false; }; "justifyContent": { "alias": "justifyContent"; "required": false; }; "justifyItems": { "alias": "justifyItems"; "required": false; }; "flexDirection": { "alias": "flexDirection"; "required": false; }; "flexWrap": { "alias": "flexWrap"; "required": false; }; "placeItems": { "alias": "placeItems"; "required": false; }; "placeContent": { "alias": "placeContent"; "required": false; }; "aspectRatio": { "alias": "aspectRatio"; "required": false; }; "cursor": { "alias": "cursor"; "required": false; }; "pointerEvents": { "alias": "pointerEvents"; "required": false; }; "syncFirstRender": { "alias": "syncFirstRender"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ngAcceptInputType_syncFirstRender: unknown;
 }

package/generated/card/index.d.ts

@@ -3,7 +3,7 @@
  * A container for content representing a single entity. e.g. a contact, article, or task.
 
 `gds-card` inherits all properties from `gds-div`, but comes with some predefined defaults
-and a shortcut property for specifiying different card variants.
+and a shortcut property for specifying different card variants.
  *
  * Auto-generated from Custom Elements Manifest
  */

package/generated/card-linked/card-linked.component.d.ts

@@ -30,11 +30,6 @@ export declare class GdsCardLinkedComponent implements OnInit, OnChanges, AfterV
     /** Specifies a space-separated list of URLs to which, when the link is followed,
   POST requests with the body ping will be sent by the browser. */
     ping?: GdsCardLinked['ping'];
-    /** Shortcut for setting the border, background and text color of the card to the specified color variant, such as 'primary', 'secondary', 'tertiary', etc.
-  
-  You can find all available variants in the L2 section of the [Color System documentation page](./?path=/docs/style-colors--docs)
-  
-  Supports Style Expression syntax for setting the value responsively. */
     variant?: GdsCardLinked['variant'];
     /** Style Expression Property that controls the `padding` property.
   Only accepts space tokens. */
@@ -243,6 +238,15 @@ export declare class GdsCardLinkedComponent implements OnInit, OnChanges, AfterV
     /** Style Expression Property that controls the `pointer-events` property.
   Supports all valid CSS `pointer-events` values. */
     pointerEvents?: GdsCardLinked['pointer-events'];
+    /** Force the element to perform a synchronous first render and apply style expression properties in `connectedCallback`.
+  
+  This guarantees that the child DOM always remains projected in DOM, since the element will attach the shadowRoot and
+  run the first render pass in the same event loop cycle, and that declarative layout will be applied once slotted DOM
+  is projected.
+  
+  Note: This will cause the first render pass to be blocking. Use sparingly and only when necessary, such as when the
+  element needs to be measured synchronously after being added to the DOM. */
+    syncFirstRender?: GdsCardLinked['syncFirstRender'];
     /**
      * Prevent the browser from following the href when RouterLink handles
      * navigation. RouterLink calls Router.navigateByUrl() for all elements,
@@ -262,5 +266,6 @@ export declare class GdsCardLinkedComponent implements OnInit, OnChanges, AfterV
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsCardLinkedComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsCardLinkedComponent, "gds-card-linked", never, { "href": { "alias": "href"; "required": false; }; "target": { "alias": "target"; "required": false; }; "rel": { "alias": "rel"; "required": false; }; "download": { "alias": "download"; "required": false; }; "ping": { "alias": "ping"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "padding": { "alias": "padding"; "required": false; }; "width": { "alias": "width"; "required": false; }; "minWidth": { "alias": "minWidth"; "required": false; }; "maxWidth": { "alias": "maxWidth"; "required": false; }; "inlineSize": { "alias": "inlineSize"; "required": false; }; "minInlineSize": { "alias": "minInlineSize"; "required": false; }; "maxInlineSize": { "alias": "maxInlineSize"; "required": false; }; "height": { "alias": "height"; "required": false; }; "minHeight": { "alias": "minHeight"; "required": false; }; "maxHeight": { "alias": "maxHeight"; "required": false; }; "blockSize": { "alias": "blockSize"; "required": false; }; "minBlockSize": { "alias": "minBlockSize"; "required": false; }; "maxBlockSize": { "alias": "maxBlockSize"; "required": false; }; "margin": { "alias": "margin"; "required": false; }; "marginInline": { "alias": "marginInline"; "required": false; }; "marginBlock": { "alias": "marginBlock"; "required": false; }; "paddingInline": { "alias": "paddingInline"; "required": false; }; "paddingBlock": { "alias": "paddingBlock"; "required": false; }; "alignSelf": { "alias": "alignSelf"; "required": false; }; "justifySelf": { "alias": "justifySelf"; "required": false; }; "placeSelf": { "alias": "placeSelf"; "required": false; }; "gridColumn": { "alias": "gridColumn"; "required": false; }; "gridRow": { "alias": "gridRow"; "required": false; }; "gridArea": { "alias": "gridArea"; "required": false; }; "flex": { "alias": "flex"; "required": false; }; "order": { "alias": "order"; "required": false; }; "position": { "alias": "position"; "required": false; }; "transform": { "alias": "transform"; "required": false; }; "inset": { "alias": "inset"; "required": false; }; "display": { "alias": "display"; "required": false; }; "level": { "alias": "level"; "required": false; }; "color": { "alias": "color"; "required": false; }; "background": { "alias": "background"; "required": false; }; "border": { "alias": "border"; "required": false; }; "borderColor": { "alias": "borderColor"; "required": false; }; "borderWidth": { "alias": "borderWidth"; "required": false; }; "borderStyle": { "alias": "borderStyle"; "required": false; }; "borderRadius": { "alias": "borderRadius"; "required": false; }; "boxShadow": { "alias": "boxShadow"; "required": false; }; "opacity": { "alias": "opacity"; "required": false; }; "overflow": { "alias": "overflow"; "required": false; }; "boxSizing": { "alias": "boxSizing"; "required": false; }; "zIndex": { "alias": "zIndex"; "required": false; }; "font": { "alias": "font"; "required": false; }; "fontWeight": { "alias": "fontWeight"; "required": false; }; "textAlign": { "alias": "textAlign"; "required": false; }; "textWrap": { "alias": "textWrap"; "required": false; }; "overflowWrap": { "alias": "overflowWrap"; "required": false; }; "whiteSpace": { "alias": "whiteSpace"; "required": false; }; "gap": { "alias": "gap"; "required": false; }; "alignItems": { "alias": "alignItems"; "required": false; }; "alignContent": { "alias": "alignContent"; "required": false; }; "justifyContent": { "alias": "justifyContent"; "required": false; }; "justifyItems": { "alias": "justifyItems"; "required": false; }; "flexDirection": { "alias": "flexDirection"; "required": false; }; "flexWrap": { "alias": "flexWrap"; "required": false; }; "placeItems": { "alias": "placeItems"; "required": false; }; "placeContent": { "alias": "placeContent"; "required": false; }; "aspectRatio": { "alias": "aspectRatio"; "required": false; }; "cursor": { "alias": "cursor"; "required": false; }; "pointerEvents": { "alias": "pointerEvents"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GdsCardLinkedComponent, "gds-card-linked", never, { "href": { "alias": "href"; "required": false; }; "target": { "alias": "target"; "required": false; }; "rel": { "alias": "rel"; "required": false; }; "download": { "alias": "download"; "required": false; }; "ping": { "alias": "ping"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "padding": { "alias": "padding"; "required": false; }; "width": { "alias": "width"; "required": false; }; "minWidth": { "alias": "minWidth"; "required": false; }; "maxWidth": { "alias": "maxWidth"; "required": false; }; "inlineSize": { "alias": "inlineSize"; "required": false; }; "minInlineSize": { "alias": "minInlineSize"; "required": false; }; "maxInlineSize": { "alias": "maxInlineSize"; "required": false; }; "height": { "alias": "height"; "required": false; }; "minHeight": { "alias": "minHeight"; "required": false; }; "maxHeight": { "alias": "maxHeight"; "required": false; }; "blockSize": { "alias": "blockSize"; "required": false; }; "minBlockSize": { "alias": "minBlockSize"; "required": false; }; "maxBlockSize": { "alias": "maxBlockSize"; "required": false; }; "margin": { "alias": "margin"; "required": false; }; "marginInline": { "alias": "marginInline"; "required": false; }; "marginBlock": { "alias": "marginBlock"; "required": false; }; "paddingInline": { "alias": "paddingInline"; "required": false; }; "paddingBlock": { "alias": "paddingBlock"; "required": false; }; "alignSelf": { "alias": "alignSelf"; "required": false; }; "justifySelf": { "alias": "justifySelf"; "required": false; }; "placeSelf": { "alias": "placeSelf"; "required": false; }; "gridColumn": { "alias": "gridColumn"; "required": false; }; "gridRow": { "alias": "gridRow"; "required": false; }; "gridArea": { "alias": "gridArea"; "required": false; }; "flex": { "alias": "flex"; "required": false; }; "order": { "alias": "order"; "required": false; }; "position": { "alias": "position"; "required": false; }; "transform": { "alias": "transform"; "required": false; }; "inset": { "alias": "inset"; "required": false; }; "display": { "alias": "display"; "required": false; }; "level": { "alias": "level"; "required": false; }; "color": { "alias": "color"; "required": false; }; "background": { "alias": "background"; "required": false; }; "border": { "alias": "border"; "required": false; }; "borderColor": { "alias": "borderColor"; "required": false; }; "borderWidth": { "alias": "borderWidth"; "required": false; }; "borderStyle": { "alias": "borderStyle"; "required": false; }; "borderRadius": { "alias": "borderRadius"; "required": false; }; "boxShadow": { "alias": "boxShadow"; "required": false; }; "opacity": { "alias": "opacity"; "required": false; }; "overflow": { "alias": "overflow"; "required": false; }; "boxSizing": { "alias": "boxSizing"; "required": false; }; "zIndex": { "alias": "zIndex"; "required": false; }; "font": { "alias": "font"; "required": false; }; "fontWeight": { "alias": "fontWeight"; "required": false; }; "textAlign": { "alias": "textAlign"; "required": false; }; "textWrap": { "alias": "textWrap"; "required": false; }; "overflowWrap": { "alias": "overflowWrap"; "required": false; }; "whiteSpace": { "alias": "whiteSpace"; "required": false; }; "gap": { "alias": "gap"; "required": false; }; "alignItems": { "alias": "alignItems"; "required": false; }; "alignContent": { "alias": "alignContent"; "required": false; }; "justifyContent": { "alias": "justifyContent"; "required": false; }; "justifyItems": { "alias": "justifyItems"; "required": false; }; "flexDirection": { "alias": "flexDirection"; "required": false; }; "flexWrap": { "alias": "flexWrap"; "required": false; }; "placeItems": { "alias": "placeItems"; "required": false; }; "placeContent": { "alias": "placeContent"; "required": false; }; "aspectRatio": { "alias": "aspectRatio"; "required": false; }; "cursor": { "alias": "cursor"; "required": false; }; "pointerEvents": { "alias": "pointerEvents"; "required": false; }; "syncFirstRender": { "alias": "syncFirstRender"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ngAcceptInputType_syncFirstRender: unknown;
 }

package/generated/card-pattern-01/card-pattern-01.component.d.ts

@@ -25,9 +25,6 @@ export declare class GdsCardPattern01Component implements OnInit, OnChanges, Aft
     label?: GdsCardPattern01['label'];
     /** Card background variant */
     variant?: GdsCardPattern01['variant'];
-    /** Enables border styling
-  Designed to work with neutral-02 variant */
-    outlined?: GdsCardPattern01['outlined'];
     /** HTML tag for the card title
   Controls heading level for accessibility */
     tag?: GdsCardPattern01['tag'];
@@ -123,6 +120,15 @@ export declare class GdsCardPattern01Component implements OnInit, OnChanges, Aft
     loading?: GdsCardPattern01['loading'];
     /** Decoding strategy for the image */
     decoding?: GdsCardPattern01['decoding'];
+    /** Force the element to perform a synchronous first render and apply style expression properties in `connectedCallback`.
+  
+  This guarantees that the child DOM always remains projected in DOM, since the element will attach the shadowRoot and
+  run the first render pass in the same event loop cycle, and that declarative layout will be applied once slotted DOM
+  is projected.
+  
+  Note: This will cause the first render pass to be blocking. Use sparingly and only when necessary, such as when the
+  element needs to be measured synchronously after being added to the DOM. */
+    syncFirstRender?: GdsCardPattern01['syncFirstRender'];
     /**
      * Prevent the browser from following the href when RouterLink handles
      * navigation. RouterLink calls Router.navigateByUrl() for all elements,
@@ -142,6 +148,6 @@ export declare class GdsCardPattern01Component implements OnInit, OnChanges, Aft
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsCardPattern01Component, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsCardPattern01Component, "gds-card-pattern-01", never, { "title": { "alias": "title"; "required": false; }; "excerpt": { "alias": "excerpt"; "required": false; }; "label": { "alias": "label"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "outlined": { "alias": "outlined"; "required": false; }; "tag": { "alias": "tag"; "required": false; }; "ratio": { "alias": "ratio"; "required": false; }; "category": { "alias": "category"; "required": false; }; "date": { "alias": "date"; "required": false; }; "dateFormat": { "alias": "dateFormat"; "required": false; }; "locale": { "alias": "locale"; "required": false; }; "width": { "alias": "width"; "required": false; }; "minWidth": { "alias": "minWidth"; "required": false; }; "maxWidth": { "alias": "maxWidth"; "required": false; }; "inlineSize": { "alias": "inlineSize"; "required": false; }; "minInlineSize": { "alias": "minInlineSize"; "required": false; }; "maxInlineSize": { "alias": "maxInlineSize"; "required": false; }; "margin": { "alias": "margin"; "required": false; }; "marginInline": { "alias": "marginInline"; "required": false; }; "marginBlock": { "alias": "marginBlock"; "required": false; }; "alignSelf": { "alias": "alignSelf"; "required": false; }; "justifySelf": { "alias": "justifySelf"; "required": false; }; "placeSelf": { "alias": "placeSelf"; "required": false; }; "gridColumn": { "alias": "gridColumn"; "required": false; }; "gridRow": { "alias": "gridRow"; "required": false; }; "gridArea": { "alias": "gridArea"; "required": false; }; "flex": { "alias": "flex"; "required": false; }; "order": { "alias": "order"; "required": false; }; "href": { "alias": "href"; "required": false; }; "target": { "alias": "target"; "required": false; }; "rel": { "alias": "rel"; "required": false; }; "download": { "alias": "download"; "required": false; }; "ping": { "alias": "ping"; "required": false; }; "src": { "alias": "src"; "required": false; }; "srcset": { "alias": "srcset"; "required": false; }; "sizes": { "alias": "sizes"; "required": false; }; "alt": { "alias": "alt"; "required": false; }; "loading": { "alias": "loading"; "required": false; }; "decoding": { "alias": "decoding"; "required": false; }; }, {}, never, ["*"], true, never>;
-    static ngAcceptInputType_outlined: unknown;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GdsCardPattern01Component, "gds-card-pattern-01", never, { "title": { "alias": "title"; "required": false; }; "excerpt": { "alias": "excerpt"; "required": false; }; "label": { "alias": "label"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "tag": { "alias": "tag"; "required": false; }; "ratio": { "alias": "ratio"; "required": false; }; "category": { "alias": "category"; "required": false; }; "date": { "alias": "date"; "required": false; }; "dateFormat": { "alias": "dateFormat"; "required": false; }; "locale": { "alias": "locale"; "required": false; }; "width": { "alias": "width"; "required": false; }; "minWidth": { "alias": "minWidth"; "required": false; }; "maxWidth": { "alias": "maxWidth"; "required": false; }; "inlineSize": { "alias": "inlineSize"; "required": false; }; "minInlineSize": { "alias": "minInlineSize"; "required": false; }; "maxInlineSize": { "alias": "maxInlineSize"; "required": false; }; "margin": { "alias": "margin"; "required": false; }; "marginInline": { "alias": "marginInline"; "required": false; }; "marginBlock": { "alias": "marginBlock"; "required": false; }; "alignSelf": { "alias": "alignSelf"; "required": false; }; "justifySelf": { "alias": "justifySelf"; "required": false; }; "placeSelf": { "alias": "placeSelf"; "required": false; }; "gridColumn": { "alias": "gridColumn"; "required": false; }; "gridRow": { "alias": "gridRow"; "required": false; }; "gridArea": { "alias": "gridArea"; "required": false; }; "flex": { "alias": "flex"; "required": false; }; "order": { "alias": "order"; "required": false; }; "href": { "alias": "href"; "required": false; }; "target": { "alias": "target"; "required": false; }; "rel": { "alias": "rel"; "required": false; }; "download": { "alias": "download"; "required": false; }; "ping": { "alias": "ping"; "required": false; }; "src": { "alias": "src"; "required": false; }; "srcset": { "alias": "srcset"; "required": false; }; "sizes": { "alias": "sizes"; "required": false; }; "alt": { "alias": "alt"; "required": false; }; "loading": { "alias": "loading"; "required": false; }; "decoding": { "alias": "decoding"; "required": false; }; "syncFirstRender": { "alias": "syncFirstRender"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ngAcceptInputType_syncFirstRender: unknown;
 }

package/generated/checkbox/checkbox.component.d.ts

@@ -32,6 +32,15 @@ export declare class GdsCheckboxComponent extends GdsCheckboxFormControlBase {
     /** Validation state of the form control. Setting this to true triggers the invalid state of the control. */
     invalid?: GdsCheckbox['invalid'];
     name?: GdsCheckbox['name'];
+    /** Force the element to perform a synchronous first render and apply style expression properties in `connectedCallback`.
+  
+  This guarantees that the child DOM always remains projected in DOM, since the element will attach the shadowRoot and
+  run the first render pass in the same event loop cycle, and that declarative layout will be applied once slotted DOM
+  is projected.
+  
+  Note: This will cause the first render pass to be blocking. Use sparingly and only when necessary, such as when the
+  element needs to be measured synchronously after being added to the DOM. */
+    syncFirstRender?: GdsCheckbox['syncFirstRender'];
     /** Dispatched when the checkbox is checked or unchecked. */
     input: EventEmitter<InputEvent>;
     /** Dispatched when the checkbox is checked or unchecked. */
@@ -41,9 +50,10 @@ export declare class GdsCheckboxComponent extends GdsCheckboxFormControlBase {
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsCheckboxComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsCheckboxComponent, "gds-checkbox", never, { "label": { "alias": "label"; "required": false; }; "supportingText": { "alias": "supportingText"; "required": false; }; "checked": { "alias": "checked"; "required": false; }; "indeterminate": { "alias": "indeterminate"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "value": { "alias": "value"; "required": false; }; "validator": { "alias": "validator"; "required": false; }; "required": { "alias": "required"; "required": false; }; "errorMessage": { "alias": "errorMessage"; "required": false; }; "invalid": { "alias": "invalid"; "required": false; }; "name": { "alias": "name"; "required": false; }; }, { "input": "input"; "change": "change"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GdsCheckboxComponent, "gds-checkbox", never, { "label": { "alias": "label"; "required": false; }; "supportingText": { "alias": "supportingText"; "required": false; }; "checked": { "alias": "checked"; "required": false; }; "indeterminate": { "alias": "indeterminate"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "value": { "alias": "value"; "required": false; }; "validator": { "alias": "validator"; "required": false; }; "required": { "alias": "required"; "required": false; }; "errorMessage": { "alias": "errorMessage"; "required": false; }; "invalid": { "alias": "invalid"; "required": false; }; "name": { "alias": "name"; "required": false; }; "syncFirstRender": { "alias": "syncFirstRender"; "required": false; }; }, { "input": "input"; "change": "change"; }, never, ["*"], true, never>;
     static ngAcceptInputType_checked: unknown;
     static ngAcceptInputType_indeterminate: unknown;
     static ngAcceptInputType_disabled: unknown;
     static ngAcceptInputType_required: unknown;
+    static ngAcceptInputType_syncFirstRender: unknown;
 }

package/generated/checkbox-group/checkbox-group.component.d.ts

@@ -61,8 +61,8 @@ export declare class GdsCheckboxGroupComponent extends GdsFormControlBase {
     maxInlineSize?: GdsCheckboxGroup['max-inline-size'];
     /** Controls the font-size of label and supporting text on group form control header and single checkbox buttons respectively. */
     size?: GdsCheckboxGroup['size'];
-    /** The direction in which checkbox buttons are displayed. */
-    direction?: GdsCheckboxGroup['direction'];
+    /** The flex-direction in which checkbox buttons are displayed. */
+    flexDirection?: GdsCheckboxGroup['flexDirection'];
     /** Whether to hide the label for the checkbox group. Usable if you want a single checkbox to act as the label. */
     hideLabel?: GdsCheckboxGroup['hideLabel'];
     /** The supporting text displayed between the label and the field.
@@ -86,14 +86,24 @@ export declare class GdsCheckboxGroupComponent extends GdsFormControlBase {
     name?: GdsCheckboxGroup['name'];
     /** If the input is Disabled */
     disabled?: GdsCheckboxGroup['disabled'];
+    /** Force the element to perform a synchronous first render and apply style expression properties in `connectedCallback`.
+  
+  This guarantees that the child DOM always remains projected in DOM, since the element will attach the shadowRoot and
+  run the first render pass in the same event loop cycle, and that declarative layout will be applied once slotted DOM
+  is projected.
+  
+  Note: This will cause the first render pass to be blocking. Use sparingly and only when necessary, such as when the
+  element needs to be measured synchronously after being added to the DOM. */
+    syncFirstRender?: GdsCheckboxGroup['syncFirstRender'];
     get element(): GdsCheckboxGroup;
     ngOnInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsCheckboxGroupComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsCheckboxGroupComponent, "gds-checkbox-group", never, { "alignSelf": { "alias": "alignSelf"; "required": false; }; "justifySelf": { "alias": "justifySelf"; "required": false; }; "placeSelf": { "alias": "placeSelf"; "required": false; }; "gridColumn": { "alias": "gridColumn"; "required": false; }; "gridRow": { "alias": "gridRow"; "required": false; }; "gridArea": { "alias": "gridArea"; "required": false; }; "flex": { "alias": "flex"; "required": false; }; "order": { "alias": "order"; "required": false; }; "margin": { "alias": "margin"; "required": false; }; "marginInline": { "alias": "marginInline"; "required": false; }; "marginBlock": { "alias": "marginBlock"; "required": false; }; "width": { "alias": "width"; "required": false; }; "minWidth": { "alias": "minWidth"; "required": false; }; "maxWidth": { "alias": "maxWidth"; "required": false; }; "inlineSize": { "alias": "inlineSize"; "required": false; }; "minInlineSize": { "alias": "minInlineSize"; "required": false; }; "maxInlineSize": { "alias": "maxInlineSize"; "required": false; }; "size": { "alias": "size"; "required": false; }; "direction": { "alias": "direction"; "required": false; }; "hideLabel": { "alias": "hideLabel"; "required": false; }; "supportingText": { "alias": "supportingText"; "required": false; }; "showExtendedSupportingText": { "alias": "showExtendedSupportingText"; "required": false; }; "value": { "alias": "value"; "required": false; }; "validator": { "alias": "validator"; "required": false; }; "required": { "alias": "required"; "required": false; }; "errorMessage": { "alias": "errorMessage"; "required": false; }; "invalid": { "alias": "invalid"; "required": false; }; "label": { "alias": "label"; "required": false; }; "name": { "alias": "name"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GdsCheckboxGroupComponent, "gds-checkbox-group", never, { "alignSelf": { "alias": "alignSelf"; "required": false; }; "justifySelf": { "alias": "justifySelf"; "required": false; }; "placeSelf": { "alias": "placeSelf"; "required": false; }; "gridColumn": { "alias": "gridColumn"; "required": false; }; "gridRow": { "alias": "gridRow"; "required": false; }; "gridArea": { "alias": "gridArea"; "required": false; }; "flex": { "alias": "flex"; "required": false; }; "order": { "alias": "order"; "required": false; }; "margin": { "alias": "margin"; "required": false; }; "marginInline": { "alias": "marginInline"; "required": false; }; "marginBlock": { "alias": "marginBlock"; "required": false; }; "width": { "alias": "width"; "required": false; }; "minWidth": { "alias": "minWidth"; "required": false; }; "maxWidth": { "alias": "maxWidth"; "required": false; }; "inlineSize": { "alias": "inlineSize"; "required": false; }; "minInlineSize": { "alias": "minInlineSize"; "required": false; }; "maxInlineSize": { "alias": "maxInlineSize"; "required": false; }; "size": { "alias": "size"; "required": false; }; "flexDirection": { "alias": "flexDirection"; "required": false; }; "hideLabel": { "alias": "hideLabel"; "required": false; }; "supportingText": { "alias": "supportingText"; "required": false; }; "showExtendedSupportingText": { "alias": "showExtendedSupportingText"; "required": false; }; "value": { "alias": "value"; "required": false; }; "validator": { "alias": "validator"; "required": false; }; "required": { "alias": "required"; "required": false; }; "errorMessage": { "alias": "errorMessage"; "required": false; }; "invalid": { "alias": "invalid"; "required": false; }; "label": { "alias": "label"; "required": false; }; "name": { "alias": "name"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "syncFirstRender": { "alias": "syncFirstRender"; "required": false; }; }, {}, never, ["*"], true, never>;
     static ngAcceptInputType_hideLabel: unknown;
     static ngAcceptInputType_showExtendedSupportingText: unknown;
     static ngAcceptInputType_required: unknown;
     static ngAcceptInputType_disabled: unknown;
+    static ngAcceptInputType_syncFirstRender: unknown;
 }

package/generated/coachmark/coachmark.component.d.ts

@@ -28,13 +28,23 @@ export declare class GdsCoachmarkComponent implements OnInit, OnChanges, AfterVi
     targetElement?: GdsCoachmark['targetElement'];
     _isVisible?: GdsCoachmark['_isVisible'];
     _preventClose?: GdsCoachmark['_preventClose'];
+    /** Force the element to perform a synchronous first render and apply style expression properties in `connectedCallback`.
+  
+  This guarantees that the child DOM always remains projected in DOM, since the element will attach the shadowRoot and
+  run the first render pass in the same event loop cycle, and that declarative layout will be applied once slotted DOM
+  is projected.
+  
+  Note: This will cause the first render pass to be blocking. Use sparingly and only when necessary, such as when the
+  element needs to be measured synchronously after being added to the DOM. */
+    syncFirstRender?: GdsCoachmark['syncFirstRender'];
     /** dispatched when the tooltip is about to be closed. Can be cancelled to prevent closing. */
     gdsUiState: EventEmitter<CustomEvent<any>>;
     ngOnInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsCoachmarkComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsCoachmarkComponent, "gds-coachmark", never, { "placement": { "alias": "placement"; "required": false; }; "overlappedBy": { "alias": "overlappedBy"; "required": false; }; "target": { "alias": "target"; "required": false; }; "label": { "alias": "label"; "required": false; }; "computeVisibility": { "alias": "computeVisibility"; "required": false; }; "targetElement": { "alias": "targetElement"; "required": false; }; "_isVisible": { "alias": "_isVisible"; "required": false; }; "_preventClose": { "alias": "_preventClose"; "required": false; }; }, { "gdsUiState": "gdsUiState"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GdsCoachmarkComponent, "gds-coachmark", never, { "placement": { "alias": "placement"; "required": false; }; "overlappedBy": { "alias": "overlappedBy"; "required": false; }; "target": { "alias": "target"; "required": false; }; "label": { "alias": "label"; "required": false; }; "computeVisibility": { "alias": "computeVisibility"; "required": false; }; "targetElement": { "alias": "targetElement"; "required": false; }; "_isVisible": { "alias": "_isVisible"; "required": false; }; "_preventClose": { "alias": "_preventClose"; "required": false; }; "syncFirstRender": { "alias": "syncFirstRender"; "required": false; }; }, { "gdsUiState": "gdsUiState"; }, never, ["*"], true, never>;
     static ngAcceptInputType__isVisible: unknown;
     static ngAcceptInputType__preventClose: unknown;
+    static ngAcceptInputType_syncFirstRender: unknown;
 }

package/generated/context-menu/context-menu.component.d.ts

@@ -55,6 +55,15 @@ export declare class GdsContextMenuComponent implements OnInit, OnChanges, After
     /** Style Expression Property that controls the `order` property.
   Supports all valid CSS `order` values. */
     order?: GdsContextMenu['order'];
+    /** Force the element to perform a synchronous first render and apply style expression properties in `connectedCallback`.
+  
+  This guarantees that the child DOM always remains projected in DOM, since the element will attach the shadowRoot and
+  run the first render pass in the same event loop cycle, and that declarative layout will be applied once slotted DOM
+  is projected.
+  
+  Note: This will cause the first render pass to be blocking. Use sparingly and only when necessary, such as when the
+  element needs to be measured synchronously after being added to the DOM. */
+    syncFirstRender?: GdsContextMenu['syncFirstRender'];
     /** Fired when a menu item is clicked. */
     gdsMenuItemClick: EventEmitter<CustomEvent<any>>;
     /** Fired when the menu is opened or closed. */
@@ -63,7 +72,8 @@ export declare class GdsContextMenuComponent implements OnInit, OnChanges, After
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsContextMenuComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsContextMenuComponent, "gds-context-menu", never, { "open": { "alias": "open"; "required": false; }; "buttonLabel": { "alias": "buttonLabel"; "required": false; }; "showLabel": { "alias": "showLabel"; "required": false; }; "label": { "alias": "label"; "required": false; }; "placement": { "alias": "placement"; "required": false; }; "margin": { "alias": "margin"; "required": false; }; "marginInline": { "alias": "marginInline"; "required": false; }; "marginBlock": { "alias": "marginBlock"; "required": false; }; "alignSelf": { "alias": "alignSelf"; "required": false; }; "justifySelf": { "alias": "justifySelf"; "required": false; }; "placeSelf": { "alias": "placeSelf"; "required": false; }; "gridColumn": { "alias": "gridColumn"; "required": false; }; "gridRow": { "alias": "gridRow"; "required": false; }; "gridArea": { "alias": "gridArea"; "required": false; }; "flex": { "alias": "flex"; "required": false; }; "order": { "alias": "order"; "required": false; }; }, { "gdsMenuItemClick": "gdsMenuItemClick"; "gdsUiState": "gdsUiState"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GdsContextMenuComponent, "gds-context-menu", never, { "open": { "alias": "open"; "required": false; }; "buttonLabel": { "alias": "buttonLabel"; "required": false; }; "showLabel": { "alias": "showLabel"; "required": false; }; "label": { "alias": "label"; "required": false; }; "placement": { "alias": "placement"; "required": false; }; "margin": { "alias": "margin"; "required": false; }; "marginInline": { "alias": "marginInline"; "required": false; }; "marginBlock": { "alias": "marginBlock"; "required": false; }; "alignSelf": { "alias": "alignSelf"; "required": false; }; "justifySelf": { "alias": "justifySelf"; "required": false; }; "placeSelf": { "alias": "placeSelf"; "required": false; }; "gridColumn": { "alias": "gridColumn"; "required": false; }; "gridRow": { "alias": "gridRow"; "required": false; }; "gridArea": { "alias": "gridArea"; "required": false; }; "flex": { "alias": "flex"; "required": false; }; "order": { "alias": "order"; "required": false; }; "syncFirstRender": { "alias": "syncFirstRender"; "required": false; }; }, { "gdsMenuItemClick": "gdsMenuItemClick"; "gdsUiState": "gdsUiState"; }, never, ["*"], true, never>;
     static ngAcceptInputType_open: unknown;
     static ngAcceptInputType_showLabel: unknown;
+    static ngAcceptInputType_syncFirstRender: unknown;
 }