@superblocksteam/library 2.0.11-next.9 → 2.0.11

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

@@ -1,6 +1,79 @@
-import React from "react";
 import type { OptionValue } from "./types.js";
-export declare const Dropdown: React.FC<import("../../properties-panel/props-builder.js").ExternalProps<{
+export declare const Dropdown: import("../../../internal-details/sb-wrapper.jsx").ChainableComponent<{
+    general: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        label: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
+        options: import("../../properties-panel/props-builder.js").Prop<import("./types.js").UnknownOption[], false, undefined>;
+        defaultValue: import("../../properties-panel/props-builder.js").Prop<string, false, undefined>;
+        transformation: import("../../properties-panel/props-builder.js").Prop<{
+            value: string;
+            label: string;
+            icon?: string;
+        }, false, undefined>;
+    }>;
+    appearance: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        labelPosition: import("../../properties-panel/props-builder.js").Prop<"top" | "left", true, undefined>;
+        labelStyle: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").TextStyleWithVariant, true, undefined>;
+        icon: import("../../properties-panel/props-builder.js").Prop<string, false, undefined>;
+        placeholder: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
+        textStyle: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").TextStyleWithVariant, true, undefined>;
+        loading: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+    }>;
+    layout: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        padding: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").Spacing, true, undefined>;
+    } & {
+        width: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<"fill" | "rows" | "columns" | "px" | "%">, false, undefined>;
+        maxHeight?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined> | undefined;
+        minHeight?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined> | undefined;
+        maxWidth?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined> | undefined;
+        minWidth?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined> | undefined;
+        height: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined>;
+    } & {
+        margin: import("../../properties-panel/props-builder.js").Prop<{
+            top: import("@superblocksteam/library-shared").Dim<"px">;
+            bottom: import("@superblocksteam/library-shared").Dim<"px">;
+            left: import("@superblocksteam/library-shared").Dim<"px">;
+            right: import("@superblocksteam/library-shared").Dim<"px">;
+        } | undefined, true, undefined>;
+    } & {
+        isVisible: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+    }>;
+    interaction: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        customValidationRule: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
+        customErrorMessage: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
+        multiselect: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+        allowSelectAll: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+        allowClearing: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+        clientSideFiltering: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+        required: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+        isDisabled: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+        errorMessagePlacement: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/props").ErrorMessagePlacement, true, undefined>;
+    }>;
+    events: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        onOptionChange: import("../../properties-panel/props-builder.js").Prop<import("../../event-flow.js").EventFlow, false, undefined>;
+        onSearchTextChange: import("../../properties-panel/props-builder.js").Prop<import("../../event-flow.js").EventFlow, false, undefined>;
+        onClear: import("../../properties-panel/props-builder.js").Prop<import("../../event-flow.js").EventFlow, false, undefined>;
+    }>;
+    meta: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        metaSelectedOptionValue: import("../../properties-panel/props-builder.js").Prop<any, true, undefined>;
+        metaSelectedOptionValueArr: import("../../properties-panel/props-builder.js").Prop<any, true, undefined>;
+        isTouched: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+        searchText: import("../../properties-panel/props-builder.js").Prop<any, false, undefined>;
+    }>;
+    derived: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        value: import("../../properties-panel/props-builder.js").Prop<any, true, undefined>;
+        defaultTransformation: import("../../properties-panel/props-builder.js").Prop<import("./types.js").DropdownOptionsTransformation, true, undefined>;
+        transformedOptions: import("../../properties-panel/props-builder.js").Prop<import("./types.js").TransformedDropdownOption[], true, undefined>;
+        validationErrors: import("../../properties-panel/props-builder.js").Prop<any, true, undefined>;
+        selectedOptionValue: import("../../properties-panel/props-builder.js").Prop<OptionValue, true, undefined>;
+        selectedOptionValues: import("../../properties-panel/props-builder.js").Prop<OptionValue[], true, undefined>;
+        selectedOption: import("../../properties-panel/props-builder.js").Prop<import("./types.js").ExternalDropdownOption, true, undefined>;
+        selectedOptionArr: import("../../properties-panel/props-builder.js").Prop<import("./types.js").ExternalDropdownOption[], true, undefined>;
+        selectedIndex: import("../../properties-panel/props-builder.js").Prop<number, true, undefined>;
+        selectedIndexArr: import("../../properties-panel/props-builder.js").Prop<number[], true, undefined>;
+        isValid: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+        showError: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+    }>;
+}, import("../../properties-panel/props-builder.js").ExternalProps<{
     general: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
         label: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
         options: import("../../properties-panel/props-builder.js").Prop<import("./types.js").UnknownOption[], false, undefined>;

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

@@ -1,4 +1,27 @@
-export declare const Icon: import("react").FC<import("../../properties-panel/props-builder.js").ExternalProps<{
+export declare const Icon: import("../../../internal-details/sb-wrapper.jsx").ChainableComponent<{
+    general: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        icon: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
+    }>;
+    layout: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        size: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, true, undefined>;
+    } & {
+        margin: import("../../properties-panel/props-builder.js").Prop<{
+            top: import("@superblocksteam/library-shared").Dim<"px">;
+            bottom: import("@superblocksteam/library-shared").Dim<"px">;
+            left: import("@superblocksteam/library-shared").Dim<"px">;
+            right: import("@superblocksteam/library-shared").Dim<"px">;
+        } | undefined, true, undefined>;
+    } & {
+        isVisible: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+    }>;
+    appearance: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        color: import("../../properties-panel/props-builder.js").Prop<string, false, undefined>;
+        loading: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+    }>;
+    events: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        onClick: import("../../properties-panel/props-builder.js").Prop<import("../../event-flow.js").EventFlow, false, undefined>;
+    }>;
+}, import("../../properties-panel/props-builder.js").ExternalProps<{
     general: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
         icon: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
     }>;

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

