@sebgroup/green-core-ng 2.37.4 → 3.1.0

package/generated/datepicker/datepicker.component.d.ts

@@ -124,6 +124,15 @@ export declare class GdsDatepickerComponent extends GdsFormControlBase {
     name?: GdsDatepicker['name'];
     /** If the input is Disabled */
     disabled?: GdsDatepicker['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?: GdsDatepicker['syncFirstRender'];
     /** Fired when the value of the dropdown is changed through user interaction (not when value prop is set programatically). */
     change: EventEmitter<Event>;
     /** Fired when the dropdown is opened or closed. */
@@ -133,7 +142,7 @@ export declare class GdsDatepickerComponent extends GdsFormControlBase {
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsDatepickerComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsDatepickerComponent, "gds-datepicker", 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; }; "value": { "alias": "value"; "required": false; }; "min": { "alias": "min"; "required": false; }; "max": { "alias": "max"; "required": false; }; "open": { "alias": "open"; "required": false; }; "supportingText": { "alias": "supportingText"; "required": false; }; "size": { "alias": "size"; "required": false; }; "plain": { "alias": "plain"; "required": false; }; "showWeekNumbers": { "alias": "showWeekNumbers"; "required": false; }; "hideLabel": { "alias": "hideLabel"; "required": false; }; "clearable": { "alias": "clearable"; "required": false; }; "hideTodayButton": { "alias": "hideTodayButton"; "required": false; }; "utcHours": { "alias": "utcHours"; "required": false; }; "dateformat": { "alias": "dateformat"; "required": false; }; "disabledWeekends": { "alias": "disabledWeekends"; "required": false; }; "disabledDates": { "alias": "disabledDates"; "required": false; }; "showExtendedSupportingText": { "alias": "showExtendedSupportingText"; "required": false; }; "test_calendarButton": { "alias": "test_calendarButton"; "required": false; }; "test_clearButton": { "alias": "test_clearButton"; "required": false; }; "test_todayButton": { "alias": "test_todayButton"; "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; }; }, { "change": "change"; "gdsUiState": "gdsUiState"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GdsDatepickerComponent, "gds-datepicker", 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; }; "value": { "alias": "value"; "required": false; }; "min": { "alias": "min"; "required": false; }; "max": { "alias": "max"; "required": false; }; "open": { "alias": "open"; "required": false; }; "supportingText": { "alias": "supportingText"; "required": false; }; "size": { "alias": "size"; "required": false; }; "plain": { "alias": "plain"; "required": false; }; "showWeekNumbers": { "alias": "showWeekNumbers"; "required": false; }; "hideLabel": { "alias": "hideLabel"; "required": false; }; "clearable": { "alias": "clearable"; "required": false; }; "hideTodayButton": { "alias": "hideTodayButton"; "required": false; }; "utcHours": { "alias": "utcHours"; "required": false; }; "dateformat": { "alias": "dateformat"; "required": false; }; "disabledWeekends": { "alias": "disabledWeekends"; "required": false; }; "disabledDates": { "alias": "disabledDates"; "required": false; }; "showExtendedSupportingText": { "alias": "showExtendedSupportingText"; "required": false; }; "test_calendarButton": { "alias": "test_calendarButton"; "required": false; }; "test_clearButton": { "alias": "test_clearButton"; "required": false; }; "test_todayButton": { "alias": "test_todayButton"; "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; }; }, { "change": "change"; "gdsUiState": "gdsUiState"; }, never, ["*"], true, never>;
     static ngAcceptInputType_open: unknown;
     static ngAcceptInputType_plain: unknown;
     static ngAcceptInputType_showWeekNumbers: unknown;
@@ -144,4 +153,5 @@ export declare class GdsDatepickerComponent extends GdsFormControlBase {
     static ngAcceptInputType_showExtendedSupportingText: unknown;
     static ngAcceptInputType_required: unknown;
     static ngAcceptInputType_disabled: unknown;
+    static ngAcceptInputType_syncFirstRender: unknown;
 }

package/generated/details/details.component.d.ts

@@ -71,12 +71,22 @@ export declare class GdsDetailsComponent implements OnInit, OnChanges, AfterView
     /** Style Expression Property that controls the `order` property.
   Supports all valid CSS `order` values. */
     order?: GdsDetails['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?: GdsDetails['syncFirstRender'];
     /** Fired when details opens or closes */
     gdsUiState: EventEmitter<CustomEvent<any>>;
     ngOnInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsDetailsComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsDetailsComponent, "gds-details", never, { "summary": { "alias": "summary"; "required": false; }; "name": { "alias": "name"; "required": false; }; "open": { "alias": "open"; "required": false; }; "size": { "alias": "size"; "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; }; }, { "gdsUiState": "gdsUiState"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GdsDetailsComponent, "gds-details", never, { "summary": { "alias": "summary"; "required": false; }; "name": { "alias": "name"; "required": false; }; "open": { "alias": "open"; "required": false; }; "size": { "alias": "size"; "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; }; }, { "gdsUiState": "gdsUiState"; }, never, ["*"], true, never>;
     static ngAcceptInputType_open: unknown;
+    static ngAcceptInputType_syncFirstRender: unknown;
 }

package/generated/dialog/dialog.component.d.ts

@@ -85,6 +85,15 @@ export declare class GdsDialogComponent implements OnInit, OnChanges, AfterViewI
     /** Style Expression Property that controls the `padding-block` property.
   Only accepts space tokens. */
     paddingBlock?: GdsDialog['padding-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?: GdsDialog['syncFirstRender'];
     /** Fired when the dialog is opened or closed. Can be cancelled to prevent the dialog from closing. */
     gdsUiState: EventEmitter<CustomEvent<any>>;
     /** Fired when the dialog is closed */
@@ -95,7 +104,8 @@ export declare class GdsDialogComponent implements OnInit, OnChanges, AfterViewI
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsDialogComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsDialogComponent, "gds-dialog", never, { "open": { "alias": "open"; "required": false; }; "heading": { "alias": "heading"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "placement": { "alias": "placement"; "required": false; }; "scrollable": { "alias": "scrollable"; "required": false; }; "closedby": { "alias": "closedby"; "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; }; "padding": { "alias": "padding"; "required": false; }; "paddingInline": { "alias": "paddingInline"; "required": false; }; "paddingBlock": { "alias": "paddingBlock"; "required": false; }; }, { "gdsUiState": "gdsUiState"; "gdsClose": "gdsClose"; "gdsShow": "gdsShow"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GdsDialogComponent, "gds-dialog", never, { "open": { "alias": "open"; "required": false; }; "heading": { "alias": "heading"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "placement": { "alias": "placement"; "required": false; }; "scrollable": { "alias": "scrollable"; "required": false; }; "closedby": { "alias": "closedby"; "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; }; "padding": { "alias": "padding"; "required": false; }; "paddingInline": { "alias": "paddingInline"; "required": false; }; "paddingBlock": { "alias": "paddingBlock"; "required": false; }; "syncFirstRender": { "alias": "syncFirstRender"; "required": false; }; }, { "gdsUiState": "gdsUiState"; "gdsClose": "gdsClose"; "gdsShow": "gdsShow"; }, never, ["*"], true, never>;
     static ngAcceptInputType_open: unknown;
     static ngAcceptInputType_scrollable: unknown;
+    static ngAcceptInputType_syncFirstRender: unknown;
 }

package/generated/div/div.component.d.ts

@@ -218,9 +218,19 @@ export declare class GdsDivComponent implements OnInit, OnChanges, AfterViewInit
     /** Style Expression Property that controls the `inset` property.
   Supports all valid CSS `inset` values. */
     inset?: GdsDiv['inset'];
+    /** 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?: GdsDiv['syncFirstRender'];
     ngOnInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsDivComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsDivComponent, "gds-div", never, { "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; }; "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; }; "padding": { "alias": "padding"; "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; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GdsDivComponent, "gds-div", never, { "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; }; "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; }; "padding": { "alias": "padding"; "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; }; "syncFirstRender": { "alias": "syncFirstRender"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ngAcceptInputType_syncFirstRender: unknown;
 }

package/generated/divider/divider.component.d.ts

@@ -66,9 +66,19 @@ export declare class GdsDividerComponent implements OnInit, OnChanges, AfterView
     /** Style Expression Property that controls the `max-inline-size` property.
   Supports space tokens and all valid CSS `max-inline-size` values. */
     maxInlineSize?: GdsDivider['max-inline-size'];
+    /** 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?: GdsDivider['syncFirstRender'];
     ngOnInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsDividerComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsDividerComponent, "gds-divider", never, { "color": { "alias": "color"; "required": false; }; "size": { "alias": "size"; "required": false; }; "opacity": { "alias": "opacity"; "required": false; }; "role": { "alias": "role"; "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; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GdsDividerComponent, "gds-divider", never, { "color": { "alias": "color"; "required": false; }; "size": { "alias": "size"; "required": false; }; "opacity": { "alias": "opacity"; "required": false; }; "role": { "alias": "role"; "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; }; "syncFirstRender": { "alias": "syncFirstRender"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ngAcceptInputType_syncFirstRender: unknown;
 }

package/generated/dropdown/dropdown.component.d.ts

@@ -136,6 +136,15 @@ export declare class GdsDropdownComponent extends GdsFormControlBase {
     name?: GdsDropdown['name'];
     /** If the input is Disabled */
     disabled?: GdsDropdown['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?: GdsDropdown['syncFirstRender'];
     /** Fired when the value of the dropdown is changed through user interaction (not when value prop is set programatically). */
     change: EventEmitter<Event>;
     /** Fired when the value of the dropdown is changed through user interaction. */
@@ -151,7 +160,7 @@ export declare class GdsDropdownComponent extends GdsFormControlBase {
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsDropdownComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsDropdownComponent, "gds-dropdown", 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; }; "supportingText": { "alias": "supportingText"; "required": false; }; "open": { "alias": "open"; "required": false; }; "searchable": { "alias": "searchable"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "clearable": { "alias": "clearable"; "required": false; }; "combobox": { "alias": "combobox"; "required": false; }; "compareWith": { "alias": "compareWith"; "required": false; }; "searchFilter": { "alias": "searchFilter"; "required": false; }; "syncPopoverWidth": { "alias": "syncPopoverWidth"; "required": false; }; "maxHeight": { "alias": "maxHeight"; "required": false; }; "size": { "alias": "size"; "required": false; }; "hideLabel": { "alias": "hideLabel"; "required": false; }; "plain": { "alias": "plain"; "required": false; }; "disableMobileStyles": { "alias": "disableMobileStyles"; "required": false; }; "showExtendedSupportingText": { "alias": "showExtendedSupportingText"; "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; }; "value": { "alias": "value"; "required": false; }; "name": { "alias": "name"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "change": "change"; "input": "input"; "gdsUiState": "gdsUiState"; "gdsFilterInput": "gdsFilterInput"; "gdsInputCleared": "gdsInputCleared"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GdsDropdownComponent, "gds-dropdown", 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; }; "supportingText": { "alias": "supportingText"; "required": false; }; "open": { "alias": "open"; "required": false; }; "searchable": { "alias": "searchable"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "clearable": { "alias": "clearable"; "required": false; }; "combobox": { "alias": "combobox"; "required": false; }; "compareWith": { "alias": "compareWith"; "required": false; }; "searchFilter": { "alias": "searchFilter"; "required": false; }; "syncPopoverWidth": { "alias": "syncPopoverWidth"; "required": false; }; "maxHeight": { "alias": "maxHeight"; "required": false; }; "size": { "alias": "size"; "required": false; }; "hideLabel": { "alias": "hideLabel"; "required": false; }; "plain": { "alias": "plain"; "required": false; }; "disableMobileStyles": { "alias": "disableMobileStyles"; "required": false; }; "showExtendedSupportingText": { "alias": "showExtendedSupportingText"; "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; }; "value": { "alias": "value"; "required": false; }; "name": { "alias": "name"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "syncFirstRender": { "alias": "syncFirstRender"; "required": false; }; }, { "change": "change"; "input": "input"; "gdsUiState": "gdsUiState"; "gdsFilterInput": "gdsFilterInput"; "gdsInputCleared": "gdsInputCleared"; }, never, ["*"], true, never>;
     static ngAcceptInputType_open: unknown;
     static ngAcceptInputType_searchable: unknown;
     static ngAcceptInputType_multiple: unknown;
@@ -164,4 +173,5 @@ export declare class GdsDropdownComponent extends GdsFormControlBase {
     static ngAcceptInputType_showExtendedSupportingText: unknown;
     static ngAcceptInputType_required: unknown;
     static ngAcceptInputType_disabled: unknown;
+    static ngAcceptInputType_syncFirstRender: unknown;
 }

package/generated/fab/fab.component.d.ts

@@ -109,6 +109,15 @@ export declare class GdsFabComponent extends GdsFormControlBase {
     /** Get or set the value of the form control. */
     value?: GdsFab['value'];
     name?: GdsFab['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?: GdsFab['syncFirstRender'];
     /**
      * Prevent the browser from following the href when RouterLink handles
      * navigation. RouterLink calls Router.navigateByUrl() for all elements,
@@ -129,8 +138,9 @@ export declare class GdsFabComponent extends GdsFormControlBase {
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsFabComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsFabComponent, "gds-fab", never, { "position": { "alias": "position"; "required": false; }; "transform": { "alias": "transform"; "required": false; }; "inset": { "alias": "inset"; "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; }; "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; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GdsFabComponent, "gds-fab", never, { "position": { "alias": "position"; "required": false; }; "transform": { "alias": "transform"; "required": false; }; "inset": { "alias": "inset"; "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; }; "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; }; }, {}, never, ["*"], true, never>;
     static ngAcceptInputType_disabled: unknown;
     static ngAcceptInputType_wrapped: unknown;
     static ngAcceptInputType_required: unknown;
+    static ngAcceptInputType_syncFirstRender: unknown;
 }

package/generated/filter-chip/filter-chip.component.d.ts

@@ -17,10 +17,20 @@ export declare class GdsFilterChipComponent implements OnInit, OnChanges, AfterV
     value?: GdsFilterChip['value'];
     /** The size of the chip */
     size?: GdsFilterChip['size'];
+    /** 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?: GdsFilterChip['syncFirstRender'];
     ngOnInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsFilterChipComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsFilterChipComponent, "gds-filter-chip", never, { "selected": { "alias": "selected"; "required": false; }; "value": { "alias": "value"; "required": false; }; "size": { "alias": "size"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GdsFilterChipComponent, "gds-filter-chip", never, { "selected": { "alias": "selected"; "required": false; }; "value": { "alias": "value"; "required": false; }; "size": { "alias": "size"; "required": false; }; "syncFirstRender": { "alias": "syncFirstRender"; "required": false; }; }, {}, never, ["*"], true, never>;
     static ngAcceptInputType_selected: unknown;
+    static ngAcceptInputType_syncFirstRender: unknown;
 }

package/generated/filter-chips/filter-chips.component.d.ts

@@ -28,6 +28,15 @@ export declare class GdsFilterChipsComponent extends GdsFormControlBase {
     name?: GdsFilterChips['name'];
     /** If the input is Disabled */
     disabled?: GdsFilterChips['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?: GdsFilterChips['syncFirstRender'];
     /** When a chip is clicked */
     change: EventEmitter<Event>;
     get element(): GdsFilterChips;
@@ -35,9 +44,10 @@ export declare class GdsFilterChipsComponent extends GdsFormControlBase {
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsFilterChipsComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsFilterChipsComponent, "gds-filter-chips", never, { "value": { "alias": "value"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "label": { "alias": "label"; "required": false; }; "rowCollapse": { "alias": "rowCollapse"; "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; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "change": "change"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GdsFilterChipsComponent, "gds-filter-chips", never, { "value": { "alias": "value"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "label": { "alias": "label"; "required": false; }; "rowCollapse": { "alias": "rowCollapse"; "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; }; "disabled": { "alias": "disabled"; "required": false; }; "syncFirstRender": { "alias": "syncFirstRender"; "required": false; }; }, { "change": "change"; }, never, ["*"], true, never>;
     static ngAcceptInputType_multiple: unknown;
     static ngAcceptInputType_rowCollapse: unknown;
     static ngAcceptInputType_required: unknown;
     static ngAcceptInputType_disabled: unknown;
+    static ngAcceptInputType_syncFirstRender: unknown;
 }

package/generated/flex/flex.component.d.ts

@@ -218,9 +218,19 @@ export declare class GdsFlexComponent implements OnInit, OnChanges, AfterViewIni
     /** Style Expression Property that controls the `pointer-events` property.
   Supports all valid CSS `pointer-events` values. */
     pointerEvents?: GdsFlex['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?: GdsFlex['syncFirstRender'];
     ngOnInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsFlexComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsFlexComponent, "gds-flex", 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; }; "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; }; "padding": { "alias": "padding"; "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<GdsFlexComponent, "gds-flex", 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; }; "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; }; "padding": { "alias": "padding"; "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/form-summary/form-summary.component.d.ts

@@ -18,11 +18,21 @@ export declare class GdsFormSummaryComponent implements OnInit, OnChanges, After
   Avoid this setting if the summary is located above the form controls, as it may cause the form
   to jump around as the summary is updated. */
     reactive?: GdsFormSummary['reactive'];
+    /** 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?: GdsFormSummary['syncFirstRender'];
     ngOnInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsFormSummaryComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsFormSummaryComponent, "gds-form-summary", never, { "hideErrors": { "alias": "hideErrors"; "required": false; }; "reactive": { "alias": "reactive"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GdsFormSummaryComponent, "gds-form-summary", never, { "hideErrors": { "alias": "hideErrors"; "required": false; }; "reactive": { "alias": "reactive"; "required": false; }; "syncFirstRender": { "alias": "syncFirstRender"; "required": false; }; }, {}, never, ["*"], true, never>;
     static ngAcceptInputType_hideErrors: unknown;
     static ngAcceptInputType_reactive: unknown;
+    static ngAcceptInputType_syncFirstRender: unknown;
 }

package/generated/formatted-account/formatted-account.component.d.ts

@@ -232,9 +232,19 @@ export declare class GdsFormattedAccountComponent implements OnInit, OnChanges,
     /** Style Expression Property that controls the `pointer-events` property.
   Supports all valid CSS `pointer-events` values. */
     pointerEvents?: GdsFormattedAccount['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?: GdsFormattedAccount['syncFirstRender'];
     ngOnInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsFormattedAccountComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsFormattedAccountComponent, "gds-formatted-account", never, { "account": { "alias": "account"; "required": false; }; "tag": { "alias": "tag"; "required": false; }; "font": { "alias": "font"; "required": false; }; "fontWeight": { "alias": "fontWeight"; "required": false; }; "textTransform": { "alias": "textTransform"; "required": false; }; "textDecoration": { "alias": "textDecoration"; "required": false; }; "lines": { "alias": "lines"; "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; }; "padding": { "alias": "padding"; "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; }; "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<GdsFormattedAccountComponent, "gds-formatted-account", never, { "account": { "alias": "account"; "required": false; }; "tag": { "alias": "tag"; "required": false; }; "font": { "alias": "font"; "required": false; }; "fontWeight": { "alias": "fontWeight"; "required": false; }; "textTransform": { "alias": "textTransform"; "required": false; }; "textDecoration": { "alias": "textDecoration"; "required": false; }; "lines": { "alias": "lines"; "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; }; "padding": { "alias": "padding"; "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; }; "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/formatted-date/formatted-date.component.d.ts

@@ -235,9 +235,19 @@ export declare class GdsFormattedDateComponent implements OnInit, OnChanges, Aft
     /** Style Expression Property that controls the `pointer-events` property.
   Supports all valid CSS `pointer-events` values. */
     pointerEvents?: GdsFormattedDate['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?: GdsFormattedDate['syncFirstRender'];
     ngOnInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsFormattedDateComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsFormattedDateComponent, "gds-formatted-date", never, { "value": { "alias": "value"; "required": false; }; "format": { "alias": "format"; "required": false; }; "locale": { "alias": "locale"; "required": false; }; "tag": { "alias": "tag"; "required": false; }; "font": { "alias": "font"; "required": false; }; "fontWeight": { "alias": "fontWeight"; "required": false; }; "textTransform": { "alias": "textTransform"; "required": false; }; "textDecoration": { "alias": "textDecoration"; "required": false; }; "lines": { "alias": "lines"; "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; }; "padding": { "alias": "padding"; "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; }; "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<GdsFormattedDateComponent, "gds-formatted-date", never, { "value": { "alias": "value"; "required": false; }; "format": { "alias": "format"; "required": false; }; "locale": { "alias": "locale"; "required": false; }; "tag": { "alias": "tag"; "required": false; }; "font": { "alias": "font"; "required": false; }; "fontWeight": { "alias": "fontWeight"; "required": false; }; "textTransform": { "alias": "textTransform"; "required": false; }; "textDecoration": { "alias": "textDecoration"; "required": false; }; "lines": { "alias": "lines"; "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; }; "padding": { "alias": "padding"; "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; }; "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/formatted-number/formatted-number.component.d.ts

@@ -237,9 +237,19 @@ export declare class GdsFormattedNumberComponent implements OnInit, OnChanges, A
     /** Style Expression Property that controls the `pointer-events` property.
   Supports all valid CSS `pointer-events` values. */
     pointerEvents?: GdsFormattedNumber['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?: GdsFormattedNumber['syncFirstRender'];
     ngOnInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GdsFormattedNumberComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GdsFormattedNumberComponent, "gds-formatted-number", never, { "value": { "alias": "value"; "required": false; }; "locale": { "alias": "locale"; "required": false; }; "currency": { "alias": "currency"; "required": false; }; "decimals": { "alias": "decimals"; "required": false; }; "tag": { "alias": "tag"; "required": false; }; "font": { "alias": "font"; "required": false; }; "fontWeight": { "alias": "fontWeight"; "required": false; }; "textTransform": { "alias": "textTransform"; "required": false; }; "textDecoration": { "alias": "textDecoration"; "required": false; }; "lines": { "alias": "lines"; "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; }; "padding": { "alias": "padding"; "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; }; "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<GdsFormattedNumberComponent, "gds-formatted-number", never, { "value": { "alias": "value"; "required": false; }; "locale": { "alias": "locale"; "required": false; }; "currency": { "alias": "currency"; "required": false; }; "decimals": { "alias": "decimals"; "required": false; }; "tag": { "alias": "tag"; "required": false; }; "font": { "alias": "font"; "required": false; }; "fontWeight": { "alias": "fontWeight"; "required": false; }; "textTransform": { "alias": "textTransform"; "required": false; }; "textDecoration": { "alias": "textDecoration"; "required": false; }; "lines": { "alias": "lines"; "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; }; "padding": { "alias": "padding"; "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; }; "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;
 }