@elaraai/east-ui 0.0.1-beta.6 → 0.0.1-beta.8

package/dist/src/layout/flex/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/layout/flex/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EACH,KAAK,QAAQ,EAEb,UAAU,EACV,UAAU,EACV,SAAS,EAET,KAAK,kBAAkB,EAE1B,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAiB,KAAK,SAAS,EAAE,MAAM,YAAY,CAAC;AAQ3D,OAAO,EAAE,OAAO,EAAe,MAAM,EAAc,MAAM,aAAa,CAAC;AAGvE,OAAO,EAAE,aAAa,EAAE,KAAK,SAAS,EAAE,MAAM,YAAY,CAAC;AAE3D;;;;;;;;;GASG;AACH,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAEH;;;;;;;;;;;;;;;;;;WAkBG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAEH;;;;;;;;;;;WAWG;;;;;;;QAEH;;;;;;;;;;;WAWG;;;;;;;;CAGD,CAAC"}

package/dist/src/layout/flex/index.js

@@ -0,0 +1,291 @@
+/**
+ * Copyright (c) 2025 Elara AI Pty Ltd
+ * Dual-licensed under AGPL-3.0 and commercial license. See LICENSE for details.
+ */
+import { East, OptionType, StructType, ArrayType, variant, some, } from "@elaraai/east";
+import { UIComponentType } from "../../component.js";
+import { FlexStyleType } from "./types.js";
+import { FlexDirectionType, JustifyContentType, AlignItemsType, FlexWrapType, OverflowType, } from "../../style.js";
+import { Padding, PaddingType, Margin, MarginType } from "../style.js";
+// Re-export style types
+export { FlexStyleType } from "./types.js";
+/**
+ * The concrete East type for Flex component data.
+ *
+ * @remarks
+ * This struct type represents the serializable data structure for a Flex component.
+ * Flex is a container component with `display: flex` applied by default.
+ *
+ * @property children - Array of child UI components
+ * @property style - Optional styling configuration wrapped in OptionType
+ */
+export const FlexType = StructType({
+    children: ArrayType(UIComponentType),
+    style: OptionType(FlexStyleType),
+});
+/**
+ * Creates a Flex container component with children and optional styling.
+ *
+ * @param children - Array of child UI components
+ * @param style - Optional styling configuration for the flex container
+ * @returns An East expression representing the styled flex component
+ *
+ * @remarks
+ * Flex is a convenience component that renders a Box with `display: flex` applied.
+ * It provides easy access to flexbox layout properties like direction, wrap,
+ * justifyContent, and alignItems.
+ *
+ * @example
+ * ```ts
+ * import { East } from "@elaraai/east";
+ * import { Flex, Text, UIComponentType } from "@elaraai/east-ui";
+ *
+ * const example = East.function([], UIComponentType, $ => {
+ *     return Flex.Root([
+ *         Text.Root("Item 1"),
+ *         Text.Root("Item 2"),
+ *     ], {
+ *         direction: "row",
+ *         gap: "4",
+ *         justifyContent: "space-between",
+ *     });
+ * });
+ * ```
+ */
+function createFlex(children, style) {
+    const directionValue = style?.direction
+        ? (typeof style.direction === "string"
+            ? East.value(variant(style.direction, null), FlexDirectionType)
+            : style.direction)
+        : undefined;
+    const wrapValue = style?.wrap
+        ? (typeof style.wrap === "string"
+            ? East.value(variant(style.wrap, null), FlexWrapType)
+            : style.wrap)
+        : undefined;
+    const justifyContentValue = style?.justifyContent
+        ? (typeof style.justifyContent === "string"
+            ? East.value(variant(style.justifyContent, null), JustifyContentType)
+            : style.justifyContent)
+        : undefined;
+    const alignItemsValue = style?.alignItems
+        ? (typeof style.alignItems === "string"
+            ? East.value(variant(style.alignItems, null), AlignItemsType)
+            : style.alignItems)
+        : undefined;
+    const paddingValue = style?.padding
+        ? (typeof style.padding === "string"
+            ? East.value({
+                top: some(style.padding),
+                right: some(style.padding),
+                bottom: some(style.padding),
+                left: some(style.padding)
+            }, PaddingType)
+            : style.padding)
+        : undefined;
+    const marginValue = style?.margin
+        ? (typeof style.margin === "string"
+            ? East.value({
+                top: some(style.margin),
+                right: some(style.margin),
+                bottom: some(style.margin),
+                left: some(style.margin)
+            }, MarginType)
+            : style.margin)
+        : undefined;
+    const overflowValue = style?.overflow
+        ? (typeof style.overflow === "string"
+            ? East.value(variant(style.overflow, null), OverflowType)
+            : style.overflow)
+        : undefined;
+    const overflowXValue = style?.overflowX
+        ? (typeof style.overflowX === "string"
+            ? East.value(variant(style.overflowX, null), OverflowType)
+            : style.overflowX)
+        : undefined;
+    const overflowYValue = style?.overflowY
+        ? (typeof style.overflowY === "string"
+            ? East.value(variant(style.overflowY, null), OverflowType)
+            : style.overflowY)
+        : undefined;
+    return East.value(variant("Flex", {
+        children: children,
+        style: style ? variant("some", East.value({
+            direction: directionValue ? variant("some", directionValue) : variant("none", null),
+            wrap: wrapValue ? variant("some", wrapValue) : variant("none", null),
+            justifyContent: justifyContentValue ? variant("some", justifyContentValue) : variant("none", null),
+            alignItems: alignItemsValue ? variant("some", alignItemsValue) : variant("none", null),
+            gap: style.gap ? variant("some", style.gap) : variant("none", null),
+            width: style.width ? variant("some", style.width) : variant("none", null),
+            height: style.height ? variant("some", style.height) : variant("none", null),
+            minHeight: style.minHeight ? variant("some", style.minHeight) : variant("none", null),
+            minWidth: style.minWidth ? variant("some", style.minWidth) : variant("none", null),
+            maxHeight: style.maxHeight ? variant("some", style.maxHeight) : variant("none", null),
+            maxWidth: style.maxWidth ? variant("some", style.maxWidth) : variant("none", null),
+            overflow: overflowValue ? variant("some", overflowValue) : variant("none", null),
+            overflowX: overflowXValue ? variant("some", overflowXValue) : variant("none", null),
+            overflowY: overflowYValue ? variant("some", overflowYValue) : variant("none", null),
+            padding: paddingValue ? variant("some", paddingValue) : variant("none", null),
+            margin: marginValue ? variant("some", marginValue) : variant("none", null),
+            background: style.background ? variant("some", style.background) : variant("none", null),
+            color: style.color ? variant("some", style.color) : variant("none", null),
+            borderRadius: style.borderRadius ? variant("some", style.borderRadius) : variant("none", null),
+        }, FlexStyleType)) : variant("none", null),
+    }), UIComponentType);
+}
+/**
+ * Flex container component for flexbox layouts.
+ *
+ * @remarks
+ * Use `Flex.Root(children, style)` to create a flex container, or access `Flex.Types.Flex` for the East type.
+ * Flex is a convenience component that renders with `display: flex` applied by default.
+ */
+export const Flex = {
+    /**
+     * Creates a Flex container component with children and optional styling.
+     *
+     * @param children - Array of child UI components
+     * @param style - Optional styling configuration for the flex container
+     * @returns An East expression representing the styled flex component
+     *
+     * @remarks
+     * Flex is a convenience component that renders a Box with `display: flex` applied.
+     * It provides easy access to flexbox layout properties.
+     *
+     * @example
+     * ```ts
+     * import { East } from "@elaraai/east";
+     * import { Flex, Text, UIComponentType } from "@elaraai/east-ui";
+     *
+     * const example = East.function([], UIComponentType, $ => {
+     *     return Flex.Root([
+     *         Text.Root("Item 1"),
+     *         Text.Root("Item 2"),
+     *     ], {
+     *         direction: "row",
+     *         gap: "4",
+     *         alignItems: "center",
+     *     });
+     * });
+     * ```
+     */
+    Root: createFlex,
+    /**
+     * Creates padding configuration for layout components.
+     *
+     * @param top - Top padding (Chakra UI spacing token or CSS value)
+     * @param right - Right padding (Chakra UI spacing token or CSS value)
+     * @param bottom - Bottom padding (Chakra UI spacing token or CSS value)
+     * @param left - Left padding (Chakra UI spacing token or CSS value)
+     * @returns An East expression representing the padding configuration
+     *
+     * @remarks
+     * Use this helper to create structured padding values for Flex components.
+     * You can also pass a plain string to the padding style property for uniform padding.
+     *
+     * @example
+     * ```ts
+     * import { Flex, Padding } from "@elaraai/east-ui";
+     *
+     * // Structured padding
+     * Flex.Root([...], {
+     *   padding: Padding("4", "2", "4", "2"),
+     * });
+     *
+     * // Uniform padding (shorthand)
+     * Flex.Root([...], {
+     *   padding: "4",
+     * });
+     * ```
+     */
+    Padding,
+    /**
+     * Creates margin configuration for layout components.
+     *
+     * @param top - Top margin (Chakra UI spacing token or CSS value)
+     * @param right - Right margin (Chakra UI spacing token or CSS value)
+     * @param bottom - Bottom margin (Chakra UI spacing token or CSS value)
+     * @param left - Left margin (Chakra UI spacing token or CSS value)
+     * @returns An East expression representing the margin configuration
+     *
+     * @remarks
+     * Use this helper to create structured margin values for Flex components.
+     * You can also pass a plain string to the margin style property for uniform margin.
+     *
+     * @example
+     * ```ts
+     * import { Flex, Margin } from "@elaraai/east-ui";
+     *
+     * // Structured margin
+     * Flex.Root([...], {
+     *   margin: Margin("4", "auto", "4", "auto"),
+     * });
+     *
+     * // Uniform margin (shorthand)
+     * Flex.Root([...], {
+     *   margin: "4",
+     * });
+     * ```
+     */
+    Margin,
+    Types: {
+        /**
+         * The concrete East type for Flex component data.
+         *
+         * @remarks
+         * This struct type represents the serializable data structure for a Flex component.
+         * Flex is a container component with `display: flex` applied by default.
+         *
+         * @property children - Array of child UI components
+         * @property style - Optional styling configuration wrapped in OptionType
+         */
+        Flex: FlexType,
+        /**
+         * The concrete East type for Flex component style data.
+         *
+         * @remarks
+         * All properties are optional and wrapped in {@link OptionType}.
+         *
+         * @property direction - Flex direction (row, column, row-reverse, column-reverse)
+         * @property wrap - Flex wrap behavior (nowrap, wrap, wrap-reverse)
+         * @property justifyContent - Justify content for main axis alignment
+         * @property alignItems - Align items for cross axis alignment
+         * @property gap - Gap between children
+         * @property width - Width (Chakra UI size token or CSS value)
+         * @property height - Height (Chakra UI size token or CSS value)
+         * @property padding - Padding configuration
+         * @property margin - Margin configuration
+         * @property background - Background color (Chakra UI color token or CSS color)
+         * @property color - Text color (Chakra UI color token or CSS color)
+         * @property borderRadius - Border radius (Chakra UI radius token or CSS value)
+         */
+        Style: FlexStyleType,
+        /**
+         * The concrete East type for padding configuration.
+         *
+         * @remarks
+         * This struct type defines padding for all four sides of a flex container.
+         * Each side is optional and accepts Chakra UI spacing tokens or CSS values.
+         *
+         * @property top - Top padding (Chakra UI spacing token or CSS value)
+         * @property right - Right padding (Chakra UI spacing token or CSS value)
+         * @property bottom - Bottom padding (Chakra UI spacing token or CSS value)
+         * @property left - Left padding (Chakra UI spacing token or CSS value)
+         */
+        Padding: PaddingType,
+        /**
+         * The concrete East type for margin configuration.
+         *
+         * @remarks
+         * This struct type defines margin for all four sides of a flex container.
+         * Each side is optional and accepts Chakra UI spacing tokens or CSS values.
+         *
+         * @property top - Top margin (Chakra UI spacing token or CSS value)
+         * @property right - Right margin (Chakra UI spacing token or CSS value)
+         * @property bottom - Bottom margin (Chakra UI spacing token or CSS value)
+         * @property left - Left margin (Chakra UI spacing token or CSS value)
+         */
+        Margin: MarginType,
+    },
+};
+//# sourceMappingURL=index.js.map