@@ -1,4 +1,36 @@
-export declare const Image: import("react").FC<import("../../properties-panel/props-builder.js").ExternalProps<{
+export declare const Image: import("../../../internal-details/sb-wrapper.jsx").ChainableComponent<{
+    general: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        src: import("../../properties-panel/props-builder.js").Prop<string, false, undefined>;
+    }>;
+    appearance: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        backgroundColor: import("../../properties-panel/props-builder.js").Prop<string, false, undefined>;
+        border: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").PerSideBorder, false, undefined>;
+        borderRadius: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").PerCornerBorderRadius, true, undefined>;
+        fillContainer: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+        align: import("../../properties-panel/props-builder.js").Prop<import("./props.js").ImageAlign, true, undefined>;
+        loading: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+    }>;
+    layout: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        maxHeight?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined> | undefined;
+        minHeight?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined> | undefined;
+        maxWidth?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined> | undefined;
+        minWidth?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined> | undefined;
+        width: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined>;
+        height: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined>;
+    } & {
+        margin: import("../../properties-panel/props-builder.js").Prop<{
+            top: import("@superblocksteam/library-shared").Dim<"px">;
+            bottom: import("@superblocksteam/library-shared").Dim<"px">;
+            left: import("@superblocksteam/library-shared").Dim<"px">;
+            right: import("@superblocksteam/library-shared").Dim<"px">;
+        } | undefined, true, undefined>;
+    } & {
+        isVisible: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+    }>;
+    events: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        onClick: import("../../properties-panel/props-builder.js").Prop<import("../../event-flow.js").EventFlow, false, undefined>;
+    }>;
+}, import("../../properties-panel/props-builder.js").ExternalProps<{
     general: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
         src: import("../../properties-panel/props-builder.js").Prop<string, false, undefined>;
     }>;

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

@@ -0,0 +1,3 @@
+import type { propertiesDefinition } from "./props.js";
+import type { EditorTemplate } from "../../../internal-details/sb-wrapper.jsx";
+export declare const editorTemplate: EditorTemplate<typeof propertiesDefinition>;

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

