wini-web-components 2.0.4 → 2.0.5

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.
Files changed (5) hide show
  1. package/dist/form/login/view.d.ts +34 -0
  2. package/dist/form/login/view.js +51 -0
  3. package/dist/index.d.ts +2 -1
  4. package/dist/index.js +1 -1
  5. package/package.json +1 -1
package/dist/form/login/view.d.ts ADDED
@@ -0,0 +1,34 @@
1
+ import React from 'react';
2
+ import { FieldValues, SubmitHandler } from 'react-hook-form';
3
+ interface Props {
4
+ logo: React.ReactNode | string;
5
+ formData: {
6
+ "username": {
7
+ label: string;
8
+ name: string;
9
+ prefix?: React.ReactNode;
10
+ onValidate?: React.FocusEventHandler<HTMLInputElement>;
11
+ maxLength?: number;
12
+ };
13
+ "password": {
14
+ label: string;
15
+ name: string;
16
+ prefix?: React.ReactNode;
17
+ onValidate?: React.FocusEventHandler<HTMLInputElement>;
18
+ maxLength?: number;
19
+ };
20
+ };
21
+ onSubmit?: SubmitHandler<FieldValues>;
22
+ title?: string;
23
+ orText?: string;
24
+ buttonLoginLabel?: string;
25
+ loginWithGoogle?: React.MouseEventHandler<HTMLButtonElement>;
26
+ loginWithFacebook: React.MouseEventHandler<HTMLButtonElement>;
27
+ onRegister?: React.MouseEventHandler<HTMLDivElement>;
28
+ registerPrefixText?: string;
29
+ registerText?: string;
30
+ forgotPasswordText?: string;
31
+ onForgotPassword?: React.MouseEventHandler<HTMLDivElement>;
32
+ }
33
+ export declare function WLoginView(props: Props): React.JSX.Element;
34
+ export {};
package/dist/form/login/view.js ADDED
@@ -0,0 +1,51 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.WLoginView = void 0;
7
+ var react_1 = __importDefault(require("react"));
8
+ var index_1 = require("../../index");
9
+ var view_module_css_1 = __importDefault(require("./view.module.css"));
10
+ var react_hook_form_1 = require("react-hook-form");
11
+ var react_2 = require("react");
12
+ function WLoginView(props) {
13
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
14
+ var methods = (0, react_hook_form_1.useForm)({ shouldFocusError: false });
15
+ var _o = (0, react_2.useState)(false), isShowPass = _o[0], setShowPass = _o[1];
16
+ return react_1.default.createElement("div", { className: "col login-view-container ".concat(view_module_css_1.default['login-view-container']) },
17
+ typeof props.logo === "string" ? react_1.default.createElement("img", { alt: 'logo', src: props.logo, height: "36rem" }) : props.logo,
18
+ react_1.default.createElement("div", { className: "col login-view-form-container ".concat(view_module_css_1.default['login-view-form-container']) },
19
+ react_1.default.createElement(index_1.Text, { className: 'heading-4' }, (_a = props.title) !== null && _a !== void 0 ? _a : "Log in to Wini"),
20
+ react_1.default.createElement("div", { className: 'col' },
21
+ react_1.default.createElement("div", { className: 'col', style: { gap: "0.8rem" } },
22
+ react_1.default.createElement(index_1.Text, { className: 'label-3' }, "Email"),
23
+ react_1.default.createElement(index_1.TextField, { className: "placeholder-2", placeholder: props.formData.username.label, style: { height: "4.8rem" }, prefix: props.formData.username.prefix, name: props.formData.username.name, register: methods.register(props.formData.username.name, { onBlur: props.formData.username.onValidate }), onComplete: function (ev) { ev.target.blur(); }, helperText: (_c = (_b = methods.formState.errors) === null || _b === void 0 ? void 0 : _b[props.formData.username.name]) === null || _c === void 0 ? void 0 : _c.message })),
24
+ react_1.default.createElement("div", { className: 'col', style: { gap: "0.8rem" } },
25
+ react_1.default.createElement(index_1.Text, { className: 'label-3' }, "Email"),
26
+ react_1.default.createElement(index_1.TextField, { className: "placeholder-2", placeholder: props.formData.password.label, style: { height: "4.8rem" }, prefix: props.formData.password.prefix, suffix: react_1.default.createElement("button", { type: 'button', onClick: function () { setShowPass(!isShowPass); } },
27
+ react_1.default.createElement(index_1.Winicon, { src: "outline/user interface/".concat(isShowPass ? "view" : "hide"), size: "1.6rem" })), name: props.formData.password.name, type: isShowPass ? "text" : "password", register: methods.register(props.formData.password.name, { onBlur: props.formData.password.onValidate }), onComplete: function (ev) {
28
+ var _a;
29
+ if ((_a = methods.watch(props.formData.password.name)) === null || _a === void 0 ? void 0 : _a.length) {
30
+ ev.target.blur();
31
+ if (!props.formData.password.onValidate && props.onSubmit)
32
+ props.onSubmit(methods.getValues());
33
+ }
34
+ else
35
+ ev.target.blur();
36
+ }, helperText: (_e = (_d = methods.formState.errors) === null || _d === void 0 ? void 0 : _d[props.formData.password.name]) === null || _e === void 0 ? void 0 : _e.message })),
37
+ react_1.default.createElement(index_1.Text, { className: "button-text-3 ".concat(view_module_css_1.default['forgot-password-btn']), onClick: props.onForgotPassword }, (_f = props.forgotPasswordText) !== null && _f !== void 0 ? _f : "Forgot your password?"),
38
+ react_1.default.createElement("div", { className: 'col', style: { gap: "1.6rem" } },
39
+ react_1.default.createElement(index_1.Button, { disabled: ((_g = methods.watch(props.formData.username.name)) === null || _g === void 0 ? void 0 : _g.length) && ((_h = methods.watch(props.formData.password.name)) === null || _h === void 0 ? void 0 : _h.length) ? false : true, className: "button-text-1 ".concat(view_module_css_1.default['login-btn']), onClick: props.onSubmit && methods.handleSubmit(props.onSubmit), label: (_j = props.buttonLoginLabel) !== null && _j !== void 0 ? _j : "Log In" }),
40
+ react_1.default.createElement("div", { className: 'row', style: { justifyContent: "center", gap: "0.4rem" } },
41
+ react_1.default.createElement(index_1.Text, { className: 'label-4' }, (_k = props.registerPrefixText) !== null && _k !== void 0 ? _k : "Don't have an account?"),
42
+ react_1.default.createElement(index_1.Text, { className: "button-text-3 ".concat(view_module_css_1.default['register-btn']), onClick: props.onRegister }, (_l = props.registerText) !== null && _l !== void 0 ? _l : "Sign up for Wini"))),
43
+ react_1.default.createElement("div", { className: "row ".concat(view_module_css_1.default['or-spacing']) },
44
+ react_1.default.createElement("div", null),
45
+ react_1.default.createElement(index_1.Text, { className: "label-4" }, (_m = props.orText) !== null && _m !== void 0 ? _m : "Or"),
46
+ react_1.default.createElement("div", null)),
47
+ react_1.default.createElement("div", { className: "row ".concat(view_module_css_1.default['login-social-media']) },
48
+ react_1.default.createElement(index_1.Button, { className: "label-1", onClick: props.loginWithGoogle, prefix: react_1.default.createElement(index_1.Winicon, { src: 'color/social media/google', size: "2rem" }), label: "Google" }),
49
+ react_1.default.createElement(index_1.Button, { className: "label-1", onClick: props.loginWithFacebook, prefix: react_1.default.createElement(index_1.Winicon, { src: 'color/social media/logo-facebook', size: "2rem" }), label: "Facebook" })))));
50
+ }
51
+ exports.WLoginView = WLoginView;
package/dist/index.d.ts CHANGED
@@ -27,5 +27,6 @@ import { ToastContainer } from 'react-toastify';
27
27
  import { Button } from './component/button/button';
