fluekit 1.0.0 → 1.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (16) hide show
  1. package/README.md +84 -36
  2. package/dist/Align.d.ts +3 -3
  3. package/dist/AnimatedContainer.d.ts +3 -3
  4. package/dist/BoxConstraints.d.ts +4 -3
  5. package/dist/BoxDecoration.d.ts +9 -7
  6. package/dist/Container.d.ts +3 -3
  7. package/dist/EdgeInsets.d.ts +6 -5
  8. package/dist/FlexProps.d.ts +6 -6
  9. package/dist/Size.d.ts +4 -3
  10. package/dist/TextStyle.d.ts +4 -3
  11. package/dist/Transform.d.ts +3 -3
  12. package/dist/index.css +1 -1
  13. package/dist/index.d.ts +1 -1
  14. package/dist/index.js +4 -4
  15. package/dist/useOpacity.d.ts +4 -4
  16. package/package.json +6 -6
package/README.md CHANGED
@@ -1,17 +1,16 @@
1
1
  # FlueKit
2
2
 
3
- **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.
3
+ **FlueKit** is a Vue 3 component library that brings **Flutter's layout paradigm** to the web. It allows you to build complex, responsive user interfaces using declarative, composable widgets instead of struggling with CSS layout quirks.
4
4
 
5
- ## Features
5
+ ## ✨ Features
6
6
 
7
- - **Layout Primitives**: `Row`, `Column`, `Stack`, `Positioned`, `Expanded`, `SizedBox`, `Center`, `Align`
8
- - **Container System**: `Container`, `AnimatedContainer`, `Padding`, `ConstrainedBox`
9
- - **Scrolling**: `ListView`, `GridView`, `ScrollView` (SingleChildScrollView)
10
- - **Styling**: `BoxDecoration`, `TextStyle`, `EdgeInsets`, `BorderRadius`
11
- - **Interactions**: `GestureDetector`, `IgnorePointer`, `AbsorbPointer`
12
- - **Animations**: `AnimatedContainer`, `AnimatedOpacity`
7
+ - **Flutter-like API**: Familiar widget names and properties (`Row`, `Column`, `Stack`, `Container`, `Expanded`, etc.).
8
+ - **Responsive by Default**: Built-in `px` to `vw` conversion system for mobile-first development.
9
+ - **Type Safe**: Written in TypeScript with full type definitions.
10
+ - **Composable**: Build UIs by nesting components, just like in Flutter.
11
+ - **Zero-CSS Layouts**: Handle alignment, padding, margin, and positioning purely through props.
13
12
 
14
- ## Installation
13
+ ## 📦 Installation
15
14
 
16
15
  ```bash
17
16
  npm install fluekit
@@ -21,43 +20,92 @@ pnpm add fluekit
21
20
  yarn add fluekit
22
21
  ```
23
22
 
24
- ## Quick Start
23
+ ## 🚀 Usage
24
+
25
+ ### Basic Example
25
26
 
