@native-systems/ui 1.0.5 → 1.0.6

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/index.cjs CHANGED
@@ -112,6 +112,7 @@ const ForwardRef$4 = /*#__PURE__*/ React__namespace.forwardRef(EyeIcon);
112
112
  function InputField({
113
113
  id,
114
114
  label,
115
+ hideLabel = false,
115
116
  register,
116
117
  type,
117
118
  required,
@@ -122,12 +123,14 @@ function InputField({
122
123
  return jsxRuntime.jsxs('div', {
123
124
  className: 'flex flex-col space-y-2',
124
125
  children: [
125
- jsxRuntime.jsx('label', {
126
- htmlFor: id,
127
- className:
128
- 'block ml-1 text-sm font-medium text-gray-700 dark:text-white',
129
- children: label,
130
- }),
126
+ !hideLabel
127
+ ? jsxRuntime.jsx('label', {
128
+ htmlFor: id,
129
+ className:
130
+ 'block ml-1 text-sm font-medium text-gray-700 dark:text-white',
131
+ children: label,
132
+ })
133
+ : null,
131
134
  isPasswordField
132
135
  ? jsxRuntime.jsxs('div', {
133
136
  className: 'relative w-full',
@@ -138,12 +141,12 @@ function InputField({
138
141
  type: isPasswordVisible ? 'text' : 'password',
139
142
  autoComplete: autoCompleteId,
140
143
  placeholder: label,
141
- className: `w-full block py-3 pr-8 pl-3 text-gray-600 bg-white border-none rounded-lg shadow-sm shadow-input appearance-none focus:outline-none focus:ring-primary placeholder-gray-400 sm:text-sm dark:text-black dark:placeholder-gray-500 ${type === 'number' ? 'text-right' : ''}`,
144
+ className: `relative w-full block py-3 pr-10 pl-3 text-sm text-font-950 bg-base-0 border rounded-lg border-base-500/15 appearance-none focus:outline-none focus:ring-primary-500 placeholder-font-400 dark:text-font-0 dark:text-font-100 dark:bg-base-950 dark:placeholder-font-600 ${type === 'number' ? 'text-right' : ''}`,
142
145
  ...register,
143
146
  }),
144
147
  jsxRuntime.jsx('div', {
145
148
  className:
146
- 'absolute top-1/2 right-2 w-5 h-5 -translate-y-1/2 text-text-color-300 hover:cursor-pointer',
149
+ 'size-5 absolute top-1/2 right-2 -translate-y-1/2 text-font-400 transition-colors cursor-pointer hover:text-font-300 dark:text-font-600 dark:hover:text-font-500',
147
150
  children: isPasswordVisible
148
151
  ? jsxRuntime.jsx(ForwardRef$5, {
149
152
  onClick: () => {
@@ -164,14 +167,20 @@ function InputField({
164
167
  type: type,
165
168
  autoComplete: autoCompleteId,
166
169
  placeholder: label,
167
- className: `relative w-full block py-3 pr-10 pl-3 text-gray-600 bg-white border-none rounded-lg shadow-sm shadow-input appearance-none focus:outline-none focus:ring-primary placeholder-gray-400 sm:text-sm dark:text-black dark:placeholder-gray-500 ${type === 'number' ? 'text-right' : ''}`,
170
+ className: `relative w-full block py-3 pr-10 pl-3 text-sm text-font-950 bg-base-0 border rounded-lg border-base-500/15 appearance-none focus:outline-none focus:ring-primary-500 placeholder-font-400 dark:text-font-0 dark:text-font-100 dark:bg-base-950 dark:placeholder-font-600 ${type === 'number' ? 'text-right' : ''}`,
168
171
  ...register,
169
172
  }),
170
173
  ],
171
174
  });
172
175
  }
173
176
 
174
- const SigninForm = ({ mapText, onSubmit, errorMessage, onForgotPassword }) => {
177
+ const SigninForm = ({
178
+ mapText,
179
+ onSubmit,
180
+ errorMessage,
181
+ hideLabels,
182
+ onForgotPassword,
183
+ }) => {
175
184
  const { register, handleSubmit } = reactHookForm.useForm({
176
185
  shouldUseNativeValidation: true,
177
186
  });
@@ -183,38 +192,38 @@ const SigninForm = ({ mapText, onSubmit, errorMessage, onForgotPassword }) => {
183
192
  id: 'email',
184
193
  label: mapText('auth:form.email.label'),
185
194
  type: 'text',
195
+ hideLabel: hideLabels,
186
196
  required: true,
187
197
  autoCompleteId: 'email',
188
198
  register: register('email', {
189
199
  required: mapText('form.email.validations.required'),
190
200
  }),
191
201
  }),
192
- jsxRuntime.jsx('div', {
193
- className: 'relative',
194
- children: jsxRuntime.jsx(InputField, {
195
- id: 'password',
196
- label: mapText('auth:form.password.label'),
197
- type: 'password',
198
- required: true,
199
- autoCompleteId: 'password',
200
- register: register('password', {
201
- required: mapText('form.password.validations.required'),
202
- }),
203
- isPasswordField: true,
202
+ jsxRuntime.jsx(InputField, {
203
+ id: 'password',
204
+ label: mapText('auth:form.password.label'),
205
+ type: 'password',
206
+ hideLabel: hideLabels,
207
+ required: true,
208
+ autoCompleteId: 'password',
209
+ register: register('password', {
210
+ required: mapText('form.password.validations.required'),
204
211
  }),
212
+ isPasswordField: true,
205
213
  }),
206
214
  jsxRuntime.jsxs('div', {
207
215
  children: [
208
- jsxRuntime.jsx('button', {
216
+ jsxRuntime.jsx('input', {
209
217
  type: 'submit',
218
+ value: mapText('auth:form.submit.text'),
210
219
  className:
211
- 'w-full flex justify-center px-4 py-3 text-sm font-medium text-white bg-[length:200%_200%] bg-primary-shimmer border-none border rounded-lg shadow-sm transition-transform animate-shimmerdelayed hover:scale-105 focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2',
212
- children: mapText('auth:form.submit.text'),
213
- }),
214
- jsxRuntime.jsx('span', {
215
- className: 'block mt-2 text-sm font-medium text-red-500',
216
- children: errorMessage,
220
+ 'w-full flex justify-center px-4 py-3 text-sm text-white bg-[length:200%_200%] bg-primary-shimmer border-none border rounded-lg shadow-sm transition-transform animate-shimmerdelayed cursor-pointer hover:scale-105 focus:outline-none focus:ring-1 focus:ring-base-600/20 focus:ring-offset-0 dark:focus:ring-base-500',
217
221
  }),
222
+ errorMessage &&
223
+ jsxRuntime.jsx('span', {
224
+ className: 'block mt-2.5 text-sm text-red-600',
225
+ children: errorMessage,
226
+ }),
218
227
  ],
219
228
  }),
220
229
  jsxRuntime.jsx('div', {
@@ -238,42 +247,45 @@ const SigninForm = ({ mapText, onSubmit, errorMessage, onForgotPassword }) => {
238
247
  });
239
248
  };
240
249
 
241
- function SigninLayout({ mapText, onSubmit, errorMessage, onForgotPassword }) {
242
- return jsxRuntime.jsxs('div', {
243
- className: 'h-full flex flex-col sm:flex-row',
244
- children: [
245
- jsxRuntime.jsx('div', {
246
- className:
247
- "relative w-auto h-full bg-[url('/assets/signup_cover.png')] bg-no-repeat bg-center bg-cover sm:flex-1",
248
- }),
249
- jsxRuntime.jsx('div', {
250
+ function SigninLayout({
251
+ mapText,
252
+ onSubmit,
253
+ errorMessage,
254
+ logoSrc,
255
+ hideLabels,
256
+ onForgotPassword,
257
+ }) {
258
+ return jsxRuntime.jsx('div', {
259
+ className:
260
+ 'sign-in-layout-container size-full z-10 relative flex justify-end items-center p-5 sm:p-10',
261
+ children: jsxRuntime.jsx('div', {
262
+ className: 'w-full flex flex-row justify-center items-stretch max-w-xl',
263
+ children: jsxRuntime.jsxs('div', {
250
264
  className:
251
- 'flex-1 w-auto flex flex-col lg:flex-none max-sm:absolute max-sm:top-1/2 max-sm:left-1/2 max-sm:w-full max-sm:-translate-x-1/2 max-sm:-translate-y-1/2 max-sm:max-w-96 dark:sm:bg-base-900',
252
- children: jsxRuntime.jsx('div', {
253
- className:
254
- 'flex-1 flex flex-col p-4 sm:justify-center sm:px-6 sm:py-12 lg:px-20 xl:px-24 2xl:px-40 max-sm:px-5 max-sm:mx-5 max-sm:bg-white/80 max-sm:rounded-lg dark:max-sm:bg-base-900/80',
255
- children: jsxRuntime.jsxs('div', {
256
- className: 'w-full mx-auto lg:w-96 max-w-xl',
257
- children: [
258
- jsxRuntime.jsx('h2', {
259
- className:
260
- 'mt-6 text-3xl font-extrabold text-gray-900 select-none dark:text-white',
261
- children: mapText('auth:page.title'),
262
- }),
263
- jsxRuntime.jsx('div', {
264
- className: 'mt-10',
265
- children: jsxRuntime.jsx(SigninForm, {
266
- mapText: mapText,
267
- onSubmit: (values) => onSubmit(values.email, values.password),
268
- errorMessage: errorMessage,
269
- onForgotPassword: onForgotPassword,
270
- }),
271
- }),
272
- ],
265
+ 'sign-in-dialog w-full p-5 bg-base-0/70 rounded-lg sm:p-10 dark:bg-base-950/70',
266
+ children: [
267
+ jsxRuntime.jsx('img', {
268
+ className: 'w-auto h-10 mb-20 object-cover',
269
+ src: logoSrc,
270
+ alt: '',
273
271
  }),
274
- }),
272
+ jsxRuntime.jsx('h2', {
273
+ className: '',
274
+ children: mapText('auth:form.submit.text'),
275
+ }),
276
+ jsxRuntime.jsx('div', {
277
+ className: 'mt-5',
278
+ children: jsxRuntime.jsx(SigninForm, {
279
+ mapText: mapText,
280
+ onSubmit: (values) => onSubmit(values.email, values.password),
281
+ errorMessage: errorMessage,
282
+ hideLabels: hideLabels,
283
+ onForgotPassword: onForgotPassword,
284
+ }),
285
+ }),
286
+ ],
275
287
  }),
276
- ],
288
+ }),
277
289
  });
278
290
  }
279
291
 
package/dist/index.d.ts CHANGED
@@ -2,13 +2,14 @@ declare module "@native-systems/ui" {
2
2
  type InputFieldProps = {
3
3
  id: string;
4
4
  label: string;
5
+ hideLabel?: boolean;
5
6
  register: any;
6
7
  type: string;
7
8
  required: boolean;
8
9
  autoCompleteId?: string;
9
10
  isPasswordField?: boolean;
10
11
  };
11
- export function InputField({ id, label, register, type, required, autoCompleteId, isPasswordField, }: InputFieldProps): import("react/jsx-runtime").JSX.Element;
12
+ export function InputField({ id, label, hideLabel, register, type, required, autoCompleteId, isPasswordField, }: InputFieldProps): import("react/jsx-runtime").JSX.Element;
12
13
  }
13
14
 
14
15
  declare module "@native-systems/ui" {
@@ -20,9 +21,10 @@ declare module "@native-systems/ui" {
20
21
  mapText: (key: string) => string;
21
22
  onSubmit: (values: any) => void;
22
23
  errorMessage: string | null;
24
+ hideLabels?: boolean;
23
25
  onForgotPassword?: () => void;
24
26
  };
25
- export const SigninForm: ({ mapText, onSubmit, errorMessage, onForgotPassword }: ISigninFormProps) => import("react/jsx-runtime").JSX.Element;
27
+ export const SigninForm: ({ mapText, onSubmit, errorMessage, hideLabels, onForgotPassword }: ISigninFormProps) => import("react/jsx-runtime").JSX.Element;
26
28
  }
27
29
 
28
30
  declare module "@native-systems/ui" {
@@ -34,9 +36,11 @@ declare module "@native-systems/ui" {
34
36
  mapText: (key: string) => string;
35
37
  onSubmit: (email: string, password: string) => void;
36
38
  errorMessage: string | null;
39
+ logoSrc?: string;
40
+ hideLabels?: boolean;
37
41
  onForgotPassword?: () => {};
38
42
  }
39
- export function SigninLayout({ mapText, onSubmit, errorMessage, onForgotPassword, }: SigninLayoutProps): import("react/jsx-runtime").JSX.Element;
43
+ export function SigninLayout({ mapText, onSubmit, errorMessage, logoSrc, hideLabels, onForgotPassword, }: SigninLayoutProps): import("react/jsx-runtime").JSX.Element;
40
44
  }
41
45
 
42
46
  declare module "@native-systems/ui" {
@@ -147,10 +151,11 @@ declare module "@native-systems/ui" {
147
151
  SaveButton: typeof Util.SaveButton;
148
152
  Textarea: typeof Util.Textarea;
149
153
  SigninLayout: typeof UI.SigninLayout;
150
- SigninForm: ({ mapText, onSubmit, errorMessage, onForgotPassword }: {
154
+ SigninForm: ({ mapText, onSubmit, errorMessage, hideLabels, onForgotPassword }: {
151
155
  mapText: (key: string) => string;
152
156
  onSubmit: (values: any) => void;
153
157
  errorMessage: string | null;
158
+ hideLabels?: boolean;
154
159
  onForgotPassword?: () => void;
155
160
  }) => import("react/jsx-runtime").JSX.Element;
156
161
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["src/components/util/views/Input.tsx","src/components/auth/widgets/SigninForm.tsx","src/components/auth/layout/SigninLayout.tsx","src/components/util/layout/MainContentFrame.tsx","src/components/util/widgets/Pagination.tsx","src/components/util/views/CancelButton.tsx","src/components/util/views/ErrorDisplay.tsx","src/components/util/views/HowToCloseText.tsx","src/components/util/views/LoadingSpinner.tsx","src/components/util/views/SaveButton.tsx","src/components/util/views/Textarea.tsx","src/context/TemplateParserContext.tsx","src/index.ts"],"names":[],"mappings":"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","file":"index.d.ts","sourceRoot":".."}
1
+ {"version":3,"sources":["src/components/util/views/Input.tsx","src/components/auth/widgets/SigninForm.tsx","src/components/auth/layout/SigninLayout.tsx","src/components/util/layout/MainContentFrame.tsx","src/components/util/widgets/Pagination.tsx","src/components/util/views/CancelButton.tsx","src/components/util/views/ErrorDisplay.tsx","src/components/util/views/HowToCloseText.tsx","src/components/util/views/LoadingSpinner.tsx","src/components/util/views/SaveButton.tsx","src/components/util/views/Textarea.tsx","src/context/TemplateParserContext.tsx","src/index.ts"],"names":[],"mappings":"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","file":"index.d.ts","sourceRoot":".."}
package/dist/index.esm.js CHANGED
@@ -89,6 +89,7 @@ const ForwardRef$4 = /*#__PURE__*/ React.forwardRef(EyeIcon);
89
89
  function InputField({
90
90
  id,
91
91
  label,
92
+ hideLabel = false,
92
93
  register,
93
94
  type,
94
95
  required,
@@ -99,12 +100,14 @@ function InputField({
99
100
  return jsxs('div', {
100
101
  className: 'flex flex-col space-y-2',
101
102
  children: [
102
- jsx('label', {
103
- htmlFor: id,
104
- className:
105
- 'block ml-1 text-sm font-medium text-gray-700 dark:text-white',
106
- children: label,
107
- }),
103
+ !hideLabel
104
+ ? jsx('label', {
105
+ htmlFor: id,
106
+ className:
107
+ 'block ml-1 text-sm font-medium text-gray-700 dark:text-white',
108
+ children: label,
109
+ })
110
+ : null,
108
111
  isPasswordField
109
112
  ? jsxs('div', {
110
113
  className: 'relative w-full',
@@ -115,12 +118,12 @@ function InputField({
115
118
  type: isPasswordVisible ? 'text' : 'password',
116
119
  autoComplete: autoCompleteId,
117
120
  placeholder: label,
118
- className: `w-full block py-3 pr-8 pl-3 text-gray-600 bg-white border-none rounded-lg shadow-sm shadow-input appearance-none focus:outline-none focus:ring-primary placeholder-gray-400 sm:text-sm dark:text-black dark:placeholder-gray-500 ${type === 'number' ? 'text-right' : ''}`,
121
+ className: `relative w-full block py-3 pr-10 pl-3 text-sm text-font-950 bg-base-0 border rounded-lg border-base-500/15 appearance-none focus:outline-none focus:ring-primary-500 placeholder-font-400 dark:text-font-0 dark:text-font-100 dark:bg-base-950 dark:placeholder-font-600 ${type === 'number' ? 'text-right' : ''}`,
119
122
  ...register,
120
123
  }),
121
124
  jsx('div', {
122
125
  className:
123
- 'absolute top-1/2 right-2 w-5 h-5 -translate-y-1/2 text-text-color-300 hover:cursor-pointer',
126
+ 'size-5 absolute top-1/2 right-2 -translate-y-1/2 text-font-400 transition-colors cursor-pointer hover:text-font-300 dark:text-font-600 dark:hover:text-font-500',
124
127
  children: isPasswordVisible
125
128
  ? jsx(ForwardRef$5, {
126
129
  onClick: () => {
@@ -141,14 +144,20 @@ function InputField({
141
144
  type: type,
142
145
  autoComplete: autoCompleteId,
143
146
  placeholder: label,
144
- className: `relative w-full block py-3 pr-10 pl-3 text-gray-600 bg-white border-none rounded-lg shadow-sm shadow-input appearance-none focus:outline-none focus:ring-primary placeholder-gray-400 sm:text-sm dark:text-black dark:placeholder-gray-500 ${type === 'number' ? 'text-right' : ''}`,
147
+ className: `relative w-full block py-3 pr-10 pl-3 text-sm text-font-950 bg-base-0 border rounded-lg border-base-500/15 appearance-none focus:outline-none focus:ring-primary-500 placeholder-font-400 dark:text-font-0 dark:text-font-100 dark:bg-base-950 dark:placeholder-font-600 ${type === 'number' ? 'text-right' : ''}`,
145
148
  ...register,
146
149
  }),
147
150
  ],
148
151
  });
149
152
  }
150
153
 
151
- const SigninForm = ({ mapText, onSubmit, errorMessage, onForgotPassword }) => {
154
+ const SigninForm = ({
155
+ mapText,
156
+ onSubmit,
157
+ errorMessage,
158
+ hideLabels,
159
+ onForgotPassword,
160
+ }) => {
152
161
  const { register, handleSubmit } = useForm({
153
162
  shouldUseNativeValidation: true,
154
163
  });
@@ -160,38 +169,38 @@ const SigninForm = ({ mapText, onSubmit, errorMessage, onForgotPassword }) => {
160
169
  id: 'email',
161
170
  label: mapText('auth:form.email.label'),
162
171
  type: 'text',
172
+ hideLabel: hideLabels,
163
173
  required: true,
164
174
  autoCompleteId: 'email',
165
175
  register: register('email', {
166
176
  required: mapText('form.email.validations.required'),
167
177
  }),
168
178
  }),
169
- jsx('div', {
170
- className: 'relative',
171
- children: jsx(InputField, {
172
- id: 'password',
173
- label: mapText('auth:form.password.label'),
174
- type: 'password',
175
- required: true,
176
- autoCompleteId: 'password',
177
- register: register('password', {
178
- required: mapText('form.password.validations.required'),
179
- }),
180
- isPasswordField: true,
179
+ jsx(InputField, {
180
+ id: 'password',
181
+ label: mapText('auth:form.password.label'),
182
+ type: 'password',
183
+ hideLabel: hideLabels,
184
+ required: true,
185
+ autoCompleteId: 'password',
186
+ register: register('password', {
187
+ required: mapText('form.password.validations.required'),
181
188
  }),
189
+ isPasswordField: true,
182
190
  }),
183
191
  jsxs('div', {
184
192
  children: [
185
- jsx('button', {
193
+ jsx('input', {
186
194
  type: 'submit',
195
+ value: mapText('auth:form.submit.text'),
187
196
  className:
188
- 'w-full flex justify-center px-4 py-3 text-sm font-medium text-white bg-[length:200%_200%] bg-primary-shimmer border-none border rounded-lg shadow-sm transition-transform animate-shimmerdelayed hover:scale-105 focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2',
189
- children: mapText('auth:form.submit.text'),
190
- }),
191
- jsx('span', {
192
- className: 'block mt-2 text-sm font-medium text-red-500',
193
- children: errorMessage,
197
+ 'w-full flex justify-center px-4 py-3 text-sm text-white bg-[length:200%_200%] bg-primary-shimmer border-none border rounded-lg shadow-sm transition-transform animate-shimmerdelayed cursor-pointer hover:scale-105 focus:outline-none focus:ring-1 focus:ring-base-600/20 focus:ring-offset-0 dark:focus:ring-base-500',
194
198
  }),
199
+ errorMessage &&
200
+ jsx('span', {
201
+ className: 'block mt-2.5 text-sm text-red-600',
202
+ children: errorMessage,
203
+ }),
195
204
  ],
196
205
  }),
197
206
  jsx('div', {
@@ -215,42 +224,45 @@ const SigninForm = ({ mapText, onSubmit, errorMessage, onForgotPassword }) => {
215
224
  });
216
225
  };
217
226
 
218
- function SigninLayout({ mapText, onSubmit, errorMessage, onForgotPassword }) {
219
- return jsxs('div', {
220
- className: 'h-full flex flex-col sm:flex-row',
221
- children: [
222
- jsx('div', {
223
- className:
224
- "relative w-auto h-full bg-[url('/assets/signup_cover.png')] bg-no-repeat bg-center bg-cover sm:flex-1",
225
- }),
226
- jsx('div', {
227
+ function SigninLayout({
228
+ mapText,
229
+ onSubmit,
230
+ errorMessage,
231
+ logoSrc,
232
+ hideLabels,
233
+ onForgotPassword,
234
+ }) {
235
+ return jsx('div', {
236
+ className:
237
+ 'sign-in-layout-container size-full z-10 relative flex justify-end items-center p-5 sm:p-10',
238
+ children: jsx('div', {
239
+ className: 'w-full flex flex-row justify-center items-stretch max-w-xl',
240
+ children: jsxs('div', {
227
241
  className:
228
- 'flex-1 w-auto flex flex-col lg:flex-none max-sm:absolute max-sm:top-1/2 max-sm:left-1/2 max-sm:w-full max-sm:-translate-x-1/2 max-sm:-translate-y-1/2 max-sm:max-w-96 dark:sm:bg-base-900',
229
- children: jsx('div', {
230
- className:
231
- 'flex-1 flex flex-col p-4 sm:justify-center sm:px-6 sm:py-12 lg:px-20 xl:px-24 2xl:px-40 max-sm:px-5 max-sm:mx-5 max-sm:bg-white/80 max-sm:rounded-lg dark:max-sm:bg-base-900/80',
232
- children: jsxs('div', {
233
- className: 'w-full mx-auto lg:w-96 max-w-xl',
234
- children: [
235
- jsx('h2', {
236
- className:
237
- 'mt-6 text-3xl font-extrabold text-gray-900 select-none dark:text-white',
238
- children: mapText('auth:page.title'),
239
- }),
240
- jsx('div', {
241
- className: 'mt-10',
242
- children: jsx(SigninForm, {
243
- mapText: mapText,
244
- onSubmit: (values) => onSubmit(values.email, values.password),
245
- errorMessage: errorMessage,
246
- onForgotPassword: onForgotPassword,
247
- }),
248
- }),
249
- ],
242
+ 'sign-in-dialog w-full p-5 bg-base-0/70 rounded-lg sm:p-10 dark:bg-base-950/70',
243
+ children: [
244
+ jsx('img', {
245
+ className: 'w-auto h-10 mb-20 object-cover',
246
+ src: logoSrc,
247
+ alt: '',
250
248
  }),
251
- }),
249
+ jsx('h2', {
250
+ className: '',
251
+ children: mapText('auth:form.submit.text'),
252
+ }),
253
+ jsx('div', {
254
+ className: 'mt-5',
255
+ children: jsx(SigninForm, {
256
+ mapText: mapText,
257
+ onSubmit: (values) => onSubmit(values.email, values.password),
258
+ errorMessage: errorMessage,
259
+ hideLabels: hideLabels,
260
+ onForgotPassword: onForgotPassword,
261
+ }),
262
+ }),
263
+ ],
252
264
  }),
253
- ],
265
+ }),
254
266
  });
255
267
  }
256
268
 
package/package.json CHANGED
@@ -10,7 +10,7 @@
10
10
  "publishConfig": {
11
11
  "access": "public"
12
12
  },
13
- "version": "1.0.5",
13
+ "version": "1.0.6",
14
14
  "license": "MIT",
15
15
  "private": false,
16
16
  "engines": {