package/dist/src/layout/flex/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/layout/flex/index.ts"],"names":[],"mappings":"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"}

package/dist/src/layout/flex/types.d.ts

@@ -0,0 +1,176 @@
+/**
+ * Copyright (c) 2025 Elara AI Pty Ltd
+ * Dual-licensed under AGPL-3.0 and commercial license. See LICENSE for details.
+ */
+import { type SubtypeExprOrValue, OptionType, StringType, StructType } from "@elaraai/east";
+import { FlexDirectionType, JustifyContentType, AlignItemsType, FlexWrapType, OverflowType } from "../../style.js";
+import type { FlexDirectionLiteral, JustifyContentLiteral, AlignItemsLiteral, FlexWrapLiteral, OverflowLiteral } from "../../style.js";
+import { PaddingType, MarginType } from "../style.js";
+/**
+ * Style configuration for Flex components.
+ *
+ * @remarks
+ * All style properties are optional and accept either static values or East expressions
+ * for dynamic styling. Size and spacing properties accept Chakra UI tokens or CSS values.
+ * Flex is a Box with `display: flex` applied by default.
+ *
+ * @property direction - Flex direction (row, column, row-reverse, column-reverse)
+ * @property wrap - Flex wrap behavior (nowrap, wrap, wrap-reverse)
+ * @property justifyContent - Justify content for main axis alignment
+ * @property alignItems - Align items for cross axis alignment
+ * @property gap - Gap between children (Chakra UI spacing token or CSS value)
+ * @property width - Width (Chakra UI size token or CSS value)
+ * @property height - Height (Chakra UI size token or CSS value)
+ * @property minHeight - Min height (Chakra UI size token or CSS value)
+ * @property minWidth - Min width (Chakra UI size token or CSS value)
+ * @property maxHeight - Max height (Chakra UI size token or CSS value)
+ * @property maxWidth - Max width (Chakra UI size token or CSS value)
+ * @property overflow - Overflow behavior for both axes (visible, hidden, scroll, auto)
+ * @property overflowX - Horizontal overflow behavior (visible, hidden, scroll, auto)
+ * @property overflowY - Vertical overflow behavior (visible, hidden, scroll, auto)
+ * @property padding - Padding (Chakra UI spacing token or CSS value)
+ * @property margin - Margin (Chakra UI spacing token or CSS value)
+ * @property background - Background color (Chakra UI color token or CSS color)
+ * @property color - Text color (Chakra UI color token or CSS color)
+ * @property borderRadius - Border radius (Chakra UI radius token or CSS value)
+ */
+export type FlexStyle = {
+    /** Flex direction (row, column, row-reverse, column-reverse) */
+    direction?: SubtypeExprOrValue<FlexDirectionType> | FlexDirectionLiteral;
+    /** Flex wrap behavior (nowrap, wrap, wrap-reverse) */
+    wrap?: SubtypeExprOrValue<FlexWrapType> | FlexWrapLiteral;
+    /** Justify content for main axis alignment */
+    justifyContent?: SubtypeExprOrValue<JustifyContentType> | JustifyContentLiteral;
+    /** Align items for cross axis alignment */
+    alignItems?: SubtypeExprOrValue<AlignItemsType> | AlignItemsLiteral;
+    /** Gap between children (Chakra UI spacing token or CSS value) */
+    gap?: SubtypeExprOrValue<StringType>;
+    /** Width (Chakra UI size token or CSS value) */
+    width?: SubtypeExprOrValue<StringType>;
+    /** Height (Chakra UI size token or CSS value) */
+    height?: SubtypeExprOrValue<StringType>;
+    /** Min height (Chakra UI size token or CSS value) */
+    minHeight?: SubtypeExprOrValue<StringType>;
+    /** Min width (Chakra UI size token or CSS value) */
+    minWidth?: SubtypeExprOrValue<StringType>;
+    /** Max height (Chakra UI size token or CSS value) */
+    maxHeight?: SubtypeExprOrValue<StringType>;
+    /** Max width (Chakra UI size token or CSS value) */
+    maxWidth?: SubtypeExprOrValue<StringType>;
+    /** Overflow behavior for both axes (visible, hidden, scroll, auto) */
+    overflow?: SubtypeExprOrValue<OverflowType> | OverflowLiteral;
+    /** Horizontal overflow behavior (visible, hidden, scroll, auto) */
+    overflowX?: SubtypeExprOrValue<OverflowType> | OverflowLiteral;
+    /** Vertical overflow behavior (visible, hidden, scroll, auto) */
+    overflowY?: SubtypeExprOrValue<OverflowType> | OverflowLiteral;
+    /** Padding configuration - use Padding() helper */
+    padding?: SubtypeExprOrValue<PaddingType> | string;
+    /** Margin configuration - use Margin() helper */
+    margin?: SubtypeExprOrValue<MarginType> | string;
+    /** Background color (Chakra UI color token or CSS color) */
+    background?: SubtypeExprOrValue<StringType>;
+    /** Text color (Chakra UI color token or CSS color) */
+    color?: SubtypeExprOrValue<StringType>;
+    /** Border radius (Chakra UI radius token or CSS value) */
+    borderRadius?: SubtypeExprOrValue<StringType>;
+};
+/**
+ * The concrete East type for Flex component style data.
+ *
+ * @remarks
+ * All properties are optional and wrapped in {@link OptionType}.
+ * Flex is a Box with `display: flex` applied by default.
+ *
+ * @property direction - Flex direction (row, column, row-reverse, column-reverse)
+ * @property wrap - Flex wrap behavior (nowrap, wrap, wrap-reverse)
+ * @property justifyContent - Justify content for main axis alignment
+ * @property alignItems - Align items for cross axis alignment
+ * @property gap - Gap between children (Chakra UI spacing token or CSS value)
+ * @property width - Width (Chakra UI size token or CSS value)
+ * @property height - Height (Chakra UI size token or CSS value)
+ * @property minHeight - Min height (Chakra UI size token or CSS value)
+ * @property minWidth - Min width (Chakra UI size token or CSS value)
+ * @property maxHeight - Max height (Chakra UI size token or CSS value)
+ * @property maxWidth - Max width (Chakra UI size token or CSS value)
+ * @property overflow - Overflow behavior for both axes (visible, hidden, scroll, auto)
+ * @property overflowX - Horizontal overflow behavior (visible, hidden, scroll, auto)
+ * @property overflowY - Vertical overflow behavior (visible, hidden, scroll, auto)
+ * @property padding - Padding configuration
+ * @property margin - Margin configuration
+ * @property background - Background color (Chakra UI color token or CSS color)
+ * @property color - Text color (Chakra UI color token or CSS color)
+ * @property borderRadius - Border radius (Chakra UI radius token or CSS value)
+ */
+export declare const FlexStyleType: StructType<{
+    direction: OptionType<import("@elaraai/east").VariantType<{
+        row: import("@elaraai/east").NullType;
+        column: import("@elaraai/east").NullType;
+        "row-reverse": import("@elaraai/east").NullType;
+        "column-reverse": import("@elaraai/east").NullType;
+    }>>;
+    wrap: OptionType<import("@elaraai/east").VariantType<{
+        nowrap: import("@elaraai/east").NullType;
+        wrap: import("@elaraai/east").NullType;
+        "wrap-reverse": import("@elaraai/east").NullType;
+    }>>;
+    justifyContent: OptionType<import("@elaraai/east").VariantType<{
+        "flex-start": import("@elaraai/east").NullType;
+        "flex-end": import("@elaraai/east").NullType;
+        center: import("@elaraai/east").NullType;
+        "space-between": import("@elaraai/east").NullType;
+        "space-around": import("@elaraai/east").NullType;
+        "space-evenly": import("@elaraai/east").NullType;
+    }>>;
+    alignItems: OptionType<import("@elaraai/east").VariantType<{
+        "flex-start": import("@elaraai/east").NullType;
+        "flex-end": import("@elaraai/east").NullType;
+        center: import("@elaraai/east").NullType;
+        baseline: import("@elaraai/east").NullType;
+        stretch: import("@elaraai/east").NullType;
+    }>>;
+    gap: OptionType<StringType>;
+    width: OptionType<StringType>;
+    height: OptionType<StringType>;
+    minHeight: OptionType<StringType>;
+    minWidth: OptionType<StringType>;
+    maxHeight: OptionType<StringType>;
+    maxWidth: OptionType<StringType>;
+    overflow: OptionType<import("@elaraai/east").VariantType<{
+        visible: import("@elaraai/east").NullType;
+        hidden: import("@elaraai/east").NullType;
+        scroll: import("@elaraai/east").NullType;
+        auto: import("@elaraai/east").NullType;
+    }>>;
+    overflowX: OptionType<import("@elaraai/east").VariantType<{
+        visible: import("@elaraai/east").NullType;
+        hidden: import("@elaraai/east").NullType;
+        scroll: import("@elaraai/east").NullType;
+        auto: import("@elaraai/east").NullType;
+    }>>;
+    overflowY: OptionType<import("@elaraai/east").VariantType<{
+        visible: import("@elaraai/east").NullType;
+        hidden: import("@elaraai/east").NullType;
+        scroll: import("@elaraai/east").NullType;
+        auto: import("@elaraai/east").NullType;
+    }>>;
+    padding: OptionType<StructType<{
+        top: OptionType<StringType>;
+        right: OptionType<StringType>;
+        bottom: OptionType<StringType>;
+        left: OptionType<StringType>;
+    }>>;
+    margin: OptionType<StructType<{
+        top: OptionType<StringType>;
+        right: OptionType<StringType>;
+        bottom: OptionType<StringType>;
+        left: OptionType<StringType>;
+    }>>;
+    background: OptionType<StringType>;
+    color: OptionType<StringType>;
+    borderRadius: OptionType<StringType>;
+}>;
+/**
+ * Type representing Flex style structure.
+ */
+export type FlexStyleType = typeof FlexStyleType;
+//# sourceMappingURL=types.d.ts.map