@@ -1,4 +1,97 @@
-export declare const Input: import("react").FC<import("../../properties-panel/props-builder.js").ExternalProps<{
+export declare const Input: import("../../../internal-details/sb-wrapper.jsx").ChainableComponent<{
+    general: import("../../properties-panel/props-builder.js").Section<(Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & ({
+        label: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
+    } & (Omit<{
+        inputType: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
+    }, "inputType" | "currency" | "numberFormat" | "currencyCodeDisplay"> & ({
+        inputType: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
+        numberFormat: import("../../properties-panel/props-builder.js").Prop<"unformatted" | NonNullable<"compact" | "standard" | "scientific" | "engineering" | undefined>, true, undefined>;
+        currency?: undefined;
+        currencyCodeDisplay?: undefined;
+    } | {
+        inputType: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
+        numberFormat: import("../../properties-panel/props-builder.js").Prop<"unformatted" | NonNullable<"compact" | "standard" | "scientific" | "engineering" | undefined>, true, undefined>;
+        currency: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
+        currencyCodeDisplay: import("../../properties-panel/props-builder.js").Prop<import("./types.js").CurrencyCodeDisplayType, true, undefined>;
+    })))) & {
+        defaultValue: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
+    }>;
+    appearance: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        labelPosition: import("../../properties-panel/props-builder.js").Prop<"top" | "left", true, undefined>;
+        labelStyle: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").TextStyleWithVariant, true, undefined>;
+        placeholderText: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
+        textStyle: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").TextStyleWithVariant, true, undefined>;
+        backgroundColor: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
+        border: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").PerSideBorder, true, undefined>;
+        borderRadius: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").PerCornerBorderRadius, true, undefined>;
+        icon: import("../../properties-panel/props-builder.js").Prop<string, false, undefined>;
+        iconPosition: import("../../properties-panel/props-builder.js").Prop<import("../../icons/constants.js").IconPosition, true, undefined>;
+    } & Omit<{
+        inputType: import("../../properties-panel/props-builder.js").Prop<string, false, undefined>;
+    }, "inputType"> & {
+        inputType: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
+    } & {
+        loading: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+    }>;
+    layout: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        padding: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").Spacing, true, undefined>;
+    } & {
+        width: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<"fill" | "rows" | "columns" | "px" | "%">, false, undefined>;
+        maxHeight?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined> | undefined;
+        minHeight?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined> | undefined;
+        maxWidth?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined> | undefined;
+        minWidth?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined> | undefined;
+        height: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined>;
+    } & {
+        margin: import("../../properties-panel/props-builder.js").Prop<{
+            top: import("@superblocksteam/library-shared").Dim<"px">;
+            bottom: import("@superblocksteam/library-shared").Dim<"px">;
+            left: import("@superblocksteam/library-shared").Dim<"px">;
+            right: import("@superblocksteam/library-shared").Dim<"px">;
+        } | undefined, true, undefined>;
+    } & {
+        labelWidth: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim, true, undefined>;
+    } & {
+        isVisible: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+    }>;
+    interaction: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & Omit<{
+        inputType: import("../../properties-panel/props-builder.js").Prop<string, false, undefined>;
+    }, "inputType" | "stepper" | "stepSize" | "minDecimals" | "maxDecimals"> & {
+        stepper: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+        stepSize: import("../../properties-panel/props-builder.js").Prop<number, true, undefined>;
+        minDecimals: import("../../properties-panel/props-builder.js").Prop<number, false, undefined>;
+        maxDecimals: import("../../properties-panel/props-builder.js").Prop<number, false, undefined>;
+        inputType: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
+    } & Omit<{
+        inputType: import("../../properties-panel/props-builder.js").Prop<string, false, undefined>;
+    }, "maxLength" | "minLength" | "inputType"> & {
+        minLength: import("../../properties-panel/props-builder.js").Prop<number, false, undefined>;
+        maxLength: import("../../properties-panel/props-builder.js").Prop<number, false, undefined>;
+        inputType: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
+    } & {
+        errorMessagePlacement: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/props").ErrorMessagePlacement, true, undefined>;
+        customValidationRule: import("../../properties-panel/props-builder.js").Prop<any, false, undefined>;
+        customErrorMessage: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
+        isDisabled: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+        required: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+    }>;
+    events: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        onTextChanged: import("../../properties-panel/props-builder.js").Prop<import("../../event-flow.js").EventFlow, false, undefined>;
+        onSubmit: import("../../properties-panel/props-builder.js").Prop<import("../../event-flow.js").EventFlow, false, undefined>;
+        onFocus: import("../../properties-panel/props-builder.js").Prop<import("../../event-flow.js").EventFlow, false, undefined>;
+        onFocusOut: import("../../properties-panel/props-builder.js").Prop<import("../../event-flow.js").EventFlow, false, undefined>;
+    }>;
+    meta: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        text: import("../../properties-panel/props-builder.js").Prop<string | undefined, false, undefined>;
+        isTouched: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+    }>;
+    derived: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        value: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
+        validationErrors: import("../../properties-panel/props-builder.js").Prop<import("../../component-base/utils/input-validation.js").ValidationErrors, true, undefined>;
+        isValid: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+        showError: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+    }>;
+}, import("../../properties-panel/props-builder.js").ExternalProps<{
     general: import("../../properties-panel/props-builder.js").Section<(Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & ({
         label: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
     } & (Omit<{

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

@@ -1,6 +1,44 @@
 import { Dim } from "@superblocksteam/library-shared";
 import type { ContainerLayout } from "../../component-base/constants.js";
-export declare const Modal: import("react").FC<import("../../properties-panel/props-builder.js").ExternalProps<{
+export declare const Modal: import("../../../internal-details/sb-wrapper.jsx").ChainableComponent<{
+    layout: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & ((Omit<{
+        layout: import("../../properties-panel/props-builder.js").Prop<ContainerLayout, true, undefined>;
+    }, "layout" | "verticalAlign" | "horizontalAlign"> & {
+        readonly verticalAlign: import("../../properties-panel/props-builder.js").Prop<"center" | "top" | "bottom" | "space-around" | "space-between", true, undefined>;
+        readonly horizontalAlign: import("../../properties-panel/props-builder.js").Prop<"center" | "left" | "right", true, undefined>;
+        readonly layout: import("../../properties-panel/props-builder.js").Prop<"vertical", true, undefined>;
+    }) | (Omit<{
+        layout: import("../../properties-panel/props-builder.js").Prop<ContainerLayout, true, undefined>;
+    }, "layout" | "verticalAlign" | "horizontalAlign"> & {
+        readonly verticalAlign: import("../../properties-panel/props-builder.js").Prop<"center" | "top" | "bottom", true, undefined>;
+        readonly horizontalAlign: import("../../properties-panel/props-builder.js").Prop<"center" | "space-around" | "space-between" | "left" | "right", true, undefined>;
+        readonly layout: import("../../properties-panel/props-builder.js").Prop<"horizontal", true, undefined>;
+    }) | (Omit<{
+        layout: import("../../properties-panel/props-builder.js").Prop<ContainerLayout, true, undefined>;
+    }, "layout" | "columns" | "rowHeight"> & {
+        readonly columns: import("../../properties-panel/props-builder.js").Prop<number, true, undefined>;
+        readonly rowHeight: import("../../properties-panel/props-builder.js").Prop<Dim<"px">, true, undefined>;
+        readonly layout: import("../../properties-panel/props-builder.js").Prop<"freeform", true, undefined>;
+    }))>;
+    appearance: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        backgroundColor: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
+        border: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").PerSideBorder, false, undefined>;
+        borderRadius: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").PerCornerBorderRadius, false, undefined>;
+        hasBackdrop: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+        widthPreset: import("../../properties-panel/props-builder.js").Prop<import("./constants.js").ModalSize, true, undefined>;
+        loading: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+    }>;
+    interaction: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        closeOnClickOutside: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+    }>;
+    events: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        onOpen: import("../../properties-panel/props-builder.js").Prop<import("../../event-flow.js").EventFlow, false, undefined>;
+        onClose: import("../../properties-panel/props-builder.js").Prop<import("../../event-flow.js").EventFlow, false, undefined>;
+    }>;
+    meta: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        isOpen: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+    }>;
+}, 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, undefined>> & ((Omit<{
         layout: import("../../properties-panel/props-builder.js").Prop<ContainerLayout, true, undefined>;
     }, "layout" | "verticalAlign" | "horizontalAlign"> & {

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

@@ -1,4 +1,22 @@
-export declare const Page: import("react").FC<import("../../properties-panel/props-builder.js").ExternalProps<{
+export declare const Page: import("../../../internal-details/sb-wrapper.jsx").ChainableComponent<{
+    contents: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        columns: import("../../properties-panel/props-builder.js").Prop<string[], false, undefined>;
+    }>;
+    layout: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        maxHeight?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined> | undefined;
+        minHeight?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined> | undefined;
+        maxWidth?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined> | undefined;
+        minWidth?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined> | undefined;
+        width: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined>;
+        height: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined>;
+    }>;
+    appearance: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        loading: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+    }>;
+    events: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        onLoad: import("../../properties-panel/props-builder.js").Prop<import("../../event-flow.js").EventFlow, false, undefined>;
+    }>;
+}, import("../../properties-panel/props-builder.js").ExternalProps<{
     contents: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
         columns: import("../../properties-panel/props-builder.js").Prop<string[], false, undefined>;
     }>;

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

@@ -1,4 +1,27 @@
-export declare const Section: import("react").FC<import("../../properties-panel/props-builder.js").ExternalProps<{
+export declare const Section: import("../../../internal-details/sb-wrapper.jsx").ChainableComponent<{
+    contents: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        columns: import("../../properties-panel/props-builder.js").Prop<string[], false, undefined>;
+    }>;
+    layout: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        padding: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").Spacing, true, undefined>;
+    } & {
+        maxHeight?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined> | undefined;
+        minHeight?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined> | undefined;
+        maxWidth?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined> | undefined;
+        minWidth?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined> | undefined;
+        width: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined>;
+        height: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined>;
+    } & {
+        sticky: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+    } & {
+        isVisible: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+    }>;
+    appearance: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        backgroundColor: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
+        border: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").PerSideBorder, false, undefined>;
+        loading: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+    }>;
+}, import("../../properties-panel/props-builder.js").ExternalProps<{
     contents: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
         columns: import("../../properties-panel/props-builder.js").Prop<string[], false, undefined>;
     }>;

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

