react-native-terra-ui 0.11.13 → 0.11.14
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/CHANGELOG.md +6 -0
- package/lib/module/components/toast/parts/ToastViewport.js +37 -14
- package/lib/module/components/toast/parts/ToastViewport.js.map +1 -1
- package/lib/typescript/src/components/toast/parts/ToastViewport.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/components/toast/parts/ToastViewport.tsx +38 -20
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,11 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
+
## [0.11.14](https://github.com/earthlin9/react-native-terra-ui/compare/v0.11.13...v0.11.14) (2026-09-19)
|
|
4
|
+
|
|
5
|
+
### Features
|
|
6
|
+
|
|
7
|
+
* **ui:** [toast] anchor the stack at a fixed width on wide screens ([5c7345a](https://github.com/earthlin9/react-native-terra-ui/commit/5c7345afbcf2258f4ee722666e5df22cc8d5611f))
|
|
8
|
+
|
|
3
9
|
## [0.11.13](https://github.com/earthlin9/react-native-terra-ui/compare/v0.11.12...v0.11.13) (2026-09-18)
|
|
4
10
|
|
|
5
11
|
### Bug Fixes
|
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
import { View } from "react-native-unistyles/components/native/View";
|
|
3
4
|
import { useEffect } from "react";
|
|
4
5
|
import { Keyboard, Platform } from "react-native";
|
|
5
6
|
import Animated, { useAnimatedStyle, useSharedValue, withTiming } from "react-native-reanimated";
|
|
6
7
|
import { useSafeAreaInsets } from "react-native-safe-area-context";
|
|
8
|
+
import { StyleSheet } from "react-native-unistyles";
|
|
7
9
|
import { ToastAnimatedItem } from "./ToastAnimatedItem.js";
|
|
8
10
|
import { ToastOverlay } from "./ToastOverlay";
|
|
9
11
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
@@ -70,22 +72,43 @@ export function ToastViewport({
|
|
|
70
72
|
left: offset?.left ?? safeAreaInsets.left + 12,
|
|
71
73
|
right: offset?.right ?? safeAreaInsets.right + 12
|
|
72
74
|
}, keyboardStyle],
|
|
73
|
-
children:
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
placement: placement,
|
|
79
|
-
total: toasts.length,
|
|
80
|
-
frontId: frontToast.id,
|
|
81
|
-
children: toast.component({
|
|
75
|
+
children: /*#__PURE__*/_jsx(View, {
|
|
76
|
+
pointerEvents: "box-none",
|
|
77
|
+
style: styles.stack,
|
|
78
|
+
children: toasts.map((toast, index) => /*#__PURE__*/_jsx(ToastAnimatedItem, {
|
|
79
|
+
heights: heights,
|
|
82
80
|
id: toast.id,
|
|
83
|
-
index,
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
81
|
+
index: index,
|
|
82
|
+
maxVisibleToasts: maxVisibleToasts,
|
|
83
|
+
placement: placement,
|
|
84
|
+
total: toasts.length,
|
|
85
|
+
frontId: frontToast.id,
|
|
86
|
+
children: toast.component({
|
|
87
|
+
id: toast.id,
|
|
88
|
+
index,
|
|
89
|
+
hide: manager.hide,
|
|
90
|
+
show: manager.show
|
|
91
|
+
})
|
|
92
|
+
}, toast.id))
|
|
93
|
+
})
|
|
88
94
|
})
|
|
89
95
|
});
|
|
90
96
|
}
|
|
97
|
+
|
|
98
|
+
/**
|
|
99
|
+
* Width of the toast stack from the `sm` breakpoint up. On phones the stack
|
|
100
|
+
* stretches edge to edge; on wider viewports it anchors to the leading edge at
|
|
101
|
+
* a fixed width, matching Material's large-screen snackbar guidance and the
|
|
102
|
+
* 400dp width most design systems ship for corner-anchored toasts.
|
|
103
|
+
*/
|
|
104
|
+
const TOAST_WIDE_WIDTH = 400;
|
|
105
|
+
const styles = StyleSheet.create({
|
|
106
|
+
stack: {
|
|
107
|
+
alignSelf: "flex-start",
|
|
108
|
+
width: {
|
|
109
|
+
xs: "100%",
|
|
110
|
+
sm: TOAST_WIDE_WIDTH
|
|
111
|
+
}
|
|
112
|
+
}
|
|
113
|
+
});
|
|
91
114
|
//# sourceMappingURL=ToastViewport.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useEffect","Keyboard","Platform","Animated","useAnimatedStyle","useSharedValue","withTiming","useSafeAreaInsets","ToastAnimatedItem","ToastOverlay","jsx","_jsx","ToastViewport","placement","toasts","manager","maxVisibleToasts","offset","safeAreaInsets","heights","keyboardHeight","baseBottom","bottom","OS","baseTop","top","showEvent","hideEvent","showSub","addListener","e","value","endCoordinates","height","hideSub","remove","gap","keyboardStyle","activeIds","Set","map","toast","id","nextHeights","Object","entries","has","frontToast","length","children","View","pointerEvents","style","position","zIndex","elevation","left","right","index","total","frontId","component","hide","show"],"sourceRoot":"../../../../../src","sources":["components/toast/parts/ToastViewport.tsx"],"mappings":"
|
|
1
|
+
{"version":3,"names":["useEffect","Keyboard","Platform","Animated","useAnimatedStyle","useSharedValue","withTiming","useSafeAreaInsets","StyleSheet","ToastAnimatedItem","ToastOverlay","jsx","_jsx","ToastViewport","placement","toasts","manager","maxVisibleToasts","offset","safeAreaInsets","heights","keyboardHeight","baseBottom","bottom","OS","baseTop","top","showEvent","hideEvent","showSub","addListener","e","value","endCoordinates","height","hideSub","remove","gap","keyboardStyle","activeIds","Set","map","toast","id","nextHeights","Object","entries","has","frontToast","length","children","View","pointerEvents","style","position","zIndex","elevation","left","right","styles","stack","index","total","frontId","component","hide","show","TOAST_WIDE_WIDTH","create","alignSelf","width","xs","sm"],"sourceRoot":"../../../../../src","sources":["components/toast/parts/ToastViewport.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToastViewport.d.ts","sourceRoot":"","sources":["../../../../../../src/components/toast/parts/ToastViewport.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ToastViewport.d.ts","sourceRoot":"","sources":["../../../../../../src/components/toast/parts/ToastViewport.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAW,SAAS,EAAE,YAAY,EAAE,cAAc,EAAE,kBAAkB,EAAE,MAAM,aAAU,CAAC;AAIrG,UAAU,kBAAkB;IAC1B,SAAS,EAAE,cAAc,CAAC;IAC1B,MAAM,EAAE,SAAS,EAAE,CAAC;IACpB,OAAO,EAAE,YAAY,CAAC;IACtB,gBAAgB,EAAE,MAAM,CAAC;IACzB,MAAM,CAAC,EAAE,kBAAkB,CAAC,QAAQ,CAAC,CAAC;CACvC;AAED,wBAAgB,aAAa,CAAC,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,gBAAgB,EAAE,MAAM,EAAE,EAAE,kBAAkB,sCAuFzG"}
|
package/package.json
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import { useEffect } from "react";
|
|
2
|
-
import { Keyboard, Platform } from "react-native";
|
|
2
|
+
import { Keyboard, Platform, View } from "react-native";
|
|
3
3
|
|
|
4
4
|
import Animated, { useAnimatedStyle, useSharedValue, withTiming } from "react-native-reanimated";
|
|
5
5
|
import { useSafeAreaInsets } from "react-native-safe-area-context";
|
|
6
|
+
import { StyleSheet } from "react-native-unistyles";
|
|
6
7
|
|
|
7
8
|
import type { ToastId, ToastItem, ToastManager, ToastPlacement, ToastProviderProps } from "../types";
|
|
8
9
|
import { ToastAnimatedItem } from "./ToastAnimatedItem";
|
|
@@ -79,26 +80,43 @@ export function ToastViewport({ placement, toasts, manager, maxVisibleToasts, of
|
|
|
79
80
|
keyboardStyle,
|
|
80
81
|
]}
|
|
81
82
|
>
|
|
82
|
-
{
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
83
|
+
<View pointerEvents="box-none" style={styles.stack}>
|
|
84
|
+
{toasts.map((toast, index) => (
|
|
85
|
+
<ToastAnimatedItem
|
|
86
|
+
key={toast.id}
|
|
87
|
+
heights={heights}
|
|
88
|
+
id={toast.id}
|
|
89
|
+
index={index}
|
|
90
|
+
maxVisibleToasts={maxVisibleToasts}
|
|
91
|
+
placement={placement}
|
|
92
|
+
total={toasts.length}
|
|
93
|
+
frontId={frontToast.id}
|
|
94
|
+
>
|
|
95
|
+
{toast.component({
|
|
96
|
+
id: toast.id,
|
|
97
|
+
index,
|
|
98
|
+
hide: manager.hide,
|
|
99
|
+
show: manager.show,
|
|
100
|
+
})}
|
|
101
|
+
</ToastAnimatedItem>
|
|
102
|
+
))}
|
|
103
|
+
</View>
|
|
101
104
|
</Animated.View>
|
|
102
105
|
</ToastOverlay>
|
|
103
106
|
);
|
|
104
107
|
}
|
|
108
|
+
|
|
109
|
+
/**
|
|
110
|
+
* Width of the toast stack from the `sm` breakpoint up. On phones the stack
|
|
111
|
+
* stretches edge to edge; on wider viewports it anchors to the leading edge at
|
|
112
|
+
* a fixed width, matching Material's large-screen snackbar guidance and the
|
|
113
|
+
* 400dp width most design systems ship for corner-anchored toasts.
|
|
114
|
+
*/
|
|
115
|
+
const TOAST_WIDE_WIDTH = 400;
|
|
116
|
+
|
|
117
|
+
const styles = StyleSheet.create({
|
|
118
|
+
stack: {
|
|
119
|
+
alignSelf: "flex-start",
|
|
120
|
+
width: { xs: "100%", sm: TOAST_WIDE_WIDTH },
|
|
121
|
+
},
|
|
122
|
+
});
|