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

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

@@ -1,11 +1,7 @@
 import type { IconPosition } from "../../icons/constants";
 import type { Dim, DimModes } from "@superblocksteam/library-shared";
 import type { TextStyleWithVariant, UserAccessibleTheme, PerCornerBorderRadius, PerSideBorder } from "@superblocksteam/library-shared/types";
-export declare enum PaginationTypes {
-    NONE = "NONE",
-    CLIENT_SIDE = "CLIENT_SIDE",
-    SERVER_SIDE = "SERVER_SIDE"
-}
+export type PaginationType = "none" | "client-side" | "server-side";
 export interface TableFilters {
     byColumn?: {
         [column: string]: ColumnFilter;
@@ -59,30 +55,25 @@ interface Condition2 {
     param1: any;
     param2: any;
 }
-export declare const CompactMode: {
-    readonly SHORT: "SHORT";
-    readonly DEFAULT: "DEFAULT";
-    readonly TALL: "TALL";
-    readonly VERY_SHORT: "VERY_SHORT";
+export declare const RowDensity: {
+    readonly "extra-small": "extra-small";
+    readonly small: "small";
+    readonly medium: "medium";
+    readonly large: "large";
 };
-export type CompactMode = (typeof CompactMode)[keyof typeof CompactMode];
-export declare enum CellAlignmentTypes {
-    LEFT = "LEFT",
-    RIGHT = "RIGHT",
-    CENTER = "CENTER"
-}
-export declare enum VerticalAlignmentTypes {
-    TOP = "TOP",
-    BOTTOM = "BOTTOM",
-    CENTER = "CENTER"
-}
-export declare enum TextSizes {
-    HEADING1 = "HEADING1",
-    HEADING2 = "HEADING2",
-    HEADING3 = "HEADING3",
-    PARAGRAPH = "PARAGRAPH",
-    PARAGRAPH2 = "PARAGRAPH2"
-}
+export type RowDensity = (typeof RowDensity)[keyof typeof RowDensity];
+export declare const HorizontalAlignment: {
+    readonly left: "left";
+    readonly right: "right";
+    readonly center: "center";
+};
+export type HorizontalAlignment = (typeof HorizontalAlignment)[keyof typeof HorizontalAlignment];
+export declare const VerticalAlignment: {
+    readonly top: "top";
+    readonly bottom: "bottom";
+    readonly center: "center";
+};
+export type VerticalAlignment = (typeof VerticalAlignment)[keyof typeof VerticalAlignment];
 export declare enum EditInputType {
     Text = "TEXT",
     Number = "NUMBER",
@@ -91,12 +82,7 @@ export declare enum EditInputType {
     Checkbox = "CHECKBOX",
     Date = "DATE"
 }
-export declare enum BooleanStyleFalse {
-    EMPTY = "EMPTY",
-    CLOSE = "CLOSE",
-    MINUS = "MINUS",
-    EMPTY_CHECKBOX = "EMPTY_CHECKBOX"
-}
+export type BooleanStyleFalse = "empty" | "close" | "minus" | "empty_checkbox";
 export declare enum ImageSize {
     Fixed = "FIXED",
     Fit = "FIT",
@@ -178,27 +164,18 @@ export declare const ColumnType: {
 export type ColumnType = (typeof ColumnType)[keyof typeof ColumnType];
 export interface TableStyles {
     cellBackground?: string;
-    textColor?: string;
-    textSize?: TextSize;
-    fontStyle?: string;
-    horizontalAlign?: CellAlignment;
+    horizontalAlign?: HorizontalAlignment;
     verticalAlign?: VerticalAlignment;
 }
-export type Pagination = keyof typeof PaginationTypes;
-type CellAlignment = keyof typeof CellAlignmentTypes;
-type VerticalAlignment = keyof typeof VerticalAlignmentTypes;
-type TextSize = keyof typeof TextSizes;
 export type SingleCellProperties = ColumnPropertiesForEditing & {
-    horizontalAlign?: CellAlignment;
+    horizontalAlign?: HorizontalAlignment;
     verticalAlign?: VerticalAlignment;
-    textSize?: TextSize;
-    fontStyle?: string;
-    textColor?: string;
     cellTextStyle?: TextStyleWithVariant;
     cellBackground?: string;
     buttonBackgroundColor?: string;
+    buttonBorder?: PerSideBorder;
     buttonVariant?: string;
-    buttonLabelColor?: string;
+    buttonTextStyle?: TextStyleWithVariant;
     buttonLabel?: string;
     cellIcon?: string;
     cellIconPosition?: IconPosition;
@@ -208,8 +185,9 @@ export type SingleCellProperties = ColumnPropertiesForEditing & {
     isDisabled?: boolean;
     displayedValue?: string;
     textWrap?: boolean;
+    tagsWrap?: boolean;
     dropdownIcon?: string;
-    imageBorderRadius?: Dim<DimModes>;
+    imageBorderRadius?: PerCornerBorderRadius;
     imageSize?: ImageSize;
     openImageUrl?: boolean;
     inputFormat?: string;
@@ -251,17 +229,13 @@ interface ColumnPropertiesForEditing {
 export type TagDisplayConfig = {
     color: string;
 };
-export type ColumnPropertyFunctionArgs = {
-    onComplete?: () => void;
-    context: ColumnContext | Record<string, unknown>;
-};
 export type ColumnPropertyFunctions = {
-    onClick?: (args: ColumnPropertyFunctionArgs) => void;
-    onDropdownSearchTextChanged?: (args: ColumnPropertyFunctionArgs) => void;
-    onOptionChange?: (args: ColumnPropertyFunctionArgs) => void;
-    onFocusOut?: (args: ColumnPropertyFunctionArgs) => void;
-    onDateSelected?: (args: ColumnPropertyFunctionArgs) => void;
-    onCheckChange?: (args: ColumnPropertyFunctionArgs) => void;
+    onClick?: (args: RowContext) => Promise<void>;
+    onDropdownSearchTextChanged?: () => void;
+    onOptionChange?: () => void;
+    onFocusOut?: () => void;
+    onDateSelected?: () => void;
+    onCheckChange?: () => void;
 };
 export interface ColumnProperties extends ColumnEditConfigs, ColumnPropertiesForEditing, ColumnPropertyFunctions {
     id: string;
@@ -273,11 +247,8 @@ export interface ColumnProperties extends ColumnEditConfigs, ColumnPropertiesFor
     index: number;
     width: number;
     cellBackground?: string;
-    horizontalAlign?: CellAlignment;
+    horizontalAlign?: HorizontalAlignment;
     verticalAlign?: VerticalAlignment;
-    textSize?: TextSize;
-    fontStyle?: string;
-    textColor?: string;
     cellProps?: {
         textStyle: TextStyleWithVariant;
     };
@@ -287,11 +258,14 @@ export interface ColumnProperties extends ColumnEditConfigs, ColumnPropertiesFor
     computedValue: string | string[];
     displayedValue?: string | string[];
     buttonLabel?: string;
-    buttonStyle?: string;
+    buttonBackgroundColor?: string;
+    buttonBorder?: PerSideBorder;
     buttonVariant?: string;
-    buttonLabelColor?: string;
+    buttonTextStyle?: TextStyleWithVariant;
     cellIcon?: string;
     cellIconPosition?: IconPosition;
+    buttonIcon?: string;
+    buttonIconPosition?: IconPosition;
     isDisabled?: boolean;
     linkUrl?: string;
     linkLabel?: string;
@@ -300,12 +274,13 @@ export interface ColumnProperties extends ColumnEditConfigs, ColumnPropertiesFor
     isEditable?: boolean | string;
     isFrozen?: boolean;
     textWrap?: boolean;
+    tagsWrap?: boolean;
     tagDisplayConfig: Record<string, TagDisplayConfig>;
     imageSize?: ImageSize;
-    imageBorderRadius?: Dim<DimModes>;
+    imageBorderRadius?: PerCornerBorderRadius;
     openImageUrl?: boolean;
-    outputFormat?: string | string[];
-    inputFormat?: string | string[];
+    outputFormat?: string;
+    inputFormat?: string;
 }
 export type EditProps = ColumnEditConfigs & {
     handleEditStart: () => void;
@@ -366,7 +341,7 @@ type ColumnEditConfigs = {
 export type UnknownRow = Record<string, unknown>;
 export type UnknownRows = Array<UnknownRow>;
 export interface TableSortColumn {
-    column: string;
+    column?: string;
     asc: boolean;
 }
 export interface TagsColorAssignment {
@@ -377,11 +352,10 @@ export interface TableWidgetProps extends TableFunctions {
     sourceId: string;
     widgetName: string;
     isLoading: boolean;
-    defaultSearchText: string;
     searchPlaceholder: string;
     pageSize: number;
     configuredPageSize?: number;
-    pageType: Pagination;
+    paginationType: PaginationType;
     multiRowSelection?: boolean;
     columnOrder?: string[];
     columnSizeMap?: {
@@ -393,10 +367,9 @@ export interface TableWidgetProps extends TableFunctions {
     isDownloadable: boolean;
     isFilterable: boolean;
     showColumnBorders: boolean;
-    defaultFilters: string;
     isSearchable: boolean;
-    tableHeader: string;
-    compactMode: CompactMode;
+    header: string;
+    rowDensity: RowDensity;
     enableRowDeletion: boolean;
     enableRowInsertion: boolean;
     maxLinesPerRow?: number;
@@ -427,6 +400,7 @@ export interface TableWidgetProps extends TableFunctions {
     theme: UserAccessibleTheme;
     border: PerSideBorder;
     disableNudge: (disable: boolean) => void;
+    disableDrag: (disable: boolean) => void;
     filteredTableData?: UnknownRows;
     filteredOrderMap?: Array<number>;
     editedRows?: {

package/dist-types/lib/user-facing/components/table/utils.d.ts

@@ -1,2 +1,2 @@
-import { CompactMode } from "./types.js";
-export declare const getCompactMode: (compactMode: unknown) => CompactMode;
+import { RowDensity } from "./types.js";
+export declare const getRowDensity: (rowDensity: unknown) => RowDensity;

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

@@ -5,27 +5,28 @@ export declare const SbText: 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>> & ({
         textStyle: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/types").TextStyleWithVariant, true>;
-        textAlign: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/props").TextAlign, true>;
+        horizontalAlign: import("../../properties-panel/props-builder.js").Prop<import("@superblocksteam/library-shared/props").HorizontalAlign, true>;
         verticalAlign: import("../../properties-panel/props-builder.js").Prop<import("./props.js").VerticalAlign, true>;
         wrapText: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
-        animateLoading: import("../../properties-panel/props-builder.js").Prop<boolean, false>;
+        loading: import("../../properties-panel/props-builder.js").Prop<boolean, true>;
         shouldScroll: import("../../properties-panel/props-builder.js").Prop<boolean, false>;
         icon: import("../../properties-panel/props-builder.js").Prop<string, false>;
+        iconPosition: import("../../properties-panel/props-builder.js").Prop<import("../../icons/constants.js").IconPosition, true>;
     } & (Omit<{
         textType: import("../../properties-panel/props-builder.js").Prop<"number" | "time" | "text" | "date" | "currency", false>;
     }, "textType" | "dateInputFormat" | "dateOutputFormat"> & ({
-        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>;
         textType: import("../../properties-panel/props-builder.js").Prop<"currency", true>;
         currency: import("../../properties-panel/props-builder.js").Prop<string, true>;
-        notation: import("../../properties-panel/props-builder.js").Prop<"compact" | "standard" | "scientific" | "engineering" | "unformatted", true>;
+        numberFormat: import("../../properties-panel/props-builder.js").Prop<"compact" | "standard" | "scientific" | "engineering" | "unformatted", true>;
         dateInputFormat?: undefined;
         dateOutputFormat?: undefined;
     } | {
-        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>;
         textType: import("../../properties-panel/props-builder.js").Prop<"number", true>;
-        notation: import("../../properties-panel/props-builder.js").Prop<"compact" | "standard" | "scientific" | "engineering" | "unformatted", true>;
+        numberFormat: import("../../properties-panel/props-builder.js").Prop<"compact" | "standard" | "scientific" | "engineering" | "unformatted", true>;
         dateInputFormat?: undefined;
         dateOutputFormat?: undefined;
     } | {

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

@@ -1,5 +1,7 @@
 import { Prop, Section } from "../../properties-panel/props-builder.js";
-import type { TextAlign } from "@superblocksteam/library-shared/props";
+import type { IconPosition } from "../../icons/constants.js";
+import type { Dim } from "@superblocksteam/library-shared";
+import type { HorizontalAlign } from "@superblocksteam/library-shared/props";
 import type { Typographies } from "@superblocksteam/library-shared/types";
 /**
  * TODO:
@@ -14,27 +16,28 @@ export declare const propertiesDefinition: {
     }>;
     appearance: Section<Record<string, Prop<any, any>> & ({
         textStyle: Prop<import("@superblocksteam/library-shared/types").TextStyleWithVariant, true>;
-        textAlign: Prop<TextAlign, true>;
+        horizontalAlign: Prop<HorizontalAlign, true>;
         verticalAlign: Prop<VerticalAlign, true>;
         wrapText: Prop<boolean, true>;
-        animateLoading: Prop<boolean, false>;
+        loading: Prop<boolean, true>;
         shouldScroll: Prop<boolean, false>;
         icon: Prop<string, false>;
+        iconPosition: Prop<IconPosition, true>;
     } & (Omit<{
         textType: Prop<"number" | "time" | "text" | "date" | "currency", false>;
     }, "textType" | "dateInputFormat" | "dateOutputFormat"> & ({
-        minimumFractionDigits: Prop<number, true>;
-        maximumFractionDigits: Prop<number, true>;
+        minDecimals: Prop<number, false>;
+        maxDecimals: Prop<number, false>;
         textType: Prop<"currency", true>;
         currency: Prop<string, true>;
-        notation: Prop<"compact" | "standard" | "scientific" | "engineering" | "unformatted", true>;
+        numberFormat: Prop<"compact" | "standard" | "scientific" | "engineering" | "unformatted", true>;
         dateInputFormat?: undefined;
         dateOutputFormat?: undefined;
     } | {
-        minimumFractionDigits: Prop<number, true>;
-        maximumFractionDigits: Prop<number, true>;
+        minDecimals: Prop<number, false>;
+        maxDecimals: Prop<number, false>;
         textType: Prop<"number", true>;
-        notation: Prop<"compact" | "standard" | "scientific" | "engineering" | "unformatted", true>;
+        numberFormat: Prop<"compact" | "standard" | "scientific" | "engineering" | "unformatted", true>;
         dateInputFormat?: undefined;
         dateOutputFormat?: undefined;
     } | {
@@ -43,12 +46,12 @@ export declare const propertiesDefinition: {
         dateOutputFormat: Prop<string, false>;
     })))>;
     layout: Section<Record<string, Prop<any, any>> & {
-        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>;
+        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>;
     } & {
         margin: Prop<unknown, true>;
     } & {

package/dist-types/lib/user-facing/components/text/utils.d.ts

@@ -1,16 +1,16 @@
 import type { propertiesDefinition } from "./props.js";
 import type { InternalProps } from "../../properties-panel/props-builder.js";
-import type { TextAlign } from "@superblocksteam/library-shared/props";
+import type { HorizontalAlign } from "@superblocksteam/library-shared/props";
 import type { TextStyleWithVariant, Typographies, UserAccessibleTheme } from "@superblocksteam/library-shared/types";
 type TextWidgetProps = InternalProps<typeof propertiesDefinition>;
-export declare const useText: ({ text, notation, minimumFractionDigits, maximumFractionDigits, textType, currency, dateInputFormat, dateOutputFormat, }: Pick<TextWidgetProps, "text" | "notation" | "minimumFractionDigits" | "maximumFractionDigits" | "textType" | "currency" | "dateInputFormat" | "dateOutputFormat">) => string | undefined;
+export declare const useText: ({ text, numberFormat, minDecimals, maxDecimals, textType, currency, dateInputFormat, dateOutputFormat, }: Pick<TextWidgetProps, "text" | "numberFormat" | "minDecimals" | "maxDecimals" | "textType" | "currency" | "dateInputFormat" | "dateOutputFormat">) => string | undefined;
 export declare const useTextClassName: ({ textStyleVariant, isLoading, }: {
     textStyleVariant: keyof Typographies;
     isLoading?: boolean;
 }) => string;
 export declare const getFontSizePx: (textStyle: TextStyleWithVariant, theme: UserAccessibleTheme) => number;
-export declare const useIcon: ({ textStyleWithVariant, }: {
-    textStyleWithVariant: TextStyleWithVariant;
+export declare const useIcon: ({ textStyle }: {
+    textStyle: TextStyleWithVariant;
 }) => {
     iconGap: {
         gap: string;
@@ -18,8 +18,8 @@ export declare const useIcon: ({ textStyleWithVariant, }: {
     iconSize: number;
 };
 export declare const useStyle: (props: TextWidgetProps) => any;
-export declare const useIconContainerStyles: ({ iconGap, textAlign, }: {
+export declare const useIconContainerStyles: ({ iconGap, horizontalAlign, }: {
     iconGap: any;
-    textAlign: TextAlign;
+    horizontalAlign: HorizontalAlign;
 }) => any;
 export {};

package/dist-types/lib/user-facing/properties-panel/mixins/appearance-properties.d.ts

@@ -21,3 +21,4 @@ export declare const textStyleProp: ({ baseProp, propertiesPanel, }?: {
 }) => Prop<TextStyleWithVariant>;
 export declare const colorProp: (schema: Omit<Partial<PropertiesPanelDisplay<string, "COLOR_PICKER">>, "controlType">) => Prop<string, false>;
 export declare const labelTextStyle: () => Prop<TextStyleWithVariant, true>;
+export declare const inputTextStyle: () => Prop<TextStyleWithVariant, true>;

package/dist-types/lib/user-facing/properties-panel/mixins/appearance.d.ts

@@ -1,12 +1,8 @@
-import { Dim } from "@superblocksteam/library-shared";
 import { Prop } from "../props-builder.js";
+import type { Dim } from "@superblocksteam/library-shared";
 import type { PropertiesPanelDisplay } from "@superblocksteam/library-shared/props";
-import type { PerCornerBorderRadius, PerSideBorder } from "@superblocksteam/library-shared/types";
-export declare const perSideBorderDef: () => import("../props-builder.js").CompositeProp<{
-    color: Prop<string, false>;
-    width: Prop<Dim<import("@superblocksteam/library-shared").DimModes>, false>;
-    style: Prop<string, false>;
-}>;
-export declare const border: (propertiesPanelConfig?: Partial<Partial<PropertiesPanelDisplay<"unknown", "BORDER_CONTROL">>>) => Prop<PerSideBorder, true>;
+import type { BorderStyleBlock, PerCornerBorderRadius, PerSideBorder } from "@superblocksteam/library-shared/types";
+export declare const createPerSideBorder: (border: BorderStyleBlock) => PerSideBorder;
+export declare const border: (propertiesPanelConfig?: Partial<Partial<PropertiesPanelDisplay<PerSideBorder, "BORDER_CONTROL">>>) => Prop<PerSideBorder, false>;
 export declare const createBorderRadiusObject: (borderRadius: Dim<"px" | "%">) => PerCornerBorderRadius;
 export declare const borderRadius: (propertiesPanelConfig?: Partial<Partial<PropertiesPanelDisplay<PerCornerBorderRadius, "BORDER_RADIUS_CONTROL">>>) => Prop<PerCornerBorderRadius, true>;

package/dist-types/lib/user-facing/properties-panel/mixins/form-inputs-properties.d.ts

@@ -8,7 +8,7 @@ export declare const customValidationProperties: {
     customValidationRule: Prop<string, true>;
     customErrorMessage: Prop<string, true>;
 };
-export declare const labelPosition: Prop<"left" | "top", true>;
+export declare const labelPosition: () => Prop<"left" | "top", true>;
 export declare const getTypographyOptions: () => {
     label: string;
     value: {
@@ -33,12 +33,12 @@ export declare const getCustomValidationProperties: ({ errorMessagePlacementSche
     customErrorMessageSchema?: Omit<Partial<PropertiesPanelDisplay<string, "INPUT_TEXT">>, "controlType" | "options">;
 }) => {
     errorMessagePlacement: Prop<ErrorMessagePlacement, true>;
-    customValidationRule: Prop<string, true>;
+    customValidationRule: Prop<any, false>;
     customErrorMessage: Prop<string, true>;
 };
 export declare const getFractionDigitsProperties: ({ schema, }?: {
     schema?: Omit<Partial<PropertiesPanelDisplay<number, "INPUT_TEXT">>, "controlType">;
 }) => {
-    minimumFractionDigits: Prop<number, true>;
-    maximumFractionDigits: Prop<number, true>;
+    minDecimals: Prop<number, false>;
+    maxDecimals: Prop<number, false>;
 };

package/dist-types/lib/user-facing/properties-panel/mixins/layout-section.d.ts

@@ -40,6 +40,9 @@ export declare const size: ({ defaults, defaultsOnAdd, hasMinWidth, hasMaxWidth,
     width: Prop<Dim<DimModes>, false>;
     height: Prop<Dim<DimModes>, false>;
 };
+export declare const widthWithoutFit: () => {
+    width: Prop<Dim<"px" | "fill" | "%" | "rows" | "columns">, false>;
+};
 export declare const shouldScrollContents: (defaultValue?: boolean) => {
     shouldScrollContents: Prop<boolean, true>;
 };
@@ -52,7 +55,7 @@ export declare const spacing: (options?: {
     spacing: Prop<Dim<"px">, true>;
 };
 export declare const padding: (options?: {
-    default?: Padding;
+    default?: Padding | ((this: any) => Padding);
 } & Partial<PropertiesPanelDisplay<Padding, "PADDING_CONTROL">>) => {
     padding: Prop<import("@superblocksteam/library-shared/types").Spacing, true>;
 };
@@ -63,14 +66,9 @@ export declare const getAlignmentProps: <LayoutType extends "vertical" | "horizo
     verticalAlign: Prop<VerticalAlignment<LayoutType>, true>;
     horizontalAlign: Prop<HorizontalAlignment<LayoutType>, true>;
 };
-export declare const containerLayout: () => import("../props-builder.js").UnionProp<{
+export declare const containerLayout: (sizeProps?: Record<string, Prop<any, any>>) => import("../props-builder.js").UnionProp<{
     layout: Prop<ContainerLayout, true>;
 }, [{
-    readonly layout: Prop<"freeform", true>;
-    readonly columns: Prop<number, true>;
-    readonly rows: Prop<number, false>;
-    readonly rowSize: Prop<number, false>;
-}, {
     readonly verticalAlign: Prop<"center" | "space-around" | "space-between" | "bottom" | "top", true>;
     readonly horizontalAlign: Prop<"center" | "left" | "right", true>;
     readonly layout: Prop<"vertical", true>;
@@ -78,14 +76,11 @@ export declare const containerLayout: () => import("../props-builder.js").UnionP
     readonly verticalAlign: Prop<"center" | "bottom" | "top", true>;
     readonly horizontalAlign: Prop<"center" | "space-around" | "space-between" | "left" | "right", true>;
     readonly layout: Prop<"horizontal", true>;
-}], ({
-    layout: Prop<ContainerLayout, true>;
-} & {
-    readonly layout: Prop<"freeform", true>;
+}, {
     readonly columns: Prop<number, true>;
-    readonly rows: Prop<number, false>;
-    readonly rowSize: Prop<number, false>;
-}) | ({
+    readonly rowHeight: Prop<Dim<"px">, true>;
+    readonly layout: Prop<"freeform", true>;
+}], ({
     layout: Prop<ContainerLayout, true>;
 } & {
     readonly verticalAlign: Prop<"center" | "space-around" | "space-between" | "bottom" | "top", true>;
@@ -97,6 +92,12 @@ export declare const containerLayout: () => import("../props-builder.js").UnionP
     readonly verticalAlign: Prop<"center" | "bottom" | "top", true>;
     readonly horizontalAlign: Prop<"center" | "space-around" | "space-between" | "left" | "right", true>;
     readonly layout: Prop<"horizontal", true>;
+}) | ({
+    layout: Prop<ContainerLayout, true>;
+} & {
+    readonly columns: Prop<number, true>;
+    readonly rowHeight: Prop<Dim<"px">, true>;
+    readonly layout: Prop<"freeform", true>;
 })>;
 export declare const basicLayout: () => Section<Record<string, Prop<any, any>> & {
     maxHeight?: Prop<Dim<DimModes>, false> | undefined;

package/dist-types/lib/user-facing/properties-panel/mixins/loading.d.ts

@@ -0,0 +1,2 @@
+import { Prop } from "../props-builder.js";
+export declare const loading: () => Prop<boolean, true>;

package/dist-types/lib/user-facing/properties-panel/props-builder.d.ts

@@ -14,6 +14,7 @@ export type SideEffectCallback = (params: {
     updates: Record<string, PropertyInfo<unknown>>;
     widgetMeta: RuntimeWidgetMeta;
     widgetState: Entity | ScopedState | undefined;
+    propertiesDefinition: PropertiesDefinition;
 }) => Record<SbElement, {
     meta?: Record<string, unknown>;
     props?: Record<string, PropertyInfo<unknown>>;
@@ -99,13 +100,13 @@ type EntityProps<Definition extends PropertiesDefinition, MergedSections = Merge
  * - Properties are fully evaluated to their final types
  */
 type InternalProps<Definition extends PropertiesDefinition, FlattenedProps = EntityProps<Definition>, BaseProps = Omit<SbComponentProps, keyof FlattenedProps>> = FlattenedProps & BaseProps;
-type MakeOptional<T, K extends keyof T> = Omit<T, K> & Partial<Pick<T, K>>;
+type MakeOptional<T, K extends string> = Omit<T, K & keyof T> & Partial<Pick<T, K & keyof T>>;
 type CleanProps<T> = {
     [K in keyof T as string extends K ? never : K]: T[K];
 };
-type InternalPropsWithOptional<Definition extends PropertiesDefinition, OptionalProps extends keyof CleanProps<InternalPropsWithDefinition>, InternalPropsWithDefinition = InternalProps<Definition>> = MakeOptional<CleanProps<InternalPropsWithDefinition>, OptionalProps> & {
+type InternalPropsWithOptional<Definition extends PropertiesDefinition, OptionalProps extends string, InternalPropsWithDefinition = InternalProps<Definition>> = InternalPropsWithDefinition extends infer U ? U extends any ? MakeOptional<CleanProps<U>, OptionalProps> & {
     [key: string]: any;
-};
+} : never : never;
 /**
  * External props exposed to component consumers
  * - All properties are optional regardless of defaults
@@ -131,7 +132,7 @@ declare class Section<T extends Record<string, Prop<any, any>> = Record<string,
     }[number] : never : INP>(props: INP): Section<T & OUT>;
     add: <INP extends Record<string, Prop<any, any>> | CompositeProp<any> | UnionProp<any, any>, OUT extends INP extends CompositeProp<infer CU> ? CU : INP extends UnionProp<infer SHARED, infer VARIANTS> ? VARIANTS extends readonly any[] ? { [I in keyof VARIANTS]: MergeUnionVariant<SHARED, VARIANTS[I]>; }[number] : never : INP>(props: INP) => Section<T & OUT>;
     propertiesPanel(config: Omit<SectionDefinition<any>, "props">): this;
-    get name(): "Content" | "Routing" | "Interaction" | "Layout" | "Appearance" | "Permissions" | "Event handlers" | "Uncategorized";
+    get name(): "Content" | "Routing" | "Interaction" | "Layout" | "Appearance" | "Permissions" | "Uncategorized" | "Event handlers";
 }
 declare class Prop<Type extends DataType, _HasDefault extends boolean = false> {
     protected prop: ManagedProp<Type>;
@@ -141,6 +142,7 @@ declare class Prop<Type extends DataType, _HasDefault extends boolean = false> {
      */
     protected relations: Relation[][];
     protected constructor(typeString: DataTypeString, defaultValidator?: ValidateFn<Type | undefined>);
+    static unset(): Prop<undefined>;
     static string<T extends string>(): Prop<T>;
     static number<T extends number>(): Prop<T>;
     static boolean<T extends boolean>(): Prop<T>;

package/dist-types/lib/user-facing/properties-panel/validators.d.ts

@@ -2,13 +2,14 @@ import type { Entity } from "../../internal-details/lib/evaluator/base-entity-ma
 type ValidationResult<T = any> = {
     valid: false;
     message: string;
+    invalidValue: any;
 } | {
     valid: true;
     result: T;
 };
 type ValidateFn<T> = (value: any, entity: Entity) => ValidationResult<T>;
 declare const Valid: <T>(result: T) => ValidationResult<T>;
-declare const Invalid: <T>(message?: string) => ValidationResult<T>;
+declare const Invalid: <T>(message: string | undefined, invalidValue: any) => ValidationResult<T>;
 type VALIDATION_TYPES = {
     TEXT: ValidateFn<string | undefined>;
     TEXT_EMPTY_NULL: ValidateFn<string | undefined | null>;

package/dist-types/lib/user-facing/state/sb-computed.d.ts

@@ -1,2 +1,2 @@
 import type { ComputedProperty } from "@superblocksteam/library-shared";
-export declare function sbComputed<T>(fn: (...args: any[]) => T): ComputedProperty<T>;
+export declare function sbComputed<T = any>(fn: (...args: any[]) => T): ComputedProperty<T>;

package/dist-types/lib/user-facing/themes/constants.d.ts

@@ -5,6 +5,7 @@ export declare const LIGHT_APP_BG: "#F9FAFB";
 export declare const DARK_APP_BG = "#131516";
 export declare const noBorder: (theme: UserAccessibleTheme) => Border;
 export declare const noBorderOject: (theme: UserAccessibleTheme) => PerSideBorder;
+export declare const onePixelTransparentBorderObject: () => PerSideBorder;
 export declare const EMPTY_RADIUS: PerCornerBorderRadius;
 export declare const DEFAULT_SYSTEM_RADIUS: PerCornerBorderRadius;
 export declare const defaultContainerBorderObject: (theme: UserAccessibleTheme) => PerSideBorder;
@@ -58,13 +59,13 @@ export declare const BOX_SHADOWS: {
     };
 };
 export declare const BUTTON_PADDING: Padding;
-export declare const DROPDOWN_PADDING: {
+export declare const INPUT_PADDING: {
     left: Dim<"px">;
     right: Dim<"px">;
     top: Dim<"px">;
     bottom: Dim<"px">;
 };
-export declare const INPUT_PADDING: {
+export declare const DROPDOWN_PADDING: {
     left: Dim<"px">;
     right: Dim<"px">;
     top: Dim<"px">;
@@ -77,4 +78,5 @@ export declare const KEY_VALUE_PADDING: {
     bottom: Dim<"px">;
 };
 export declare const KEY_VALUE_SPACING: Dim<"px">;
+export declare const DEFAULT_GRID_ROW_SIZE = 12;
 export {};

package/dist-types/lib/user-facing/themes/utils.d.ts

@@ -1,5 +1,5 @@
 import type { Dim, DimModes } from "@superblocksteam/library-shared";
-import type { Padding, TextStyleWithVariant } from "@superblocksteam/library-shared/types";
+import type { Padding } from "@superblocksteam/library-shared/types";
 import type React from "react";
 export declare const getCustomTypographyAccessor: (typographyKey: string) => string;
 export declare const getCustomTypographyNameFromAccessor: (accessor: string) => string;
@@ -8,7 +8,6 @@ export declare const getTextCssClassFromVariant: (textStyleVariant?: string) =>
 export declare const camelCaseToSentenceCase: (input: string) => string;
 export declare const extractPixels: (pxValue: string | number) => number;
 export declare const getLineHeightInPixels: (lineHeight: string | number, fontSize: number) => number;
-export declare const mergeTextStyles: (base: TextStyleWithVariant | undefined, override: TextStyleWithVariant | undefined) => TextStyleWithVariant | undefined;
 export declare const isColorToken: (value?: string) => boolean;
 export declare function getDefaultTypographies(themeVersion?: number): import("@superblocksteam/library-shared/types").Typographies;
 export declare function generatePaddingStyle(padding: Padding): string;