@@ -1,6 +1,44 @@
 import { Dim } from "@superblocksteam/library-shared";
 import type { ContainerLayout } from "../../component-base/constants.js";
-export declare const Slideout: import("react").FC<import("../../properties-panel/props-builder.js").ExternalProps<{
+export declare const Slideout: import("../../../internal-details/sb-wrapper.jsx").ChainableComponent<{
+    layout: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & ((Omit<{
+        layout: import("../../properties-panel/props-builder.js").Prop<ContainerLayout, true, undefined>;
+    }, "layout" | "verticalAlign" | "horizontalAlign"> & {
+        readonly verticalAlign: import("../../properties-panel/props-builder.js").Prop<"center" | "top" | "bottom" | "space-around" | "space-between", true, undefined>;
+        readonly horizontalAlign: import("../../properties-panel/props-builder.js").Prop<"center" | "left" | "right", true, undefined>;
+        readonly layout: import("../../properties-panel/props-builder.js").Prop<"vertical", true, undefined>;
+    }) | (Omit<{
+        layout: import("../../properties-panel/props-builder.js").Prop<ContainerLayout, true, undefined>;
+    }, "layout" | "verticalAlign" | "horizontalAlign"> & {
+        readonly verticalAlign: import("../../properties-panel/props-builder.js").Prop<"center" | "top" | "bottom", true, undefined>;
+        readonly horizontalAlign: import("../../properties-panel/props-builder.js").Prop<"center" | "space-around" | "space-between" | "left" | "right", true, undefined>;
+        readonly layout: import("../../properties-panel/props-builder.js").Prop<"horizontal", true, undefined>;
+    }) | (Omit<{
+        layout: import("../../properties-panel/props-builder.js").Prop<ContainerLayout, true, undefined>;
+    }, "layout" | "columns" | "rowHeight"> & {
+        readonly columns: import("../../properties-panel/props-builder.js").Prop<number, true, undefined>;
+        readonly rowHeight: import("../../properties-panel/props-builder.js").Prop<Dim<"px">, true, undefined>;
+        readonly layout: import("../../properties-panel/props-builder.js").Prop<"freeform", true, undefined>;
+    }))>;
+    appearance: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        backgroundColor: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
+        border: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").PerSideBorder, false, undefined>;
+        borderRadius: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").PerCornerBorderRadius, false, undefined>;
+        hasBackdrop: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+        widthPreset: import("../../properties-panel/props-builder.js").Prop<import("./constants.js").SlideoutSize, true, undefined>;
+        loading: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+    }>;
+    interaction: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        closeOnClickOutside: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+    }>;
+    events: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        onOpen: import("../../properties-panel/props-builder.js").Prop<import("../../event-flow.js").EventFlow, false, undefined>;
+        onClose: import("../../properties-panel/props-builder.js").Prop<import("../../event-flow.js").EventFlow, false, undefined>;
+    }>;
+    meta: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        isOpen: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+    }>;
+}, 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, undefined>> & ((Omit<{
         layout: import("../../properties-panel/props-builder.js").Prop<ContainerLayout, true, undefined>;
     }, "layout" | "verticalAlign" | "horizontalAlign"> & {

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

@@ -1,4 +1,51 @@
-export declare const Switch: import("react").FC<import("../../properties-panel/props-builder.js").ExternalProps<{
+export declare const Switch: import("../../../internal-details/sb-wrapper.jsx").ChainableComponent<{
+    general: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        label: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
+        defaultChecked: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+    }>;
+    appearance: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        labelPosition: import("../../properties-panel/props-builder.js").Prop<"left" | "right", true, undefined>;
+        labelStyle: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").TextStyleWithVariant, true, undefined>;
+        loadingAnimation: import("../../properties-panel/props-builder.js").Prop<boolean, false, undefined>;
+    }>;
+    layout: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        maxHeight?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined> | undefined;
+        minHeight?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined> | undefined;
+        maxWidth?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined> | undefined;
+        minWidth?: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined> | undefined;
+        width: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined>;
+        height: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared").Dim<import("@superblocksteam/library-shared").DimModes>, false, undefined>;
+    } & {
+        margin: import("../../properties-panel/props-builder.js").Prop<{
+            top: import("@superblocksteam/library-shared").Dim<"px">;
+            bottom: import("@superblocksteam/library-shared").Dim<"px">;
+            left: import("@superblocksteam/library-shared").Dim<"px">;
+            right: import("@superblocksteam/library-shared").Dim<"px">;
+        } | undefined, true, undefined>;
+    } & {
+        isVisible: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+    }>;
+    interaction: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        customValidationRule: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
+        customErrorMessage: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
+        required: import("../../properties-panel/props-builder.js").Prop<boolean, false, undefined>;
+        isDisabled: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+        errorMessagePlacement: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/props").ErrorMessagePlacement, true, undefined>;
+    }>;
+    events: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        onSwitchChange: import("../../properties-panel/props-builder.js").Prop<import("../../event-flow.js").EventFlow, false, undefined>;
+    }>;
+    meta: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        isTouched: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+        isChecked: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+    }>;
+    derived: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
+        isToggledOn: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+        validationErrors: import("../../properties-panel/props-builder.js").Prop<any, true, undefined>;
+        isValid: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+        showError: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;
+    }>;
+}, import("../../properties-panel/props-builder.js").ExternalProps<{
     general: import("../../properties-panel/props-builder.js").Section<Record<string, import("../../properties-panel/props-builder.js").Prop<any, any, undefined>> & {
         label: import("../../properties-panel/props-builder.js").Prop<string, true, undefined>;
         defaultChecked: import("../../properties-panel/props-builder.js").Prop<boolean, true, undefined>;