package/dist/src/layout/flex/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/layout/flex/types.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EACH,KAAK,kBAAkB,EACvB,UAAU,EACV,UAAU,EACV,UAAU,EACb,MAAM,eAAe,CAAC;AAEvB,OAAO,EACH,iBAAiB,EACjB,kBAAkB,EAClB,cAAc,EACd,YAAY,EACZ,YAAY,EACf,MAAM,gBAAgB,CAAC;AACxB,OAAO,KAAK,EACR,oBAAoB,EACpB,qBAAqB,EACrB,iBAAiB,EACjB,eAAe,EACf,eAAe,EAClB,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAMtD;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,MAAM,MAAM,SAAS,GAAG;IACpB,gEAAgE;IAChE,SAAS,CAAC,EAAE,kBAAkB,CAAC,iBAAiB,CAAC,GAAG,oBAAoB,CAAC;IACzE,sDAAsD;IACtD,IAAI,CAAC,EAAE,kBAAkB,CAAC,YAAY,CAAC,GAAG,eAAe,CAAC;IAC1D,8CAA8C;IAC9C,cAAc,CAAC,EAAE,kBAAkB,CAAC,kBAAkB,CAAC,GAAG,qBAAqB,CAAC;IAChF,2CAA2C;IAC3C,UAAU,CAAC,EAAE,kBAAkB,CAAC,cAAc,CAAC,GAAG,iBAAiB,CAAC;IACpE,kEAAkE;IAClE,GAAG,CAAC,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;IACrC,gDAAgD;IAChD,KAAK,CAAC,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;IACvC,iDAAiD;IACjD,MAAM,CAAC,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;IACxC,qDAAqD;IACrD,SAAS,CAAC,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;IAC3C,oDAAoD;IACpD,QAAQ,CAAC,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;IAC1C,qDAAqD;IACrD,SAAS,CAAC,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;IAC3C,oDAAoD;IACpD,QAAQ,CAAC,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;IAC1C,sEAAsE;IACtE,QAAQ,CAAC,EAAE,kBAAkB,CAAC,YAAY,CAAC,GAAG,eAAe,CAAC;IAC9D,mEAAmE;IACnE,SAAS,CAAC,EAAE,kBAAkB,CAAC,YAAY,CAAC,GAAG,eAAe,CAAC;IAC/D,iEAAiE;IACjE,SAAS,CAAC,EAAE,kBAAkB,CAAC,YAAY,CAAC,GAAG,eAAe,CAAC;IAC/D,mDAAmD;IACnD,OAAO,CAAC,EAAE,kBAAkB,CAAC,WAAW,CAAC,GAAG,MAAM,CAAC;IACnD,iDAAiD;IACjD,MAAM,CAAC,EAAE,kBAAkB,CAAC,UAAU,CAAC,GAAG,MAAM,CAAC;IACjD,4DAA4D;IAC5D,UAAU,CAAC,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;IAC5C,sDAAsD;IACtD,KAAK,CAAC,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;IACvC,0DAA0D;IAC1D,YAAY,CAAC,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;CACjD,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAoBxB,CAAC;AAEH;;GAEG;AACH,MAAM,MAAM,aAAa,GAAG,OAAO,aAAa,CAAC"}