26
27
  ```vue
27
28
  <script setup>
28
- import { Container, Center, Text, Column, SizedBox } from "fluekit";
29
+ import { Container, Column, Row, Text, SizedBox, Alignment, MainAxisAlignment } from "fluekit";
29
30
  </script>
30
31
 
31
32
  <template>
32
- <Center>
33
- <Container
34
- :width="300"
35
- :height="200"
36
- color="#2196F3"
37
- :decoration="{
38
- borderRadius: { all: 16 },
39
- boxShadow: [{ color: 'black', blurRadius: 10, offset: { x: 0, y: 4 } }]
40
- }"
41
- alignment="center"
42
- >
43
- <Column mainAxisAlignment="center">
44
- <Text :style="{ color: 'white', fontSize: 24, fontWeight: 'bold' }">
45
- Hello FlueKit
46
- </Text>
47
- <SizedBox :height="10" />
48
- <Text :style="{ color: 'white', fontSize: 16 }">
49
- Flutter-like layouts for Vue 3
50
- </Text>
51
- </Column>
52
- </Container>
53
- </Center>
33
+ <Container alignment="center" color="#f5f5f5" :height="400">
34
+ <Column :mainAxisAlignment="MainAxisAlignment.center">
35
+ <!-- Avatar -->
36
+ <Container
37
+ :width="80"
38
+ :height="80"
39
+ :decoration="{
40
+ color: 'blue',
41
+ borderRadius: { all: 40 },
42
+ boxShadow: [{ color: '#00000033', blurRadius: 10, offset: { x: 0, y: 5 } }],
43
+ }"
44
+ />
45
+
46
+ <SizedBox :height="20" />
47
+
48
+ <!-- Text Content -->
49
+ <Text :style="{ fontSize: 24, fontWeight: 'bold' }"> Hello FlueKit </Text>
50
+
51
+ <SizedBox :height="8" />
52
+
53
+ <Text :style="{ color: '#666' }"> Flutter-style layouts in Vue 3 </Text>
54
+ </Column>
55
+ </Container>
54
56
  </template>
55
57
  ```
56
58
 
57
- ## Documentation
59
+ ### Responsive Design (px to vw)
60
+
61
+ FlueKit automatically converts number values (e.g., `:width="100"`) to `vw` units based on a default design width of **750px**.
62
+
63
+ To change the design width (e.g., to 375px):
64
+
65
+ ```typescript
66
+ import { setDefaultVW } from "fluekit";
67
+
68
+ // Call this in your main.ts or App.vue setup
69
+ setDefaultVW(375);
70
+ ```
71
+
72
+ To disable automatic conversion:
73
+
74
+ ```typescript
75
+ import { setTransform } from "fluekit";
76
+
77
+ setTransform(false); // Numbers will be treated as px
78
+ ```
79
+
80
+ ## 🧩 Component Overview
81
+
82
+ ### Layout Widgets
83
+
84
+ - **Container**: A convenience widget that combines common painting, positioning, and sizing.
85
+ - **Row / Column**: Flexbox layouts for horizontal and vertical arrays.
86
+ - **Stack / Positioned**: Overlapping layouts.
87
+ - **Expanded**: Expands a child of a Row or Column to fill available space.
88
+ - **SizedBox**: A box with a specified size.
89
+ - **Center / Align**: Alignment widgets.
90
+ - **Wrap**: A widget that displays its children in multiple horizontal or vertical runs.
91
+
92
+ ### Scrolling
93
+
94
+ - **ListView**: A scrollable list of widgets.
95
+ - **GridView**: A scrollable, 2D array of widgets.
96
+ - **ScrollView**: A box in which a single widget can be scrolled.
97
+
98
+ ### Painting & Effects
99
+
100
+ - **Opacity / AnimatedOpacity**: Makes its child partially transparent.
101
+ - **Transform**: Applies a transformation before painting its child.
102
+ - **Decorations**: Rich styling support via `BoxDecoration` (borders, shadows, gradients, images).
103
+
104
+ ### Interactions
58
105
 
