@impulse-ui-native/data-state 2.4.0 → 2.5.0
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.
- package/dist/components/data-view.js +10 -3
- package/dist/components/data-view.js.map +1 -1
- package/dist/components/empty-details.js +6 -5
- package/dist/components/empty-details.js.map +1 -1
- package/dist/components/error-details.js +6 -5
- package/dist/components/error-details.js.map +1 -1
- package/dist/components/loading-view.js +11 -5
- package/dist/components/loading-view.js.map +1 -1
- package/dist/components/state-actions-footer.js +3 -2
- package/dist/components/state-actions-footer.js.map +1 -1
- package/package.json +8 -8
|
@@ -6,7 +6,8 @@ import { EmptyDetails } from "./empty-details";
|
|
|
6
6
|
import { ErrorDetails } from "./error-details";
|
|
7
7
|
import { LoadingView } from "./loading-view";
|
|
8
8
|
const DataView = memo((props) => {
|
|
9
|
-
const tokens = useComponentsTokens()
|
|
9
|
+
const tokens = useComponentsTokens();
|
|
10
|
+
const dataStateTokens = tokens.dataState;
|
|
10
11
|
const {
|
|
11
12
|
error,
|
|
12
13
|
isEmpty,
|
|
@@ -27,14 +28,20 @@ const DataView = memo((props) => {
|
|
|
27
28
|
{
|
|
28
29
|
alignItems: "center",
|
|
29
30
|
justifyContent: "center",
|
|
30
|
-
zIndex:
|
|
31
|
+
zIndex: dataStateTokens.content.zIndex,
|
|
31
32
|
children: [
|
|
32
33
|
error ? /* @__PURE__ */ jsx(ErrorDetails, { ...errorViewProps }) : null,
|
|
33
34
|
isEmpty ? /* @__PURE__ */ jsx(EmptyDetails, { ...emptyViewProps }) : null
|
|
34
35
|
]
|
|
35
36
|
}
|
|
36
37
|
);
|
|
37
|
-
}, [
|
|
38
|
+
}, [
|
|
39
|
+
dataStateTokens.content.zIndex,
|
|
40
|
+
emptyViewProps,
|
|
41
|
+
error,
|
|
42
|
+
errorViewProps,
|
|
43
|
+
isEmpty
|
|
44
|
+
]);
|
|
38
45
|
return /* @__PURE__ */ jsxs(
|
|
39
46
|
LoadingView,
|
|
40
47
|
{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/data-view.tsx"],"sourcesContent":["import { memo, PropsWithChildren, useMemo } from \"react\";\n\nimport { View } from \"@impulse-ui-native/primitives\";\nimport { useComponentsTokens } from \"@impulse-ui-native/theme\";\n\nimport { DataViewProps } from \"../types\";\nimport { EmptyDetails } from \"./empty-details\";\nimport { ErrorDetails } from \"./error-details\";\nimport { LoadingView } from \"./loading-view\";\n\nexport const DataView = memo((props: PropsWithChildren<DataViewProps>) => {\n const tokens = useComponentsTokens().dataState;\n const {\n error,\n isEmpty,\n loading,\n errorViewProps,\n emptyViewProps,\n LoadingComponent,\n contentContainerStyle,\n children,\n ...rest\n } = props;\n\n const content = useMemo(() => {\n if (!error && !isEmpty) {\n return null;\n }\n\n return (\n <View\n alignItems=\"center\"\n justifyContent=\"center\"\n zIndex={
|
|
1
|
+
{"version":3,"sources":["../../src/components/data-view.tsx"],"sourcesContent":["import { memo, PropsWithChildren, useMemo } from \"react\";\n\nimport { View } from \"@impulse-ui-native/primitives\";\nimport { useComponentsTokens } from \"@impulse-ui-native/theme\";\n\nimport { DataViewProps } from \"../types\";\nimport { EmptyDetails } from \"./empty-details\";\nimport { ErrorDetails } from \"./error-details\";\nimport { LoadingView } from \"./loading-view\";\n\nexport const DataView = memo((props: PropsWithChildren<DataViewProps>) => {\n const tokens = useComponentsTokens();\n const dataStateTokens = tokens.dataState;\n const {\n error,\n isEmpty,\n loading,\n errorViewProps,\n emptyViewProps,\n LoadingComponent,\n contentContainerStyle,\n children,\n ...rest\n } = props;\n\n const content = useMemo(() => {\n if (!error && !isEmpty) {\n return null;\n }\n\n return (\n <View\n alignItems=\"center\"\n justifyContent=\"center\"\n zIndex={dataStateTokens.content.zIndex}\n >\n {error ? <ErrorDetails {...errorViewProps} /> : null}\n {isEmpty ? <EmptyDetails {...emptyViewProps} /> : null}\n </View>\n );\n }, [\n dataStateTokens.content.zIndex,\n emptyViewProps,\n error,\n errorViewProps,\n isEmpty,\n ]);\n\n return (\n <LoadingView\n {...rest}\n LoadingComponent={LoadingComponent}\n contentContainerStyle={contentContainerStyle}\n loading={loading}\n >\n {!error && !isEmpty ? children : null}\n {content}\n </LoadingView>\n );\n});\n"],"mappings":"AA+BM,SAKW,KALX;AA/BN,SAAS,MAAyB,eAAe;AAEjD,SAAS,YAAY;AACrB,SAAS,2BAA2B;AAGpC,SAAS,oBAAoB;AAC7B,SAAS,oBAAoB;AAC7B,SAAS,mBAAmB;AAErB,MAAM,WAAW,KAAK,CAAC,UAA4C;AACxE,QAAM,SAAS,oBAAoB;AACnC,QAAM,kBAAkB,OAAO;AAC/B,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AAEJ,QAAM,UAAU,QAAQ,MAAM;AAC5B,QAAI,CAAC,SAAS,CAAC,SAAS;AACtB,aAAO;AAAA,IACT;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,YAAW;AAAA,QACX,gBAAe;AAAA,QACf,QAAQ,gBAAgB,QAAQ;AAAA,QAE/B;AAAA,kBAAQ,oBAAC,gBAAc,GAAG,gBAAgB,IAAK;AAAA,UAC/C,UAAU,oBAAC,gBAAc,GAAG,gBAAgB,IAAK;AAAA;AAAA;AAAA,IACpD;AAAA,EAEJ,GAAG;AAAA,IACD,gBAAgB,QAAQ;AAAA,IACxB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MAEC;AAAA,SAAC,SAAS,CAAC,UAAU,WAAW;AAAA,QAChC;AAAA;AAAA;AAAA,EACH;AAEJ,CAAC;","names":[]}
|
|
@@ -5,15 +5,16 @@ import { Typography, View } from "@impulse-ui-native/primitives";
|
|
|
5
5
|
import { useComponentsTokens } from "@impulse-ui-native/theme";
|
|
6
6
|
import { StateActionsFooter } from "./state-actions-footer";
|
|
7
7
|
const EmptyDetails = memo(function EmptyDetails2(props) {
|
|
8
|
-
const tokens = useComponentsTokens()
|
|
9
|
-
|
|
8
|
+
const tokens = useComponentsTokens();
|
|
9
|
+
const detailsTokens = tokens.dataState.details;
|
|
10
|
+
return /* @__PURE__ */ jsxs(View, { alignItems: "center", justifyContent: "center", gap: detailsTokens.gap, children: [
|
|
10
11
|
/* @__PURE__ */ jsx(
|
|
11
12
|
EmptyIcon,
|
|
12
13
|
{
|
|
13
|
-
width:
|
|
14
|
-
height:
|
|
14
|
+
width: detailsTokens.iconSize,
|
|
15
|
+
height: detailsTokens.iconSize,
|
|
15
16
|
variant: props.variant,
|
|
16
|
-
color:
|
|
17
|
+
color: detailsTokens.iconColor
|
|
17
18
|
}
|
|
18
19
|
),
|
|
19
20
|
/* @__PURE__ */ jsx(Typography.Body, { children: props.text }),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/empty-details.tsx"],"sourcesContent":["import { memo } from \"react\";\n\nimport { EmptyIcon } from \"@impulse-ui-native/icon/icons/empty\";\nimport { Typography, View } from \"@impulse-ui-native/primitives\";\nimport { useComponentsTokens } from \"@impulse-ui-native/theme\";\n\nimport { StateViewProps } from \"../types\";\nimport { StateActionsFooter } from \"./state-actions-footer\";\n\nexport const EmptyDetails = memo(function EmptyDetails(props: StateViewProps) {\n const tokens = useComponentsTokens().dataState.details;\n\n return (\n <View alignItems=\"center\" justifyContent=\"center\" gap={
|
|
1
|
+
{"version":3,"sources":["../../src/components/empty-details.tsx"],"sourcesContent":["import { memo } from \"react\";\n\nimport { EmptyIcon } from \"@impulse-ui-native/icon/icons/empty\";\nimport { Typography, View } from \"@impulse-ui-native/primitives\";\nimport { useComponentsTokens } from \"@impulse-ui-native/theme\";\n\nimport { StateViewProps } from \"../types\";\nimport { StateActionsFooter } from \"./state-actions-footer\";\n\nexport const EmptyDetails = memo(function EmptyDetails(props: StateViewProps) {\n const tokens = useComponentsTokens();\n const detailsTokens = tokens.dataState.details;\n\n return (\n <View alignItems=\"center\" justifyContent=\"center\" gap={detailsTokens.gap}>\n <EmptyIcon\n width={detailsTokens.iconSize}\n height={detailsTokens.iconSize}\n variant={props.variant}\n color={detailsTokens.iconColor}\n />\n <Typography.Body>{props.text}</Typography.Body>\n <StateActionsFooter\n onPressPrimaryAction={props.onPressPrimaryAction}\n primaryActionLabel={props.primaryActionLabel}\n onPressSecondaryAction={props.onPressSecondaryAction}\n secondaryActionLabel={props.secondaryActionLabel}\n />\n </View>\n );\n});\n"],"mappings":"AAcI,SACE,KADF;AAdJ,SAAS,YAAY;AAErB,SAAS,iBAAiB;AAC1B,SAAS,YAAY,YAAY;AACjC,SAAS,2BAA2B;AAGpC,SAAS,0BAA0B;AAE5B,MAAM,eAAe,KAAK,SAASA,cAAa,OAAuB;AAC5E,QAAM,SAAS,oBAAoB;AACnC,QAAM,gBAAgB,OAAO,UAAU;AAEvC,SACE,qBAAC,QAAK,YAAW,UAAS,gBAAe,UAAS,KAAK,cAAc,KACnE;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,OAAO,cAAc;AAAA,QACrB,QAAQ,cAAc;AAAA,QACtB,SAAS,MAAM;AAAA,QACf,OAAO,cAAc;AAAA;AAAA,IACvB;AAAA,IACA,oBAAC,WAAW,MAAX,EAAiB,gBAAM,MAAK;AAAA,IAC7B;AAAA,MAAC;AAAA;AAAA,QACC,sBAAsB,MAAM;AAAA,QAC5B,oBAAoB,MAAM;AAAA,QAC1B,wBAAwB,MAAM;AAAA,QAC9B,sBAAsB,MAAM;AAAA;AAAA,IAC9B;AAAA,KACF;AAEJ,CAAC;","names":["EmptyDetails"]}
|
|
@@ -5,15 +5,16 @@ import { Typography, View } from "@impulse-ui-native/primitives";
|
|
|
5
5
|
import { useComponentsTokens } from "@impulse-ui-native/theme";
|
|
6
6
|
import { StateActionsFooter } from "./state-actions-footer";
|
|
7
7
|
const ErrorDetails = memo(function ErrorDetails2(props) {
|
|
8
|
-
const tokens = useComponentsTokens()
|
|
9
|
-
|
|
8
|
+
const tokens = useComponentsTokens();
|
|
9
|
+
const detailsTokens = tokens.dataState.details;
|
|
10
|
+
return /* @__PURE__ */ jsxs(View, { alignItems: "center", justifyContent: "center", gap: detailsTokens.gap, children: [
|
|
10
11
|
/* @__PURE__ */ jsx(
|
|
11
12
|
CloudXIcon,
|
|
12
13
|
{
|
|
13
|
-
width:
|
|
14
|
-
height:
|
|
14
|
+
width: detailsTokens.iconSize,
|
|
15
|
+
height: detailsTokens.iconSize,
|
|
15
16
|
variant: props.variant,
|
|
16
|
-
color:
|
|
17
|
+
color: detailsTokens.iconColor
|
|
17
18
|
}
|
|
18
19
|
),
|
|
19
20
|
/* @__PURE__ */ jsx(Typography.Body, { children: props.text }),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/error-details.tsx"],"sourcesContent":["import { memo } from \"react\";\n\nimport { CloudXIcon } from \"@impulse-ui-native/icon/icons/cloud-x\";\nimport { Typography, View } from \"@impulse-ui-native/primitives\";\nimport { useComponentsTokens } from \"@impulse-ui-native/theme\";\n\nimport { StateViewProps } from \"../types\";\nimport { StateActionsFooter } from \"./state-actions-footer\";\n\nexport const ErrorDetails = memo(function ErrorDetails(props: StateViewProps) {\n const tokens = useComponentsTokens().dataState.details;\n\n return (\n <View alignItems=\"center\" justifyContent=\"center\" gap={
|
|
1
|
+
{"version":3,"sources":["../../src/components/error-details.tsx"],"sourcesContent":["import { memo } from \"react\";\n\nimport { CloudXIcon } from \"@impulse-ui-native/icon/icons/cloud-x\";\nimport { Typography, View } from \"@impulse-ui-native/primitives\";\nimport { useComponentsTokens } from \"@impulse-ui-native/theme\";\n\nimport { StateViewProps } from \"../types\";\nimport { StateActionsFooter } from \"./state-actions-footer\";\n\nexport const ErrorDetails = memo(function ErrorDetails(props: StateViewProps) {\n const tokens = useComponentsTokens();\n const detailsTokens = tokens.dataState.details;\n\n return (\n <View alignItems=\"center\" justifyContent=\"center\" gap={detailsTokens.gap}>\n <CloudXIcon\n width={detailsTokens.iconSize}\n height={detailsTokens.iconSize}\n variant={props.variant}\n color={detailsTokens.iconColor}\n />\n <Typography.Body>{props.text}</Typography.Body>\n <StateActionsFooter\n onPressPrimaryAction={props.onPressPrimaryAction}\n primaryActionLabel={props.primaryActionLabel}\n onPressSecondaryAction={props.onPressSecondaryAction}\n secondaryActionLabel={props.secondaryActionLabel}\n />\n </View>\n );\n});\n"],"mappings":"AAcI,SACE,KADF;AAdJ,SAAS,YAAY;AAErB,SAAS,kBAAkB;AAC3B,SAAS,YAAY,YAAY;AACjC,SAAS,2BAA2B;AAGpC,SAAS,0BAA0B;AAE5B,MAAM,eAAe,KAAK,SAASA,cAAa,OAAuB;AAC5E,QAAM,SAAS,oBAAoB;AACnC,QAAM,gBAAgB,OAAO,UAAU;AAEvC,SACE,qBAAC,QAAK,YAAW,UAAS,gBAAe,UAAS,KAAK,cAAc,KACnE;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,OAAO,cAAc;AAAA,QACrB,QAAQ,cAAc;AAAA,QACtB,SAAS,MAAM;AAAA,QACf,OAAO,cAAc;AAAA;AAAA,IACvB;AAAA,IACA,oBAAC,WAAW,MAAX,EAAiB,gBAAM,MAAK;AAAA,IAC7B;AAAA,MAAC;AAAA;AAAA,QACC,sBAAsB,MAAM;AAAA,QAC5B,oBAAoB,MAAM;AAAA,QAC1B,wBAAwB,MAAM;AAAA,QAC9B,sBAAsB,MAAM;AAAA;AAAA,IAC9B;AAAA,KACF;AAEJ,CAAC;","names":["ErrorDetails"]}
|
|
@@ -18,7 +18,8 @@ const LoadingView = memo(function LoadingView2(props) {
|
|
|
18
18
|
style,
|
|
19
19
|
...rest
|
|
20
20
|
} = props;
|
|
21
|
-
const tokens = useComponentsTokens()
|
|
21
|
+
const tokens = useComponentsTokens();
|
|
22
|
+
const loadingTokens = tokens.dataState.loading;
|
|
22
23
|
const [shouldMountLoader, setShouldMountLoader] = useState(loading);
|
|
23
24
|
const [loaderHeight, setLoaderHeight] = useState(0);
|
|
24
25
|
const loaderOpacity = useSharedValue(loading ? 1 : 0);
|
|
@@ -29,7 +30,7 @@ const LoadingView = memo(function LoadingView2(props) {
|
|
|
29
30
|
left: 0,
|
|
30
31
|
right: 0,
|
|
31
32
|
top: 0,
|
|
32
|
-
zIndex:
|
|
33
|
+
zIndex: loadingTokens.loaderZIndex,
|
|
33
34
|
opacity: loaderOpacity.value
|
|
34
35
|
}));
|
|
35
36
|
const childrenStyles = useAnimatedStyle(() => ({
|
|
@@ -68,7 +69,7 @@ const LoadingView = memo(function LoadingView2(props) {
|
|
|
68
69
|
loaderOpacity.value = withTiming(
|
|
69
70
|
0,
|
|
70
71
|
{
|
|
71
|
-
duration:
|
|
72
|
+
duration: loadingTokens.transitionDuration,
|
|
72
73
|
easing: Easing.linear
|
|
73
74
|
},
|
|
74
75
|
(finished) => {
|
|
@@ -78,10 +79,15 @@ const LoadingView = memo(function LoadingView2(props) {
|
|
|
78
79
|
}
|
|
79
80
|
);
|
|
80
81
|
childrenOpacity.value = withTiming(1, {
|
|
81
|
-
duration:
|
|
82
|
+
duration: loadingTokens.transitionDuration,
|
|
82
83
|
easing: Easing.linear
|
|
83
84
|
});
|
|
84
|
-
}, [
|
|
85
|
+
}, [
|
|
86
|
+
childrenOpacity,
|
|
87
|
+
loaderOpacity,
|
|
88
|
+
loading,
|
|
89
|
+
loadingTokens.transitionDuration
|
|
90
|
+
]);
|
|
85
91
|
return /* @__PURE__ */ jsxs(View, { ...rest, style: containerStyle, children: [
|
|
86
92
|
/* @__PURE__ */ jsx(Animated.View, { style: childrenContainerStyles, children }),
|
|
87
93
|
shouldMountLoader ? /* @__PURE__ */ jsx(Animated.View, { style: loaderStyles, pointerEvents: "auto", children: /* @__PURE__ */ jsx(View, { onLayout: onLoaderLayout, children: /* @__PURE__ */ jsx(LoadingComponent, {}) }) }) : null
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/loading-view.tsx"],"sourcesContent":["import { memo, useCallback, useEffect, useMemo, useState } from \"react\";\nimport { LayoutChangeEvent, StyleProp, ViewStyle } from \"react-native\";\nimport Animated, {\n Easing,\n useAnimatedStyle,\n useSharedValue,\n withTiming,\n} from \"react-native-reanimated\";\nimport { scheduleOnRN } from \"react-native-worklets\";\n\nimport { View } from \"@impulse-ui-native/primitives\";\nimport { useComponentsTokens } from \"@impulse-ui-native/theme\";\n\nimport { LoadingViewProps } from \"../types\";\n\nexport const LoadingView = memo(function LoadingView(props: LoadingViewProps) {\n const {\n loading,\n children,\n LoadingComponent,\n contentContainerStyle,\n style,\n ...rest\n } = props;\n\n const tokens = useComponentsTokens().dataState.loading;\n\n const [shouldMountLoader, setShouldMountLoader] = useState(loading);\n const [loaderHeight, setLoaderHeight] = useState(0);\n\n const loaderOpacity = useSharedValue(loading ? 1 : 0);\n const childrenOpacity = useSharedValue(loading ? 0 : 1);\n\n const loaderStyles = useAnimatedStyle(() => ({\n position: \"absolute\",\n bottom: 0,\n left: 0,\n right: 0,\n top: 0,\n zIndex:
|
|
1
|
+
{"version":3,"sources":["../../src/components/loading-view.tsx"],"sourcesContent":["import { memo, useCallback, useEffect, useMemo, useState } from \"react\";\nimport { LayoutChangeEvent, StyleProp, ViewStyle } from \"react-native\";\nimport Animated, {\n Easing,\n useAnimatedStyle,\n useSharedValue,\n withTiming,\n} from \"react-native-reanimated\";\nimport { scheduleOnRN } from \"react-native-worklets\";\n\nimport { View } from \"@impulse-ui-native/primitives\";\nimport { useComponentsTokens } from \"@impulse-ui-native/theme\";\n\nimport { LoadingViewProps } from \"../types\";\n\nexport const LoadingView = memo(function LoadingView(props: LoadingViewProps) {\n const {\n loading,\n children,\n LoadingComponent,\n contentContainerStyle,\n style,\n ...rest\n } = props;\n\n const tokens = useComponentsTokens();\n const loadingTokens = tokens.dataState.loading;\n\n const [shouldMountLoader, setShouldMountLoader] = useState(loading);\n const [loaderHeight, setLoaderHeight] = useState(0);\n\n const loaderOpacity = useSharedValue(loading ? 1 : 0);\n const childrenOpacity = useSharedValue(loading ? 0 : 1);\n\n const loaderStyles = useAnimatedStyle(() => ({\n position: \"absolute\",\n bottom: 0,\n left: 0,\n right: 0,\n top: 0,\n zIndex: loadingTokens.loaderZIndex,\n opacity: loaderOpacity.value,\n }));\n\n const childrenStyles = useAnimatedStyle(() => ({\n opacity: childrenOpacity.value,\n }));\n\n const containerStyle = useMemo<StyleProp<ViewStyle>>(\n () => [\n {\n position: \"relative\",\n minHeight: shouldMountLoader ? loaderHeight : undefined,\n },\n style,\n ],\n [loaderHeight, shouldMountLoader, style],\n );\n\n const childrenContainerStyles = useMemo(\n () => [contentContainerStyle, childrenStyles],\n [contentContainerStyle, childrenStyles],\n );\n\n const onLoaderLayout = useCallback((event: LayoutChangeEvent) => {\n const height = event.nativeEvent.layout.height;\n\n setLoaderHeight((prev) => {\n if (prev === height) {\n return prev;\n }\n\n return height;\n });\n }, []);\n\n useEffect(() => {\n if (loading) {\n setShouldMountLoader(true);\n\n loaderOpacity.value = 1;\n childrenOpacity.value = 0;\n\n return;\n }\n\n loaderOpacity.value = withTiming(\n 0,\n {\n duration: loadingTokens.transitionDuration,\n easing: Easing.linear,\n },\n (finished) => {\n if (finished) {\n scheduleOnRN(setShouldMountLoader, false);\n }\n },\n );\n\n childrenOpacity.value = withTiming(1, {\n duration: loadingTokens.transitionDuration,\n easing: Easing.linear,\n });\n }, [\n childrenOpacity,\n loaderOpacity,\n loading,\n loadingTokens.transitionDuration,\n ]);\n\n return (\n <View {...rest} style={containerStyle}>\n <Animated.View style={childrenContainerStyles}>{children}</Animated.View>\n\n {shouldMountLoader ? (\n <Animated.View style={loaderStyles} pointerEvents=\"auto\">\n <View onLayout={onLoaderLayout}>\n <LoadingComponent />\n </View>\n </Animated.View>\n ) : null}\n </View>\n );\n});\n"],"mappings":"AA+GI,SACE,KADF;AA/GJ,SAAS,MAAM,aAAa,WAAW,SAAS,gBAAgB;AAEhE,OAAO;AAAA,EACL;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,oBAAoB;AAE7B,SAAS,YAAY;AACrB,SAAS,2BAA2B;AAI7B,MAAM,cAAc,KAAK,SAASA,aAAY,OAAyB;AAC5E,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AAEJ,QAAM,SAAS,oBAAoB;AACnC,QAAM,gBAAgB,OAAO,UAAU;AAEvC,QAAM,CAAC,mBAAmB,oBAAoB,IAAI,SAAS,OAAO;AAClE,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,CAAC;AAElD,QAAM,gBAAgB,eAAe,UAAU,IAAI,CAAC;AACpD,QAAM,kBAAkB,eAAe,UAAU,IAAI,CAAC;AAEtD,QAAM,eAAe,iBAAiB,OAAO;AAAA,IAC3C,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,OAAO;AAAA,IACP,KAAK;AAAA,IACL,QAAQ,cAAc;AAAA,IACtB,SAAS,cAAc;AAAA,EACzB,EAAE;AAEF,QAAM,iBAAiB,iBAAiB,OAAO;AAAA,IAC7C,SAAS,gBAAgB;AAAA,EAC3B,EAAE;AAEF,QAAM,iBAAiB;AAAA,IACrB,MAAM;AAAA,MACJ;AAAA,QACE,UAAU;AAAA,QACV,WAAW,oBAAoB,eAAe;AAAA,MAChD;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,cAAc,mBAAmB,KAAK;AAAA,EACzC;AAEA,QAAM,0BAA0B;AAAA,IAC9B,MAAM,CAAC,uBAAuB,cAAc;AAAA,IAC5C,CAAC,uBAAuB,cAAc;AAAA,EACxC;AAEA,QAAM,iBAAiB,YAAY,CAAC,UAA6B;AAC/D,UAAM,SAAS,MAAM,YAAY,OAAO;AAExC,oBAAgB,CAAC,SAAS;AACxB,UAAI,SAAS,QAAQ;AACnB,eAAO;AAAA,MACT;AAEA,aAAO;AAAA,IACT,CAAC;AAAA,EACH,GAAG,CAAC,CAAC;AAEL,YAAU,MAAM;AACd,QAAI,SAAS;AACX,2BAAqB,IAAI;AAEzB,oBAAc,QAAQ;AACtB,sBAAgB,QAAQ;AAExB;AAAA,IACF;AAEA,kBAAc,QAAQ;AAAA,MACpB;AAAA,MACA;AAAA,QACE,UAAU,cAAc;AAAA,QACxB,QAAQ,OAAO;AAAA,MACjB;AAAA,MACA,CAAC,aAAa;AACZ,YAAI,UAAU;AACZ,uBAAa,sBAAsB,KAAK;AAAA,QAC1C;AAAA,MACF;AAAA,IACF;AAEA,oBAAgB,QAAQ,WAAW,GAAG;AAAA,MACpC,UAAU,cAAc;AAAA,MACxB,QAAQ,OAAO;AAAA,IACjB,CAAC;AAAA,EACH,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,EAChB,CAAC;AAED,SACE,qBAAC,QAAM,GAAG,MAAM,OAAO,gBACrB;AAAA,wBAAC,SAAS,MAAT,EAAc,OAAO,yBAA0B,UAAS;AAAA,IAExD,oBACC,oBAAC,SAAS,MAAT,EAAc,OAAO,cAAc,eAAc,QAChD,8BAAC,QAAK,UAAU,gBACd,8BAAC,oBAAiB,GACpB,GACF,IACE;AAAA,KACN;AAEJ,CAAC;","names":["LoadingView"]}
|
|
@@ -3,7 +3,8 @@ import { memo } from "react";
|
|
|
3
3
|
import { Button, View } from "@impulse-ui-native/primitives";
|
|
4
4
|
import { useComponentsTokens } from "@impulse-ui-native/theme";
|
|
5
5
|
const StateActionsFooter = memo(function StateActionsFooter2(props) {
|
|
6
|
-
const tokens = useComponentsTokens()
|
|
6
|
+
const tokens = useComponentsTokens();
|
|
7
|
+
const actionsFooterTokens = tokens.dataState.actionsFooter;
|
|
7
8
|
const {
|
|
8
9
|
onPressPrimaryAction,
|
|
9
10
|
onPressSecondaryAction,
|
|
@@ -15,7 +16,7 @@ const StateActionsFooter = memo(function StateActionsFooter2(props) {
|
|
|
15
16
|
View,
|
|
16
17
|
{
|
|
17
18
|
flexDirection: "row",
|
|
18
|
-
gap:
|
|
19
|
+
gap: actionsFooterTokens.gap,
|
|
19
20
|
justifyContent: "center",
|
|
20
21
|
alignItems: "center",
|
|
21
22
|
...rest,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/state-actions-footer.tsx"],"sourcesContent":["import { memo } from \"react\";\n\nimport { Button, View } from \"@impulse-ui-native/primitives\";\nimport { useComponentsTokens } from \"@impulse-ui-native/theme\";\n\nimport { StateActionsFooterProps } from \"../types\";\n\nexport const StateActionsFooter = memo(function StateActionsFooter(\n props: StateActionsFooterProps,\n) {\n const tokens = useComponentsTokens().dataState.actionsFooter;\n const {\n onPressPrimaryAction,\n onPressSecondaryAction,\n primaryActionLabel,\n secondaryActionLabel,\n ...rest\n } = props;\n\n return (\n <View\n flexDirection=\"row\"\n gap={
|
|
1
|
+
{"version":3,"sources":["../../src/components/state-actions-footer.tsx"],"sourcesContent":["import { memo } from \"react\";\n\nimport { Button, View } from \"@impulse-ui-native/primitives\";\nimport { useComponentsTokens } from \"@impulse-ui-native/theme\";\n\nimport { StateActionsFooterProps } from \"../types\";\n\nexport const StateActionsFooter = memo(function StateActionsFooter(\n props: StateActionsFooterProps,\n) {\n const tokens = useComponentsTokens();\n const actionsFooterTokens = tokens.dataState.actionsFooter;\n const {\n onPressPrimaryAction,\n onPressSecondaryAction,\n primaryActionLabel,\n secondaryActionLabel,\n ...rest\n } = props;\n\n return (\n <View\n flexDirection=\"row\"\n gap={actionsFooterTokens.gap}\n justifyContent=\"center\"\n alignItems=\"center\"\n {...rest}\n >\n <Button onPress={props.onPressPrimaryAction}>\n {props.primaryActionLabel}\n </Button>\n {props.onPressSecondaryAction ? (\n <Button variant=\"outlined\" onPress={props.onPressSecondaryAction}>\n {props.secondaryActionLabel}\n </Button>\n ) : null}\n </View>\n );\n});\n"],"mappings":"AAqBI,SAOE,KAPF;AArBJ,SAAS,YAAY;AAErB,SAAS,QAAQ,YAAY;AAC7B,SAAS,2BAA2B;AAI7B,MAAM,qBAAqB,KAAK,SAASA,oBAC9C,OACA;AACA,QAAM,SAAS,oBAAoB;AACnC,QAAM,sBAAsB,OAAO,UAAU;AAC7C,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AAEJ,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAc;AAAA,MACd,KAAK,oBAAoB;AAAA,MACzB,gBAAe;AAAA,MACf,YAAW;AAAA,MACV,GAAG;AAAA,MAEJ;AAAA,4BAAC,UAAO,SAAS,MAAM,sBACpB,gBAAM,oBACT;AAAA,QACC,MAAM,yBACL,oBAAC,UAAO,SAAQ,YAAW,SAAS,MAAM,wBACvC,gBAAM,sBACT,IACE;AAAA;AAAA;AAAA,EACN;AAEJ,CAAC;","names":["StateActionsFooter"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@impulse-ui-native/data-state",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.5.0",
|
|
4
4
|
"description": "Loading, empty, and error state components for ImpulseUI Native applications.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"react-native",
|
|
@@ -28,11 +28,11 @@
|
|
|
28
28
|
],
|
|
29
29
|
"sideEffects": false,
|
|
30
30
|
"dependencies": {
|
|
31
|
-
"@impulse-ui-native/
|
|
32
|
-
"@impulse-ui-native/primitives": "2.
|
|
33
|
-
"@impulse-ui-native/
|
|
34
|
-
"@impulse-ui-native/
|
|
35
|
-
"@impulse-ui-native/
|
|
31
|
+
"@impulse-ui-native/skeleton": "2.5.0",
|
|
32
|
+
"@impulse-ui-native/primitives": "2.5.0",
|
|
33
|
+
"@impulse-ui-native/core": "2.5.0",
|
|
34
|
+
"@impulse-ui-native/icon": "2.5.0",
|
|
35
|
+
"@impulse-ui-native/theme": "2.5.0"
|
|
36
36
|
},
|
|
37
37
|
"devDependencies": {
|
|
38
38
|
"@types/react": "~19.2.14",
|
|
@@ -43,9 +43,9 @@
|
|
|
43
43
|
"react-native-reanimated": "4.5.1",
|
|
44
44
|
"react-native-worklets": "0.10.1",
|
|
45
45
|
"typescript": "~6.0.3",
|
|
46
|
-
"@impulse-ui-native/prettier-config": "1.0.0",
|
|
47
46
|
"@impulse-ui-native/eslint-config": "1.0.0",
|
|
48
|
-
"@impulse-ui-native/tsconfig": "1.0.0"
|
|
47
|
+
"@impulse-ui-native/tsconfig": "1.0.0",
|
|
48
|
+
"@impulse-ui-native/prettier-config": "1.0.0"
|
|
49
49
|
},
|
|
50
50
|
"peerDependencies": {
|
|
51
51
|
"react": ">=18",
|