@draftbit/core 48.1.1-157a30.2 → 48.1.1-2e0561.2
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/lib/src/components/MediaPlayer/AudioPlayer/AudioPlayerCommon.d.ts +22 -0
- package/lib/src/components/MediaPlayer/AudioPlayer/AudioPlayerCommon.js.map +1 -0
- package/lib/src/components/MediaPlayer/AudioPlayer/AudioPlayerWithInterface.d.ts +7 -0
- package/lib/src/components/{AudioPlayer → MediaPlayer/AudioPlayer}/AudioPlayerWithInterface.js +6 -6
- package/lib/src/components/MediaPlayer/AudioPlayer/AudioPlayerWithInterface.js.map +1 -0
- package/lib/src/components/{AudioPlayer → MediaPlayer/AudioPlayer}/HeadlessAudioPlayer.d.ts +3 -2
- package/lib/src/components/{AudioPlayer → MediaPlayer/AudioPlayer}/HeadlessAudioPlayer.js +9 -48
- package/lib/src/components/MediaPlayer/AudioPlayer/HeadlessAudioPlayer.js.map +1 -0
- package/lib/src/components/{AudioPlayer → MediaPlayer/AudioPlayer}/index.d.ts +5 -4
- package/{src/components → lib/src/components/MediaPlayer}/AudioPlayer/index.js +1 -1
- package/lib/src/components/MediaPlayer/AudioPlayer/index.js.map +1 -0
- package/lib/src/components/MediaPlayer/MediaPlaybackWrapper.d.ts +15 -0
- package/lib/src/components/MediaPlayer/MediaPlaybackWrapper.js +32 -0
- package/lib/src/components/MediaPlayer/MediaPlaybackWrapper.js.map +1 -0
- package/lib/src/components/MediaPlayer/MediaPlayerCommon.d.ts +21 -0
- package/lib/src/components/MediaPlayer/MediaPlayerCommon.js +24 -0
- package/lib/src/components/MediaPlayer/MediaPlayerCommon.js.map +1 -0
- package/lib/src/components/MediaPlayer/VideoPlayer/VideoPlayer.d.ts +15 -0
- package/lib/src/components/MediaPlayer/VideoPlayer/VideoPlayer.js +73 -0
- package/lib/src/components/MediaPlayer/VideoPlayer/VideoPlayer.js.map +1 -0
- package/lib/src/components/MediaPlayer/VideoPlayer/index.d.ts +2 -0
- package/lib/src/components/MediaPlayer/VideoPlayer/index.js +2 -0
- package/lib/src/components/MediaPlayer/VideoPlayer/index.js.map +1 -0
- package/lib/src/components/NumberInput.d.ts +5 -3
- package/lib/src/components/NumberInput.js +13 -3
- package/lib/src/components/NumberInput.js.map +1 -1
- package/lib/src/components/Progress/CircularProgress/CircularProgress.d.ts +6 -0
- package/lib/src/components/Progress/CircularProgress/CircularProgress.js +101 -0
- package/lib/src/components/Progress/CircularProgress/CircularProgress.js.map +1 -0
- package/lib/src/components/Progress/CircularProgress/index.d.ts +6 -0
- package/lib/src/components/Progress/CircularProgress/index.js +14 -0
- package/lib/src/components/Progress/CircularProgress/index.js.map +1 -0
- package/lib/src/components/Progress/IndeterminateProgress.d.ts +7 -0
- package/lib/src/components/Progress/IndeterminateProgress.js +39 -0
- package/lib/src/components/Progress/IndeterminateProgress.js.map +1 -0
- package/lib/src/components/Progress/LinearProgress/LinearProgress.d.ts +6 -0
- package/lib/src/components/Progress/LinearProgress/LinearProgress.js +54 -0
- package/lib/src/components/Progress/LinearProgress/LinearProgress.js.map +1 -0
- package/lib/src/components/Progress/LinearProgress/index.d.ts +6 -0
- package/lib/src/components/Progress/LinearProgress/index.js +14 -0
- package/lib/src/components/Progress/LinearProgress/index.js.map +1 -0
- package/lib/src/components/Progress/ProgressCommon.d.ts +40 -0
- package/lib/src/components/Progress/ProgressCommon.js +2 -0
- package/lib/src/components/Progress/ProgressCommon.js.map +1 -0
- package/lib/src/components/SwipeableItem/SwipeableItem.js +9 -2
- package/lib/src/components/SwipeableItem/SwipeableItem.js.map +1 -1
- package/lib/src/components/SwipeableItem/SwipeableItemCommon.d.ts +3 -2
- package/lib/src/components/SwipeableItem/SwipeableItemCommon.js.map +1 -1
- package/lib/src/components/TextField.d.ts +2 -1
- package/lib/src/components/TextField.js +3 -2
- package/lib/src/components/TextField.js.map +1 -1
- package/lib/src/components/TextInput.d.ts +8 -0
- package/lib/src/components/TextInput.js +15 -0
- package/lib/src/components/TextInput.js.map +1 -0
- package/lib/src/hooks.d.ts +1 -0
- package/lib/src/hooks.js +12 -0
- package/lib/src/hooks.js.map +1 -1
- package/lib/src/index.d.ts +5 -1
- package/lib/src/index.js +5 -1
- package/lib/src/index.js.map +1 -1
- package/lib/tsconfig.tsbuildinfo +1 -1
- package/package.json +13 -10
- package/src/components/MediaPlayer/AudioPlayer/AudioPlayerCommon.ts +25 -0
- package/src/components/{AudioPlayer → MediaPlayer/AudioPlayer}/AudioPlayerWithInterface.js +6 -6
- package/src/components/MediaPlayer/AudioPlayer/AudioPlayerWithInterface.js.map +1 -0
- package/src/components/{AudioPlayer → MediaPlayer/AudioPlayer}/AudioPlayerWithInterface.tsx +11 -9
- package/src/components/{AudioPlayer → MediaPlayer/AudioPlayer}/HeadlessAudioPlayer.js +9 -48
- package/src/components/MediaPlayer/AudioPlayer/HeadlessAudioPlayer.js.map +1 -0
- package/src/components/{AudioPlayer → MediaPlayer/AudioPlayer}/HeadlessAudioPlayer.tsx +19 -64
- package/{lib/src/components → src/components/MediaPlayer}/AudioPlayer/index.js +1 -1
- package/src/components/MediaPlayer/AudioPlayer/index.js.map +1 -0
- package/src/components/{AudioPlayer → MediaPlayer/AudioPlayer}/index.tsx +4 -4
- package/src/components/MediaPlayer/MediaPlaybackWrapper.js +32 -0
- package/src/components/MediaPlayer/MediaPlaybackWrapper.js.map +1 -0
- package/src/components/MediaPlayer/MediaPlaybackWrapper.tsx +56 -0
- package/src/components/MediaPlayer/MediaPlayerCommon.js +24 -0
- package/src/components/MediaPlayer/MediaPlayerCommon.js.map +1 -0
- package/src/components/MediaPlayer/MediaPlayerCommon.ts +50 -0
- package/src/components/MediaPlayer/VideoPlayer/VideoPlayer.js +73 -0
- package/src/components/MediaPlayer/VideoPlayer/VideoPlayer.js.map +1 -0
- package/src/components/MediaPlayer/VideoPlayer/VideoPlayer.tsx +136 -0
- package/src/components/MediaPlayer/VideoPlayer/index.js +2 -0
- package/src/components/MediaPlayer/VideoPlayer/index.js.map +1 -0
- package/src/components/MediaPlayer/VideoPlayer/index.ts +2 -0
- package/src/components/NumberInput.js +13 -3
- package/src/components/NumberInput.js.map +1 -1
- package/src/components/NumberInput.tsx +34 -5
- package/src/components/Progress/CircularProgress/CircularProgress.js +101 -0
- package/src/components/Progress/CircularProgress/CircularProgress.js.map +1 -0
- package/src/components/Progress/CircularProgress/CircularProgress.tsx +200 -0
- package/src/components/Progress/CircularProgress/index.js +14 -0
- package/src/components/Progress/CircularProgress/index.js.map +1 -0
- package/src/components/Progress/CircularProgress/index.tsx +28 -0
- package/src/components/Progress/IndeterminateProgress.js +39 -0
- package/src/components/Progress/IndeterminateProgress.js.map +1 -0
- package/src/components/Progress/IndeterminateProgress.tsx +74 -0
- package/src/components/Progress/LinearProgress/LinearProgress.js +54 -0
- package/src/components/Progress/LinearProgress/LinearProgress.js.map +1 -0
- package/src/components/Progress/LinearProgress/LinearProgress.tsx +132 -0
- package/src/components/Progress/LinearProgress/index.js +14 -0
- package/src/components/Progress/LinearProgress/index.js.map +1 -0
- package/src/components/Progress/LinearProgress/index.tsx +25 -0
- package/src/components/Progress/ProgressCommon.js +2 -0
- package/src/components/Progress/ProgressCommon.js.map +1 -0
- package/src/components/Progress/ProgressCommon.ts +44 -0
- package/src/components/SwipeableItem/SwipeableItem.js +9 -2
- package/src/components/SwipeableItem/SwipeableItem.js.map +1 -1
- package/src/components/SwipeableItem/SwipeableItem.tsx +9 -1
- package/src/components/SwipeableItem/SwipeableItemCommon.js.map +1 -1
- package/src/components/SwipeableItem/SwipeableItemCommon.ts +3 -2
- package/src/components/TextField.js +3 -2
- package/src/components/TextField.js.map +1 -1
- package/src/components/TextField.tsx +2 -2
- package/src/components/TextInput.js +15 -0
- package/src/components/TextInput.js.map +1 -0
- package/src/components/TextInput.tsx +35 -0
- package/src/hooks.js +12 -0
- package/src/hooks.js.map +1 -1
- package/src/hooks.ts +16 -0
- package/src/index.js +5 -1
- package/src/index.js.map +1 -1
- package/src/index.tsx +8 -1
- package/lib/src/components/AudioPlayer/AudioPlayerCommon.d.ts +0 -39
- package/lib/src/components/AudioPlayer/AudioPlayerCommon.js.map +0 -1
- package/lib/src/components/AudioPlayer/AudioPlayerWithInterface.d.ts +0 -6
- package/lib/src/components/AudioPlayer/AudioPlayerWithInterface.js.map +0 -1
- package/lib/src/components/AudioPlayer/HeadlessAudioPlayer.js.map +0 -1
- package/lib/src/components/AudioPlayer/index.js.map +0 -1
- package/src/components/AudioPlayer/AudioPlayerCommon.ts +0 -44
- package/src/components/AudioPlayer/AudioPlayerWithInterface.js.map +0 -1
- package/src/components/AudioPlayer/HeadlessAudioPlayer.js.map +0 -1
- package/src/components/AudioPlayer/index.js.map +0 -1
- /package/lib/src/components/{AudioPlayer → MediaPlayer/AudioPlayer}/AudioPlayerCommon.js +0 -0
- /package/src/components/{AudioPlayer → MediaPlayer/AudioPlayer}/AudioPlayerCommon.js +0 -0
- /package/src/components/{AudioPlayer → MediaPlayer/AudioPlayer}/AudioPlayerCommon.js.map +0 -0
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import IndeterminateProgress from "../IndeterminateProgress";
|
|
3
|
+
import {
|
|
4
|
+
CircularProgressProps,
|
|
5
|
+
IndeterminateProgressProps,
|
|
6
|
+
ValueProgressProps,
|
|
7
|
+
} from "../ProgressCommon";
|
|
8
|
+
import { CircularProgress as CircularProgressComponent } from "./CircularProgress";
|
|
9
|
+
import { withTheme } from "../../../theming";
|
|
10
|
+
|
|
11
|
+
const CircularProgress: React.FC<
|
|
12
|
+
ValueProgressProps & IndeterminateProgressProps & CircularProgressProps
|
|
13
|
+
> = (props) => {
|
|
14
|
+
if (props.indeterminate) {
|
|
15
|
+
return (
|
|
16
|
+
<IndeterminateProgress
|
|
17
|
+
ProgressComponent={
|
|
18
|
+
CircularProgressComponent as React.FunctionComponent<ValueProgressProps>
|
|
19
|
+
}
|
|
20
|
+
{...props}
|
|
21
|
+
/>
|
|
22
|
+
);
|
|
23
|
+
} else {
|
|
24
|
+
return <CircularProgressComponent {...props} />;
|
|
25
|
+
}
|
|
26
|
+
};
|
|
27
|
+
|
|
28
|
+
export default withTheme(CircularProgress);
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { runOnJS, useAnimatedReaction, useSharedValue, withTiming, } from "react-native-reanimated";
|
|
3
|
+
import { DEFAULT_ANIMATION_DURATION, } from "./ProgressCommon";
|
|
4
|
+
const IndeterminateProgress = ({ ProgressComponent, ...rest }) => {
|
|
5
|
+
const [pathWidth, setPathWidth] = React.useState(0);
|
|
6
|
+
const [value, setValue] = React.useState(0);
|
|
7
|
+
const [dashOffset, setDashOffset] = React.useState(0);
|
|
8
|
+
const animationDuration = rest.animationDuration || DEFAULT_ANIMATION_DURATION;
|
|
9
|
+
const currentOffset = useSharedValue(0);
|
|
10
|
+
// dashOffset animation done through state due to it not being a 'native' prop that reanimated can animate on the native thread
|
|
11
|
+
useAnimatedReaction(() => currentOffset.value, (result) => runOnJS(setDashOffset)(result));
|
|
12
|
+
const repeatIndeterminateAnimation = React.useCallback(() => {
|
|
13
|
+
if (value === 0) {
|
|
14
|
+
setValue(100);
|
|
15
|
+
currentOffset.value = withTiming(pathWidth, {
|
|
16
|
+
duration: animationDuration,
|
|
17
|
+
});
|
|
18
|
+
}
|
|
19
|
+
else {
|
|
20
|
+
setValue(0);
|
|
21
|
+
currentOffset.value = withTiming(0, {
|
|
22
|
+
duration: animationDuration,
|
|
23
|
+
});
|
|
24
|
+
}
|
|
25
|
+
}, [currentOffset, value, animationDuration, pathWidth]);
|
|
26
|
+
React.useEffect(() => {
|
|
27
|
+
const timeout = setTimeout(() => {
|
|
28
|
+
repeatIndeterminateAnimation();
|
|
29
|
+
}, animationDuration);
|
|
30
|
+
return () => clearTimeout(timeout);
|
|
31
|
+
}, [animationDuration, repeatIndeterminateAnimation]);
|
|
32
|
+
return (React.createElement(ProgressComponent, { ...rest, testID: rest.testID || "indeterminate-progress", onFullPathWidth: (width) => {
|
|
33
|
+
var _a;
|
|
34
|
+
setPathWidth(width);
|
|
35
|
+
(_a = rest.onFullPathWidth) === null || _a === void 0 ? void 0 : _a.call(rest, width);
|
|
36
|
+
}, dashOffset: dashOffset, dashGap: pathWidth / 2, dashWidth: pathWidth / 2, animationDuration: animationDuration, value: 100 }));
|
|
37
|
+
};
|
|
38
|
+
export default IndeterminateProgress;
|
|
39
|
+
//# sourceMappingURL=IndeterminateProgress.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"IndeterminateProgress.js","sourceRoot":"","sources":["IndeterminateProgress.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EACL,OAAO,EACP,mBAAmB,EACnB,cAAc,EACd,UAAU,GACX,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAEL,0BAA0B,GAE3B,MAAM,kBAAkB,CAAC;AAM1B,MAAM,qBAAqB,GAAyC,CAAC,EACnE,iBAAiB,EACjB,GAAG,IAAI,EACR,EAAE,EAAE;IACH,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;IACpD,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;IAC5C,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;IACtD,MAAM,iBAAiB,GACrB,IAAI,CAAC,iBAAiB,IAAI,0BAA0B,CAAC;IAEvD,MAAM,aAAa,GAAG,cAAc,CAAC,CAAC,CAAC,CAAC;IAExC,+HAA+H;IAC/H,mBAAmB,CACjB,GAAG,EAAE,CAAC,aAAa,CAAC,KAAK,EACzB,CAAC,MAAM,EAAE,EAAE,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC,MAAM,CAAC,CAC3C,CAAC;IAEF,MAAM,4BAA4B,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QAC1D,IAAI,KAAK,KAAK,CAAC,EAAE;YACf,QAAQ,CAAC,GAAG,CAAC,CAAC;YACd,aAAa,CAAC,KAAK,GAAG,UAAU,CAAC,SAAS,EAAE;gBAC1C,QAAQ,EAAE,iBAAiB;aAC5B,CAAC,CAAC;SACJ;aAAM;YACL,QAAQ,CAAC,CAAC,CAAC,CAAC;YACZ,aAAa,CAAC,KAAK,GAAG,UAAU,CAAC,CAAC,EAAE;gBAClC,QAAQ,EAAE,iBAAiB;aAC5B,CAAC,CAAC;SACJ;IACH,CAAC,EAAE,CAAC,aAAa,EAAE,KAAK,EAAE,iBAAiB,EAAE,SAAS,CAAC,CAAC,CAAC;IAEzD,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,MAAM,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE;YAC9B,4BAA4B,EAAE,CAAC;QACjC,CAAC,EAAE,iBAAiB,CAAC,CAAC;QACtB,OAAO,GAAG,EAAE,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;IACrC,CAAC,EAAE,CAAC,iBAAiB,EAAE,4BAA4B,CAAC,CAAC,CAAC;IAEtD,OAAO,CACL,oBAAC,iBAAiB,OACZ,IAAI,EACR,MAAM,EAAE,IAAI,CAAC,MAAM,IAAI,wBAAwB,EAC/C,eAAe,EAAE,CAAC,KAAK,EAAE,EAAE;;YACzB,YAAY,CAAC,KAAK,CAAC,CAAC;YACpB,MAAA,IAAI,CAAC,eAAe,qDAAG,KAAK,CAAC,CAAC;QAChC,CAAC,EACD,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,SAAS,GAAG,CAAC,EACtB,SAAS,EAAE,SAAS,GAAG,CAAC,EACxB,iBAAiB,EAAE,iBAAiB,EACpC,KAAK,EAAE,GAAG,GACV,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,qBAAqB,CAAC"}
|
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import {
|
|
3
|
+
runOnJS,
|
|
4
|
+
useAnimatedReaction,
|
|
5
|
+
useSharedValue,
|
|
6
|
+
withTiming,
|
|
7
|
+
} from "react-native-reanimated";
|
|
8
|
+
import {
|
|
9
|
+
BaseProgressProps,
|
|
10
|
+
DEFAULT_ANIMATION_DURATION,
|
|
11
|
+
ValueProgressProps,
|
|
12
|
+
} from "./ProgressCommon";
|
|
13
|
+
|
|
14
|
+
interface IndeterminateProgressProps extends BaseProgressProps {
|
|
15
|
+
ProgressComponent: React.FunctionComponent<ValueProgressProps>;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
const IndeterminateProgress: React.FC<IndeterminateProgressProps> = ({
|
|
19
|
+
ProgressComponent,
|
|
20
|
+
...rest
|
|
21
|
+
}) => {
|
|
22
|
+
const [pathWidth, setPathWidth] = React.useState(0);
|
|
23
|
+
const [value, setValue] = React.useState(0);
|
|
24
|
+
const [dashOffset, setDashOffset] = React.useState(0);
|
|
25
|
+
const animationDuration =
|
|
26
|
+
rest.animationDuration || DEFAULT_ANIMATION_DURATION;
|
|
27
|
+
|
|
28
|
+
const currentOffset = useSharedValue(0);
|
|
29
|
+
|
|
30
|
+
// dashOffset animation done through state due to it not being a 'native' prop that reanimated can animate on the native thread
|
|
31
|
+
useAnimatedReaction(
|
|
32
|
+
() => currentOffset.value,
|
|
33
|
+
(result) => runOnJS(setDashOffset)(result)
|
|
34
|
+
);
|
|
35
|
+
|
|
36
|
+
const repeatIndeterminateAnimation = React.useCallback(() => {
|
|
37
|
+
if (value === 0) {
|
|
38
|
+
setValue(100);
|
|
39
|
+
currentOffset.value = withTiming(pathWidth, {
|
|
40
|
+
duration: animationDuration,
|
|
41
|
+
});
|
|
42
|
+
} else {
|
|
43
|
+
setValue(0);
|
|
44
|
+
currentOffset.value = withTiming(0, {
|
|
45
|
+
duration: animationDuration,
|
|
46
|
+
});
|
|
47
|
+
}
|
|
48
|
+
}, [currentOffset, value, animationDuration, pathWidth]);
|
|
49
|
+
|
|
50
|
+
React.useEffect(() => {
|
|
51
|
+
const timeout = setTimeout(() => {
|
|
52
|
+
repeatIndeterminateAnimation();
|
|
53
|
+
}, animationDuration);
|
|
54
|
+
return () => clearTimeout(timeout);
|
|
55
|
+
}, [animationDuration, repeatIndeterminateAnimation]);
|
|
56
|
+
|
|
57
|
+
return (
|
|
58
|
+
<ProgressComponent
|
|
59
|
+
{...rest}
|
|
60
|
+
testID={rest.testID || "indeterminate-progress"}
|
|
61
|
+
onFullPathWidth={(width) => {
|
|
62
|
+
setPathWidth(width);
|
|
63
|
+
rest.onFullPathWidth?.(width);
|
|
64
|
+
}}
|
|
65
|
+
dashOffset={dashOffset}
|
|
66
|
+
dashGap={pathWidth / 2}
|
|
67
|
+
dashWidth={pathWidth / 2}
|
|
68
|
+
animationDuration={animationDuration}
|
|
69
|
+
value={100}
|
|
70
|
+
/>
|
|
71
|
+
);
|
|
72
|
+
};
|
|
73
|
+
|
|
74
|
+
export default IndeterminateProgress;
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import Svg, { Line } from "react-native-svg";
|
|
3
|
+
import Animated, { useAnimatedProps, useSharedValue, withTiming, } from "react-native-reanimated";
|
|
4
|
+
import { DEFAULT_ANIMATION_DURATION, } from "../ProgressCommon";
|
|
5
|
+
export const AnimatedLine = Animated.createAnimatedComponent(Line);
|
|
6
|
+
export const LinearProgress = ({ theme, minimumValue = 0, maximumValue = 100, value = minimumValue, thickness = 10, trackThickness = thickness, color = theme.colors.primary, trackColor = theme.colors.divider, trackOpacity = 1, showTrack = true, animationDuration = DEFAULT_ANIMATION_DURATION, isAnimated = true, lineCap = "round", trackLineCap = lineCap, dashWidth, trackDashWidth, dashGap, trackDashGap, dashOffset, trackDashOffset, customDashArray, trackCustomDashArray, onFullPathWidth, style, testID, }) => {
|
|
7
|
+
const [svgContainerWidth, setSvgContainerWidth] = React.useState(0);
|
|
8
|
+
const dashArray = dashWidth !== undefined
|
|
9
|
+
? `${dashWidth} ${dashGap || dashWidth}`
|
|
10
|
+
: undefined;
|
|
11
|
+
const trackDashArray = trackDashWidth !== undefined
|
|
12
|
+
? `${trackDashWidth} ${trackDashGap || trackDashWidth}`
|
|
13
|
+
: undefined;
|
|
14
|
+
const maxThickness = Math.max(thickness, trackThickness);
|
|
15
|
+
const thicknessOffset = maxThickness / 2; // This offset guarantees nothing is cut off by view bounds
|
|
16
|
+
const progressLineWidth = svgContainerWidth - thicknessOffset;
|
|
17
|
+
const trackProgressLineWidth = svgContainerWidth - thicknessOffset;
|
|
18
|
+
const currentFillPercentage = value / (maximumValue + minimumValue);
|
|
19
|
+
const currentProgressLineWidth = useSharedValue(currentFillPercentage * progressLineWidth);
|
|
20
|
+
const progressLineAnimatedProps = useAnimatedProps(() => {
|
|
21
|
+
const isBelowMinWidth = currentProgressLineWidth.value <= thicknessOffset;
|
|
22
|
+
return {
|
|
23
|
+
x2: Math.min(progressLineWidth, currentProgressLineWidth.value),
|
|
24
|
+
strokeOpacity: isBelowMinWidth ? 0.0 : 1.0,
|
|
25
|
+
};
|
|
26
|
+
});
|
|
27
|
+
React.useEffect(() => {
|
|
28
|
+
currentProgressLineWidth.value = withTiming(progressLineWidth * currentFillPercentage, {
|
|
29
|
+
duration: isAnimated ? animationDuration : 0,
|
|
30
|
+
});
|
|
31
|
+
}, [
|
|
32
|
+
value,
|
|
33
|
+
progressLineWidth,
|
|
34
|
+
currentFillPercentage,
|
|
35
|
+
animationDuration,
|
|
36
|
+
currentProgressLineWidth,
|
|
37
|
+
maximumValue,
|
|
38
|
+
minimumValue,
|
|
39
|
+
isAnimated,
|
|
40
|
+
]);
|
|
41
|
+
return (React.createElement(Svg, { testID: testID !== null && testID !== void 0 ? testID : "linear-progress-component", onLayout: (event) => {
|
|
42
|
+
const width = event.nativeEvent.layout.width;
|
|
43
|
+
setSvgContainerWidth(width);
|
|
44
|
+
onFullPathWidth === null || onFullPathWidth === void 0 ? void 0 : onFullPathWidth(width);
|
|
45
|
+
}, style: [
|
|
46
|
+
{
|
|
47
|
+
height: maxThickness,
|
|
48
|
+
},
|
|
49
|
+
style,
|
|
50
|
+
] },
|
|
51
|
+
showTrack && (React.createElement(Line, { x1: thicknessOffset, y1: thicknessOffset, x2: trackProgressLineWidth, y2: thicknessOffset, stroke: trackColor, strokeWidth: trackThickness, strokeOpacity: trackOpacity, strokeLinecap: trackLineCap, strokeDasharray: trackCustomDashArray || trackDashArray, strokeDashoffset: trackDashOffset })),
|
|
52
|
+
React.createElement(AnimatedLine, { animatedProps: progressLineAnimatedProps, x1: thicknessOffset, y1: thicknessOffset, y2: thicknessOffset, stroke: color, strokeWidth: thickness, strokeLinecap: lineCap, strokeDasharray: customDashArray || dashArray, strokeDashoffset: dashOffset })));
|
|
53
|
+
};
|
|
54
|
+
//# sourceMappingURL=LinearProgress.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"LinearProgress.js","sourceRoot":"","sources":["LinearProgress.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,132 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import Svg, { Line, LineProps } from "react-native-svg";
|
|
3
|
+
import Animated, {
|
|
4
|
+
useAnimatedProps,
|
|
5
|
+
useSharedValue,
|
|
6
|
+
withTiming,
|
|
7
|
+
} from "react-native-reanimated";
|
|
8
|
+
import {
|
|
9
|
+
DEFAULT_ANIMATION_DURATION,
|
|
10
|
+
ValueProgressProps,
|
|
11
|
+
} from "../ProgressCommon";
|
|
12
|
+
|
|
13
|
+
export const AnimatedLine = Animated.createAnimatedComponent(Line);
|
|
14
|
+
|
|
15
|
+
export const LinearProgress: React.FC<ValueProgressProps> = ({
|
|
16
|
+
theme,
|
|
17
|
+
minimumValue = 0,
|
|
18
|
+
maximumValue = 100,
|
|
19
|
+
value = minimumValue,
|
|
20
|
+
thickness = 10,
|
|
21
|
+
trackThickness = thickness,
|
|
22
|
+
color = theme.colors.primary,
|
|
23
|
+
trackColor = theme.colors.divider,
|
|
24
|
+
trackOpacity = 1,
|
|
25
|
+
showTrack = true,
|
|
26
|
+
animationDuration = DEFAULT_ANIMATION_DURATION,
|
|
27
|
+
isAnimated = true,
|
|
28
|
+
lineCap = "round",
|
|
29
|
+
trackLineCap = lineCap,
|
|
30
|
+
dashWidth,
|
|
31
|
+
trackDashWidth,
|
|
32
|
+
dashGap,
|
|
33
|
+
trackDashGap,
|
|
34
|
+
dashOffset,
|
|
35
|
+
trackDashOffset,
|
|
36
|
+
customDashArray,
|
|
37
|
+
trackCustomDashArray,
|
|
38
|
+
onFullPathWidth,
|
|
39
|
+
style,
|
|
40
|
+
testID,
|
|
41
|
+
}) => {
|
|
42
|
+
const [svgContainerWidth, setSvgContainerWidth] = React.useState(0);
|
|
43
|
+
|
|
44
|
+
const dashArray =
|
|
45
|
+
dashWidth !== undefined
|
|
46
|
+
? `${dashWidth} ${dashGap || dashWidth}`
|
|
47
|
+
: undefined;
|
|
48
|
+
const trackDashArray =
|
|
49
|
+
trackDashWidth !== undefined
|
|
50
|
+
? `${trackDashWidth} ${trackDashGap || trackDashWidth}`
|
|
51
|
+
: undefined;
|
|
52
|
+
|
|
53
|
+
const maxThickness = Math.max(thickness, trackThickness);
|
|
54
|
+
const thicknessOffset = maxThickness / 2; // This offset guarantees nothing is cut off by view bounds
|
|
55
|
+
|
|
56
|
+
const progressLineWidth = svgContainerWidth - thicknessOffset;
|
|
57
|
+
const trackProgressLineWidth = svgContainerWidth - thicknessOffset;
|
|
58
|
+
|
|
59
|
+
const currentFillPercentage = value / (maximumValue + minimumValue);
|
|
60
|
+
const currentProgressLineWidth = useSharedValue(
|
|
61
|
+
currentFillPercentage * progressLineWidth
|
|
62
|
+
);
|
|
63
|
+
|
|
64
|
+
const progressLineAnimatedProps = useAnimatedProps<LineProps>(() => {
|
|
65
|
+
const isBelowMinWidth = currentProgressLineWidth.value <= thicknessOffset;
|
|
66
|
+
return {
|
|
67
|
+
x2: Math.min(progressLineWidth, currentProgressLineWidth.value), //Prevents going beyond the max width
|
|
68
|
+
strokeOpacity: isBelowMinWidth ? 0.0 : 1.0,
|
|
69
|
+
};
|
|
70
|
+
});
|
|
71
|
+
|
|
72
|
+
React.useEffect(() => {
|
|
73
|
+
currentProgressLineWidth.value = withTiming(
|
|
74
|
+
progressLineWidth * currentFillPercentage,
|
|
75
|
+
{
|
|
76
|
+
duration: isAnimated ? animationDuration : 0,
|
|
77
|
+
}
|
|
78
|
+
);
|
|
79
|
+
}, [
|
|
80
|
+
value,
|
|
81
|
+
progressLineWidth,
|
|
82
|
+
currentFillPercentage,
|
|
83
|
+
animationDuration,
|
|
84
|
+
currentProgressLineWidth,
|
|
85
|
+
maximumValue,
|
|
86
|
+
minimumValue,
|
|
87
|
+
isAnimated,
|
|
88
|
+
]);
|
|
89
|
+
|
|
90
|
+
return (
|
|
91
|
+
<Svg
|
|
92
|
+
testID={testID ?? "linear-progress-component"}
|
|
93
|
+
onLayout={(event) => {
|
|
94
|
+
const width = event.nativeEvent.layout.width;
|
|
95
|
+
setSvgContainerWidth(width);
|
|
96
|
+
onFullPathWidth?.(width);
|
|
97
|
+
}}
|
|
98
|
+
style={[
|
|
99
|
+
{
|
|
100
|
+
height: maxThickness,
|
|
101
|
+
},
|
|
102
|
+
style,
|
|
103
|
+
]}
|
|
104
|
+
>
|
|
105
|
+
{showTrack && (
|
|
106
|
+
<Line
|
|
107
|
+
x1={thicknessOffset}
|
|
108
|
+
y1={thicknessOffset}
|
|
109
|
+
x2={trackProgressLineWidth}
|
|
110
|
+
y2={thicknessOffset}
|
|
111
|
+
stroke={trackColor}
|
|
112
|
+
strokeWidth={trackThickness}
|
|
113
|
+
strokeOpacity={trackOpacity}
|
|
114
|
+
strokeLinecap={trackLineCap}
|
|
115
|
+
strokeDasharray={trackCustomDashArray || trackDashArray}
|
|
116
|
+
strokeDashoffset={trackDashOffset}
|
|
117
|
+
/>
|
|
118
|
+
)}
|
|
119
|
+
<AnimatedLine
|
|
120
|
+
animatedProps={progressLineAnimatedProps}
|
|
121
|
+
x1={thicknessOffset}
|
|
122
|
+
y1={thicknessOffset}
|
|
123
|
+
y2={thicknessOffset}
|
|
124
|
+
stroke={color}
|
|
125
|
+
strokeWidth={thickness}
|
|
126
|
+
strokeLinecap={lineCap}
|
|
127
|
+
strokeDasharray={customDashArray || dashArray}
|
|
128
|
+
strokeDashoffset={dashOffset}
|
|
129
|
+
/>
|
|
130
|
+
</Svg>
|
|
131
|
+
);
|
|
132
|
+
};
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import IndeterminateProgress from "../IndeterminateProgress";
|
|
3
|
+
import { LinearProgress as LinearProgressComponent } from "./LinearProgress";
|
|
4
|
+
import { withTheme } from "../../../theming";
|
|
5
|
+
const LinearProgress = (props) => {
|
|
6
|
+
if (props.indeterminate) {
|
|
7
|
+
return (React.createElement(IndeterminateProgress, { ProgressComponent: LinearProgressComponent, ...props }));
|
|
8
|
+
}
|
|
9
|
+
else {
|
|
10
|
+
return React.createElement(LinearProgressComponent, { ...props });
|
|
11
|
+
}
|
|
12
|
+
};
|
|
13
|
+
export default withTheme(LinearProgress);
|
|
14
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,qBAAqB,MAAM,0BAA0B,CAAC;AAK7D,OAAO,EAAE,cAAc,IAAI,uBAAuB,EAAE,MAAM,kBAAkB,CAAC;AAC7E,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAE7C,MAAM,cAAc,GAEhB,CAAC,KAAK,EAAE,EAAE;IACZ,IAAI,KAAK,CAAC,aAAa,EAAE;QACvB,OAAO,CACL,oBAAC,qBAAqB,IACpB,iBAAiB,EAAE,uBAAuB,KACtC,KAAK,GACT,CACH,CAAC;KACH;SAAM;QACL,OAAO,oBAAC,uBAAuB,OAAK,KAAK,GAAI,CAAC;KAC/C;AACH,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC,cAAc,CAAC,CAAC"}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import IndeterminateProgress from "../IndeterminateProgress";
|
|
3
|
+
import {
|
|
4
|
+
IndeterminateProgressProps,
|
|
5
|
+
ValueProgressProps,
|
|
6
|
+
} from "../ProgressCommon";
|
|
7
|
+
import { LinearProgress as LinearProgressComponent } from "./LinearProgress";
|
|
8
|
+
import { withTheme } from "../../../theming";
|
|
9
|
+
|
|
10
|
+
const LinearProgress: React.FC<
|
|
11
|
+
ValueProgressProps & IndeterminateProgressProps
|
|
12
|
+
> = (props) => {
|
|
13
|
+
if (props.indeterminate) {
|
|
14
|
+
return (
|
|
15
|
+
<IndeterminateProgress
|
|
16
|
+
ProgressComponent={LinearProgressComponent}
|
|
17
|
+
{...props}
|
|
18
|
+
/>
|
|
19
|
+
);
|
|
20
|
+
} else {
|
|
21
|
+
return <LinearProgressComponent {...props} />;
|
|
22
|
+
}
|
|
23
|
+
};
|
|
24
|
+
|
|
25
|
+
export default withTheme(LinearProgress);
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ProgressCommon.js","sourceRoot":"","sources":["ProgressCommon.ts"],"names":[],"mappings":"AAKA,MAAM,CAAC,MAAM,0BAA0B,GAAG,GAAG,CAAC"}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import { StyleProp, ViewStyle } from "react-native";
|
|
2
|
+
import { Theme } from "../../styles/DefaultTheme";
|
|
3
|
+
|
|
4
|
+
type LineCap = "round" | "square";
|
|
5
|
+
|
|
6
|
+
export const DEFAULT_ANIMATION_DURATION = 500;
|
|
7
|
+
|
|
8
|
+
export interface BaseProgressProps {
|
|
9
|
+
thickness?: number;
|
|
10
|
+
trackThickness?: number;
|
|
11
|
+
color?: string;
|
|
12
|
+
trackColor?: string;
|
|
13
|
+
trackOpacity?: number;
|
|
14
|
+
showTrack?: boolean;
|
|
15
|
+
animationDuration?: number;
|
|
16
|
+
isAnimated?: boolean;
|
|
17
|
+
lineCap?: LineCap;
|
|
18
|
+
trackLineCap?: LineCap;
|
|
19
|
+
dashWidth?: string | number;
|
|
20
|
+
trackDashWidth?: string | number;
|
|
21
|
+
dashGap?: string | number;
|
|
22
|
+
trackDashGap?: string | number;
|
|
23
|
+
dashOffset?: string | number;
|
|
24
|
+
trackDashOffset?: string | number;
|
|
25
|
+
customDashArray?: string;
|
|
26
|
+
trackCustomDashArray?: string;
|
|
27
|
+
onFullPathWidth?: (width: number) => void;
|
|
28
|
+
style?: StyleProp<ViewStyle>;
|
|
29
|
+
theme: Theme;
|
|
30
|
+
testID?: string;
|
|
31
|
+
}
|
|
32
|
+
export interface ValueProgressProps extends BaseProgressProps {
|
|
33
|
+
value?: number;
|
|
34
|
+
minimumValue?: number;
|
|
35
|
+
maximumValue?: number;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
export interface IndeterminateProgressProps extends BaseProgressProps {
|
|
39
|
+
indeterminate?: boolean;
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
export interface CircularProgressProps {
|
|
43
|
+
startPosition?: "left" | "top" | "right" | "bottom";
|
|
44
|
+
}
|
|
@@ -12,6 +12,7 @@ const SwipeableItem = ({ theme, style, children, Icon, closeOnPress, leftOpenVal
|
|
|
12
12
|
return Object.keys(object).length === 0;
|
|
13
13
|
};
|
|
14
14
|
const { onStartSwiping, onStopSwiping } = React.useContext(SwipeableListContext);
|
|
15
|
+
const swipeableRef = React.useRef(null);
|
|
15
16
|
const { viewStyles, textStyles } = extractStyles(style);
|
|
16
17
|
const { borderStyles, marginStyles } = extractBorderAndMarginStyles(viewStyles);
|
|
17
18
|
const sizeStyles = extractSizeStyles(viewStyles);
|
|
@@ -49,7 +50,13 @@ const SwipeableItem = ({ theme, style, children, Icon, closeOnPress, leftOpenVal
|
|
|
49
50
|
throw Error("Colliding configuration in SwipeableItem. You cannot have SwipeableItemButton(s) on the swipe direction where swipe handling is configured. Either reset swipe configuration or remove the button(s).");
|
|
50
51
|
}
|
|
51
52
|
//Renders a single 'behind' item. Used for both buttons and swipe handler
|
|
52
|
-
const renderBehindItem = (item, index) => (React.createElement(Pressable, { key: index.toString(), onPress:
|
|
53
|
+
const renderBehindItem = (item, index) => (React.createElement(Pressable, { key: index.toString(), onPress: () => {
|
|
54
|
+
var _a, _b;
|
|
55
|
+
(_a = item.onPress) === null || _a === void 0 ? void 0 : _a.call(item);
|
|
56
|
+
if (item.closeOnPress !== false) {
|
|
57
|
+
(_b = swipeableRef.current) === null || _b === void 0 ? void 0 : _b.closeRow();
|
|
58
|
+
}
|
|
59
|
+
}, style: [
|
|
53
60
|
styles.buttonContainer,
|
|
54
61
|
{ backgroundColor: item.backgroundColor || theme.colors.primary },
|
|
55
62
|
] },
|
|
@@ -60,7 +67,7 @@ const SwipeableItem = ({ theme, style, children, Icon, closeOnPress, leftOpenVal
|
|
|
60
67
|
return (React.createElement(View, { onLayout: (event) => {
|
|
61
68
|
setComponentWidth(event.nativeEvent.layout.width);
|
|
62
69
|
}, style: [styles.parentContainer, parentContainerStyles] },
|
|
63
|
-
React.createElement(SwipeRow, { leftOpenValue: isRightSwipeHandled ? 0 : leftOpenValue || defaultLeftOpenValue //If in swiping mode, don't keep open
|
|
70
|
+
React.createElement(SwipeRow, { ref: swipeableRef, leftOpenValue: isRightSwipeHandled ? 0 : leftOpenValue || defaultLeftOpenValue //If in swiping mode, don't keep open
|
|
64
71
|
, rightOpenValue: isLeftSwipeHandled ? 0 : rightOpenValue || defaultRightOpenValue, leftActivationValue: leftActivationValue || isRightSwipeHandled
|
|
65
72
|
? defaultLeftOpenValue * (swipeActivationPercentage / 100) //When swipe passes activation percentage then it should be considered activated (call onSwipe)
|
|
66
73
|
: defaultLeftOpenValue, rightActivationValue: rightActivationValue || isLeftSwipeHandled
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SwipeableItem.js","sourceRoot":"","sources":["SwipeableItem.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"SwipeableItem.js","sourceRoot":"","sources":["SwipeableItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EACL,IAAI,EAIJ,UAAU,EACV,IAAI,GACL,MAAM,cAAc,CAAC;AACtB,OAAO,SAAS,MAAM,cAAc,CAAC;AACrC,OAAO,EACL,4BAA4B,EAC5B,mBAAmB,EACnB,qBAAqB,EACrB,qBAAqB,EACrB,iBAAiB,EACjB,aAAa,GACd,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AAGxD,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC1C,OAAO,mBAEN,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AACvD,OAAO,EAIL,kCAAkC,EAClC,mCAAmC,EACnC,qBAAqB,EACrB,sBAAsB,GACvB,MAAM,uBAAuB,CAAC;AAuC/B,MAAM,aAAa,GAA6C,CAAC,EAC/D,KAAK,EACL,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,YAAY,EACZ,aAAa,EACb,cAAc,EACd,mBAAmB,EACnB,oBAAoB,EACpB,yBAAyB,GAAG,EAAE,EAC9B,aAAa,EACb,cAAc,EACd,QAAQ,GAAG,EAAE,EACb,gBAAgB,EAChB,iBAAiB,EACjB,GAAG,IAAI,EACR,EAAE,EAAE;IACH,MAAM,aAAa,GAAG,CAAC,MAAc,EAAE,EAAE;QACvC,OAAO,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC;IAC1C,CAAC,CAAC;IAEF,MAAM,EAAE,cAAc,EAAE,aAAa,EAAE,GACrC,KAAK,CAAC,UAAU,CAAC,oBAAoB,CAAC,CAAC;IAEzC,MAAM,YAAY,GAAG,KAAK,CAAC,MAAM,CAAM,IAAI,CAAC,CAAC;IAE7C,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,GAAG,aAAa,CAAC,KAAK,CAAC,CAAC;IAExD,MAAM,EAAE,YAAY,EAAE,YAAY,EAAE,GAClC,4BAA4B,CAAC,UAAU,CAAC,CAAC;IAE3C,MAAM,UAAU,GAAG,iBAAiB,CAAC,UAAU,CAAC,CAAC;IAEjD,MAAM,qBAAqB,GAAG,UAAU,CAAC,OAAO,CAAC;QAC/C,YAAY;QACZ,YAAY;QACZ,qBAAqB,CAAC,UAAU,CAAC;QACjC,qBAAqB,CAAC,UAAU,CAAC;QACjC,mBAAmB,CAAC,UAAU,CAAC;QAC/B,UAAU;KACX,CAAC,CAAC;IAEH,gDAAgD;IAChD,MAAM,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC,OAAO,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,OAAO,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC;IAC5E,MAAM,sBAAsB,GAAG,UAAU,CAAC,OAAO,CAAC;QAChD,UAAU;QACV,UAAU,CAAC,wFAAwF;KACpG,CAAC,CAAC;IAEH,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,KAAK,CAAC,QAAQ,CACxD,IAAI,CACL,CAAC;IACF,MAAM,gBAAgB,GAAG,KAAK,CAAC,OAAO,CACpC,GAAG,EAAE,CACH,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,MAAM,CACrC,CAAC,KAAK,EAAE,EAAE,CACR,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;QAC3B,KAAK,CAAC,IAAI,KAAK,mBAAmB;QAClC,KAAK,CAAC,KAAK,CAAC,oBAAoB,KAAK,MAAM,CACI,EACrD,CAAC,QAAQ,CAAC,CACX,CAAC;IAEF,MAAM,iBAAiB,GAAG,KAAK,CAAC,OAAO,CACrC,GAAG,EAAE,CACH,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,MAAM,CACrC,CAAC,KAAK,EAAE,EAAE,CACR,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;QAC3B,KAAK,CAAC,IAAI,KAAK,mBAAmB;QAClC,KAAK,CAAC,KAAK,CAAC,oBAAoB,KAAK,OAAO,CACG,EACrD,CAAC,QAAQ,CAAC,CACX,CAAC;IAEF,MAAM,iBAAiB,GAAG,KAAK,CAAC,OAAO,CACrC,GAAG,EAAE,CACH,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,MAAM,CACrC,CAAC,KAAK,EAAE,EAAE,CACR,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC,IAAI,KAAK,mBAAmB,CACpE,EACH,CAAC,QAAQ,CAAC,CACX,CAAC;IAEF,MAAM,SAAS,GAAG,qBAAqB,CAAC,IAAI,CAAC,CAAC;IAC9C,MAAM,UAAU,GAAG,sBAAsB,CAAC,IAAI,CAAC,CAAC;IAEhD,MAAM,kBAAkB,GAAG,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC;IACrD,MAAM,mBAAmB,GAAG,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IAEvD,IAAI,gBAAgB,CAAC,MAAM,GAAG,CAAC,IAAI,iBAAiB,CAAC,MAAM,GAAG,CAAC,EAAE;QAC/D,MAAM,KAAK,CAAC,yDAAyD,CAAC,CAAC;KACxE;IAED,IACE,CAAC,gBAAgB,CAAC,MAAM,IAAI,kBAAkB,CAAC;QAC/C,CAAC,iBAAiB,CAAC,MAAM,IAAI,mBAAmB,CAAC,EACjD;QACA,MAAM,KAAK,CACT,uMAAuM,CACxM,CAAC;KACH;IAED,yEAAyE;IACzE,MAAM,gBAAgB,GAAG,CAAC,IAA6B,EAAE,KAAa,EAAE,EAAE,CAAC,CACzE,oBAAC,SAAS,IACR,GAAG,EAAE,KAAK,CAAC,QAAQ,EAAE,EACrB,OAAO,EAAE,GAAG,EAAE;;YACZ,MAAA,IAAI,CAAC,OAAO,oDAAI,CAAC;YACjB,IAAI,IAAI,CAAC,YAAY,KAAK,KAAK,EAAE;gBAC/B,MAAA,YAAY,CAAC,OAAO,0CAAE,QAAQ,EAAE,CAAC;aAClC;QACH,CAAC,EACD,KAAK,EAAE;YACL,MAAM,CAAC,eAAe;YACtB,EAAE,eAAe,EAAE,IAAI,CAAC,eAAe,IAAI,KAAK,CAAC,MAAM,CAAC,OAAO,EAAE;SAClE;QAEA,IAAI,CAAC,IAAI,IAAI,CACZ,oBAAC,IAAI,IACH,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,IAAI,CAAC,QAAQ,IAAI,EAAE,EACzB,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,KAAK,CAAC,MAAM,CAAC,OAAO,GACzC,CACH;QACA,IAAI,CAAC,KAAK,IAAI,CACb,oBAAC,IAAI,IACH,KAAK,EAAE,CAAC,UAAU,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,KAAK,CAAC,MAAM,CAAC,OAAO,EAAE,CAAC,IAEjE,IAAI,CAAC,KAAK,CACN,CACR,CACS,CACb,CAAC;IAEF,MAAM,oBAAoB,GAAG,cAAc,CAAC,CAAC,CAAC,cAAc,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IACrE,MAAM,qBAAqB,GAAG,cAAc,CAAC,CAAC,CAAC,CAAC,cAAc,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IAEvE,OAAO,CACL,oBAAC,IAAI,IACH,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;YAClB,iBAAiB,CAAC,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACpD,CAAC,EACD,KAAK,EAAE,CAAC,MAAM,CAAC,eAAe,EAAE,qBAAqB,CAAC;QAGtD,oBAAC,QAAQ,IACP,GAAG,EAAE,YAAY,EACjB,aAAa,EACX,mBAAmB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,aAAa,IAAI,oBAAoB,CAAC,qCAAqC;cAEvG,cAAc,EACZ,kBAAkB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,cAAc,IAAI,qBAAqB,EAElE,mBAAmB,EACjB,mBAAmB,IAAI,mBAAmB;gBACxC,CAAC,CAAC,oBAAoB,GAAG,CAAC,yBAAyB,GAAG,GAAG,CAAC,CAAC,+FAA+F;gBAC1J,CAAC,CAAC,oBAAoB,EAE1B,oBAAoB,EAClB,oBAAoB,IAAI,kBAAkB;gBACxC,CAAC,CAAC,qBAAqB,GAAG,CAAC,yBAAyB,GAAG,GAAG,CAAC;gBAC3D,CAAC,CAAC,qBAAqB,EAE3B,aAAa,EAAE,cAAc,IAAI,oBAAoB,EACrD,cAAc,EAAE,aAAa,IAAI,qBAAqB,EACtD,YAAY,EACV,mBAAmB,CAAC,CAAC,CAAC,GAAG,EAAE,WAAC,OAAA,MAAA,UAAU,CAAC,aAAa,0DAAI,CAAA,EAAA,CAAC,CAAC,CAAC,SAAS,EAEtE,aAAa,EACX,kBAAkB,CAAC,CAAC,CAAC,GAAG,EAAE,WAAC,OAAA,MAAA,SAAS,CAAC,YAAY,yDAAI,CAAA,EAAA,CAAC,CAAC,CAAC,SAAS,EAEnE,iBAAiB,EAAE,cAAc,EACjC,iBAAiB,EAAE,aAAa,EAChC,eAAe,EAAE,YAAY,EAC7B,QAAQ,EAAE,QAAQ,EAClB,gBAAgB,EAAE,iBAAiB,EACnC,iBAAiB,EAAE,gBAAgB,KAC/B,IAAI;YAER,oBAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,eAAe;gBACjC,oBAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,mBAAmB,IACpC,mBAAmB;oBAClB,CAAC,CAAC,gBAAgB,CACd,mCAAmC,CAAC,UAAU,CAAC,EAC/C,CAAC,CACF;oBACH,CAAC,CAAC,iBAAiB,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CACpC,gBAAgB,CAAC,IAAI,CAAC,KAAK,EAAE,KAAK,CAAC,CACpC,CACA;gBACP,oBAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,mBAAmB,IACpC,kBAAkB;oBACjB,CAAC,CAAC,gBAAgB,CACd,kCAAkC,CAAC,SAAS,CAAC,EAC7C,CAAC,CACF;oBACH,CAAC,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CACnC,gBAAgB,CAAC,IAAI,CAAC,KAAK,EAAE,KAAK,CAAC,CACpC,CACA,CACF;YACP,oBAAC,IAAI,IACH,KAAK,EAAE;oBACL,MAAM,CAAC,gBAAgB;oBACvB;wBACE,eAAe,EAAE,KAAK,CAAC,MAAM,CAAC,UAAU;qBACzC;oBACD,sBAAsB;iBACvB,IAEA,iBAAiB,CACb,CACE,CACN,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IAC/B,eAAe,EAAE;QACf,QAAQ,EAAE,QAAQ;QAClB,SAAS,EAAE,EAAE;KACd;IACD,eAAe,EAAE;QACf,IAAI,EAAE,CAAC;QACP,KAAK,EAAE,MAAM;QACb,MAAM,EAAE,MAAM;QACd,aAAa,EAAE,KAAK;KACrB;IACD,mBAAmB,EAAE;QACnB,IAAI,EAAE,CAAC;QACP,aAAa,EAAE,KAAK;KACrB;IACD,eAAe,EAAE;QACf,IAAI,EAAE,CAAC;QACP,UAAU,EAAE,QAAQ;QACpB,cAAc,EAAE,QAAQ;KACzB;IACD,gBAAgB,EAAE;QAChB,KAAK,EAAE,MAAM;QACb,SAAS,EAAE,EAAE;QACb,QAAQ,EAAE,QAAQ;KACnB;CACF,CAAC,CAAC;AAEH,eAAe,SAAS,CAAC,aAAa,CAAC,CAAC"}
|
|
@@ -96,6 +96,8 @@ const SwipeableItem: React.FC<React.PropsWithChildren<Props>> = ({
|
|
|
96
96
|
const { onStartSwiping, onStopSwiping } =
|
|
97
97
|
React.useContext(SwipeableListContext);
|
|
98
98
|
|
|
99
|
+
const swipeableRef = React.useRef<any>(null);
|
|
100
|
+
|
|
99
101
|
const { viewStyles, textStyles } = extractStyles(style);
|
|
100
102
|
|
|
101
103
|
const { borderStyles, marginStyles } =
|
|
@@ -176,7 +178,12 @@ const SwipeableItem: React.FC<React.PropsWithChildren<Props>> = ({
|
|
|
176
178
|
const renderBehindItem = (item: SwipeableItemBehindItem, index: number) => (
|
|
177
179
|
<Pressable
|
|
178
180
|
key={index.toString()}
|
|
179
|
-
onPress={(
|
|
181
|
+
onPress={() => {
|
|
182
|
+
item.onPress?.();
|
|
183
|
+
if (item.closeOnPress !== false) {
|
|
184
|
+
swipeableRef.current?.closeRow();
|
|
185
|
+
}
|
|
186
|
+
}}
|
|
180
187
|
style={[
|
|
181
188
|
styles.buttonContainer,
|
|
182
189
|
{ backgroundColor: item.backgroundColor || theme.colors.primary },
|
|
@@ -211,6 +218,7 @@ const SwipeableItem: React.FC<React.PropsWithChildren<Props>> = ({
|
|
|
211
218
|
>
|
|
212
219
|
{/*@ts-ignore*/}
|
|
213
220
|
<SwipeRow
|
|
221
|
+
ref={swipeableRef}
|
|
214
222
|
leftOpenValue={
|
|
215
223
|
isRightSwipeHandled ? 0 : leftOpenValue || defaultLeftOpenValue //If in swiping mode, don't keep open
|
|
216
224
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SwipeableItemCommon.js","sourceRoot":"","sources":["SwipeableItemCommon.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;
|
|
1
|
+
{"version":3,"file":"SwipeableItemCommon.js","sourceRoot":"","sources":["SwipeableItemCommon.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAgC9B,MAAM,UAAU,sBAAsB,CAAC,MAAc;IACnD,OAAO,IAAI,CAAC,MAAM,EAAE;QAClB,eAAe;QACf,iBAAiB;QACjB,gBAAgB;QAChB,oBAAoB;QACpB,2BAA2B;QAC3B,iBAAiB;KAClB,CAAC,CAAC;AACL,CAAC;AAED,MAAM,UAAU,qBAAqB,CAAC,MAAc;IAClD,OAAO,IAAI,CAAC,MAAM,EAAE;QAClB,cAAc;QACd,gBAAgB;QAChB,eAAe;QACf,mBAAmB;QACnB,0BAA0B;QAC1B,gBAAgB;KACjB,CAAC,CAAC;AACL,CAAC;AAED,MAAM,UAAU,mCAAmC,CACjD,KAAsB;IAEtB,OAAO;QACL,KAAK,EAAE,KAAK,CAAC,eAAe,IAAI,EAAE;QAClC,oBAAoB,EAAE,OAAO;QAC7B,OAAO,EAAE,KAAK,CAAC,aAAa;QAC5B,IAAI,EAAE,KAAK,CAAC,cAAc;QAC1B,QAAQ,EAAE,KAAK,CAAC,kBAAkB;QAClC,eAAe,EAAE,KAAK,CAAC,yBAAyB;QAChD,KAAK,EAAE,KAAK,CAAC,eAAe;KAC7B,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,kCAAkC,CAChD,KAAqB;IAErB,OAAO;QACL,KAAK,EAAE,KAAK,CAAC,cAAc,IAAI,EAAE;QACjC,oBAAoB,EAAE,MAAM;QAC5B,OAAO,EAAE,KAAK,CAAC,YAAY;QAC3B,IAAI,EAAE,KAAK,CAAC,aAAa;QACzB,QAAQ,EAAE,KAAK,CAAC,iBAAiB;QACjC,eAAe,EAAE,KAAK,CAAC,wBAAwB;QAC/C,KAAK,EAAE,KAAK,CAAC,cAAc;KAC5B,CAAC;AACJ,CAAC"}
|
|
@@ -5,6 +5,7 @@ export interface SwipeableItemBehindItem {
|
|
|
5
5
|
revealSwipeDirection: "left" | "right";
|
|
6
6
|
onPress?: () => void;
|
|
7
7
|
onSwipe?: () => void;
|
|
8
|
+
closeOnPress?: boolean;
|
|
8
9
|
icon?: string;
|
|
9
10
|
iconSize?: number;
|
|
10
11
|
backgroundColor?: string;
|
|
@@ -53,7 +54,7 @@ export function extractLeftSwipeProps(object: object): LeftSwipeProps {
|
|
|
53
54
|
|
|
54
55
|
export function rightSwipeToSwipeableItemBehindItem(
|
|
55
56
|
swipe: RightSwipeProps
|
|
56
|
-
): Omit<SwipeableItemBehindItem, "onPress"> {
|
|
57
|
+
): Omit<SwipeableItemBehindItem, "onPress" | "closeOnPress"> {
|
|
57
58
|
return {
|
|
58
59
|
title: swipe.rightSwipeTitle || "",
|
|
59
60
|
revealSwipeDirection: "right",
|
|
@@ -67,7 +68,7 @@ export function rightSwipeToSwipeableItemBehindItem(
|
|
|
67
68
|
|
|
68
69
|
export function leftSwipeToSwipeableItemBehindItem(
|
|
69
70
|
swipe: LeftSwipeProps
|
|
70
|
-
): Omit<SwipeableItemBehindItem, "onPress"> {
|
|
71
|
+
): Omit<SwipeableItemBehindItem, "onPress" | "closeOnPress"> {
|
|
71
72
|
return {
|
|
72
73
|
title: swipe.leftSwipeTitle || "",
|
|
73
74
|
revealSwipeDirection: "left",
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
import { View, Animated,
|
|
2
|
+
import { View, Animated, StyleSheet, Text, I18nManager, } from "react-native";
|
|
3
3
|
import { withTheme } from "../theming";
|
|
4
4
|
import { applyStyles, extractStyles } from "../utilities";
|
|
5
|
+
import TextInput from "./TextInput";
|
|
5
6
|
const AnimatedText = Animated.createAnimatedComponent(Text);
|
|
6
7
|
const FOCUS_ANIMATION_DURATION = 150;
|
|
7
8
|
const BLUR_ANIMATION_DURATION = 180;
|
|
@@ -140,7 +141,7 @@ class TextField extends React.Component {
|
|
|
140
141
|
return this._root && this._root.blur();
|
|
141
142
|
}
|
|
142
143
|
render() {
|
|
143
|
-
const { Icon, type = "underline", disabled = false, label, error = false, leftIconName, leftIconMode, rightIconName, assistiveText, underlineColor: underlineColorProp, activeBorderColor: activeBorderColorProp, multiline = false, numberOfLines = 4, style, theme: { colors, typography, roundness, disabledOpacity }, render = (props) => React.createElement(
|
|
144
|
+
const { Icon, type = "underline", disabled = false, label, error = false, leftIconName, leftIconMode, rightIconName, assistiveText, underlineColor: underlineColorProp, activeBorderColor: activeBorderColorProp, multiline = false, numberOfLines = 4, style, theme: { colors, typography, roundness, disabledOpacity }, render = (props) => React.createElement(TextInput, { ...props }), ...rest } = this.props;
|
|
144
145
|
const MINIMIZED_LABEL_Y_OFFSET = -(typography.caption.lineHeight + 4);
|
|
145
146
|
const OUTLINE_MINIMIZED_LABEL_Y_OFFSET = -(16 * 0.5 + 4);
|
|
146
147
|
const MAXIMIZED_LABEL_FONT_SIZE = typography.subtitle1.fontSize;
|