fluekit 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 Fitz
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,63 @@
+# FlueKit
+
+**FlueKit** (Fluent Layouts for Vue) is a Vue 3 library that provides Flutter-like layout components for building complex UIs with ease. It brings the power and simplicity of Flutter's layout model to the web.
+
+## Features
+
+- **Layout Primitives**: `Row`, `Column`, `Stack`, `Positioned`, `Expanded`, `SizedBox`, `Center`, `Align`
+- **Container System**: `Container`, `AnimatedContainer`, `Padding`, `ConstrainedBox`
+- **Scrolling**: `ListView`, `GridView`, `ScrollView` (SingleChildScrollView)
+- **Styling**: `BoxDecoration`, `TextStyle`, `EdgeInsets`, `BorderRadius`
+- **Interactions**: `GestureDetector`, `IgnorePointer`, `AbsorbPointer`
+- **Animations**: `AnimatedContainer`, `AnimatedOpacity`
+
+## Installation
+
+```bash
+npm install fluekit
+# or
+pnpm add fluekit
+# or
+yarn add fluekit
+```
+
+## Quick Start
+
+```vue
+<script setup>
+import { Container, Center, Text, Column, SizedBox } from "fluekit";
+</script>
+
+<template>
+  <Center>
+    <Container
+      :width="300"
+      :height="200"
+      color="#2196F3"
+      :decoration="{
+        borderRadius: { all: 16 },
+        boxShadow: [{ color: 'black', blurRadius: 10, offset: { x: 0, y: 4 } }]
+      }"
+      alignment="center"
+    >
+      <Column mainAxisAlignment="center">
+        <Text :style="{ color: 'white', fontSize: 24, fontWeight: 'bold' }">
+          Hello FlueKit
+        </Text>
+        <SizedBox :height="10" />
+        <Text :style="{ color: 'white', fontSize: 16 }">
+          Flutter-like layouts for Vue 3
+        </Text>
+      </Column>
+    </Container>
+  </Center>
+</template>
+```
+
+## Documentation
+
+Visit the [documentation website](https://fitz.github.io/fluekit) for detailed guides and API references.
+
+## License
+
+MIT

package/dist/Align.d.ts

@@ -0,0 +1,25 @@
+import { FlexAlignment } from './FlexProps';
+interface Props {
+    alignment?: FlexAlignment;
+    widthFactor?: number;
+    heightFactor?: number;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {
+    alignment: FlexAlignment;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/AnimatedContainer.d.ts

@@ -0,0 +1,41 @@
+import { BoxConstraints } from './BoxConstraints';
+import { BoxDecoration } from './BoxDecoration';
+import { EdgeInsets } from './EdgeInsets';
+import { FlexAlignment } from './FlexProps';
+interface Props {
+    width?: number | string;
+    height?: number | string;
+    padding?: EdgeInsets;
+    margin?: EdgeInsets;
+    decoration?: BoxDecoration;
+    foregroundDecoration?: BoxDecoration;
+    color?: string;
+    alignment?: FlexAlignment | string;
+    clipBehavior?: "none" | "hardEdge" | "antiAlias" | string;
+    transform?: string;
+    transformAlignment?: FlexAlignment | string;
+    constraints?: BoxConstraints;
+    duration?: number;
+    curve?: string;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {
+    clipBehavior: "none" | "hardEdge" | "antiAlias" | string;
+    duration: number;
+    curve: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/AnimatedOpacity.d.ts

@@ -0,0 +1,25 @@
+interface Props {
+    opacity: number;
+    duration?: number;
+    curve?: string;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {
+    duration: number;
+    curve: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/Border.d.ts

@@ -0,0 +1,16 @@
+import { CSSProperties } from 'vue';
+export type BorderStyleType = "none" | "solid" | "dashed" | "dotted" | "double";
+export type BorderSide = {
+    width?: number | string;
+    color?: string;
+    style?: BorderStyleType;
+};
+export declare function Border(side: BorderSide): BorderSide;
+export interface Borders extends BorderSide {
+    all?: BorderSide;
+    left?: BorderSide;
+    top?: BorderSide;
+    right?: BorderSide;
+    bottom?: BorderSide;
+}
+export declare function borderToStyle(border: Borders): CSSProperties;

package/dist/BorderRadius.d.ts

@@ -0,0 +1,12 @@
+import { CSSProperties } from 'vue';
+export type BorderRadiusValue = number | string;
+export type BorderRadiusType = BorderRadiusValue | {
+    topLeft?: BorderRadiusValue;
+    bottom?: BorderRadiusValue;
+    topRight?: BorderRadiusValue;
+    bottomLeft?: BorderRadiusValue;
+    bottomRight?: BorderRadiusValue;
+    all?: BorderRadiusValue;
+};
+export declare function BorderRadius(borderRadius: BorderRadiusType): BorderRadiusType;
+export declare function borderRadiusToStyle(props?: BorderRadiusType): CSSProperties;

package/dist/BoxConstraints.d.ts

@@ -0,0 +1,9 @@
+import { CSSProperties } from 'vue';
+export interface BoxConstraints {
+    minWidth?: number;
+    maxWidth?: number;
+    minHeight?: number;
+    maxHeight?: number;
+}
+export declare function BoxConstraints(props?: BoxConstraints): BoxConstraints;
+export declare function boxConstraintsToStyle(constraints?: BoxConstraints): CSSProperties;

package/dist/BoxDecoration.d.ts

@@ -0,0 +1,89 @@
+import { BorderRadiusType } from './BorderRadius';
+import { CSSProperties } from 'vue';
+import { Borders } from './Border';
+type Valueof<T> = T[keyof T];
+export type BoxFit = Valueof<typeof BoxFit>;
+export declare const BoxFit: {
+    readonly fitWidth: "fitWidth";
+    readonly fitHeight: "fitHeight";
+    readonly fill: "fill";
+    readonly contain: "contain";
+    readonly cover: "cover";
+    readonly none: "none";
+    readonly scaleDown: "scaleDown";
+};
+export type ImageRepeat = "repeat" | "repeat-x" | "repeat-y" | "no-repeat";
+export type BorderRadiusValue = number | string;
+export type BorderRadius = BorderRadiusType;
+export type Overflow = "none" | "visible" | "hidden" | "scroll" | "auto";
+export type BoxAlignment = keyof typeof BoxAlignment | string;
+export declare const BoxAlignment: {
+    readonly center: "center";
+    readonly top: "top";
+    readonly bottom: "bottom";
+    readonly left: "left";
+    readonly right: "right";
+    readonly topLeft: "left top";
+    readonly topCenter: "center top";
+    readonly topRight: "right top";
+    readonly centerLeft: "left center";
+    readonly centerRight: "right center";
+    readonly bottomLeft: "left bottom";
+    readonly bottomCenter: "center bottom";
+    readonly bottomRight: "right bottom";
+};
+export declare function setBaseUrl(url: string): void;
+export declare function normalizeSrc(src: string): string;
+export type ImageProvider = string;
+export declare const NetworkImage: (url: string) => string;
+export declare const AssetImage: (url: string) => string;
+export interface DecorationImage {
+    image: ImageProvider;
+    fit?: BoxFit;
+    alignment?: BoxAlignment;
+    repeat?: ImageRepeat;
+    blendMode?: string;
+    attachment?: string;
+    clip?: string;
+    origin?: string;
+}
+export declare function DecorationImage(props: DecorationImage): DecorationImage;
+/**
+ * BoxDecoration接口定义
+ */
+export type BoxDecoration = {
+    color?: string;
+    border?: Borders;
+    borderRadius?: BorderRadius;
+    boxShadow?: BoxShadow | BoxShadow[];
+    gradient?: string;
+    image?: DecorationImage;
+    overflow?: Overflow;
+    opacity?: number | string;
+};
+export interface BoxShadow {
+    color?: string;
+    offset?: {
+        x: number;
+        y: number;
+    };
+    blurRadius?: number;
+    spreadRadius?: number;
+    inset?: boolean;
+}
+export declare function decorationImageToStyle(di: DecorationImage): CSSProperties;
+export declare function boxDecorationToStyle(decoration?: BoxDecoration): CSSProperties;
+export declare function BoxDecoration(props?: BoxDecoration): BoxDecoration;
+export declare function LinearGradient(direction: string, ...colors: string[]): string;
+/**
+ * Clip
+ * 对应 Flutter 的 Clip
+ */
+export declare const Clip: {
+    readonly none: "none";
+    readonly hardEdge: "hardEdge";
+    readonly antiAlias: "antiAlias";
+    readonly antiAliasWithSaveLayer: "antiAliasWithSaveLayer";
+};
+export type Clip = keyof typeof Clip;
+export {};

package/dist/Center.d.ts

@@ -0,0 +1,29 @@
+interface Props {
+    /**
+     * 宽度因子
+     * 如果非 null，则将其宽度设置为子元素宽度乘以该因子。
+     */
+    widthFactor?: number;
+    /**
+     * 高度因子
+     * 如果非 null，则将其高度设置为子元素高度乘以该因子。
+     */
+    heightFactor?: number;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/Column.d.ts

@@ -0,0 +1,18 @@
+import { FlexBoxProps } from './FlexProps';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<FlexBoxProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<FlexBoxProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/Container.d.ts

@@ -0,0 +1,37 @@
+import { BoxConstraints } from './BoxConstraints';
+import { BoxDecoration } from './BoxDecoration';
+import { EdgeInsets } from './EdgeInsets';
+import { FlexAlignment } from './FlexProps';
+interface Props {
+    width?: number | string;
+    height?: number | string;
+    padding?: EdgeInsets;
+    margin?: EdgeInsets;
+    decoration?: BoxDecoration;
+    foregroundDecoration?: BoxDecoration;
+    color?: string;
+    alignment?: FlexAlignment | string;
+    clipBehavior?: "none" | "hardEdge" | "antiAlias" | string;
+    transform?: string;
+    transformAlignment?: FlexAlignment | string;
+    constraints?: BoxConstraints;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {
+    clipBehavior: "none" | "hardEdge" | "antiAlias" | string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/EdgeInsets.d.ts

@@ -0,0 +1,19 @@
+export interface EdgeInsets {
+    top?: number | string;
+    right?: number | string;
+    bottom?: number | string;
+    left?: number | string;
+    all?: number | string;
+    horizontal?: number | string;
+    vertical?: number | string;
+}
+export declare function EdgeInsets(edgeInsets: EdgeInsets): EdgeInsets;
+export declare function edgeInsetsToStyle(type: "margin" | "padding", edgeInsets: EdgeInsets | undefined): {
+    [x: string]: string;
+};
+export declare const paddingToStyle: (value?: EdgeInsets) => {
+    [x: string]: string;
+};
+export declare const marginToStyle: (value?: EdgeInsets) => {
+    [x: string]: string;
+};

package/dist/Expanded.d.ts

@@ -0,0 +1,26 @@
+interface Props {
+    flex?: number;
+    alignSelf?: "auto" | "start" | "end" | "center" | "stretch" | "baseline";
+    minSize?: number | string;
+    maxSize?: number | string;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {
+    flex: number;
+    alignSelf: "auto" | "start" | "end" | "center" | "stretch" | "baseline";
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/Fixed.d.ts

@@ -0,0 +1,20 @@
+import { Props } from './usePosition';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {
+    zIndex: number | string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/FlexBox.d.ts

@@ -0,0 +1,26 @@
+import { CrossAxisAlignment, FlexBoxProps, MainAxisAlignment } from './FlexProps';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<FlexBoxProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<FlexBoxProps> & Readonly<{}>, {
+    wrap: boolean;
+    expanded: boolean;
+    direction: "row" | "column" | "row-reverse" | "column-reverse" | string;
+    mainAxisAlignment: MainAxisAlignment;
+    crossAxisAlignment: CrossAxisAlignment;
+    gap: number | string;
+    as: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/FlexItem.d.ts

@@ -0,0 +1,30 @@
+interface Props {
+    flex?: number;
+    expanded?: boolean;
+    flexible?: boolean;
+    alignSelf?: "auto" | "start" | "end" | "center" | "stretch" | "baseline";
+    minSize?: number | string;
+    maxSize?: number | string;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {
+    flex: number;
+    expanded: boolean;
+    flexible: boolean;
+    alignSelf: "auto" | "start" | "end" | "center" | "stretch" | "baseline";
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/FlexProps.d.ts

@@ -0,0 +1,131 @@
+import { BoxConstraints } from './BoxConstraints';
+export type FlexAlignment = keyof typeof FlexAlignment;
+/**
+ * FlexAlignment 定义
+ * 对应 Flutter 的 Alignment 常量
+ * 用于 Container 等组件的 alignment 属性
+ */
+export declare const FlexAlignment: {
+    readonly center: {
+        readonly justifyContent: "center";
+        readonly alignItems: "center";
+    };
+    readonly topLeft: {
+        readonly justifyContent: "flex-start";
+        readonly alignItems: "flex-start";
+    };
+    readonly topCenter: {
+        readonly justifyContent: "center";
+        readonly alignItems: "flex-start";
+    };
+    readonly topRight: {
+        readonly justifyContent: "flex-end";
+        readonly alignItems: "flex-start";
+    };
+    readonly centerLeft: {
+        readonly justifyContent: "flex-start";
+        readonly alignItems: "center";
+    };
+    readonly centerRight: {
+        readonly justifyContent: "flex-end";
+        readonly alignItems: "center";
+    };
+    readonly bottomLeft: {
+        readonly justifyContent: "flex-start";
+        readonly alignItems: "flex-end";
+    };
+    readonly bottomCenter: {
+        readonly justifyContent: "center";
+        readonly alignItems: "flex-end";
+    };
+    readonly bottomRight: {
+        readonly justifyContent: "flex-end";
+        readonly alignItems: "flex-end";
+    };
+};
+export declare function alignmentToStyle(alignment: FlexAlignment, direction?: "row" | "column"): {
+    readonly justifyContent: "center";
+    readonly alignItems: "center";
+} | {
+    readonly justifyContent: "flex-start";
+    readonly alignItems: "flex-start";
+} | {
+    readonly justifyContent: "center";
+    readonly alignItems: "flex-start";
+} | {
+    readonly justifyContent: "flex-end";
+    readonly alignItems: "flex-start";
+} | {
+    readonly justifyContent: "flex-start";
+    readonly alignItems: "center";
+} | {
+    readonly justifyContent: "flex-end";
+    readonly alignItems: "center";
+} | {
+    readonly justifyContent: "flex-start";
+    readonly alignItems: "flex-end";
+} | {
+    readonly justifyContent: "center";
+    readonly alignItems: "flex-end";
+} | {
+    readonly justifyContent: "flex-end";
+    readonly alignItems: "flex-end";
+} | {
+    justifyContent?: undefined;
+    alignItems?: undefined;
+} | {
+    justifyContent: "center" | "flex-start" | "flex-end";
+    alignItems: "center" | "flex-start" | "flex-end";
+};
+export declare function alignmentToOrigin(alignment: FlexAlignment): string | undefined;
+type Valueof<T> = T[keyof T];
+/**
+ * CrossAxisAlignment
+ * 对应 CSS alignItems
+ */
+export declare const CrossAxisAlignment: {
+    readonly start: "start";
+    readonly end: "end";
+    readonly center: "center";
+    readonly stretch: "stretch";
+    readonly baseline: "baseline";
+};
+export type CrossAxisAlignment = Valueof<typeof CrossAxisAlignment> | string;
+/**
+ * MainAxisAlignment
+ * 对应 CSS justifyContent
+ * 注意：这里的值对应的是简写，由 FlexBoxJustifyMap 转换为 CSS 值
+ */
+export declare const MainAxisAlignment: {
+    readonly start: "start";
+    readonly end: "end";
+    readonly center: "center";
+    readonly spaceBetween: "space-between";
+    readonly spaceAround: "space-around";
+    readonly spaceEvenly: "space-evenly";
+};
+export type MainAxisAlignment = Valueof<typeof MainAxisAlignment> | string;
+export type FlexBoxProps = {
+    direction?: "row" | "column" | "row-reverse" | "column-reverse" | string;
+    mainAxisAlignment?: MainAxisAlignment;
+    crossAxisAlignment?: CrossAxisAlignment;
+    wrap?: boolean;
+    gap?: number | string;
+    expanded?: boolean;
+    as?: string;
+    constraints?: BoxConstraints;
+};
+type Preset = Record<string, string>;
+export declare const FlexBoxJustifyMap: Preset;
+export declare const FlexBoxAlignMap: Preset;
+/**
+ * StackFit
+ * 对应 Flutter 的 StackFit
+ */
+export declare const StackFit: {
+    readonly loose: "loose";
+    readonly expand: "expand";
+    readonly passthrough: "passthrough";
+};
+export type StackFit = Valueof<typeof StackFit>;
+export {};