aport-tools 4.3.6 → 4.4.0

Sign up to get free protection for your applications and to get access to all the features.
@@ -7,9 +7,16 @@ interface FormContextProps {
7
7
  handleSubmit: () => void;
8
8
  }
9
9
  export declare const useFormContext: () => FormContextProps;
10
+ interface StepperProps {
11
+ steps: string[];
12
+ presseable?: boolean;
13
+ onPress?: (stepIndex: number) => void;
14
+ step: number;
15
+ }
10
16
  interface FormProps {
11
17
  children: ReactNode;
12
18
  onSubmit: (values: Record<string, any>) => Promise<Record<string, string[]>>;
19
+ stepper?: StepperProps;
13
20
  }
14
21
  export declare const Form: React.FC<FormProps>;
15
22
  export {};
@@ -0,0 +1,9 @@
1
+ import React from "react";
2
+ interface StepperProps {
3
+ steps: string[];
4
+ currentStep: number;
5
+ presseable?: boolean;
6
+ onPress?: (stepIndex: number) => void;
7
+ }
8
+ declare const Stepper: React.FC<StepperProps>;
9
+ export default Stepper;
package/dist/index.esm.js CHANGED
@@ -1,6 +1,6 @@
1
- /*! aport-tools v4.3.6 | ISC */
1
+ /*! aport-tools v4.4.0 | ISC */
2
2
  import React, { useContext, useState, createContext, useCallback, useMemo } from 'react';
3
- import { StyleSheet, Text as Text$1, View, TextInput, TouchableOpacity, Modal, Pressable, FlatList, Keyboard, Platform, Image, Alert, ActivityIndicator } from 'react-native';
3
+ import { StyleSheet, View, TouchableOpacity, Text as Text$1, TextInput, Modal, Pressable, FlatList, Keyboard, Platform, Image, Alert, ActivityIndicator } from 'react-native';
4
4
  import { ThemeContext } from 'aport-themes';
5
5
  import * as ImagePicker from 'expo-image-picker';
6
6
 
@@ -97,6 +97,66 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
97
97
  return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
98
98
  };
99
99
 
100
+ var Stepper = function Stepper(_a) {
101
+ var steps = _a.steps,
102
+ currentStep = _a.currentStep,
103
+ _b = _a.presseable,
104
+ presseable = _b === void 0 ? false : _b,
105
+ _onPress = _a.onPress;
106
+ return /*#__PURE__*/React.createElement(View, {
107
+ style: styles$9.container
108
+ }, steps.map(function (label, index) {
109
+ return /*#__PURE__*/React.createElement(TouchableOpacity, {
110
+ key: index,
111
+ style: [styles$9.stepContainer, index <= currentStep ? styles$9.activeStep : styles$9.inactiveStep],
112
+ disabled: !presseable,
113
+ onPress: function onPress() {
114
+ return _onPress && _onPress(index);
115
+ }
116
+ }, /*#__PURE__*/React.createElement(View, {
117
+ style: styles$9.stepCircle
118
+ }, /*#__PURE__*/React.createElement(Text$1, {
119
+ style: styles$9.stepLabel
120
+ }, index + 1)), /*#__PURE__*/React.createElement(Text$1, {
121
+ style: styles$9.stepText
122
+ }, label));
123
+ }));
124
+ };
125
+ var styles$9 = StyleSheet.create({
126
+ container: {
127
+ flexDirection: "row",
128
+ alignItems: "center",
129
+ justifyContent: "space-between",
130
+ marginBottom: 16
131
+ },
132
+ stepContainer: {
133
+ alignItems: "center",
134
+ flex: 1
135
+ },
136
+ stepCircle: {
137
+ width: 30,
138
+ height: 30,
139
+ borderRadius: 15,
140
+ alignItems: "center",
141
+ justifyContent: "center",
142
+ marginBottom: 4
143
+ },
144
+ activeStep: {
145
+ backgroundColor: "#3498db"
146
+ },
147
+ inactiveStep: {
148
+ backgroundColor: "#aaaaaa"
149
+ },
150
+ stepLabel: {
151
+ color: "#ffffff",
152
+ fontWeight: "bold"
153
+ },
154
+ stepText: {
155
+ fontSize: 12,
156
+ textAlign: "center"
157
+ }
158
+ });
159
+
100
160
  // src/forms/FormContext.tsx
101
161
  var FormContext = /*#__PURE__*/createContext(undefined);
102
162
  var useFormContext = function useFormContext() {
@@ -108,7 +168,8 @@ var useFormContext = function useFormContext() {
108
168
  };
109
169
  var Form = function Form(_a) {
110
170
  var children = _a.children,
111
- onSubmit = _a.onSubmit;
171
+ onSubmit = _a.onSubmit,
172
+ stepper = _a.stepper;
112
173
  var _b = useState({}),
113
174
  formValues = _b[0],
114
175
  setFormValues = _b[1];
@@ -149,7 +210,12 @@ var Form = function Form(_a) {
149
210
  setErrors: setErrors,
150
211
  handleSubmit: handleSubmit
151
212
  }
152
- }, children);
213
+ }, stepper && (/*#__PURE__*/React.createElement(Stepper, {
214
+ steps: stepper.steps,
215
+ currentStep: stepper.step,
216
+ presseable: stepper.presseable,
217
+ onPress: stepper.onPress
218
+ })), children);
153
219
  };
154
220
 
155
221
  // src/fonts/Text.tsx