react-swipe-action 0.1.1 → 0.2.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.
- package/README.md +167 -12
- package/dist/SwipeAction.d.ts +2 -1
- package/dist/SwipeAction.js +24 -11
- package/dist/SwipeAction.js.map +1 -1
- package/dist/index.js +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,6 +1,15 @@
|
|
|
1
|
-
# React
|
|
1
|
+
# React Swipe Action [](https://www.npmjs.com/package/react-swipe-action) 
|
|
2
2
|
|
|
3
|
-
Swipe to reveal or perform an action. Try interactive [Storybook demo](https://filipchalupa.cz/react-swipe-action/).
|
|
3
|
+
Swipe to reveal or perform an action. Try the interactive [Storybook demo](https://filipchalupa.cz/react-swipe-action/).
|
|
4
|
+
|
|
5
|
+
## Features
|
|
6
|
+
|
|
7
|
+
- Works with both mouse and touch events.
|
|
8
|
+
- Supports actions on both the left (start) and right (end) sides.
|
|
9
|
+
- "Long swipe" gesture to trigger an action.
|
|
10
|
+
- Customizable content and backgrounds for each side.
|
|
11
|
+
- `useSwipeActionReset` hook to programmatically close the swipe action.
|
|
12
|
+
- Written in TypeScript.
|
|
4
13
|
|
|
5
14
|
## Installation
|
|
6
15
|
|
|
@@ -10,28 +19,174 @@ npm install react-swipe-action
|
|
|
10
19
|
|
|
11
20
|
## How to use
|
|
12
21
|
|
|
22
|
+
Import the component and the CSS file.
|
|
23
|
+
|
|
13
24
|
```jsx
|
|
14
25
|
import { SwipeAction } from 'react-swipe-action'
|
|
15
26
|
import 'react-swipe-action/dist/index.css'
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
Use the `SwipeAction` component. The `main` prop is a function that receives a `handle` which you should pass to the element you want to be draggable.
|
|
30
|
+
|
|
31
|
+
```jsx
|
|
32
|
+
<SwipeAction
|
|
33
|
+
main={(handle) => (
|
|
34
|
+
<div className="main-content">
|
|
35
|
+
Swipe me
|
|
36
|
+
{handle}
|
|
37
|
+
</div>
|
|
38
|
+
)}
|
|
39
|
+
startAction={...}
|
|
40
|
+
endAction={...}
|
|
41
|
+
/>
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
### Actions
|
|
45
|
+
|
|
46
|
+
You can define `startAction` (swipe from left to right) and/or `endAction` (swipe from right to left).
|
|
47
|
+
|
|
48
|
+
An action is an object with the following properties:
|
|
49
|
+
|
|
50
|
+
- `content`: The content to be revealed (e.g., a button).
|
|
51
|
+
- `background`: The background that is shown behind the content.
|
|
52
|
+
- `onLongSwipe`: A function to be called when a "long swipe" is performed.
|
|
53
|
+
|
|
54
|
+
Action and its properties are optional, so you can choose to only implement one side or just the long swipe.
|
|
55
|
+
|
|
56
|
+
```jsx
|
|
57
|
+
<SwipeAction
|
|
58
|
+
main={(handle) => <button>Main content{handle}</button>}
|
|
59
|
+
endAction={{
|
|
60
|
+
content: <button onClick={() => alert('Action clicked!')}>Delete</button>,
|
|
61
|
+
background: <div style={{ backgroundColor: 'red' }} />,
|
|
62
|
+
onLongSwipe: () => alert('Long swipe!'),
|
|
63
|
+
}}
|
|
64
|
+
/>
|
|
65
|
+
```
|
|
66
|
+
|
|
67
|
+
### Closing the action programmatically
|
|
68
|
+
|
|
69
|
+
You can use the `useSwipeActionReset` hook to get a function that will reset the swipe action to its initial state. This is useful when you want to close the action after a button is clicked.
|
|
70
|
+
|
|
71
|
+
```jsx
|
|
72
|
+
import { SwipeAction, useSwipeActionReset } from 'react-swipe-action'
|
|
73
|
+
|
|
74
|
+
const ActionButton = ({ onClick, children }) => {
|
|
75
|
+
const reset = useSwipeActionReset()
|
|
76
|
+
return (
|
|
77
|
+
<button
|
|
78
|
+
onClick={async () => {
|
|
79
|
+
await onClick()
|
|
80
|
+
reset()
|
|
81
|
+
}}
|
|
82
|
+
>
|
|
83
|
+
{children}
|
|
84
|
+
</button>
|
|
85
|
+
)
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
// ...
|
|
89
|
+
|
|
90
|
+
;<SwipeAction
|
|
91
|
+
// ...
|
|
92
|
+
endAction={{
|
|
93
|
+
content: (
|
|
94
|
+
<ActionButton onClick={() => alert('Deleted!')}>Delete</ActionButton>
|
|
95
|
+
),
|
|
96
|
+
// ...
|
|
97
|
+
}}
|
|
98
|
+
/>
|
|
99
|
+
```
|
|
100
|
+
|
|
101
|
+
## API
|
|
102
|
+
|
|
103
|
+
### `<SwipeAction />` Props
|
|
104
|
+
|
|
105
|
+
| Prop | Type | Description |
|
|
106
|
+
| ------------- | ---------------------------------- | --------------------------------------------------------------------------------------------------------------------------------- |
|
|
107
|
+
| `main` | `(handle: ReactNode) => ReactNode` | **Required.** A function that returns the main content. It receives a `handle` which should be rendered on the draggable element. |
|
|
108
|
+
| `startAction` | `Action` | An action to be performed when swiping from left to right. |
|
|
109
|
+
| `endAction` | `Action` | An action to be performed when swiping from right to left. |
|
|
110
|
+
|
|
111
|
+
### `Action` Type
|
|
112
|
+
|
|
113
|
+
| Prop | Type | Description |
|
|
114
|
+
| ------------- | ------------ | ---------------------------------------------------------------------------------------------------------------------------------- |
|
|
115
|
+
| `content` | `ReactNode` | The content to be revealed when swiping. |
|
|
116
|
+
| `background` | `ReactNode` | The background to be shown behind the content. |
|
|
117
|
+
| `onLongSwipe` | `() => void` | A callback function that is triggered on a "long swipe" gesture. This can be used for quick actions without revealing the content. |
|
|
118
|
+
|
|
119
|
+
### `useSwipeActionReset()`
|
|
120
|
+
|
|
121
|
+
A custom hook that returns a `reset` function. Call `reset()` to programmatically close the swipe action.
|
|
122
|
+
|
|
123
|
+
## Example
|
|
124
|
+
|
|
125
|
+
```jsx
|
|
126
|
+
import { SwipeAction, useSwipeActionReset } from 'react-swipe-action'
|
|
127
|
+
import 'react-swipe-action/dist/index.css'
|
|
128
|
+
|
|
129
|
+
const pretendWork = () => new Promise((resolve) => setTimeout(resolve, 1000))
|
|
130
|
+
|
|
131
|
+
const ActionButton = ({ onClick, children }) => {
|
|
132
|
+
const reset = useSwipeActionReset()
|
|
133
|
+
return (
|
|
134
|
+
<button
|
|
135
|
+
onClick={async () => {
|
|
136
|
+
await onClick()
|
|
137
|
+
reset()
|
|
138
|
+
}}
|
|
139
|
+
>
|
|
140
|
+
{children}
|
|
141
|
+
</button>
|
|
142
|
+
)
|
|
143
|
+
}
|
|
16
144
|
|
|
17
145
|
const App = () => {
|
|
18
146
|
return (
|
|
19
147
|
<SwipeAction
|
|
20
|
-
main={(handle) =>
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
148
|
+
main={(handle) => (
|
|
149
|
+
<button
|
|
150
|
+
className="main"
|
|
151
|
+
onClick={() => {
|
|
152
|
+
alert("You've clicked me!")
|
|
153
|
+
}}
|
|
154
|
+
>
|
|
155
|
+
Swipe me
|
|
156
|
+
{handle}
|
|
157
|
+
</button>
|
|
158
|
+
)}
|
|
159
|
+
startAction={{
|
|
160
|
+
content: (
|
|
161
|
+
<ActionButton
|
|
162
|
+
onClick={() => {
|
|
163
|
+
alert('Click left side!')
|
|
164
|
+
}}
|
|
165
|
+
>
|
|
166
|
+
🔖
|
|
167
|
+
</ActionButton>
|
|
168
|
+
),
|
|
169
|
+
background: <div style={{ backgroundColor: 'blue' }} />,
|
|
170
|
+
onLongSwipe: () => {
|
|
171
|
+
alert('Long swipe from left side!')
|
|
172
|
+
},
|
|
173
|
+
}}
|
|
24
174
|
endAction={{
|
|
25
175
|
content: (
|
|
26
|
-
<
|
|
27
|
-
|
|
28
|
-
|
|
176
|
+
<ActionButton
|
|
177
|
+
onClick={async () => {
|
|
178
|
+
await pretendWork()
|
|
179
|
+
alert('Click right side which took some time to process!')
|
|
180
|
+
}}
|
|
29
181
|
>
|
|
30
|
-
|
|
31
|
-
</
|
|
182
|
+
🗑️
|
|
183
|
+
</ActionButton>
|
|
32
184
|
),
|
|
33
|
-
onLongSwipe: () => { alert('Right action') },
|
|
34
185
|
background: <div style={{ backgroundColor: 'red' }} />,
|
|
186
|
+
onLongSwipe: async () => {
|
|
187
|
+
await pretendWork()
|
|
188
|
+
alert('Long swipe from right side which took some time to process!')
|
|
189
|
+
},
|
|
35
190
|
}}
|
|
36
191
|
/>
|
|
37
192
|
)
|
package/dist/SwipeAction.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { FunctionComponent, ReactNode } from 'react';
|
|
2
|
-
type OnLongSwipe = () => void
|
|
2
|
+
type OnLongSwipe = () => void | Promise<void>;
|
|
3
3
|
type Content = ReactNode;
|
|
4
4
|
export type Action = {
|
|
5
5
|
background?: ReactNode;
|
|
@@ -16,4 +16,5 @@ export type SwipeActionProps = {
|
|
|
16
16
|
endAction?: Action;
|
|
17
17
|
};
|
|
18
18
|
export declare const SwipeAction: FunctionComponent<SwipeActionProps>;
|
|
19
|
+
export declare const useSwipeActionReset: () => () => void;
|
|
19
20
|
export {};
|
package/dist/SwipeAction.js
CHANGED
|
@@ -1,10 +1,15 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { __assign } from './_virtual/_tslib.js';
|
|
3
|
-
import {
|
|
4
|
-
import { useState, useCallback, useRef, useMemo } from 'react';
|
|
3
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
4
|
+
import { createContext, useState, useCallback, useRef, useMemo, useContext } from 'react';
|
|
5
5
|
import { useDrag } from 'react-use-drag';
|
|
6
6
|
import styles from './SwipeAction.module.css.js';
|
|
7
7
|
|
|
8
|
+
var context = createContext({
|
|
9
|
+
reset: function () {
|
|
10
|
+
throw new Error("Can't call reset outside SwipeAction component.");
|
|
11
|
+
},
|
|
12
|
+
});
|
|
8
13
|
var SwipeAction = function (_a) {
|
|
9
14
|
var startAction = _a.startAction, endAction = _a.endAction, main = _a.main;
|
|
10
15
|
var _b = useState(0), position = _b[0], setPosition = _b[1];
|
|
@@ -36,7 +41,9 @@ var SwipeAction = function (_a) {
|
|
|
36
41
|
normalizedSwipePosition >
|
|
37
42
|
Math.max(mainWidth / 4, contentWidth) * 1.6) {
|
|
38
43
|
if (isLongSwipeEnabled.current) {
|
|
39
|
-
onLongSwipe()
|
|
44
|
+
Promise.resolve(onLongSwipe()).then(function () {
|
|
45
|
+
setPosition(0);
|
|
46
|
+
});
|
|
40
47
|
isLongSwipeEnabled.current = false;
|
|
41
48
|
}
|
|
42
49
|
return positionSign * mainWidth;
|
|
@@ -72,19 +79,25 @@ var SwipeAction = function (_a) {
|
|
|
72
79
|
var x = useMemo(function () {
|
|
73
80
|
return Math.max(endAction ? Number.NEGATIVE_INFINITY : 0, Math.min(startAction ? Number.POSITIVE_INFINITY : 0, position + positionOffset));
|
|
74
81
|
}, [position, positionOffset, startAction, endAction]);
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
+
var reset = useCallback(function () {
|
|
83
|
+
setPosition(0);
|
|
84
|
+
setPositionOffset(0);
|
|
85
|
+
setIsSwiping(false);
|
|
86
|
+
}, []);
|
|
87
|
+
return (jsx(context.Provider, { value: { reset: reset }, children: jsxs("div", { className: styles.wrapper, children: [startAction && x > 0 && (jsx(Action, { position: "start", content: startAction.content, background: startAction.background, contentRef: startActionContentRef })), endAction && x < 0 && (jsx(Action, { position: "end", content: endAction.content, background: endAction.background, contentRef: endActionContentRef })), jsx("div", { className: styles.main, ref: mainRef, style: {
|
|
88
|
+
'--x': "".concat(x, "px"),
|
|
89
|
+
}, children: main(jsx("div", __assign({ className: styles.handle }, elementProps, { onClick: function (event) {
|
|
90
|
+
if (isSwiping) {
|
|
91
|
+
event.stopPropagation();
|
|
92
|
+
}
|
|
93
|
+
} }))) })] }) }));
|
|
82
94
|
};
|
|
83
95
|
var Action = function (_a) {
|
|
84
96
|
var content = _a.content, background = _a.background, position = _a.position, contentRef = _a.contentRef;
|
|
85
97
|
// @TODO: allow focus by tab key before visible
|
|
86
98
|
return (jsxs("div", { className: "".concat(styles.action, " ").concat(styles["is_position_".concat(position)]), children: [jsx("div", { className: styles.action_background, children: background }), jsx("div", { className: styles.action_content, ref: contentRef, children: content })] }));
|
|
87
99
|
};
|
|
100
|
+
var useSwipeActionReset = function () { return useContext(context).reset; };
|
|
88
101
|
|
|
89
|
-
export { SwipeAction };
|
|
102
|
+
export { SwipeAction, useSwipeActionReset };
|
|
90
103
|
//# sourceMappingURL=SwipeAction.js.map
|
package/dist/SwipeAction.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SwipeAction.js","sources":["../src/SwipeAction.tsx"],"sourcesContent":["'use client'\n\nimport type {\n\tCSSProperties,\n\tFunctionComponent,\n\tReactNode,\n\tRefObject,\n} from 'react'\nimport {
|
|
1
|
+
{"version":3,"file":"SwipeAction.js","sources":["../src/SwipeAction.tsx"],"sourcesContent":["'use client'\n\nimport type {\n\tCSSProperties,\n\tFunctionComponent,\n\tReactNode,\n\tRefObject,\n} from 'react'\nimport {\n\tcreateContext,\n\tuseCallback,\n\tuseContext,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n} from 'react'\nimport { useDrag } from 'react-use-drag'\nimport styles from './SwipeAction.module.css'\n\n// @TODO: add inertia\n// @TODO: animate snapping\n// @TODO: add threshold - maybe to react-use-drag\n\ntype OnLongSwipe = () => void | Promise<void>\ntype Content = ReactNode\n\nexport type Action = {\n\tbackground?: ReactNode\n\tcontent?: Content\n\tonLongSwipe?: OnLongSwipe\n} & (\n\t| {\n\t\t\tcontent: Content\n\t }\n\t| {\n\t\t\tonLongSwipe: OnLongSwipe\n\t }\n)\n\nconst context = createContext({\n\treset: (): void => {\n\t\tthrow new Error(\"Can't call reset outside SwipeAction component.\")\n\t},\n})\n\nexport type SwipeActionProps = {\n\tmain: (handle: ReactNode) => ReactNode\n\tstartAction?: Action\n\tendAction?: Action\n}\n\nexport const SwipeAction: FunctionComponent<SwipeActionProps> = ({\n\tstartAction,\n\tendAction,\n\tmain,\n}) => {\n\tconst [position, setPosition] = useState(0)\n\tconst [positionOffset, setPositionOffset] = useState(0)\n\tconst [isSwiping, setIsSwiping] = useState(false)\n\tconst onRelativePositionChange = useCallback((x: number) => {\n\t\tif (Math.abs(x) > 5) {\n\t\t\tsetIsSwiping(true)\n\t\t}\n\t\tsetPositionOffset(x)\n\t}, [])\n\tconst isLongSwipeEnabled = useRef(true) // Prevents long swipe from being triggered twice in React strict mode\n\tconst onEnd = useCallback(\n\t\t(x: number) => {\n\t\t\tif (x === 0) {\n\t\t\t\tsetIsSwiping(false)\n\t\t\t} else {\n\t\t\t\tsetPosition((position) => {\n\t\t\t\t\tconst newPosition = position + x\n\t\t\t\t\tconst mainWidth = mainRef.current?.offsetWidth ?? 0\n\n\t\t\t\t\tconst handleContent = (\n\t\t\t\t\t\tref: RefObject<HTMLDivElement>,\n\t\t\t\t\t\tposition: Position,\n\t\t\t\t\t\tonLongSwipe: undefined | OnLongSwipe,\n\t\t\t\t\t) => {\n\t\t\t\t\t\tconst contentWidth = ref.current?.offsetWidth\n\t\t\t\t\t\tconst positionSign = position === 'start' ? 1 : -1\n\t\t\t\t\t\tconst normalizedSwipePosition = positionSign * newPosition\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\tonLongSwipe &&\n\t\t\t\t\t\t\tcontentWidth !== undefined &&\n\t\t\t\t\t\t\tnormalizedSwipePosition >\n\t\t\t\t\t\t\t\tMath.max(mainWidth / 4, contentWidth) * 1.6\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tif (isLongSwipeEnabled.current) {\n\t\t\t\t\t\t\t\tPromise.resolve(onLongSwipe()).then(() => {\n\t\t\t\t\t\t\t\t\tsetPosition(0)\n\t\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t\tisLongSwipeEnabled.current = false\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\treturn positionSign * mainWidth\n\t\t\t\t\t\t}\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\tcontentWidth !== 0 &&\n\t\t\t\t\t\t\tcontentWidth !== undefined &&\n\t\t\t\t\t\t\tnormalizedSwipePosition > contentWidth * 0.7\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\treturn positionSign * contentWidth\n\t\t\t\t\t\t}\n\t\t\t\t\t\tif (Math.sign(newPosition) === positionSign) {\n\t\t\t\t\t\t\tsetTimeout(() => {\n\t\t\t\t\t\t\t\tsetIsSwiping(false)\n\t\t\t\t\t\t\t}, 200) // Delay to ignore immediate click\n\t\t\t\t\t\t\treturn 0\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\thandleContent(\n\t\t\t\t\t\t\tstartActionContentRef,\n\t\t\t\t\t\t\t'start',\n\t\t\t\t\t\t\tstartAction?.onLongSwipe,\n\t\t\t\t\t\t) ??\n\t\t\t\t\t\thandleContent(endActionContentRef, 'end', endAction?.onLongSwipe) ??\n\t\t\t\t\t\tnewPosition\n\t\t\t\t\t)\n\t\t\t\t})\n\t\t\t}\n\t\t\tsetPositionOffset(0)\n\t\t},\n\t\t[startAction?.onLongSwipe, endAction?.onLongSwipe],\n\t)\n\tconst onStart = useCallback(() => {\n\t\tisLongSwipeEnabled.current = true\n\t}, [])\n\tconst { elementProps } = useDrag({\n\t\tonStart,\n\t\tonRelativePositionChange,\n\t\tonEnd,\n\t})\n\tconst mainRef = useRef<HTMLDivElement>(null)\n\tconst startActionContentRef = useRef<HTMLDivElement>(null)\n\tconst endActionContentRef = useRef<HTMLDivElement>(null)\n\n\tconst x = useMemo(\n\t\t() =>\n\t\t\tMath.max(\n\t\t\t\tendAction ? Number.NEGATIVE_INFINITY : 0,\n\t\t\t\tMath.min(\n\t\t\t\t\tstartAction ? Number.POSITIVE_INFINITY : 0,\n\t\t\t\t\tposition + positionOffset,\n\t\t\t\t),\n\t\t\t),\n\t\t[position, positionOffset, startAction, endAction],\n\t)\n\n\tconst reset = useCallback(() => {\n\t\tsetPosition(0)\n\t\tsetPositionOffset(0)\n\t\tsetIsSwiping(false)\n\t}, [])\n\n\treturn (\n\t\t<context.Provider value={{ reset }}>\n\t\t\t<div className={styles.wrapper}>\n\t\t\t\t{startAction && x > 0 && (\n\t\t\t\t\t<Action\n\t\t\t\t\t\tposition=\"start\"\n\t\t\t\t\t\tcontent={startAction.content}\n\t\t\t\t\t\tbackground={startAction.background}\n\t\t\t\t\t\tcontentRef={startActionContentRef}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t{endAction && x < 0 && (\n\t\t\t\t\t<Action\n\t\t\t\t\t\tposition=\"end\"\n\t\t\t\t\t\tcontent={endAction.content}\n\t\t\t\t\t\tbackground={endAction.background}\n\t\t\t\t\t\tcontentRef={endActionContentRef}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t<div\n\t\t\t\t\tclassName={styles.main}\n\t\t\t\t\tref={mainRef}\n\t\t\t\t\tstyle={\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t'--x': `${x}px`,\n\t\t\t\t\t\t} as CSSProperties\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t{main(\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclassName={styles.handle}\n\t\t\t\t\t\t\t{...elementProps}\n\t\t\t\t\t\t\tonClick={(event) => {\n\t\t\t\t\t\t\t\tif (isSwiping) {\n\t\t\t\t\t\t\t\t\tevent.stopPropagation()\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>,\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</context.Provider>\n\t)\n}\n\ntype Position = 'start' | 'end'\n\nconst Action: FunctionComponent<{\n\tposition: Position\n\tcontent: ReactNode\n\tbackground: ReactNode\n\tcontentRef: RefObject<HTMLDivElement>\n}> = ({ content, background, position, contentRef }) => {\n\t// @TODO: allow focus by tab key before visible\n\treturn (\n\t\t<div className={`${styles.action} ${styles[`is_position_${position}`]}`}>\n\t\t\t<div className={styles.action_background}>{background}</div>\n\t\t\t<div className={styles.action_content} ref={contentRef}>\n\t\t\t\t{content}\n\t\t\t</div>\n\t\t</div>\n\t)\n}\n\nexport const useSwipeActionReset = () => useContext(context).reset\n"],"names":[],"mappings":";;;;;;;AAuCA;AACC;AACC;;AAED;AAQM;AACN;;;;AAOA;;;;;;;AAOA;AAEE;;;;;;AAIE;;AAGA;;;AAMC;AACA;AACA;AAEC;;AAEC;AAED;;;AAGC;AACA;;;;;AAMD;AACA;;;;AAKA;;AAEA;AACA;;AAEF;AAEA;AASD;;;AAGF;;AAIA;;;AAGA;AACA;AACA;AACA;AACD;AACA;AACA;;AAIE;;;;;;;;;AAyCqB;;;;AAWjB;AAOP;AAIA;;;AAOC;AAQD;AAEO;;"}
|
package/dist/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { SwipeAction } from './SwipeAction.js';
|
|
1
|
+
export { SwipeAction, useSwipeActionReset } from './SwipeAction.js';
|
|
2
2
|
//# sourceMappingURL=index.js.map
|