package/dist/src/layout/flex/types.js

@@ -0,0 +1,56 @@
+/**
+ * Copyright (c) 2025 Elara AI Pty Ltd
+ * Dual-licensed under AGPL-3.0 and commercial license. See LICENSE for details.
+ */
+import { OptionType, StringType, StructType, } from "@elaraai/east";
+import { FlexDirectionType, JustifyContentType, AlignItemsType, FlexWrapType, OverflowType, } from "../../style.js";
+import { PaddingType, MarginType } from "../style.js";
+/**
+ * The concrete East type for Flex component style data.
+ *
+ * @remarks
+ * All properties are optional and wrapped in {@link OptionType}.
+ * Flex is a Box with `display: flex` applied by default.
+ *
+ * @property direction - Flex direction (row, column, row-reverse, column-reverse)
+ * @property wrap - Flex wrap behavior (nowrap, wrap, wrap-reverse)
+ * @property justifyContent - Justify content for main axis alignment
+ * @property alignItems - Align items for cross axis alignment
+ * @property gap - Gap between children (Chakra UI spacing token or CSS value)
+ * @property width - Width (Chakra UI size token or CSS value)
+ * @property height - Height (Chakra UI size token or CSS value)
+ * @property minHeight - Min height (Chakra UI size token or CSS value)
+ * @property minWidth - Min width (Chakra UI size token or CSS value)
+ * @property maxHeight - Max height (Chakra UI size token or CSS value)
+ * @property maxWidth - Max width (Chakra UI size token or CSS value)
+ * @property overflow - Overflow behavior for both axes (visible, hidden, scroll, auto)
+ * @property overflowX - Horizontal overflow behavior (visible, hidden, scroll, auto)
+ * @property overflowY - Vertical overflow behavior (visible, hidden, scroll, auto)
+ * @property padding - Padding configuration
+ * @property margin - Margin configuration
+ * @property background - Background color (Chakra UI color token or CSS color)
+ * @property color - Text color (Chakra UI color token or CSS color)
+ * @property borderRadius - Border radius (Chakra UI radius token or CSS value)
+ */
+export const FlexStyleType = StructType({
+    direction: OptionType(FlexDirectionType),
+    wrap: OptionType(FlexWrapType),
+    justifyContent: OptionType(JustifyContentType),
+    alignItems: OptionType(AlignItemsType),
+    gap: OptionType(StringType),
+    width: OptionType(StringType),
+    height: OptionType(StringType),
+    minHeight: OptionType(StringType),
+    minWidth: OptionType(StringType),
+    maxHeight: OptionType(StringType),
+    maxWidth: OptionType(StringType),
+    overflow: OptionType(OverflowType),
+    overflowX: OptionType(OverflowType),
+    overflowY: OptionType(OverflowType),
+    padding: OptionType(PaddingType),
+    margin: OptionType(MarginType),
+    background: OptionType(StringType),
+    color: OptionType(StringType),
+    borderRadius: OptionType(StringType),
+});
+//# sourceMappingURL=types.js.map