59
- Visit the [documentation website](https://fitz.github.io/fluekit) for detailed guides and API references.
106
+ - **GestureDetector**: Detects gestures (tap, double tap, pan, long press).
107
+ - **IgnorePointer**: Invisible widget that controls hit-testing.
60
108
 
61
- ## License
109
+ ## 📄 License
62
110
 
63
111
  MIT
package/dist/Align.d.ts CHANGED
@@ -1,6 +1,6 @@
1
- import { FlexAlignment } from './FlexProps';
1
+ import { Alignment } from './FlexProps';
2
2
  interface Props {
3
- alignment?: FlexAlignment;
3
+ alignment?: Alignment;
4
4
  widthFactor?: number;
5
5
  heightFactor?: number;
6
6
  }
@@ -14,7 +14,7 @@ declare function __VLS_template(): {
14
14
  };
15
15
  type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
16
16
  declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {
17
- alignment: FlexAlignment;
17
+ alignment: Alignment;
18
18
  }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
19
19
  declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
20
20
  export default _default;
package/dist/AnimatedContainer.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import { BoxConstraints } from './BoxConstraints';
2
2
  import { BoxDecoration } from './BoxDecoration';
3
3
  import { EdgeInsets } from './EdgeInsets';
4
- import { FlexAlignment } from './FlexProps';
4
+ import { Alignment } from './FlexProps';
5
5
  interface Props {
6
6
  width?: number | string;
7
7
  height?: number | string;
@@ -10,10 +10,10 @@ interface Props {
10
10
  decoration?: BoxDecoration;
11
11
  foregroundDecoration?: BoxDecoration;
12
12
  color?: string;
13
- alignment?: FlexAlignment | string;
13
+ alignment?: Alignment | string;
14
14
  clipBehavior?: "none" | "hardEdge" | "antiAlias" | string;
15
15
  transform?: string;
16
- transformAlignment?: FlexAlignment | string;
16
+ transformAlignment?: Alignment | string;
17
17
  constraints?: BoxConstraints;
18
18
  duration?: number;
19
19
  curve?: string;
package/dist/BoxConstraints.d.ts CHANGED
@@ -1,9 +1,10 @@
1
1
  import { CSSProperties } from 'vue';
2
- export interface BoxConstraints {
2
+ export interface BoxConstraintsProps {
3
3
  minWidth?: number;
4
4
  maxWidth?: number;
5
5
  minHeight?: number;
6
6
  maxHeight?: number;
7
7
  }
8
- export declare function BoxConstraints(props?: BoxConstraints): BoxConstraints;
9
- export declare function boxConstraintsToStyle(constraints?: BoxConstraints): CSSProperties;
8
+ export type BoxConstraints = BoxConstraintsProps;
9
+ export declare function BoxConstraints(props?: BoxConstraintsProps): BoxConstraintsProps;
10
+ export declare function boxConstraintsToStyle(constraints?: BoxConstraintsProps): CSSProperties;
package/dist/BoxDecoration.d.ts CHANGED
@@ -37,7 +37,7 @@ export declare function normalizeSrc(src: string): string;
37
37
  export type ImageProvider = string;
38
38
  export declare const NetworkImage: (url: string) => string;
39
39
  export declare const AssetImage: (url: string) => string;
40
- export interface DecorationImage {
40
+ export interface DecorationImageProps {
41
41
  image: ImageProvider;
42
42
  fit?: BoxFit;
43
43
  alignment?: BoxAlignment;
@@ -47,20 +47,22 @@ export interface DecorationImage {
47
47
  clip?: string;
48
48
  origin?: string;
49
49
  }
50
- export declare function DecorationImage(props: DecorationImage): DecorationImage;
50
+ export type DecorationImage = DecorationImageProps;
51
+ export declare function DecorationImage(props: DecorationImageProps): DecorationImageProps;
51
52
  /**
52
53
  * BoxDecoration接口定义
53
54
  */
54
- export type BoxDecoration = {
55
+ export type BoxDecorationProps = {
55
56
  color?: string;
56
57
  border?: Borders;
57
58
  borderRadius?: BorderRadius;
58
59
  boxShadow?: BoxShadow | BoxShadow[];
59
60
  gradient?: string;
60
- image?: DecorationImage;
61
+ image?: DecorationImageProps;
61
62
  overflow?: Overflow;
62
63
  opacity?: number | string;
63
64
  };
65
+ export type BoxDecoration = BoxDecorationProps;
64
66
  export interface BoxShadow {
65
67
  color?: string;
66
68
  offset?: {
@@ -71,9 +73,9 @@ export interface BoxShadow {
71
73
  spreadRadius?: number;
72
74
  inset?: boolean;
73
75
  }
74
- export declare function decorationImageToStyle(di: DecorationImage): CSSProperties;
75
- export declare function boxDecorationToStyle(decoration?: BoxDecoration): CSSProperties;
76
- export declare function BoxDecoration(props?: BoxDecoration): BoxDecoration;
76
+ export declare function decorationImageToStyle(di: DecorationImageProps): CSSProperties;
77
+ export declare function boxDecorationToStyle(decoration?: BoxDecorationProps): CSSProperties;
78
+ export declare function BoxDecoration(props?: BoxDecorationProps): BoxDecorationProps;
77
79
  export declare function LinearGradient(direction: string, ...colors: string[]): string;
78
80
  /**
79
81
  * Clip
package/dist/Container.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import { BoxConstraints } from './BoxConstraints';
2
2
  import { BoxDecoration } from './BoxDecoration';
3
3
  import { EdgeInsets } from './EdgeInsets';
4
- import { FlexAlignment } from './FlexProps';
4
+ import { Alignment } from './FlexProps';
5
5
  interface Props {
6
6
  width?: number | string;
7
7
  height?: number | string;
@@ -10,10 +10,10 @@ interface Props {
10
10
  decoration?: BoxDecoration;
11
11
  foregroundDecoration?: BoxDecoration;
12
12
  color?: string;
13
- alignment?: FlexAlignment | string;
13
+ alignment?: Alignment | string;
14
14
  clipBehavior?: "none" | "hardEdge" | "antiAlias" | string;
15
15
  transform?: string;
16
- transformAlignment?: FlexAlignment | string;
16
+ transformAlignment?: Alignment | string;
17
17
  constraints?: BoxConstraints;
18
18
  }
19
19
  declare function __VLS_template(): {
package/dist/EdgeInsets.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- export interface EdgeInsets {
1
+ export interface EdgeInsetsProps {
2
2
  top?: number | string;
3
3
  right?: number | string;
4
4
  bottom?: number | string;
@@ -7,13 +7,14 @@ export interface EdgeInsets {
7
7
  horizontal?: number | string;
8
8
  vertical?: number | string;
9
9
  }
10
- export declare function EdgeInsets(edgeInsets: EdgeInsets): EdgeInsets;
11
- export declare function edgeInsetsToStyle(type: "margin" | "padding", edgeInsets: EdgeInsets | undefined): {
10
+ export type EdgeInsets = EdgeInsetsProps;
11
+ export declare function EdgeInsets(edgeInsets: EdgeInsetsProps): EdgeInsetsProps;
12
+ export declare function edgeInsetsToStyle(type: "margin" | "padding", edgeInsets: EdgeInsetsProps | undefined): {
12
13
  [x: string]: string;
13
14
  };
14
- export declare const paddingToStyle: (value?: EdgeInsets) => {
15
+ export declare const paddingToStyle: (value?: EdgeInsetsProps) => {
15
16
  [x: string]: string;
16
17
  };
17
- export declare const marginToStyle: (value?: EdgeInsets) => {
18
+ export declare const marginToStyle: (value?: EdgeInsetsProps) => {
18
19
  [x: string]: string;
19
20
  };
package/dist/FlexProps.d.ts CHANGED
@@ -1,11 +1,11 @@
1
- import { BoxConstraints } from './BoxConstraints';
2
- export type FlexAlignment = keyof typeof FlexAlignment;
1
+ import { BoxConstraintsProps } from './BoxConstraints';
2
+ export type Alignment = keyof typeof Alignment;
3
3
  /**
4
4
  * FlexAlignment 定义
5
5
  * 对应 Flutter 的 Alignment 常量
6
6
  * 用于 Container 等组件的 alignment 属性
7
7
  */
8
- export declare const FlexAlignment: {
8
+ export declare const Alignment: {
9
9
  readonly center: {
10
10
  readonly justifyContent: "center";
11
11
  readonly alignItems: "center";
@@ -43,7 +43,7 @@ export declare const FlexAlignment: {
43
43
  readonly alignItems: "flex-end";
44
44
  };
45
45
  };
46
- export declare function alignmentToStyle(alignment: FlexAlignment, direction?: "row" | "column"): {
46
+ export declare function alignmentToStyle(alignment: Alignment, direction?: "row" | "column"): {
47
47
  readonly justifyContent: "center";
48
48
  readonly alignItems: "center";
49
49
  } | {
@@ -77,7 +77,7 @@ export declare function alignmentToStyle(alignment: FlexAlignment, direction?: "
77
77
  justifyContent: "center" | "flex-start" | "flex-end";
78
78
  alignItems: "center" | "flex-start" | "flex-end";
79
79
  };
80
- export declare function alignmentToOrigin(alignment: FlexAlignment): string | undefined;
80
+ export declare function alignmentToOrigin(alignment: Alignment): string | undefined;
81
81
  type Valueof<T> = T[keyof T];
82
82
  /**
83
83
  * CrossAxisAlignment
@@ -113,7 +113,7 @@ export type FlexBoxProps = {
113
113
  gap?: number | string;
114
114
  expanded?: boolean;
115
115
  as?: string;
116
- constraints?: BoxConstraints;
116
+ constraints?: BoxConstraintsProps;
117
117
  };
118
118
  type Preset = Record<string, string>;
119
119
  export declare const FlexBoxJustifyMap: Preset;
package/dist/Size.d.ts CHANGED
@@ -1,9 +1,10 @@
1
- export interface Size {
1
+ export interface SizeType {
2
2
  width?: number | string;
3
3
  height?: number | string;
4
4
  }
5
- export declare function Size(value: Size | string | number): Size | undefined;
6
- export declare function sizeToStyle(size?: Size): {
5
+ export type Size = SizeType;
6
+ export declare function Size(value: SizeType | string | number): SizeType | undefined;
7
+ export declare function sizeToStyle(size?: SizeType): {
7
8
  width: string;
8
9
  height: string;
9
10
  } | undefined;
package/dist/TextStyle.d.ts CHANGED
@@ -89,7 +89,7 @@ export interface TextShadow {
89
89
  /** 模糊半径 */
90
90
  blurRadius?: number;
91
91
  }
92
- export interface TextStyle {
92
+ export interface TextStyleProps {
93
93
  inherit?: boolean;
94
94
  color?: string;
95
95
  backgroundColor?: string;
@@ -117,5 +117,6 @@ export interface TextStyle {
117
117
  package?: string;
118
118
  overflow?: TextOverflow;
119
119
  }
120
- export declare function toCSSStyle(props?: TextStyle): CSSProperties;
121
- export declare function TextStyle(initial?: TextStyle, cloned?: TextStyle): TextStyle;
120
+ export type TextStyle = TextStyleProps;
121
+ export declare function toCSSStyle(props?: TextStyleProps): CSSProperties;
122
+ export declare function TextStyle(initial?: TextStyleProps, cloned?: TextStyleProps): TextStyleProps;
package/dist/Transform.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { FlexAlignment } from './FlexProps';
1
+ import { Alignment } from './FlexProps';
2
2
  interface Props {
3
3
  /**
4
4
  * CSS 变换字符串
@@ -10,7 +10,7 @@ interface Props {
10
10
  * 变换的原点对齐方式
11
11
  * 对应 Flutter 的 alignment
12
12
  */
13
- alignment?: FlexAlignment;
13
+ alignment?: Alignment;
14
14
  /**
15
15
  * 具体的原点偏移 (CSS transform-origin)
16
16
  * 如果提供了 alignment，origin 会被忽略或合并（取决于实现，这里优先 alignment）
@@ -27,7 +27,7 @@ declare function __VLS_template(): {
27
27
  };
28
28
  type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
29
29
  declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {
30
- alignment: FlexAlignment;
30
+ alignment: Alignment;
31
31
  }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
32
32
  declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
33
33
  export default _default;
package/dist/index.css CHANGED
@@ -1,2 +1,2 @@
1
- .flutter-list-view[data-v-3b4a0fca]{flex-direction:column;display:flex}.list-view-shrink-wrap[data-v-3b4a0fca]{flex:none}.flutter-stack[data-v-f268257b]>*{flex-shrink:0}.flutter-transform[data-v-44c40486]{box-sizing:border-box}
1
+ .flutter-list-view[data-v-3b4a0fca]{flex-direction:column;display:flex}.list-view-shrink-wrap[data-v-3b4a0fca]{flex:none}.flutter-stack[data-v-f268257b]>*{flex-shrink:0}.flutter-transform[data-v-7e66ebaa]{box-sizing:border-box}
2
2
  /*$vite$:1*/
package/dist/index.d.ts CHANGED
@@ -27,7 +27,7 @@ export * from './BoxConstraints';
27
27
  export * from './BoxDecoration';
28
28
  export * from './EdgeInsets';
29
29
  export * from './FlexProps';
30
- export { FlexAlignment as Alignment } from './FlexProps';
30
+ export { Alignment as Alignment } from './FlexProps';
31
31
  export * from './Size';
32
32
  export * from './TextStyle';
33
33
  export * from './useOpacity';
package/dist/index.js CHANGED
@@ -42,7 +42,7 @@ function px2vw(o, F = DEFAULT_VW) {
42
42
  return o = Number(o), F /= 100, `${Math.round(o / F * 1e5) / 1e5}vw`;
43
43
  }
44
44
  }
45
- const FlexAlignment = {
45
+ const Alignment = {
46
46
  center: {
47
47
  justifyContent: "center",
48
48
  alignItems: "center"
@@ -81,7 +81,7 @@ const FlexAlignment = {
81
81
  }
82
82
  };
83
83
  function alignmentToStyle(o, F = "row") {
84
- let I = FlexAlignment[o];
84
+ let I = Alignment[o];
85
85
  return I ? F === "row" ? I : {
86
86
  justifyContent: I.alignItems,
87
87
  alignItems: I.justifyContent
@@ -1412,7 +1412,7 @@ var Text_default = /* @__PURE__ */ defineComponent({
1412
1412
  style: normalizeStyle(I.value)
1413
1413
  }, [renderSlot(o.$slots, "default", {}, void 0, !0)], 4));
1414
1414
  }
1415
- }), [["__scopeId", "data-v-44c40486"]]), Wrap_default = /* @__PURE__ */ defineComponent({
1415
+ }), [["__scopeId", "data-v-7e66ebaa"]]), Wrap_default = /* @__PURE__ */ defineComponent({
1416
1416
  inheritAttrs: !1,
1417
1417
  __name: "Wrap",
1418
1418
  props: {
@@ -1454,4 +1454,4 @@ var Text_default = /* @__PURE__ */ defineComponent({
1454
1454
  }
1455
1455
  });
1456
1456
  setTransform(!1);
1457
- export { Align_default as Align, FlexAlignment as Alignment, FlexAlignment, AnimatedContainer_default as AnimatedContainer, AnimatedOpacity_default as AnimatedOpacity, AssetImage, Border, BoxAlignment, BoxConstraints, BoxDecoration, BoxFit, Center_default as Center, Clip, Column_default as Column, Container_default as Container, CrossAxisAlignment, DecorationImage, EdgeInsets, Expanded_default as Expanded, Fixed_default as Fixed, FlexBoxAlignMap, FlexBoxJustifyMap, FontStyle, FontWeight, GestureDetector_default as GestureDetector, GridView_default as GridView, IgnorePointer_default as IgnorePointer, LinearGradient, ListView_default as ListView, MainAxisAlignment, NetworkImage, Opacity_default as Opacity, OpacityKey, Padding_default as Padding, Positioned_default as Positioned, Row_default as Row, SafeArea_default as SafeArea, ScrollView_default as ScrollView, Size, SizedBox_default as SizedBox, Stack_default as Stack, StackFit, Sticky_default as Sticky, Text_default as Text, TextAlign, TextBaseline, TextDecoration, TextDecorationStyle, TextDirection, TextOverflow, TextStyle, Transform_default as Transform, Wrap_default as Wrap, alignmentToOrigin, alignmentToStyle, borderToStyle, boxConstraintsToStyle, boxDecorationToStyle, decorationImageToStyle, edgeInsetsToStyle, marginToStyle, normalizeSrc, paddingToStyle, provideOpacity, px2vw, setBaseUrl, setDefaultVW, setTransform, sizeToStyle, toCSSStyle, useOpacity };
1457
+ export { Align_default as Align, Alignment, AnimatedContainer_default as AnimatedContainer, AnimatedOpacity_default as AnimatedOpacity, AssetImage, Border, BoxAlignment, BoxConstraints, BoxDecoration, BoxFit, Center_default as Center, Clip, Column_default as Column, Container_default as Container, CrossAxisAlignment, DecorationImage, EdgeInsets, Expanded_default as Expanded, Fixed_default as Fixed, FlexBoxAlignMap, FlexBoxJustifyMap, FontStyle, FontWeight, GestureDetector_default as GestureDetector, GridView_default as GridView, IgnorePointer_default as IgnorePointer, LinearGradient, ListView_default as ListView, MainAxisAlignment, NetworkImage, Opacity_default as Opacity, OpacityKey, Padding_default as Padding, Positioned_default as Positioned, Row_default as Row, SafeArea_default as SafeArea, ScrollView_default as ScrollView, Size, SizedBox_default as SizedBox, Stack_default as Stack, StackFit, Sticky_default as Sticky, Text_default as Text, TextAlign, TextBaseline, TextDecoration, TextDecorationStyle, TextDirection, TextOverflow, TextStyle, Transform_default as Transform, Wrap_default as Wrap, alignmentToOrigin, alignmentToStyle, borderToStyle, boxConstraintsToStyle, boxDecorationToStyle, decorationImageToStyle, edgeInsetsToStyle, marginToStyle, normalizeSrc, paddingToStyle, provideOpacity, px2vw, setBaseUrl, setDefaultVW, setTransform, sizeToStyle, toCSSStyle, useOpacity };
package/dist/useOpacity.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { InjectionKey, Ref } from 'vue';
2
- export declare const OpacityKey: InjectionKey<Ref<number>>;
3
- export declare function useOpacity(): Ref<number, number>;
4
- export declare function provideOpacity(opacity: number | Ref<number>): import('vue').ComputedRef<number>;
1
+ import { InjectionKey, MaybeRef, ComputedRef } from 'vue';
2
+ export declare const OpacityKey: InjectionKey<ComputedRef<number>>;
3
+ export declare function useOpacity(): ComputedRef<number>;
4
+ export declare function provideOpacity(opacity: MaybeRef<number>): ComputedRef<number>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "fluekit",
3
- "version": "1.0.0",
3
+ "version": "1.0.1",
4
4
  "description": "A Flutter-style Layout UI kit for Vue",
5
5
  "repository": {
6
6
  "type": "git",
@@ -19,6 +19,10 @@
19
19
  "files": [
20
20
  "dist"
21
21
  ],
22
+ "scripts": {
23
+ "build": "vite build",
24
+ "test": "vitest"
25
+ },
22
26
  "peerDependencies": {
23
27
  "vue": "^3.5.0"
24
28
  },
@@ -32,9 +36,5 @@
32
36
  "vite-plugin-dts": "^4.5.4",
33
37
  "vitest": "^4.0.16",
34
38
  "vue-tsc": "^3.1.4"
35
- },
36
- "scripts": {
37
- "build": "vite build",
38
- "test": "vitest"
39
39
  }
40
- }
40
+ }