@superblocksteam/library 2.0.0-next.11 → 2.0.0-next.111

package/dist-types/lib/user-facing/components/grid/index.d.ts

@@ -2,6 +2,7 @@ import { Dim } from "@superblocksteam/library-shared";
 import React from "react";
 import { Prop, Section } from "../../properties-panel/props-builder.js";
 import type { InternalProps } from "../../properties-panel/props-builder.js";
+import type { DimModes } from "@superblocksteam/library-shared";
 export type GridChild = React.ReactElement<{
     name: string;
     marginTop?: Dim<"rows">;
@@ -14,16 +15,15 @@ declare const _propertiesDefinition: {
     general: Section<Record<string, Prop<any, any>> & {
         spacing: Prop<Dim<"px">, true>;
         columns: Prop<number, false>;
-        rows: Prop<number, false>;
-        rowSize: Prop<number, false>;
+        rowHeight: Prop<Dim<"px">, false>;
     }>;
     layout: Section<Record<string, Prop<any, any>> & {
-        maxHeight?: Prop<Dim<import("@superblocksteam/library-shared").DimModes>, false> | undefined;
-        minHeight?: Prop<Dim<import("@superblocksteam/library-shared").DimModes>, false> | undefined;
-        maxWidth?: Prop<Dim<import("@superblocksteam/library-shared").DimModes>, false> | undefined;
-        minWidth?: Prop<Dim<import("@superblocksteam/library-shared").DimModes>, false> | undefined;
-        width: Prop<Dim<import("@superblocksteam/library-shared").DimModes>, false>;
-        height: Prop<Dim<import("@superblocksteam/library-shared").DimModes>, false>;
+        maxHeight?: Prop<Dim<DimModes>, false> | undefined;
+        minHeight?: Prop<Dim<DimModes>, false> | undefined;
+        maxWidth?: Prop<Dim<DimModes>, false> | undefined;
+        minWidth?: Prop<Dim<DimModes>, false> | undefined;
+        width: Prop<Dim<DimModes>, false>;
+        height: Prop<Dim<DimModes>, false>;
     } & {
         margin: Prop<unknown, true>;
     } & {

package/dist-types/lib/user-facing/components/icon/index.d.ts

@@ -13,7 +13,7 @@ export declare const SbIcon: import("react").FC<import("../../properties-panel/p
     }>;
     appearance: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any>> & {
         color: import("../../properties-panel/props-builder.js").Prop<string, false>;
-        animateLoading: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
+        loading: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
     }>;
     events: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any>> & {
         onClick: import("../../properties-panel/props-builder.js").Prop<import("../../sb-event-flow.js").SbEventFlow, false>;

package/dist-types/lib/user-facing/components/icon/props.d.ts

@@ -15,7 +15,7 @@ export declare const propertiesDefinition: {
     }>;
     appearance: Section<Record<string, Prop<any, any>> & {
         color: Prop<string, false>;
-        animateLoading: Prop<boolean, true>;
+        loading: Prop<boolean, true>;
     }>;
     events: Section<Record<string, Prop<any, any>> & {
         onClick: Prop<import("../../sb-event-flow.js").SbEventFlow, false>;

package/dist-types/lib/user-facing/components/image/index.d.ts

@@ -4,11 +4,11 @@ export declare const SbImage: import("react").FC<import("../../properties-panel/
     }>;
     appearance: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any>> & {
         backgroundColor: import("../../properties-panel/props-builder.js").Prop<string, false>;
-        border: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").PerSideBorder, true>;
+        border: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").PerSideBorder, false>;
         borderRadius: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").PerCornerBorderRadius, true>;
         fillContainer: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
         align: import("../../properties-panel/props-builder.js").Prop<import("./props.js").ImageAlign, true>;
-        animateLoading: import("../../properties-panel/props-builder.js").Prop<boolean, false>;
+        loading: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
     }>;
     layout: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any>> & {
         maxHeight?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false> | undefined;

package/dist-types/lib/user-facing/components/image/props.d.ts

@@ -14,11 +14,11 @@ export declare const propertiesDefinition: {
     }>;
     appearance: Section<Record<string, Prop<any, any>> & {
         backgroundColor: Prop<string, false>;
-        border: Prop<import("@superblocksteam/library-shared/types").PerSideBorder, true>;
+        border: Prop<import("@superblocksteam/library-shared/types").PerSideBorder, false>;
         borderRadius: Prop<import("@superblocksteam/library-shared/types").PerCornerBorderRadius, true>;
         fillContainer: Prop<boolean, true>;
         align: Prop<ImageAlign, true>;
-        animateLoading: Prop<boolean, false>;
+        loading: Prop<boolean, true>;
     }>;
     layout: Section<Record<string, Prop<any, any>> & {
         maxHeight?: Prop<Dim<DimModes>, false> | undefined;

package/dist-types/lib/user-facing/components/input/derived-properties.d.ts

@@ -1,4 +1,4 @@
 import type { InputWidgetProps } from "./types.js";
-export declare function getValue(this: InputWidgetProps): string | number | null | undefined;
+export declare function getValue(this: InputWidgetProps): string | number | null;
 export declare function getShowError(this: InputWidgetProps): boolean;
 export declare function getIsValid(this: InputWidgetProps): boolean;

package/dist-types/lib/user-facing/components/input/index.d.ts

@@ -3,14 +3,14 @@ export declare const SbInput: import("react").FC<import("../../properties-panel/
         label: import("../../properties-panel/props-builder.js").Prop<string, true>;
     } & (Omit<{
         inputType: import("../../properties-panel/props-builder.js").Prop<string, true>;
-    }, "inputType" | "currency" | "numberFormatting" | "currencyCodeDisplay"> & ({
+    }, "inputType" | "currency" | "numberFormat" | "currencyCodeDisplay"> & ({
         inputType: import("../../properties-panel/props-builder.js").Prop<string, true>;
-        numberFormatting: import("../../properties-panel/props-builder.js").Prop<"unformatted" | NonNullable<"compact" | "standard" | "scientific" | "engineering" | undefined>, true>;
+        numberFormat: import("../../properties-panel/props-builder.js").Prop<"unformatted" | NonNullable<"compact" | "standard" | "scientific" | "engineering" | undefined>, true>;
         currency?: undefined;
         currencyCodeDisplay?: undefined;
     } | {
         inputType: import("../../properties-panel/props-builder.js").Prop<string, true>;
-        numberFormatting: import("../../properties-panel/props-builder.js").Prop<"unformatted" | NonNullable<"compact" | "standard" | "scientific" | "engineering" | undefined>, true>;
+        numberFormat: import("../../properties-panel/props-builder.js").Prop<"unformatted" | NonNullable<"compact" | "standard" | "scientific" | "engineering" | undefined>, true>;
         currency: import("../../properties-panel/props-builder.js").Prop<string, true>;
         currencyCodeDisplay: import("../../properties-panel/props-builder.js").Prop<import("./types.js").CurrencyCodeDisplayType, true>;
     })))) & {
@@ -31,37 +31,31 @@ export declare const SbInput: import("react").FC<import("../../properties-panel/
     }, "inputType"> & {
         inputType: import("../../properties-panel/props-builder.js").Prop<string, true>;
     } & {
-        loadingAnimation: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
+        loading: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
     }>;
-    layout: import("../../properties-panel/props-builder.js").Section<(Record<string, import("../../properties-panel/props-builder.js").Prop<any, any>> & {
+    layout: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any>> & {
         padding: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").Spacing, true>;
-    } & ({
+    } & {
+        width: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<"px" | "fill" | "%" | "rows" | "columns">, false>;
         maxHeight?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false> | undefined;
         minHeight?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false> | undefined;
         maxWidth?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false> | undefined;
         minWidth?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false> | undefined;
-        width: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false>;
         height: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false>;
-    } & ({
+    } & {
         margin: import("../../properties-panel/props-builder.js").Prop<unknown, true>;
-    } & (Omit<{
-        labelPosition: import("../../properties-panel/props-builder.js").Prop<"left" | "top", false>;
-    }, "labelPosition" | "labelWidth"> & ({
-        labelPosition: import("../../properties-panel/props-builder.js").Prop<"left", true>;
+    } & {
         labelWidth: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim, true>;
-    } | {
-        labelPosition: import("../../properties-panel/props-builder.js").Prop<"top", true>;
-        labelWidth?: undefined;
-    }))))) & {
+    } & {
         isVisible: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
     }>;
     interaction: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any>> & Omit<{
         inputType: import("../../properties-panel/props-builder.js").Prop<string, false>;
-    }, "inputType" | "minimumFractionDigits" | "maximumFractionDigits" | "stepper" | "stepSize"> & {
+    }, "inputType" | "stepper" | "stepSize" | "minDecimals" | "maxDecimals"> & {
         stepper: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
         stepSize: import("../../properties-panel/props-builder.js").Prop<number, true>;
-        minimumFractionDigits: import("../../properties-panel/props-builder.js").Prop<number, true>;
-        maximumFractionDigits: import("../../properties-panel/props-builder.js").Prop<number, true>;
+        minDecimals: import("../../properties-panel/props-builder.js").Prop<number, false>;
+        maxDecimals: import("../../properties-panel/props-builder.js").Prop<number, false>;
         inputType: import("../../properties-panel/props-builder.js").Prop<string, true>;
     } & Omit<{
         inputType: import("../../properties-panel/props-builder.js").Prop<string, false>;
@@ -71,7 +65,7 @@ export declare const SbInput: import("react").FC<import("../../properties-panel/
         inputType: import("../../properties-panel/props-builder.js").Prop<string, true>;
     } & {
         errorMessagePlacement: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/props").ErrorMessagePlacement, true>;
-        customValidationRule: import("../../properties-panel/props-builder.js").Prop<string, true>;
+        customValidationRule: import("../../properties-panel/props-builder.js").Prop<any, false>;
         customErrorMessage: import("../../properties-panel/props-builder.js").Prop<string, true>;
         isDisabled: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
         isRequired: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
@@ -88,7 +82,7 @@ export declare const SbInput: import("react").FC<import("../../properties-panel/
     }>;
     derived: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any>> & {
         value: import("../../properties-panel/props-builder.js").Prop<string, true>;
-        validationErrors: import("../../properties-panel/props-builder.js").Prop<any, true>;
+        validationErrors: import("../../properties-panel/props-builder.js").Prop<import("../../component-base/utils/input-validation.js").ValidationErrors, true>;
         isValid: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
         showError: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
     }>;

package/dist-types/lib/user-facing/components/input/props.d.ts

@@ -1,19 +1,20 @@
 import { Section, Prop } from "../../properties-panel/props-builder.js";
 import type { CurrencyCodeDisplayType } from "./types.js";
+import type { ValidationErrors } from "../../component-base/utils/input-validation.js";
 import type { IconPosition } from "../../icons/constants.js";
 export declare const propertiesDefinition: {
     general: Section<(Record<string, Prop<any, any>> & ({
         label: Prop<string, true>;
     } & (Omit<{
         inputType: Prop<string, true>;
-    }, "inputType" | "currency" | "numberFormatting" | "currencyCodeDisplay"> & ({
+    }, "inputType" | "currency" | "numberFormat" | "currencyCodeDisplay"> & ({
         inputType: Prop<string, true>;
-        numberFormatting: Prop<"unformatted" | NonNullable<"compact" | "standard" | "scientific" | "engineering" | undefined>, true>;
+        numberFormat: Prop<"unformatted" | NonNullable<"compact" | "standard" | "scientific" | "engineering" | undefined>, true>;
         currency?: undefined;
         currencyCodeDisplay?: undefined;
     } | {
         inputType: Prop<string, true>;
-        numberFormatting: Prop<"unformatted" | NonNullable<"compact" | "standard" | "scientific" | "engineering" | undefined>, true>;
+        numberFormat: Prop<"unformatted" | NonNullable<"compact" | "standard" | "scientific" | "engineering" | undefined>, true>;
         currency: Prop<string, true>;
         currencyCodeDisplay: Prop<CurrencyCodeDisplayType, true>;
     })))) & {
@@ -34,37 +35,31 @@ export declare const propertiesDefinition: {
     }, "inputType"> & {
         inputType: Prop<string, true>;
     } & {
-        loadingAnimation: Prop<boolean, true>;
+        loading: Prop<boolean, true>;
     }>;
-    layout: Section<(Record<string, Prop<any, any>> & {
+    layout: Section<Record<string, Prop<any, any>> & {
         padding: Prop<import("@superblocksteam/library-shared/types").Spacing, true>;
-    } & ({
+    } & {
+        width: Prop<import("@superblocksteam/library-shared").Dim<"px" | "fill" | "%" | "rows" | "columns">, false>;
         maxHeight?: Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false> | undefined;
         minHeight?: Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false> | undefined;
         maxWidth?: Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false> | undefined;
         minWidth?: Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false> | undefined;
-        width: Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false>;
         height: Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false>;
-    } & ({
+    } & {
         margin: Prop<unknown, true>;
-    } & (Omit<{
-        labelPosition: Prop<"left" | "top", false>;
-    }, "labelPosition" | "labelWidth"> & ({
-        labelPosition: Prop<"left", true>;
+    } & {
         labelWidth: Prop<import("@superblocksteam/library-shared").Dim, true>;
-    } | {
-        labelPosition: Prop<"top", true>;
-        labelWidth?: undefined;
-    }))))) & {
+    } & {
         isVisible: Prop<boolean, true>;
     }>;
     interaction: Section<Record<string, Prop<any, any>> & Omit<{
         inputType: Prop<string, false>;
-    }, "inputType" | "minimumFractionDigits" | "maximumFractionDigits" | "stepper" | "stepSize"> & {
+    }, "inputType" | "stepper" | "stepSize" | "minDecimals" | "maxDecimals"> & {
         stepper: Prop<boolean, true>;
         stepSize: Prop<number, true>;
-        minimumFractionDigits: Prop<number, true>;
-        maximumFractionDigits: Prop<number, true>;
+        minDecimals: Prop<number, false>;
+        maxDecimals: Prop<number, false>;
         inputType: Prop<string, true>;
     } & Omit<{
         inputType: Prop<string, false>;
@@ -74,7 +69,7 @@ export declare const propertiesDefinition: {
         inputType: Prop<string, true>;
     } & {
         errorMessagePlacement: Prop<import("@superblocksteam/library-shared/props").ErrorMessagePlacement, true>;
-        customValidationRule: Prop<string, true>;
+        customValidationRule: Prop<any, false>;
         customErrorMessage: Prop<string, true>;
         isDisabled: Prop<boolean, true>;
         isRequired: Prop<boolean, true>;
@@ -91,7 +86,7 @@ export declare const propertiesDefinition: {
     }>;
     derived: Section<Record<string, Prop<any, any>> & {
         value: Prop<string, true>;
-        validationErrors: Prop<any, true>;
+        validationErrors: Prop<ValidationErrors, true>;
         isValid: Prop<boolean, true>;
         showError: Prop<boolean, true>;
     }>;

package/dist-types/lib/user-facing/components/key-value/props.d.ts

@@ -18,6 +18,7 @@ export declare const propertiesDefinition: {
         "styleProps.border": Prop<any, false>;
         "styleProps.borderRadius": Prop<any, false>;
         "styleProps.divider": Prop<any, true>;
+        loading: Prop<boolean, true>;
     }>;
     layout: Section<Record<string, Prop<any, any>> & {
         isVisible: Prop<boolean, true>;

package/dist-types/lib/user-facing/components/modal/index.d.ts

@@ -5,14 +5,7 @@ import type { ContainerLayout } from "../../component-base/constants.js";
  * - close all other modal when current modal is opened
  */
 export declare const SbModal: import("react").FC<import("../../properties-panel/props-builder.js").ExternalProps<{
-    layout: import("../../properties-panel/props-builder.js").Section<((Record<string, import("../../properties-panel/props-builder.js").Prop<any, any>> & ((Omit<{
-        layout: import("../../properties-panel/props-builder.js").Prop<ContainerLayout, true>;
-    }, "layout" | "rows" | "columns" | "rowSize"> & {
-        readonly layout: import("../../properties-panel/props-builder.js").Prop<"freeform", true>;
-        readonly columns: import("../../properties-panel/props-builder.js").Prop<number, true>;
-        readonly rows: import("../../properties-panel/props-builder.js").Prop<number, false>;
-        readonly rowSize: import("../../properties-panel/props-builder.js").Prop<number, false>;
-    }) | (Omit<{
+    layout: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any>> & ((Omit<{
         layout: import("../../properties-panel/props-builder.js").Prop<ContainerLayout, true>;
     }, "layout" | "verticalAlign" | "horizontalAlign"> & {
         readonly verticalAlign: import("../../properties-panel/props-builder.js").Prop<"center" | "space-around" | "space-between" | "bottom" | "top", true>;
@@ -24,20 +17,23 @@ export declare const SbModal: import("react").FC<import("../../properties-panel/
         readonly verticalAlign: import("../../properties-panel/props-builder.js").Prop<"center" | "bottom" | "top", true>;
         readonly horizontalAlign: import("../../properties-panel/props-builder.js").Prop<"center" | "space-around" | "space-between" | "left" | "right", true>;
         readonly layout: import("../../properties-panel/props-builder.js").Prop<"horizontal", true>;
-    }))) & {
-        spacing: import("../../properties-panel/props-builder.js").Prop<Dim<"px">, true>;
-    }) & {
-        padding: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").Spacing, true>;
-    }>;
+    }) | (Omit<{
+        layout: import("../../properties-panel/props-builder.js").Prop<ContainerLayout, true>;
+    }, "layout" | "columns" | "rowHeight"> & {
+        readonly columns: import("../../properties-panel/props-builder.js").Prop<number, true>;
+        readonly rowHeight: import("../../properties-panel/props-builder.js").Prop<Dim<"px">, true>;
+        readonly layout: import("../../properties-panel/props-builder.js").Prop<"freeform", true>;
+    }))>;
     appearance: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any>> & {
-        backgroundColor: import("../../properties-panel/props-builder.js").Prop<string, false>;
+        backgroundColor: import("../../properties-panel/props-builder.js").Prop<string, true>;
         border: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").PerSideBorder, false>;
         borderRadius: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").PerCornerBorderRadius, false>;
         hasBackdrop: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
         widthPreset: import("../../properties-panel/props-builder.js").Prop<import("./constants.js").ModalSize, true>;
+        loading: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
     }>;
     interaction: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any>> & {
-        canOutsideClickClose: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
+        closeOnClickOutside: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
     }>;
     events: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any>> & {
         onOpen: import("../../properties-panel/props-builder.js").Prop<import("../../sb-event-flow.js").SbEventFlow, false>;

package/dist-types/lib/user-facing/components/modal/modal-component.d.ts

@@ -11,7 +11,7 @@ type ModalComponentProps = {
     onCancel: (e: any) => void;
     children: ReactNode;
     className?: string;
-    canOutsideClickClose: boolean;
+    closeOnClickOutside: boolean;
     hasBackdrop: boolean;
     widthPreset?: ModalSize;
     heightPreset?: ModalSize;
@@ -28,7 +28,7 @@ type ModalComponentProps = {
     spacing: Dim<"px">;
     columns?: number;
     rows?: number;
-    rowSize?: number;
+    rowHeight?: Dim<"px">;
     dropTargetRef?: React.RefObject<HTMLElement | null>;
 };
 /** the modal is open/close by setting isOpen to true/false

package/dist-types/lib/user-facing/components/modal/props.d.ts

@@ -2,14 +2,7 @@ import { Prop, Section } from "../../properties-panel/props-builder.js";
 import type { ModalSize } from "./constants.js";
 import type { PerCornerBorderRadius, PerSideBorder } from "@superblocksteam/library-shared/types";
 export declare const propertiesDefinition: {
-    layout: Section<((Record<string, Prop<any, any>> & ((Omit<{
-        layout: Prop<import("../../component-base/constants.js").ContainerLayout, true>;
-    }, "layout" | "rows" | "columns" | "rowSize"> & {
-        readonly layout: Prop<"freeform", true>;
-        readonly columns: Prop<number, true>;
-        readonly rows: Prop<number, false>;
-        readonly rowSize: Prop<number, false>;
-    }) | (Omit<{
+    layout: Section<Record<string, Prop<any, any>> & ((Omit<{
         layout: Prop<import("../../component-base/constants.js").ContainerLayout, true>;
     }, "layout" | "verticalAlign" | "horizontalAlign"> & {
         readonly verticalAlign: Prop<"center" | "space-around" | "space-between" | "bottom" | "top", true>;
@@ -21,20 +14,23 @@ export declare const propertiesDefinition: {
         readonly verticalAlign: Prop<"center" | "bottom" | "top", true>;
         readonly horizontalAlign: Prop<"center" | "space-around" | "space-between" | "left" | "right", true>;
         readonly layout: Prop<"horizontal", true>;
-    }))) & {
-        spacing: Prop<import("@superblocksteam/library-shared").Dim<"px">, true>;
-    }) & {
-        padding: Prop<import("@superblocksteam/library-shared/types").Spacing, true>;
-    }>;
+    }) | (Omit<{
+        layout: Prop<import("../../component-base/constants.js").ContainerLayout, true>;
+    }, "layout" | "columns" | "rowHeight"> & {
+        readonly columns: Prop<number, true>;
+        readonly rowHeight: Prop<import("@superblocksteam/library-shared").Dim<"px">, true>;
+        readonly layout: Prop<"freeform", true>;
+    }))>;
     appearance: Section<Record<string, Prop<any, any>> & {
-        backgroundColor: Prop<string, false>;
+        backgroundColor: Prop<string, true>;
         border: Prop<PerSideBorder, false>;
         borderRadius: Prop<PerCornerBorderRadius, false>;
         hasBackdrop: Prop<boolean, true>;
         widthPreset: Prop<ModalSize, true>;
+        loading: Prop<boolean, true>;
     }>;
     interaction: Section<Record<string, Prop<any, any>> & {
-        canOutsideClickClose: Prop<boolean, true>;
+        closeOnClickOutside: Prop<boolean, true>;
     }>;
     events: Section<Record<string, Prop<any, any>> & {
         onOpen: Prop<import("../../sb-event-flow.js").SbEventFlow, false>;

package/dist-types/lib/user-facing/components/page/index.d.ts

@@ -7,6 +7,9 @@ export declare const SbPage: import("react").FC<import("../../properties-panel/p
         width: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false>;
         height: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false>;
     }>;
+    appearance: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any>> & {
+        loading: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
+    }>;
     events: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any>> & {
         onLoad: import("../../properties-panel/props-builder.js").Prop<import("../../sb-event-flow.js").SbEventFlow, false>;
     }>;

package/dist-types/lib/user-facing/components/page/props.d.ts

@@ -9,6 +9,9 @@ export declare const propertiesDefinition: {
         width: Prop<Dim<import("@superblocksteam/library-shared").DimModes>, false>;
         height: Prop<Dim<import("@superblocksteam/library-shared").DimModes>, false>;
     }>;
+    appearance: Section<Record<string, Prop<any, any>> & {
+        loading: Prop<boolean, true>;
+    }>;
     events: Section<Record<string, Prop<any, any>> & {
         onLoad: Prop<import("../../sb-event-flow.js").SbEventFlow, false>;
     }>;

package/dist-types/lib/user-facing/components/pixel-input/index.d.ts

@@ -0,0 +1,7 @@
+import type { InputNumberProps } from "antd";
+export interface PixelInputProps extends InputNumberProps<number> {
+    showResetToDefault?: boolean;
+    dataTest?: string;
+    unit?: string;
+}
+export declare const PixelInput: (props: PixelInputProps) => import("react").JSX.Element;

package/dist-types/lib/user-facing/components/section/index.d.ts

@@ -17,7 +17,8 @@ export declare const SbSection: import("react").FC<import("../../properties-pane
         isVisible: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
     }>;
     appearance: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any>> & {
-        backgroundColor: import("../../properties-panel/props-builder.js").Prop<string, false>;
-        border: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").PerSideBorder, true>;
+        backgroundColor: import("../../properties-panel/props-builder.js").Prop<string, true>;
+        border: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").PerSideBorder, false>;
+        loading: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
     }>;
 }>>;

package/dist-types/lib/user-facing/components/section/props.d.ts

@@ -20,7 +20,8 @@ export declare const propertiesDefinition: {
         isVisible: Prop<boolean, true>;
     }>;
     appearance: Section<Record<string, Prop<any, any>> & {
-        backgroundColor: Prop<string, false>;
-        border: Prop<import("@superblocksteam/library-shared/types").PerSideBorder, true>;
+        backgroundColor: Prop<string, true>;
+        border: Prop<import("@superblocksteam/library-shared/types").PerSideBorder, false>;
+        loading: Prop<boolean, true>;
     }>;
 };

package/dist-types/lib/user-facing/components/slideout/props.d.ts

@@ -1,5 +1,6 @@
+import { Section } from "../../properties-panel/props-builder.js";
 export declare const propertiesDefinition: {
-    layout: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any>> & {
+    layout: Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any>> & {
         maxHeight?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false> | undefined;
         minHeight?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false> | undefined;
         maxWidth?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false> | undefined;
@@ -11,4 +12,7 @@ export declare const propertiesDefinition: {
     } & {
         isVisible: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
     }>;
+    appearance: Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any>> & {
+        loading: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
+    }>;
 };

package/dist-types/lib/user-facing/components/stack/index.d.ts

@@ -21,8 +21,9 @@ declare const _propertiesDefinitionVStack: {
     }>;
     appearance: Section<Record<string, Prop<any, any>> & {
         backgroundColor: Prop<string, false>;
-        border: Prop<import("@superblocksteam/library-shared/types").PerSideBorder, true>;
+        border: Prop<import("@superblocksteam/library-shared/types").PerSideBorder, false>;
         borderRadius: Prop<import("@superblocksteam/library-shared/types").PerCornerBorderRadius, true>;
+        loading: Prop<boolean, true>;
     }>;
 };
 declare const _propertiesDefinitionHStack: {
@@ -43,11 +44,12 @@ declare const _propertiesDefinitionHStack: {
     }>;
     appearance: Section<Record<string, Prop<any, any>> & {
         backgroundColor: Prop<string, false>;
-        border: Prop<import("@superblocksteam/library-shared/types").PerSideBorder, true>;
+        border: Prop<import("@superblocksteam/library-shared/types").PerSideBorder, false>;
         borderRadius: Prop<import("@superblocksteam/library-shared/types").PerCornerBorderRadius, true>;
+        loading: Prop<boolean, true>;
     }>;
 };
-type OptionalProps = "verticalAlign" | "horizontalAlign" | "margin" | "padding" | "spacing" | "backgroundColor" | "border" | "borderRadius" | "shouldScrollContents";
+type OptionalProps = "verticalAlign" | "horizontalAlign" | "margin" | "padding" | "spacing" | "backgroundColor" | "border" | "borderRadius" | "shouldScrollContents" | "loading";
 type InternalVStackProps = InternalPropsWithOptional<typeof _propertiesDefinitionVStack, OptionalProps>;
 type InternalHStackProps = InternalPropsWithOptional<typeof _propertiesDefinitionHStack, OptionalProps> & {
     [key: string]: any;

package/dist-types/lib/user-facing/components/switch/index.d.ts

@@ -35,7 +35,7 @@ export declare const SbSwitch: import("react").FC<import("../../properties-panel
         isChecked: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
     }>;
     derived: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any>> & {
-        value: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
+        isToggledOn: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
         validationErrors: import("../../properties-panel/props-builder.js").Prop<any, true>;
         isValid: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
         showError: import("../../properties-panel/props-builder.js").Prop<boolean, true>;

package/dist-types/lib/user-facing/components/switch/props.d.ts

@@ -36,7 +36,7 @@ export declare const propertiesDefinition: {
         isChecked: Prop<boolean, true>;
     }>;
     derived: Section<Record<string, Prop<any, any>> & {
-        value: Prop<boolean, true>;
+        isToggledOn: Prop<boolean, true>;
         validationErrors: Prop<any, true>;
         isValid: Prop<boolean, true>;
         showError: Prop<boolean, true>;