package/dist/src/layout/flex/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/layout/flex/types.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAEH,UAAU,EACV,UAAU,EACV,UAAU,GACb,MAAM,eAAe,CAAC;AAEvB,OAAO,EACH,iBAAiB,EACjB,kBAAkB,EAClB,cAAc,EACd,YAAY,EACZ,YAAY,GACf,MAAM,gBAAgB,CAAC;AAQxB,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AA2EtD;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,UAAU,CAAC;IACpC,SAAS,EAAE,UAAU,CAAC,iBAAiB,CAAC;IACxC,IAAI,EAAE,UAAU,CAAC,YAAY,CAAC;IAC9B,cAAc,EAAE,UAAU,CAAC,kBAAkB,CAAC;IAC9C,UAAU,EAAE,UAAU,CAAC,cAAc,CAAC;IACtC,GAAG,EAAE,UAAU,CAAC,UAAU,CAAC;IAC3B,KAAK,EAAE,UAAU,CAAC,UAAU,CAAC;IAC7B,MAAM,EAAE,UAAU,CAAC,UAAU,CAAC;IAC9B,SAAS,EAAE,UAAU,CAAC,UAAU,CAAC;IACjC,QAAQ,EAAE,UAAU,CAAC,UAAU,CAAC;IAChC,SAAS,EAAE,UAAU,CAAC,UAAU,CAAC;IACjC,QAAQ,EAAE,UAAU,CAAC,UAAU,CAAC;IAChC,QAAQ,EAAE,UAAU,CAAC,YAAY,CAAC;IAClC,SAAS,EAAE,UAAU,CAAC,YAAY,CAAC;IACnC,SAAS,EAAE,UAAU,CAAC,YAAY,CAAC;IACnC,OAAO,EAAE,UAAU,CAAC,WAAW,CAAC;IAChC,MAAM,EAAE,UAAU,CAAC,UAAU,CAAC;IAC9B,UAAU,EAAE,UAAU,CAAC,UAAU,CAAC;IAClC,KAAK,EAAE,UAAU,CAAC,UAAU,CAAC;IAC7B,YAAY,EAAE,UAAU,CAAC,UAAU,CAAC;CACvC,CAAC,CAAC"}