28
28
  import { Tag } from './component/tag/tag';
29
29
  import { Winicon } from './component/wini-icon/winicon';
30
- export { Calendar, CalendarType, ComponentStatus, getStatusIcon, Checkbox, Select1, Switch, Popup, showPopup, closePopup, Dialog, showDialog, DialogAlignment, DatePicker, SelectMultiple, ProgressBar, Text, Pagination, Table, TbCell, TbHeader, TbBody, TbRow, CellAlignItems, TextField, RadioButton, TextArea, ImportFile, ToastMessage, InfiniteScroll, Rating, ProgressCircle, CustomSlider, ToastContainer, Button, Tag, Winicon };
30
+ import { WLoginView } from './form/login/view';
31
+ export { Calendar, CalendarType, ComponentStatus, getStatusIcon, Checkbox, Select1, Switch, Popup, showPopup, closePopup, Dialog, showDialog, DialogAlignment, DatePicker, SelectMultiple, ProgressBar, Text, Pagination, Table, TbCell, TbHeader, TbBody, TbRow, CellAlignItems, TextField, RadioButton, TextArea, ImportFile, ToastMessage, InfiniteScroll, Rating, ProgressCircle, CustomSlider, ToastContainer, Button, Tag, Winicon, WLoginView };
31
32
  export type { OptionsItem };