phx-react 1.3.14 → 1.3.15

package/dist/cjs/components/Input/Textarea.d.ts

@@ -0,0 +1,8 @@
+import React, { TextareaHTMLAttributes } from 'react';
+import { UseFormRegisterReturn } from 'react-hook-form';
+export interface TextAreaProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {
+    register?: UseFormRegisterReturn;
+    error?: boolean;
+    props?: any;
+}
+export declare const Textarea: React.FC<TextAreaProps>;

package/dist/cjs/components/Input/Textarea.js

@@ -0,0 +1,12 @@
+"use strict";
+exports.__esModule = true;
+exports.Textarea = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var types_1 = require("../types");
+var Textarea = function (_a) {
+    var register = _a.register, error = _a.error, props = _a.props;
+    return (react_1["default"].createElement("textarea", tslib_1.__assign({}, props, register, { className: (0, types_1.classNames)('mt-1 font-light block w-full rounded-lg border border-gray-500 px-3 py-1.5 shadow-sm focus:outline-indigo-500 focus:outline-none focus:outline-offset-1 focus:bg-gray-50 hover:bg-gray-50 text-xs focus:ring-transparent focus:border-gray-500', error ? 'border-red-800 bg-red-50 hover:bg-red-50 focus:border-red-800 focus:bg-red-50' : '') })));
+};
+exports.Textarea = Textarea;
+//# sourceMappingURL=Textarea.js.map

package/dist/cjs/components/Input/Textarea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Textarea.js","sourceRoot":"","sources":["../../../../src/components/Input/Textarea.tsx"],"names":[],"mappings":";;;;AAAA,wDAAqD;AAErD,kCAAqC;AAQ9B,IAAM,QAAQ,GAA4B,UAAC,EAAyC;QAAvC,QAAQ,cAAA,EAAE,KAAK,WAAA,EAAE,KAAK,WAAA;IACxE,OAAO,CACL,kEACM,KAAK,EACL,QAAQ,IACZ,SAAS,EAAE,IAAA,kBAAU,EACnB,gPAAgP,EAChP,KAAK,CAAC,CAAC,CAAC,+EAA+E,CAAC,CAAC,CAAC,EAAE,CAC7F,IACD,CACH,CAAA;AACH,CAAC,CAAA;AAXY,QAAA,QAAQ,YAWpB"}

package/dist/cjs/components/LoginScreen/LoginScreen.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+export interface LoginProps {
+    redirectPath?: any;
+    logo?: any;
+    banner?: any;
+}
+export declare const PHXLoginScreen: ({ logo, banner, redirectPath }: LoginProps) => JSX.Element;

package/dist/cjs/components/LoginScreen/LoginScreen.js

@@ -0,0 +1,100 @@
+"use strict";
+exports.__esModule = true;
+exports.PHXLoginScreen = void 0;
+var tslib_1 = require("tslib");
+var solid_1 = require("@heroicons/react/24/solid");
+var react_1 = tslib_1.__importStar(require("react"));
+var react_hook_form_1 = require("react-hook-form");
+var FormWrap_1 = require("../FormWrap");
+var Input_1 = require("../Input");
+var Button_1 = require("../Button");
+var js_cookie_1 = tslib_1.__importDefault(require("js-cookie"));
+var client_1 = require("@apollo/client");
+var loginQuery_1 = require("../../utils/loginQuery");
+var PHXLoginScreen = function (_a) {
+    var logo = _a.logo, banner = _a.banner, redirectPath = _a.redirectPath;
+    var _b = (0, react_1.useState)(false), showPassword = _b[0], setShowPassword = _b[1];
+    var _c = (0, react_1.useState)(false), remember = _c[0], setRemember = _c[1];
+    var _d = (0, react_hook_form_1.useForm)(), handleSubmit = _d.handleSubmit, register = _d.register, errors = _d.formState.errors;
+    var handleClickShowPassword = function () {
+        setShowPassword(!showPassword);
+    };
+    var loginAction = (0, client_1.useLazyQuery)(loginQuery_1.getUserInfo, {
+        fetchPolicy: 'network-only'
+    })[0];
+    var onSubmitForm = function (values) { return tslib_1.__awaiter(void 0, void 0, void 0, function () {
+        var email, password, loginInfo, userObjectString, error_1;
+        return tslib_1.__generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    email = values.email, password = values.password;
+                    _a.label = 1;
+                case 1:
+                    _a.trys.push([1, 3, , 4]);
+                    return [4 /*yield*/, loginAction({
+                            variables: {
+                                email: email,
+                                password: password
+                            }
+                        })];
+                case 2:
+                    loginInfo = _a.sent();
+                    if (loginInfo && loginInfo.data) {
+                        userObjectString = JSON.stringify(loginInfo.data.users[0]);
+                        if (remember) {
+                            js_cookie_1["default"].set('isLoggedIn', userObjectString, { expires: 365 });
+                            window.location.replace(redirectPath);
+                        }
+                        else {
+                            js_cookie_1["default"].set('isLoggedIn', userObjectString);
+                            window.location.replace(redirectPath);
+                        }
+                    }
+                    return [3 /*break*/, 4];
+                case 3:
+                    error_1 = _a.sent();
+                    console.error('Error:', error_1);
+                    return [3 /*break*/, 4];
+                case 4: return [2 /*return*/];
+            }
+        });
+    }); };
+    return (react_1["default"].createElement(react_1["default"].Fragment, null,
+        react_1["default"].createElement("main", { className: 'flex min-h-screen items-center justify-center text-gray-700' },
+            react_1["default"].createElement("div", { className: 'm-auto flex h-[100vh] max-w-[100vw] flex-1 justify-center' },
+                react_1["default"].createElement("div", { className: 'py-auto flex w-[40%] flex-1 flex-col justify-center px-4 sm:px-6 lg:flex-none lg:px-12' },
+                    react_1["default"].createElement("div", { className: 'lg:w-76 mx-auto w-full max-w-sm xl:w-96' },
+                        react_1["default"].createElement("div", { className: 'flex flex-col items-center' },
+                            react_1["default"].createElement("img", { className: 'h-[4rem] w-auto', src: logo !== null && logo !== void 0 ? logo : 'https://static-data.phx.asia/iris/iris-logo.png', alt: 'logo' }),
+                            react_1["default"].createElement("h2", { className: 'mt-8 text-2xl font-bold leading-9 tracking-tight text-gray-900' }, "\u0110\u0103ng nh\u1EADp")),
+                        react_1["default"].createElement("div", { className: 'mt-10' },
+                            react_1["default"].createElement(FormWrap_1.PHXFormWrap, { headerAction: false, footerAction: false, submit: true, onSubmit: handleSubmit(onSubmitForm) },
+                                react_1["default"].createElement("div", { className: 'space-y-6' },
+                                    react_1["default"].createElement("div", { className: 'mt-2' },
+                                        react_1["default"].createElement(Input_1.PHXInput, { label: 'Email', 
+                                            //@ts-ignore
+                                            error: errors.email, register: register('email', {
+                                                required: true
+                                            }), errorMessage: 'Vui l\u00F2ng nh\u1EADp email' })),
+                                    react_1["default"].createElement("div", { className: 'relative mt-2' },
+                                        showPassword ? (react_1["default"].createElement(solid_1.EyeIcon, { className: 'w-4 h-5 absolute right-2 top-[1.8rem] cursor-pointer', onClick: handleClickShowPassword })) : (react_1["default"].createElement(solid_1.EyeSlashIcon, { className: 'w-4 h-5 absolute right-2 top-[1.8rem] cursor-pointer', onClick: handleClickShowPassword })),
+                                        react_1["default"].createElement(Input_1.PHXInput
+                                        //@ts-ignore
+                                        , { 
+                                            //@ts-ignore
+                                            error: errors.password, errorMessage: 'Vui l\u00F2ng nh\u1EADp m\u1EADt kh\u1EA9u', register: register('password', {
+                                                required: true
+                                            }), label: 'Password', type: showPassword ? 'text' : 'password', id: 'password' })),
+                                    react_1["default"].createElement("div", { className: 'flex items-center justify-between' },
+                                        react_1["default"].createElement("div", { className: 'flex items-center' },
+                                            react_1["default"].createElement("input", { onChange: function (e) { return setRemember(e.target.checked); }, id: 'remember-me', name: 'remember-me', type: 'checkbox', className: 'h-4 w-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-600' }),
+                                            react_1["default"].createElement("label", { id: 'remember-me', className: 'ml-3 block text-sm leading-6 text-gray-900' }, "Ghi nh\u1EDB t\u00E0i kho\u1EA3n"))),
+                                    react_1["default"].createElement(Button_1.PHXButton, { className: 'flex w-full justify-center rounded-md bg-indigo-600 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600', primary: true, submit: true, size: 'large' }, "\u0110\u0103ng nh\u1EADp"))),
+                            react_1["default"].createElement("div", { className: 'mt-10' },
+                                react_1["default"].createElement("div", { className: 'relative' },
+                                    react_1["default"].createElement("div", { className: 'absolute inset-0 flex items-center', "aria-hidden": 'true' })))))),
+                react_1["default"].createElement("div", { className: 'relative hidden w-0 flex-1 lg:block lg:w-full' },
+                    react_1["default"].createElement("img", { className: 'absolute inset-0 h-full w-full object-cover', src: banner !== null && banner !== void 0 ? banner : 'https://images.unsplash.com/photo-1496917756835-20cb06e75b4e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1908&q=80', alt: 'banner' }))))));
+};
+exports.PHXLoginScreen = PHXLoginScreen;
+//# sourceMappingURL=LoginScreen.js.map

package/dist/cjs/components/LoginScreen/LoginScreen.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoginScreen.js","sourceRoot":"","sources":["../../../../src/components/LoginScreen/LoginScreen.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/components/LoginScreen/index.d.ts

@@ -0,0 +1 @@
+export * from './LoginScreen';

package/dist/cjs/components/LoginScreen/index.js

@@ -0,0 +1,5 @@
+"use strict";
+exports.__esModule = true;
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./LoginScreen"), exports);
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/LoginScreen/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/LoginScreen/index.ts"],"names":[],"mappings":";;;AAAA,wDAA6B"}

package/dist/cjs/components/Skeleton/SkeletonLarge.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+export interface SkeletonProps {
+    size?: 'small' | 'medium' | 'large' | 'extra-large';
+    className?: string;
+}
+export declare function PHXSkeletonLarge({ size, className }: SkeletonProps): JSX.Element;

package/dist/cjs/components/Skeleton/SkeletonLarge.js

@@ -0,0 +1,40 @@
+"use strict";
+exports.__esModule = true;
+exports.PHXSkeletonLarge = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var types_1 = require("../types");
+function PHXSkeletonLarge(_a) {
+    var _b = _a.size, size = _b === void 0 ? 'extra-large' : _b, className = _a.className;
+    var skeletonClass = (0, types_1.classNames)(size === 'small' && 'mx-auto md:w-4/6 lg:w-1/2', size === 'medium' && 'mx-auto md:w-5/6 lg:w-3/4', size === 'large' && 'mx-auto md:w-md lg:w-11/12', size === 'extra-large' && 'mx-auto w-full');
+    return (react_1["default"].createElement("div", { className: className },
+        react_1["default"].createElement("div", { className: "".concat(skeletonClass, " mb-4 rounded-md p-4 shadow") },
+            react_1["default"].createElement("div", { className: 'flex animate-pulse space-x-4' },
+                react_1["default"].createElement("div", { className: 'flex-1 space-y-6 py-1' },
+                    react_1["default"].createElement("div", { className: 'h-2 rounded bg-slate-200' }),
+                    react_1["default"].createElement("div", { className: 'space-y-3' },
+                        react_1["default"].createElement("div", { className: 'grid grid-cols-3 gap-4' },
+                            react_1["default"].createElement("div", { className: 'col-span-2 h-2 rounded bg-slate-200' }),
+                            react_1["default"].createElement("div", { className: 'col-span-1 h-2 rounded bg-slate-200' })),
+                        react_1["default"].createElement("div", { className: 'h-2 rounded bg-slate-200' }))))),
+        react_1["default"].createElement("div", { className: "".concat(skeletonClass, " mb-4 rounded-md p-4 shadow") },
+            react_1["default"].createElement("div", { className: 'flex animate-pulse space-x-4' },
+                react_1["default"].createElement("div", { className: 'flex-1 space-y-6 py-1' },
+                    react_1["default"].createElement("div", { className: 'h-2 rounded bg-slate-200' }),
+                    react_1["default"].createElement("div", { className: 'space-y-3' },
+                        react_1["default"].createElement("div", { className: 'grid grid-cols-3 gap-4' },
+                            react_1["default"].createElement("div", { className: 'col-span-2 h-2 rounded bg-slate-200' }),
+                            react_1["default"].createElement("div", { className: 'col-span-1 h-2 rounded bg-slate-200' })),
+                        react_1["default"].createElement("div", { className: 'h-2 rounded bg-slate-200' }))))),
+        react_1["default"].createElement("div", { className: "".concat(skeletonClass, " mb-4 rounded-md p-4 shadow") },
+            react_1["default"].createElement("div", { className: 'flex animate-pulse space-x-4' },
+                react_1["default"].createElement("div", { className: 'flex-1 space-y-6 py-1' },
+                    react_1["default"].createElement("div", { className: 'h-2 rounded bg-slate-200' }),
+                    react_1["default"].createElement("div", { className: 'space-y-3' },
+                        react_1["default"].createElement("div", { className: 'grid grid-cols-3 gap-4' },
+                            react_1["default"].createElement("div", { className: 'col-span-2 h-2 rounded bg-slate-200' }),
+                            react_1["default"].createElement("div", { className: 'col-span-1 h-2 rounded bg-slate-200' })),
+                        react_1["default"].createElement("div", { className: 'h-2 rounded bg-slate-200' })))))));
+}
+exports.PHXSkeletonLarge = PHXSkeletonLarge;
+//# sourceMappingURL=SkeletonLarge.js.map

package/dist/cjs/components/Skeleton/SkeletonLarge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SkeletonLarge.js","sourceRoot":"","sources":["../../../../src/components/Skeleton/SkeletonLarge.tsx"],"names":[],"mappings":";;;;AAAA,wDAAyB;AACzB,kCAAqC;AAOrC,SAAgB,gBAAgB,CAAC,EAAkD;QAAhD,YAAoB,EAApB,IAAI,mBAAG,aAAa,KAAA,EAAE,SAAS,eAAA;IAChE,IAAM,aAAa,GAAG,IAAA,kBAAU,EAC9B,IAAI,KAAK,OAAO,IAAI,2BAA2B,EAC/C,IAAI,KAAK,QAAQ,IAAI,2BAA2B,EAChD,IAAI,KAAK,OAAO,IAAI,4BAA4B,EAChD,IAAI,KAAK,aAAa,IAAI,gBAAgB,CAC3C,CAAA;IAED,OAAO,CACL,0CAAK,SAAS,EAAE,SAAS;QACvB,0CAAK,SAAS,EAAE,UAAG,aAAa,gCAA6B;YAC3D,0CAAK,SAAS,EAAC,8BAA8B;gBAC3C,0CAAK,SAAS,EAAC,uBAAuB;oBACpC,0CAAK,SAAS,EAAC,0BAA0B,GAAG;oBAC5C,0CAAK,SAAS,EAAC,WAAW;wBACxB,0CAAK,SAAS,EAAC,wBAAwB;4BACrC,0CAAK,SAAS,EAAC,qCAAqC,GAAG;4BACvD,0CAAK,SAAS,EAAC,qCAAqC,GAAG,CACnD;wBACN,0CAAK,SAAS,EAAC,0BAA0B,GAAG,CACxC,CACF,CACF,CACF;QACN,0CAAK,SAAS,EAAE,UAAG,aAAa,gCAA6B;YAC3D,0CAAK,SAAS,EAAC,8BAA8B;gBAC3C,0CAAK,SAAS,EAAC,uBAAuB;oBACpC,0CAAK,SAAS,EAAC,0BAA0B,GAAG;oBAC5C,0CAAK,SAAS,EAAC,WAAW;wBACxB,0CAAK,SAAS,EAAC,wBAAwB;4BACrC,0CAAK,SAAS,EAAC,qCAAqC,GAAG;4BACvD,0CAAK,SAAS,EAAC,qCAAqC,GAAG,CACnD;wBACN,0CAAK,SAAS,EAAC,0BAA0B,GAAG,CACxC,CACF,CACF,CACF;QACN,0CAAK,SAAS,EAAE,UAAG,aAAa,gCAA6B;YAC3D,0CAAK,SAAS,EAAC,8BAA8B;gBAC3C,0CAAK,SAAS,EAAC,uBAAuB;oBACpC,0CAAK,SAAS,EAAC,0BAA0B,GAAG;oBAC5C,0CAAK,SAAS,EAAC,WAAW;wBACxB,0CAAK,SAAS,EAAC,wBAAwB;4BACrC,0CAAK,SAAS,EAAC,qCAAqC,GAAG;4BACvD,0CAAK,SAAS,EAAC,qCAAqC,GAAG,CACnD;wBACN,0CAAK,SAAS,EAAC,0BAA0B,GAAG,CACxC,CACF,CACF,CACF,CACF,CACP,CAAA;AACH,CAAC;AAtDD,4CAsDC"}

package/dist/cjs/components/Table/SkeletonLarge.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export default function SkeletonLarge(): JSX.Element;

package/dist/cjs/components/Table/SkeletonLarge.js

@@ -0,0 +1,36 @@
+"use strict";
+exports.__esModule = true;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+function SkeletonLarge() {
+    return (react_1["default"].createElement(react_1["default"].Fragment, null,
+        react_1["default"].createElement("div", { className: 'mx-auto mb-4 w-full rounded-md p-4 shadow' },
+            react_1["default"].createElement("div", { className: 'flex animate-pulse space-x-4' },
+                react_1["default"].createElement("div", { className: 'flex-1 space-y-6 py-1' },
+                    react_1["default"].createElement("div", { className: 'h-2 rounded bg-slate-200' }),
+                    react_1["default"].createElement("div", { className: 'space-y-3' },
+                        react_1["default"].createElement("div", { className: 'grid grid-cols-3 gap-4' },
+                            react_1["default"].createElement("div", { className: 'col-span-2 h-2 rounded bg-slate-200' }),
+                            react_1["default"].createElement("div", { className: 'col-span-1 h-2 rounded bg-slate-200' })),
+                        react_1["default"].createElement("div", { className: 'h-2 rounded bg-slate-200' }))))),
+        react_1["default"].createElement("div", { className: 'mx-auto mb-4 w-full rounded-md p-4 shadow' },
+            react_1["default"].createElement("div", { className: 'flex animate-pulse space-x-4' },
+                react_1["default"].createElement("div", { className: 'flex-1 space-y-6 py-1' },
+                    react_1["default"].createElement("div", { className: 'h-2 rounded bg-slate-200' }),
+                    react_1["default"].createElement("div", { className: 'space-y-3' },
+                        react_1["default"].createElement("div", { className: 'grid grid-cols-3 gap-4' },
+                            react_1["default"].createElement("div", { className: 'col-span-2 h-2 rounded bg-slate-200' }),
+                            react_1["default"].createElement("div", { className: 'col-span-1 h-2 rounded bg-slate-200' })),
+                        react_1["default"].createElement("div", { className: 'h-2 rounded bg-slate-200' }))))),
+        react_1["default"].createElement("div", { className: 'mx-auto mb-4 w-full rounded-md p-4 shadow' },
+            react_1["default"].createElement("div", { className: 'flex animate-pulse space-x-4' },
+                react_1["default"].createElement("div", { className: 'flex-1 space-y-6 py-1' },
+                    react_1["default"].createElement("div", { className: 'h-2 rounded bg-slate-200' }),
+                    react_1["default"].createElement("div", { className: 'space-y-3' },
+                        react_1["default"].createElement("div", { className: 'grid grid-cols-3 gap-4' },
+                            react_1["default"].createElement("div", { className: 'col-span-2 h-2 rounded bg-slate-200' }),
+                            react_1["default"].createElement("div", { className: 'col-span-1 h-2 rounded bg-slate-200' })),
+                        react_1["default"].createElement("div", { className: 'h-2 rounded bg-slate-200' })))))));
+}
+exports["default"] = SkeletonLarge;
+//# sourceMappingURL=SkeletonLarge.js.map

package/dist/cjs/components/Table/SkeletonLarge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SkeletonLarge.js","sourceRoot":"","sources":["../../../../src/components/Table/SkeletonLarge.tsx"],"names":[],"mappings":";;;AAAA,wDAAyB;AAEzB,SAAwB,aAAa;IACnC,OAAO,CACL;QACE,0CAAK,SAAS,EAAC,2CAA2C;YACxD,0CAAK,SAAS,EAAC,8BAA8B;gBAC3C,0CAAK,SAAS,EAAC,uBAAuB;oBACpC,0CAAK,SAAS,EAAC,0BAA0B,GAAG;oBAC5C,0CAAK,SAAS,EAAC,WAAW;wBACxB,0CAAK,SAAS,EAAC,wBAAwB;4BACrC,0CAAK,SAAS,EAAC,qCAAqC,GAAG;4BACvD,0CAAK,SAAS,EAAC,qCAAqC,GAAG,CACnD;wBACN,0CAAK,SAAS,EAAC,0BAA0B,GAAG,CACxC,CACF,CACF,CACF;QACN,0CAAK,SAAS,EAAC,2CAA2C;YACxD,0CAAK,SAAS,EAAC,8BAA8B;gBAC3C,0CAAK,SAAS,EAAC,uBAAuB;oBACpC,0CAAK,SAAS,EAAC,0BAA0B,GAAG;oBAC5C,0CAAK,SAAS,EAAC,WAAW;wBACxB,0CAAK,SAAS,EAAC,wBAAwB;4BACrC,0CAAK,SAAS,EAAC,qCAAqC,GAAG;4BACvD,0CAAK,SAAS,EAAC,qCAAqC,GAAG,CACnD;wBACN,0CAAK,SAAS,EAAC,0BAA0B,GAAG,CACxC,CACF,CACF,CACF;QACN,0CAAK,SAAS,EAAC,2CAA2C;YACxD,0CAAK,SAAS,EAAC,8BAA8B;gBAC3C,0CAAK,SAAS,EAAC,uBAAuB;oBACpC,0CAAK,SAAS,EAAC,0BAA0B,GAAG;oBAC5C,0CAAK,SAAS,EAAC,WAAW;wBACxB,0CAAK,SAAS,EAAC,wBAAwB;4BACrC,0CAAK,SAAS,EAAC,qCAAqC,GAAG;4BACvD,0CAAK,SAAS,EAAC,qCAAqC,GAAG,CACnD;wBACN,0CAAK,SAAS,EAAC,0BAA0B,GAAG,CACxC,CACF,CACF,CACF,CACL,CACJ,CAAA;AACH,CAAC;AA/CD,mCA+CC"}

package/dist/cjs/components/Table/Spinner.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export default function Spinner(): JSX.Element;

package/dist/cjs/components/Table/Spinner.js

@@ -0,0 +1,9 @@
+"use strict";
+exports.__esModule = true;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+function Spinner() {
+    return (react_1["default"].createElement("div", { "aria-label": 'loading1', className: 'inline-block h-5 w-5 animate-spin rounded-full border-[3px] border-current border-t-transparent text-indigo-600', role: 'status' }));
+}
+exports["default"] = Spinner;
+//# sourceMappingURL=Spinner.js.map

package/dist/cjs/components/Table/Spinner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Spinner.js","sourceRoot":"","sources":["../../../../src/components/Table/Spinner.tsx"],"names":[],"mappings":";;;AAAA,wDAAyB;AAEzB,SAAwB,OAAO;IAC7B,OAAO,CACL,wDACa,UAAU,EACrB,SAAS,EAAC,iHAAiH,EAC3H,IAAI,EAAC,QAAQ,GACb,CACH,CAAA;AACH,CAAC;AARD,6BAQC"}

package/dist/cjs/components/Test/Test.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+export interface InputProps {
+    className?: string;
+    props?: any;
+}
+export declare const Test: () => JSX.Element;

package/dist/cjs/components/Test/Test.js

@@ -0,0 +1,12 @@
+"use strict";
+exports.__esModule = true;
+exports.Test = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var Input_1 = require("../Input");
+var Test = function () {
+    return (react_1["default"].createElement("form", null,
+        react_1["default"].createElement(Input_1.Input, { autoComplete: 'on', defaultValue: 'abc' })));
+};
+exports.Test = Test;
+//# sourceMappingURL=Test.js.map

package/dist/cjs/components/Test/Test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Test.js","sourceRoot":"","sources":["../../../../src/components/Test/Test.tsx"],"names":[],"mappings":";;;;AAAA,wDAAyB;AACzB,kCAAgC;AAOzB,IAAM,IAAI,GAAG;IAClB,OAAO,CACL;QACE,iCAAC,aAAK,IAAC,YAAY,EAAC,IAAI,EAAC,YAAY,EAAC,KAAK,GAAG,CACzC,CACR,CAAA;AACH,CAAC,CAAA;AANY,QAAA,IAAI,QAMhB"}

package/dist/cjs/components/Test/index.d.ts

@@ -0,0 +1 @@
+export * from './Test';

package/dist/cjs/components/Test/index.js

@@ -0,0 +1,5 @@
+"use strict";
+exports.__esModule = true;
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./Test"), exports);
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/Test/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Test/index.ts"],"names":[],"mappings":";;;AAAA,iDAAsB"}

package/dist/cjs/components/WrapTable/WrapTable.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+export interface TableProps {
+    color?: 'indigo' | 'gray';
+    className?: string;
+}
+export declare const WrapTable: ({ color, className }: TableProps) => JSX.Element;

package/dist/cjs/components/WrapTable/WrapTable.js

@@ -0,0 +1,13 @@
+"use strict";
+exports.__esModule = true;
+exports.WrapTable = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var types_1 = require("../types");
+var WrapTable = function (_a) {
+    var _b = _a.color, color = _b === void 0 ? 'indigo' : _b, _c = _a.className, className = _c === void 0 ? 'w-5 h-5' : _c;
+    var colorMaker = (0, types_1.classNames)(color === 'indigo' && 'text-indigo-600', color === 'gray' && 'text-gray-600');
+    return (react_1["default"].createElement("div", { className: "animate-spin inline-block ".concat(className, " border-[3px] border-current border-t-transparent ").concat(colorMaker, " rounded-full"), role: 'status', "aria-label": 'loading1' }));
+};
+exports.WrapTable = WrapTable;
+//# sourceMappingURL=WrapTable.js.map

package/dist/cjs/components/WrapTable/WrapTable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"WrapTable.js","sourceRoot":"","sources":["../../../../src/components/WrapTable/WrapTable.tsx"],"names":[],"mappings":";;;;AAAA,wDAAyB;AACzB,kCAAqC;AAO9B,IAAM,SAAS,GAAG,UAAC,EAAuD;QAArD,aAAgB,EAAhB,KAAK,mBAAG,QAAQ,KAAA,EAAE,iBAAqB,EAArB,SAAS,mBAAG,SAAS,KAAA;IACjE,IAAM,UAAU,GAAG,IAAA,kBAAU,EAAC,KAAK,KAAK,QAAQ,IAAI,iBAAiB,EAAE,KAAK,KAAK,MAAM,IAAI,eAAe,CAAC,CAAA;IAC3G,OAAO,CACL,0CACE,SAAS,EAAE,oCAA6B,SAAS,+DAAqD,UAAU,kBAAe,EAC/H,IAAI,EAAC,QAAQ,gBACF,UAAU,GAChB,CACR,CAAA;AACH,CAAC,CAAA;AATY,QAAA,SAAS,aASrB"}

package/dist/cjs/components/WrapTable/index.d.ts

@@ -0,0 +1 @@
+export * from './WrapTable';

package/dist/cjs/components/WrapTable/index.js

@@ -0,0 +1,5 @@
+"use strict";
+exports.__esModule = true;
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./WrapTable"), exports);
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/WrapTable/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/WrapTable/index.ts"],"names":[],"mappings":";;;AAAA,sDAA2B"}

package/dist/cjs/demo/LoginDemo.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const LoginDemo: () => JSX.Element;

package/dist/cjs/demo/LoginDemo.js

@@ -0,0 +1,13 @@
+"use strict";
+exports.__esModule = true;
+exports.LoginDemo = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var LoginScreen_1 = require("../components/LoginScreen/LoginScreen");
+var apollo_wrapper_1 = require("../lib/apollo-wrapper");
+var LoginDemo = function () {
+    return (react_1["default"].createElement(apollo_wrapper_1.ApolloWrapper, null,
+        react_1["default"].createElement(LoginScreen_1.PHXLoginScreen, null)));
+};
+exports.LoginDemo = LoginDemo;
+//# sourceMappingURL=LoginDemo.js.map

package/dist/cjs/demo/LoginDemo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoginDemo.js","sourceRoot":"","sources":["../../../src/demo/LoginDemo.tsx"],"names":[],"mappings":";;;;AAAA,wDAAyB;AACzB,qEAAsE;AACtE,wDAAqD;AAE9C,IAAM,SAAS,GAAG;IACvB,OAAO,CACL,iCAAC,8BAAa;QACZ,iCAAC,4BAAc,OAAG,CACJ,CACjB,CAAA;AACH,CAAC,CAAA;AANY,QAAA,SAAS,aAMrB"}

package/dist/cjs/index.d.ts

@@ -19,5 +19,6 @@ import PHXClientQuery from './components/Func/clientQueryV2';
 import PHXClientMutation from './components/Func/clientMutationV2';
 import { PHXTextarea } from './components/Textarea';
 import { PHXModal } from './components/Modal';
+import { PHXLoginScreen } from './components/LoginScreen';
 import { PHXTabs } from './components/Tabs';
-export { MyCounter, PHXButton, PHXCard, PHXSpinner, PHXMainWrap, PHXFormWrap, PHXHeaderBar, PHXTable, PHXInput, PHXSelect, PHXRadio, PHXCheckbox, PHXFormStep, PHXNotifications, PHXStep, PHXSkeleton, PHXFuncGetLoggedInfo, PHXClientQuery, PHXClientMutation, PHXTextarea, PHXModal, PHXTabs, };
+export { MyCounter, PHXButton, PHXCard, PHXSpinner, PHXMainWrap, PHXFormWrap, PHXHeaderBar, PHXTable, PHXInput, PHXSelect, PHXRadio, PHXCheckbox, PHXFormStep, PHXNotifications, PHXStep, PHXSkeleton, PHXFuncGetLoggedInfo, PHXClientQuery, PHXClientMutation, PHXTextarea, PHXModal, PHXLoginScreen, PHXTabs, };

package/dist/cjs/index.js

@@ -1,6 +1,6 @@
 "use strict";
 exports.__esModule = true;
-exports.PHXTabs = exports.PHXModal = exports.PHXTextarea = exports.PHXClientMutation = exports.PHXClientQuery = exports.PHXFuncGetLoggedInfo = exports.PHXSkeleton = exports.PHXStep = exports.PHXNotifications = exports.PHXFormStep = exports.PHXCheckbox = exports.PHXRadio = exports.PHXSelect = exports.PHXInput = exports.PHXTable = exports.PHXHeaderBar = exports.PHXFormWrap = exports.PHXMainWrap = exports.PHXSpinner = exports.PHXCard = exports.PHXButton = exports.MyCounter = void 0;
+exports.PHXTabs = exports.PHXLoginScreen = exports.PHXModal = exports.PHXTextarea = exports.PHXClientMutation = exports.PHXClientQuery = exports.PHXFuncGetLoggedInfo = exports.PHXSkeleton = exports.PHXStep = exports.PHXNotifications = exports.PHXFormStep = exports.PHXCheckbox = exports.PHXRadio = exports.PHXSelect = exports.PHXInput = exports.PHXTable = exports.PHXHeaderBar = exports.PHXFormWrap = exports.PHXMainWrap = exports.PHXSpinner = exports.PHXCard = exports.PHXButton = exports.MyCounter = void 0;
 var tslib_1 = require("tslib");
 var Step_1 = require("./components/Step");
 exports.PHXStep = Step_1.PHXStep;
@@ -44,6 +44,8 @@ var Textarea_1 = require("./components/Textarea");
 exports.PHXTextarea = Textarea_1.PHXTextarea;
 var Modal_1 = require("./components/Modal");
 exports.PHXModal = Modal_1.PHXModal;
+var LoginScreen_1 = require("./components/LoginScreen");
+exports.PHXLoginScreen = LoginScreen_1.PHXLoginScreen;
 var Tabs_1 = require("./components/Tabs");
 exports.PHXTabs = Tabs_1.PHXTabs;
 //# sourceMappingURL=index.js.map

package/dist/cjs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;AAAA,0CAA2C;AAsCzC,kBAtCO,cAAO,CAsCP;AArCT,iEAAwC;AAuBtC,oBAvBK,gBAAS,CAuBL;AAtBX,8CAA+C;AAuB7C,oBAvBO,kBAAS,CAuBP;AAtBX,0CAA2C;AAuBzC,kBAvBO,cAAO,CAuBP;AAtBT,gDAAiD;AAuB/C,qBAvBO,oBAAU,CAuBP;AAtBZ,kDAAmD;AAuBjD,sBAvBO,sBAAW,CAuBP;AAtBb,4CAA6C;AAyB3C,mBAzBO,gBAAQ,CAyBP;AAxBV,kDAAmD;AAsBjD,sBAtBO,sBAAW,CAsBP;AArBb,oDAAqD;AAsBnD,uBAtBO,wBAAY,CAsBP;AArBd,4CAA6C;AAuB3C,mBAvBO,gBAAQ,CAuBP;AAtBV,8CAA+C;AAuB7C,oBAvBO,kBAAS,CAuBP;AAtBX,4CAA6C;AAuB3C,mBAvBO,gBAAQ,CAuBP;AAtBV,kDAAmD;AAuBjD,sBAvBO,sBAAW,CAuBP;AAtBb,kDAAmD;AAuBjD,sBAvBO,sBAAW,CAuBP;AAtBb,4DAA6D;AAuB3D,2BAvBO,gCAAgB,CAuBP;AAtBlB,kDAAmD;AAwBjD,sBAxBO,sBAAW,CAwBP;AAvBb,wFAAiE;AAwB/D,+BAxBK,yBAAoB,CAwBL;AAvBtB,0FAA4D;AAwB1D,yBAxBK,0BAAc,CAwBL;AAvBhB,gGAAkE;AAwBhE,4BAxBK,6BAAiB,CAwBL;AAvBnB,kDAAmD;AAwBjD,sBAxBO,sBAAW,CAwBP;AAvBb,4CAA6C;AAwB3C,mBAxBO,gBAAQ,CAwBP;AAvBV,0CAA2C;AAwBzC,kBAxBO,cAAO,CAwBP"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;AAAA,0CAA2C;AAuCzC,kBAvCO,cAAO,CAuCP;AAtCT,iEAAwC;AAwBtC,oBAxBK,gBAAS,CAwBL;AAvBX,8CAA+C;AAwB7C,oBAxBO,kBAAS,CAwBP;AAvBX,0CAA2C;AAwBzC,kBAxBO,cAAO,CAwBP;AAvBT,gDAAiD;AAwB/C,qBAxBO,oBAAU,CAwBP;AAvBZ,kDAAmD;AAwBjD,sBAxBO,sBAAW,CAwBP;AAvBb,4CAA6C;AA0B3C,mBA1BO,gBAAQ,CA0BP;AAzBV,kDAAmD;AAuBjD,sBAvBO,sBAAW,CAuBP;AAtBb,oDAAqD;AAuBnD,uBAvBO,wBAAY,CAuBP;AAtBd,4CAA6C;AAwB3C,mBAxBO,gBAAQ,CAwBP;AAvBV,8CAA+C;AAwB7C,oBAxBO,kBAAS,CAwBP;AAvBX,4CAA6C;AAwB3C,mBAxBO,gBAAQ,CAwBP;AAvBV,kDAAmD;AAwBjD,sBAxBO,sBAAW,CAwBP;AAvBb,kDAAmD;AAwBjD,sBAxBO,sBAAW,CAwBP;AAvBb,4DAA6D;AAwB3D,2BAxBO,gCAAgB,CAwBP;AAvBlB,kDAAmD;AAyBjD,sBAzBO,sBAAW,CAyBP;AAxBb,wFAAiE;AAyB/D,+BAzBK,yBAAoB,CAyBL;AAxBtB,0FAA4D;AAyB1D,yBAzBK,0BAAc,CAyBL;AAxBhB,gGAAkE;AAyBhE,4BAzBK,6BAAiB,CAyBL;AAxBnB,kDAAmD;AAyBjD,sBAzBO,sBAAW,CAyBP;AAxBb,4CAA6C;AAyB3C,mBAzBO,gBAAQ,CAyBP;AAxBV,wDAAyD;AAyBvD,yBAzBO,4BAAc,CAyBP;AAxBhB,0CAA2C;AAyBzC,kBAzBO,cAAO,CAyBP"}

package/dist/cjs/utils/loginQuery.d.ts

@@ -0,0 +1 @@
+export declare const getUserInfo: import("@apollo/client").DocumentNode;

package/dist/cjs/utils/loginQuery.js

@@ -0,0 +1,8 @@
+"use strict";
+exports.__esModule = true;
+exports.getUserInfo = void 0;
+var tslib_1 = require("tslib");
+var client_1 = require("@apollo/client");
+exports.getUserInfo = (0, client_1.gql)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  query GetUsers($email: String, $password: String) {\n    users(where: { email: { _eq: $email }, v2_password: { _eq: $password } }) {\n      email\n      v2_password\n      id\n      school_info_id\n      user_id\n      user_role_id\n      user_type\n      avatar\n      name\n      created_at\n      deleted_at\n      updated_at\n    }\n  }\n"], ["\n  query GetUsers($email: String, $password: String) {\n    users(where: { email: { _eq: $email }, v2_password: { _eq: $password } }) {\n      email\n      v2_password\n      id\n      school_info_id\n      user_id\n      user_role_id\n      user_type\n      avatar\n      name\n      created_at\n      deleted_at\n      updated_at\n    }\n  }\n"])));
+var templateObject_1;
+//# sourceMappingURL=loginQuery.js.map

package/dist/cjs/utils/loginQuery.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"loginQuery.js","sourceRoot":"","sources":["../../../src/utils/loginQuery.ts"],"names":[],"mappings":";;;;AAAA,yCAAoC;AAEvB,QAAA,WAAW,OAAG,YAAG,waAAA,4VAiB7B,KAAA"}

package/dist/esm/components/Input/Textarea.d.ts

@@ -0,0 +1,8 @@
+import React, { TextareaHTMLAttributes } from 'react';
+import { UseFormRegisterReturn } from 'react-hook-form';
+export interface TextAreaProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {
+    register?: UseFormRegisterReturn;
+    error?: boolean;
+    props?: any;
+}
+export declare const Textarea: React.FC<TextAreaProps>;

package/dist/esm/components/Input/Textarea.js

@@ -0,0 +1,8 @@
+import { __assign } from "tslib";
+import React from 'react';
+import { classNames } from '../types';
+export var Textarea = function (_a) {
+    var register = _a.register, error = _a.error, props = _a.props;
+    return (React.createElement("textarea", __assign({}, props, register, { className: classNames('mt-1 font-light block w-full rounded-lg border border-gray-500 px-3 py-1.5 shadow-sm focus:outline-indigo-500 focus:outline-none focus:outline-offset-1 focus:bg-gray-50 hover:bg-gray-50 text-xs focus:ring-transparent focus:border-gray-500', error ? 'border-red-800 bg-red-50 hover:bg-red-50 focus:border-red-800 focus:bg-red-50' : '') })));
+};
+//# sourceMappingURL=Textarea.js.map

package/dist/esm/components/Input/Textarea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Textarea.js","sourceRoot":"","sources":["../../../../src/components/Input/Textarea.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAiC,MAAM,OAAO,CAAA;AAErD,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAQrC,MAAM,CAAC,IAAM,QAAQ,GAA4B,UAAC,EAAyC;QAAvC,QAAQ,cAAA,EAAE,KAAK,WAAA,EAAE,KAAK,WAAA;IACxE,OAAO,CACL,6CACM,KAAK,EACL,QAAQ,IACZ,SAAS,EAAE,UAAU,CACnB,gPAAgP,EAChP,KAAK,CAAC,CAAC,CAAC,+EAA+E,CAAC,CAAC,CAAC,EAAE,CAC7F,IACD,CACH,CAAA;AACH,CAAC,CAAA"}

package/dist/esm/components/LoginScreen/LoginScreen.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+export interface LoginProps {
+    redirectPath?: any;
+    logo?: any;
+    banner?: any;
+}
+export declare const PHXLoginScreen: ({ logo, banner, redirectPath }: LoginProps) => JSX.Element;

package/dist/esm/components/LoginScreen/LoginScreen.js

@@ -0,0 +1,96 @@
+import { __awaiter, __generator } from "tslib";
+import { EyeIcon, EyeSlashIcon } from '@heroicons/react/24/solid';
+import React, { useState } from 'react';
+import { useForm } from 'react-hook-form';
+import { PHXFormWrap } from '../FormWrap';
+import { PHXInput } from '../Input';
+import { PHXButton } from '../Button';
+import Cookies from 'js-cookie';
+import { useLazyQuery } from '@apollo/client';
+import { getUserInfo } from '../../utils/loginQuery';
+export var PHXLoginScreen = function (_a) {
+    var logo = _a.logo, banner = _a.banner, redirectPath = _a.redirectPath;
+    var _b = useState(false), showPassword = _b[0], setShowPassword = _b[1];
+    var _c = useState(false), remember = _c[0], setRemember = _c[1];
+    var _d = useForm(), handleSubmit = _d.handleSubmit, register = _d.register, errors = _d.formState.errors;
+    var handleClickShowPassword = function () {
+        setShowPassword(!showPassword);
+    };
+    var loginAction = useLazyQuery(getUserInfo, {
+        fetchPolicy: 'network-only'
+    })[0];
+    var onSubmitForm = function (values) { return __awaiter(void 0, void 0, void 0, function () {
+        var email, password, loginInfo, userObjectString, error_1;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    email = values.email, password = values.password;
+                    _a.label = 1;
+                case 1:
+                    _a.trys.push([1, 3, , 4]);
+                    return [4 /*yield*/, loginAction({
+                            variables: {
+                                email: email,
+                                password: password
+                            }
+                        })];
+                case 2:
+                    loginInfo = _a.sent();
+                    if (loginInfo && loginInfo.data) {
+                        userObjectString = JSON.stringify(loginInfo.data.users[0]);
+                        if (remember) {
+                            Cookies.set('isLoggedIn', userObjectString, { expires: 365 });
+                            window.location.replace(redirectPath);
+                        }
+                        else {
+                            Cookies.set('isLoggedIn', userObjectString);
+                            window.location.replace(redirectPath);
+                        }
+                    }
+                    return [3 /*break*/, 4];
+                case 3:
+                    error_1 = _a.sent();
+                    console.error('Error:', error_1);
+                    return [3 /*break*/, 4];
+                case 4: return [2 /*return*/];
+            }
+        });
+    }); };
+    return (React.createElement(React.Fragment, null,
+        React.createElement("main", { className: 'flex min-h-screen items-center justify-center text-gray-700' },
+            React.createElement("div", { className: 'm-auto flex h-[100vh] max-w-[100vw] flex-1 justify-center' },
+                React.createElement("div", { className: 'py-auto flex w-[40%] flex-1 flex-col justify-center px-4 sm:px-6 lg:flex-none lg:px-12' },
+                    React.createElement("div", { className: 'lg:w-76 mx-auto w-full max-w-sm xl:w-96' },
+                        React.createElement("div", { className: 'flex flex-col items-center' },
+                            React.createElement("img", { className: 'h-[4rem] w-auto', src: logo !== null && logo !== void 0 ? logo : 'https://static-data.phx.asia/iris/iris-logo.png', alt: 'logo' }),
+                            React.createElement("h2", { className: 'mt-8 text-2xl font-bold leading-9 tracking-tight text-gray-900' }, "\u0110\u0103ng nh\u1EADp")),
+                        React.createElement("div", { className: 'mt-10' },
+                            React.createElement(PHXFormWrap, { headerAction: false, footerAction: false, submit: true, onSubmit: handleSubmit(onSubmitForm) },
+                                React.createElement("div", { className: 'space-y-6' },
+                                    React.createElement("div", { className: 'mt-2' },
+                                        React.createElement(PHXInput, { label: 'Email', 
+                                            //@ts-ignore
+                                            error: errors.email, register: register('email', {
+                                                required: true
+                                            }), errorMessage: 'Vui l\u00F2ng nh\u1EADp email' })),
+                                    React.createElement("div", { className: 'relative mt-2' },
+                                        showPassword ? (React.createElement(EyeIcon, { className: 'w-4 h-5 absolute right-2 top-[1.8rem] cursor-pointer', onClick: handleClickShowPassword })) : (React.createElement(EyeSlashIcon, { className: 'w-4 h-5 absolute right-2 top-[1.8rem] cursor-pointer', onClick: handleClickShowPassword })),
+                                        React.createElement(PHXInput
+                                        //@ts-ignore
+                                        , { 
+                                            //@ts-ignore
+                                            error: errors.password, errorMessage: 'Vui l\u00F2ng nh\u1EADp m\u1EADt kh\u1EA9u', register: register('password', {
+                                                required: true
+                                            }), label: 'Password', type: showPassword ? 'text' : 'password', id: 'password' })),
+                                    React.createElement("div", { className: 'flex items-center justify-between' },
+                                        React.createElement("div", { className: 'flex items-center' },
+                                            React.createElement("input", { onChange: function (e) { return setRemember(e.target.checked); }, id: 'remember-me', name: 'remember-me', type: 'checkbox', className: 'h-4 w-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-600' }),
+                                            React.createElement("label", { id: 'remember-me', className: 'ml-3 block text-sm leading-6 text-gray-900' }, "Ghi nh\u1EDB t\u00E0i kho\u1EA3n"))),
+                                    React.createElement(PHXButton, { className: 'flex w-full justify-center rounded-md bg-indigo-600 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600', primary: true, submit: true, size: 'large' }, "\u0110\u0103ng nh\u1EADp"))),
+                            React.createElement("div", { className: 'mt-10' },
+                                React.createElement("div", { className: 'relative' },
+                                    React.createElement("div", { className: 'absolute inset-0 flex items-center', "aria-hidden": 'true' })))))),
+                React.createElement("div", { className: 'relative hidden w-0 flex-1 lg:block lg:w-full' },
+                    React.createElement("img", { className: 'absolute inset-0 h-full w-full object-cover', src: banner !== null && banner !== void 0 ? banner : 'https://images.unsplash.com/photo-1496917756835-20cb06e75b4e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1908&q=80', alt: 'banner' }))))));
+};
+//# sourceMappingURL=LoginScreen.js.map

package/dist/esm/components/LoginScreen/LoginScreen.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoginScreen.js","sourceRoot":"","sources":["../../../../src/components/LoginScreen/LoginScreen.tsx"],"names":[],"mappings":"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"}

package/dist/esm/components/LoginScreen/index.d.ts

@@ -0,0 +1 @@
+export * from './LoginScreen';

package/dist/esm/components/LoginScreen/index.js

@@ -0,0 +1,2 @@
+export * from './LoginScreen';
+//# sourceMappingURL=index.js.map

package/dist/esm/components/LoginScreen/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/LoginScreen/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAA"}

package/dist/esm/components/Skeleton/SkeletonLarge.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+export interface SkeletonProps {
+    size?: 'small' | 'medium' | 'large' | 'extra-large';
+    className?: string;
+}
+export declare function PHXSkeletonLarge({ size, className }: SkeletonProps): JSX.Element;

package/dist/esm/components/Skeleton/SkeletonLarge.js

@@ -0,0 +1,35 @@
+import React from 'react';
+import { classNames } from '../types';
+export function PHXSkeletonLarge(_a) {
+    var _b = _a.size, size = _b === void 0 ? 'extra-large' : _b, className = _a.className;
+    var skeletonClass = classNames(size === 'small' && 'mx-auto md:w-4/6 lg:w-1/2', size === 'medium' && 'mx-auto md:w-5/6 lg:w-3/4', size === 'large' && 'mx-auto md:w-md lg:w-11/12', size === 'extra-large' && 'mx-auto w-full');
+    return (React.createElement("div", { className: className },
+        React.createElement("div", { className: "".concat(skeletonClass, " mb-4 rounded-md p-4 shadow") },
+            React.createElement("div", { className: 'flex animate-pulse space-x-4' },
+                React.createElement("div", { className: 'flex-1 space-y-6 py-1' },
+                    React.createElement("div", { className: 'h-2 rounded bg-slate-200' }),
+                    React.createElement("div", { className: 'space-y-3' },
+                        React.createElement("div", { className: 'grid grid-cols-3 gap-4' },
+                            React.createElement("div", { className: 'col-span-2 h-2 rounded bg-slate-200' }),
+                            React.createElement("div", { className: 'col-span-1 h-2 rounded bg-slate-200' })),
+                        React.createElement("div", { className: 'h-2 rounded bg-slate-200' }))))),
+        React.createElement("div", { className: "".concat(skeletonClass, " mb-4 rounded-md p-4 shadow") },
+            React.createElement("div", { className: 'flex animate-pulse space-x-4' },
+                React.createElement("div", { className: 'flex-1 space-y-6 py-1' },
+                    React.createElement("div", { className: 'h-2 rounded bg-slate-200' }),
+                    React.createElement("div", { className: 'space-y-3' },
+                        React.createElement("div", { className: 'grid grid-cols-3 gap-4' },
+                            React.createElement("div", { className: 'col-span-2 h-2 rounded bg-slate-200' }),
+                            React.createElement("div", { className: 'col-span-1 h-2 rounded bg-slate-200' })),
+                        React.createElement("div", { className: 'h-2 rounded bg-slate-200' }))))),
+        React.createElement("div", { className: "".concat(skeletonClass, " mb-4 rounded-md p-4 shadow") },
+            React.createElement("div", { className: 'flex animate-pulse space-x-4' },
+                React.createElement("div", { className: 'flex-1 space-y-6 py-1' },
+                    React.createElement("div", { className: 'h-2 rounded bg-slate-200' }),
+                    React.createElement("div", { className: 'space-y-3' },
+                        React.createElement("div", { className: 'grid grid-cols-3 gap-4' },
+                            React.createElement("div", { className: 'col-span-2 h-2 rounded bg-slate-200' }),
+                            React.createElement("div", { className: 'col-span-1 h-2 rounded bg-slate-200' })),
+                        React.createElement("div", { className: 'h-2 rounded bg-slate-200' })))))));
+}
+//# sourceMappingURL=SkeletonLarge.js.map

package/dist/esm/components/Skeleton/SkeletonLarge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SkeletonLarge.js","sourceRoot":"","sources":["../../../../src/components/Skeleton/SkeletonLarge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAOrC,MAAM,UAAU,gBAAgB,CAAC,EAAkD;QAAhD,YAAoB,EAApB,IAAI,mBAAG,aAAa,KAAA,EAAE,SAAS,eAAA;IAChE,IAAM,aAAa,GAAG,UAAU,CAC9B,IAAI,KAAK,OAAO,IAAI,2BAA2B,EAC/C,IAAI,KAAK,QAAQ,IAAI,2BAA2B,EAChD,IAAI,KAAK,OAAO,IAAI,4BAA4B,EAChD,IAAI,KAAK,aAAa,IAAI,gBAAgB,CAC3C,CAAA;IAED,OAAO,CACL,6BAAK,SAAS,EAAE,SAAS;QACvB,6BAAK,SAAS,EAAE,UAAG,aAAa,gCAA6B;YAC3D,6BAAK,SAAS,EAAC,8BAA8B;gBAC3C,6BAAK,SAAS,EAAC,uBAAuB;oBACpC,6BAAK,SAAS,EAAC,0BAA0B,GAAG;oBAC5C,6BAAK,SAAS,EAAC,WAAW;wBACxB,6BAAK,SAAS,EAAC,wBAAwB;4BACrC,6BAAK,SAAS,EAAC,qCAAqC,GAAG;4BACvD,6BAAK,SAAS,EAAC,qCAAqC,GAAG,CACnD;wBACN,6BAAK,SAAS,EAAC,0BAA0B,GAAG,CACxC,CACF,CACF,CACF;QACN,6BAAK,SAAS,EAAE,UAAG,aAAa,gCAA6B;YAC3D,6BAAK,SAAS,EAAC,8BAA8B;gBAC3C,6BAAK,SAAS,EAAC,uBAAuB;oBACpC,6BAAK,SAAS,EAAC,0BAA0B,GAAG;oBAC5C,6BAAK,SAAS,EAAC,WAAW;wBACxB,6BAAK,SAAS,EAAC,wBAAwB;4BACrC,6BAAK,SAAS,EAAC,qCAAqC,GAAG;4BACvD,6BAAK,SAAS,EAAC,qCAAqC,GAAG,CACnD;wBACN,6BAAK,SAAS,EAAC,0BAA0B,GAAG,CACxC,CACF,CACF,CACF;QACN,6BAAK,SAAS,EAAE,UAAG,aAAa,gCAA6B;YAC3D,6BAAK,SAAS,EAAC,8BAA8B;gBAC3C,6BAAK,SAAS,EAAC,uBAAuB;oBACpC,6BAAK,SAAS,EAAC,0BAA0B,GAAG;oBAC5C,6BAAK,SAAS,EAAC,WAAW;wBACxB,6BAAK,SAAS,EAAC,wBAAwB;4BACrC,6BAAK,SAAS,EAAC,qCAAqC,GAAG;4BACvD,6BAAK,SAAS,EAAC,qCAAqC,GAAG,CACnD;wBACN,6BAAK,SAAS,EAAC,0BAA0B,GAAG,CACxC,CACF,CACF,CACF,CACF,CACP,CAAA;AACH,CAAC"}

package/dist/esm/components/Table/SkeletonLarge.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export default function SkeletonLarge(): JSX.Element;

package/dist/esm/components/Table/SkeletonLarge.js

@@ -0,0 +1,32 @@
+import React from 'react';
+export default function SkeletonLarge() {
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", { className: 'mx-auto mb-4 w-full rounded-md p-4 shadow' },
+            React.createElement("div", { className: 'flex animate-pulse space-x-4' },
+                React.createElement("div", { className: 'flex-1 space-y-6 py-1' },
+                    React.createElement("div", { className: 'h-2 rounded bg-slate-200' }),
+                    React.createElement("div", { className: 'space-y-3' },
+                        React.createElement("div", { className: 'grid grid-cols-3 gap-4' },
+                            React.createElement("div", { className: 'col-span-2 h-2 rounded bg-slate-200' }),
+                            React.createElement("div", { className: 'col-span-1 h-2 rounded bg-slate-200' })),
+                        React.createElement("div", { className: 'h-2 rounded bg-slate-200' }))))),
+        React.createElement("div", { className: 'mx-auto mb-4 w-full rounded-md p-4 shadow' },
+            React.createElement("div", { className: 'flex animate-pulse space-x-4' },
+                React.createElement("div", { className: 'flex-1 space-y-6 py-1' },
+                    React.createElement("div", { className: 'h-2 rounded bg-slate-200' }),
+                    React.createElement("div", { className: 'space-y-3' },
+                        React.createElement("div", { className: 'grid grid-cols-3 gap-4' },
+                            React.createElement("div", { className: 'col-span-2 h-2 rounded bg-slate-200' }),
+                            React.createElement("div", { className: 'col-span-1 h-2 rounded bg-slate-200' })),
+                        React.createElement("div", { className: 'h-2 rounded bg-slate-200' }))))),
+        React.createElement("div", { className: 'mx-auto mb-4 w-full rounded-md p-4 shadow' },
+            React.createElement("div", { className: 'flex animate-pulse space-x-4' },
+                React.createElement("div", { className: 'flex-1 space-y-6 py-1' },
+                    React.createElement("div", { className: 'h-2 rounded bg-slate-200' }),
+                    React.createElement("div", { className: 'space-y-3' },
+                        React.createElement("div", { className: 'grid grid-cols-3 gap-4' },
+                            React.createElement("div", { className: 'col-span-2 h-2 rounded bg-slate-200' }),
+                            React.createElement("div", { className: 'col-span-1 h-2 rounded bg-slate-200' })),
+                        React.createElement("div", { className: 'h-2 rounded bg-slate-200' })))))));
+}
+//# sourceMappingURL=SkeletonLarge.js.map

package/dist/esm/components/Table/SkeletonLarge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SkeletonLarge.js","sourceRoot":"","sources":["../../../../src/components/Table/SkeletonLarge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,MAAM,CAAC,OAAO,UAAU,aAAa;IACnC,OAAO,CACL;QACE,6BAAK,SAAS,EAAC,2CAA2C;YACxD,6BAAK,SAAS,EAAC,8BAA8B;gBAC3C,6BAAK,SAAS,EAAC,uBAAuB;oBACpC,6BAAK,SAAS,EAAC,0BAA0B,GAAG;oBAC5C,6BAAK,SAAS,EAAC,WAAW;wBACxB,6BAAK,SAAS,EAAC,wBAAwB;4BACrC,6BAAK,SAAS,EAAC,qCAAqC,GAAG;4BACvD,6BAAK,SAAS,EAAC,qCAAqC,GAAG,CACnD;wBACN,6BAAK,SAAS,EAAC,0BAA0B,GAAG,CACxC,CACF,CACF,CACF;QACN,6BAAK,SAAS,EAAC,2CAA2C;YACxD,6BAAK,SAAS,EAAC,8BAA8B;gBAC3C,6BAAK,SAAS,EAAC,uBAAuB;oBACpC,6BAAK,SAAS,EAAC,0BAA0B,GAAG;oBAC5C,6BAAK,SAAS,EAAC,WAAW;wBACxB,6BAAK,SAAS,EAAC,wBAAwB;4BACrC,6BAAK,SAAS,EAAC,qCAAqC,GAAG;4BACvD,6BAAK,SAAS,EAAC,qCAAqC,GAAG,CACnD;wBACN,6BAAK,SAAS,EAAC,0BAA0B,GAAG,CACxC,CACF,CACF,CACF;QACN,6BAAK,SAAS,EAAC,2CAA2C;YACxD,6BAAK,SAAS,EAAC,8BAA8B;gBAC3C,6BAAK,SAAS,EAAC,uBAAuB;oBACpC,6BAAK,SAAS,EAAC,0BAA0B,GAAG;oBAC5C,6BAAK,SAAS,EAAC,WAAW;wBACxB,6BAAK,SAAS,EAAC,wBAAwB;4BACrC,6BAAK,SAAS,EAAC,qCAAqC,GAAG;4BACvD,6BAAK,SAAS,EAAC,qCAAqC,GAAG,CACnD;wBACN,6BAAK,SAAS,EAAC,0BAA0B,GAAG,CACxC,CACF,CACF,CACF,CACL,CACJ,CAAA;AACH,CAAC"}

package/dist/esm/components/Table/Spinner.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export default function Spinner(): JSX.Element;

package/dist/esm/components/Table/Spinner.js

@@ -0,0 +1,5 @@
+import React from 'react';
+export default function Spinner() {
+    return (React.createElement("div", { "aria-label": 'loading1', className: 'inline-block h-5 w-5 animate-spin rounded-full border-[3px] border-current border-t-transparent text-indigo-600', role: 'status' }));
+}
+//# sourceMappingURL=Spinner.js.map

package/dist/esm/components/Table/Spinner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Spinner.js","sourceRoot":"","sources":["../../../../src/components/Table/Spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,MAAM,CAAC,OAAO,UAAU,OAAO;IAC7B,OAAO,CACL,2CACa,UAAU,EACrB,SAAS,EAAC,iHAAiH,EAC3H,IAAI,EAAC,QAAQ,GACb,CACH,CAAA;AACH,CAAC"}

package/dist/esm/components/Test/Test.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+export interface InputProps {
+    className?: string;
+    props?: any;
+}
+export declare const Test: () => JSX.Element;

package/dist/esm/components/Test/Test.js

@@ -0,0 +1,7 @@
+import React from 'react';
+import { Input } from '../Input';
+export var Test = function () {
+    return (React.createElement("form", null,
+        React.createElement(Input, { autoComplete: 'on', defaultValue: 'abc' })));
+};
+//# sourceMappingURL=Test.js.map

package/dist/esm/components/Test/Test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Test.js","sourceRoot":"","sources":["../../../../src/components/Test/Test.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAOhC,MAAM,CAAC,IAAM,IAAI,GAAG;IAClB,OAAO,CACL;QACE,oBAAC,KAAK,IAAC,YAAY,EAAC,IAAI,EAAC,YAAY,EAAC,KAAK,GAAG,CACzC,CACR,CAAA;AACH,CAAC,CAAA"}

package/dist/esm/components/Test/index.d.ts

@@ -0,0 +1 @@
+export * from './Test';

package/dist/esm/components/Test/index.js

@@ -0,0 +1,2 @@
+export * from './Test';
+//# sourceMappingURL=index.js.map

package/dist/esm/components/Test/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Test/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAA"}

package/dist/esm/components/WrapTable/WrapTable.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+export interface TableProps {
+    color?: 'indigo' | 'gray';
+    className?: string;
+}
+export declare const WrapTable: ({ color, className }: TableProps) => JSX.Element;

package/dist/esm/components/WrapTable/WrapTable.js

@@ -0,0 +1,8 @@
+import React from 'react';
+import { classNames } from '../types';
+export var WrapTable = function (_a) {
+    var _b = _a.color, color = _b === void 0 ? 'indigo' : _b, _c = _a.className, className = _c === void 0 ? 'w-5 h-5' : _c;
+    var colorMaker = classNames(color === 'indigo' && 'text-indigo-600', color === 'gray' && 'text-gray-600');
+    return (React.createElement("div", { className: "animate-spin inline-block ".concat(className, " border-[3px] border-current border-t-transparent ").concat(colorMaker, " rounded-full"), role: 'status', "aria-label": 'loading1' }));
+};
+//# sourceMappingURL=WrapTable.js.map

package/dist/esm/components/WrapTable/WrapTable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"WrapTable.js","sourceRoot":"","sources":["../../../../src/components/WrapTable/WrapTable.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAOrC,MAAM,CAAC,IAAM,SAAS,GAAG,UAAC,EAAuD;QAArD,aAAgB,EAAhB,KAAK,mBAAG,QAAQ,KAAA,EAAE,iBAAqB,EAArB,SAAS,mBAAG,SAAS,KAAA;IACjE,IAAM,UAAU,GAAG,UAAU,CAAC,KAAK,KAAK,QAAQ,IAAI,iBAAiB,EAAE,KAAK,KAAK,MAAM,IAAI,eAAe,CAAC,CAAA;IAC3G,OAAO,CACL,6BACE,SAAS,EAAE,oCAA6B,SAAS,+DAAqD,UAAU,kBAAe,EAC/H,IAAI,EAAC,QAAQ,gBACF,UAAU,GAChB,CACR,CAAA;AACH,CAAC,CAAA"}

package/dist/esm/components/WrapTable/index.d.ts

@@ -0,0 +1 @@
+export * from './WrapTable';

package/dist/esm/components/WrapTable/index.js

@@ -0,0 +1,2 @@
+export * from './WrapTable';
+//# sourceMappingURL=index.js.map

package/dist/esm/components/WrapTable/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/WrapTable/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA"}

package/dist/esm/demo/LoginDemo.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const LoginDemo: () => JSX.Element;

package/dist/esm/demo/LoginDemo.js

@@ -0,0 +1,8 @@
+import React from 'react';
+import { PHXLoginScreen } from '../components/LoginScreen/LoginScreen';
+import { ApolloWrapper } from '../lib/apollo-wrapper';
+export var LoginDemo = function () {
+    return (React.createElement(ApolloWrapper, null,
+        React.createElement(PHXLoginScreen, null)));
+};
+//# sourceMappingURL=LoginDemo.js.map

package/dist/esm/demo/LoginDemo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoginDemo.js","sourceRoot":"","sources":["../../../src/demo/LoginDemo.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,cAAc,EAAE,MAAM,uCAAuC,CAAA;AACtE,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAA;AAErD,MAAM,CAAC,IAAM,SAAS,GAAG;IACvB,OAAO,CACL,oBAAC,aAAa;QACZ,oBAAC,cAAc,OAAG,CACJ,CACjB,CAAA;AACH,CAAC,CAAA"}

package/dist/esm/index.d.ts

@@ -19,5 +19,6 @@ import PHXClientQuery from './components/Func/clientQueryV2';
 import PHXClientMutation from './components/Func/clientMutationV2';
 import { PHXTextarea } from './components/Textarea';
 import { PHXModal } from './components/Modal';
+import { PHXLoginScreen } from './components/LoginScreen';
 import { PHXTabs } from './components/Tabs';
-export { MyCounter, PHXButton, PHXCard, PHXSpinner, PHXMainWrap, PHXFormWrap, PHXHeaderBar, PHXTable, PHXInput, PHXSelect, PHXRadio, PHXCheckbox, PHXFormStep, PHXNotifications, PHXStep, PHXSkeleton, PHXFuncGetLoggedInfo, PHXClientQuery, PHXClientMutation, PHXTextarea, PHXModal, PHXTabs, };
+export { MyCounter, PHXButton, PHXCard, PHXSpinner, PHXMainWrap, PHXFormWrap, PHXHeaderBar, PHXTable, PHXInput, PHXSelect, PHXRadio, PHXCheckbox, PHXFormStep, PHXNotifications, PHXStep, PHXSkeleton, PHXFuncGetLoggedInfo, PHXClientQuery, PHXClientMutation, PHXTextarea, PHXModal, PHXLoginScreen, PHXTabs, };

package/dist/esm/index.js

@@ -19,6 +19,7 @@ import PHXClientQuery from './components/Func/clientQueryV2';
 import PHXClientMutation from './components/Func/clientMutationV2';
 import { PHXTextarea } from './components/Textarea';
 import { PHXModal } from './components/Modal';
+import { PHXLoginScreen } from './components/LoginScreen';
 import { PHXTabs } from './components/Tabs';
-export { MyCounter, PHXButton, PHXCard, PHXSpinner, PHXMainWrap, PHXFormWrap, PHXHeaderBar, PHXTable, PHXInput, PHXSelect, PHXRadio, PHXCheckbox, PHXFormStep, PHXNotifications, PHXStep, PHXSkeleton, PHXFuncGetLoggedInfo, PHXClientQuery, PHXClientMutation, PHXTextarea, PHXModal, PHXTabs, };
+export { MyCounter, PHXButton, PHXCard, PHXSpinner, PHXMainWrap, PHXFormWrap, PHXHeaderBar, PHXTable, PHXInput, PHXSelect, PHXRadio, PHXCheckbox, PHXFormStep, PHXNotifications, PHXStep, PHXSkeleton, PHXFuncGetLoggedInfo, PHXClientQuery, PHXClientMutation, PHXTextarea, PHXModal, PHXLoginScreen, PHXTabs, };
 //# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAA;AAC3C,OAAO,SAAS,MAAM,kBAAkB,CAAA;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAA;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAA;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAA;AACjD,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AACnD,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAA;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AACnD,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAA;AACrD,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAA;AAC7C,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAA;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAA;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AACnD,OAAO,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAA;AAC7D,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AACnD,OAAO,oBAAoB,MAAM,gCAAgC,CAAA;AACjE,OAAO,cAAc,MAAM,iCAAiC,CAAA;AAC5D,OAAO,iBAAiB,MAAM,oCAAoC,CAAA;AAClE,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AACnD,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAA;AAC7C,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAA;AAE3C,OAAO,EACL,SAAS,EACT,SAAS,EACT,OAAO,EACP,UAAU,EACV,WAAW,EACX,WAAW,EACX,YAAY,EACZ,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,WAAW,EACX,WAAW,EACX,gBAAgB,EAChB,OAAO,EACP,WAAW,EACX,oBAAoB,EACpB,cAAc,EACd,iBAAiB,EACjB,WAAW,EACX,QAAQ,EACR,OAAO,GACR,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAA;AAC3C,OAAO,SAAS,MAAM,kBAAkB,CAAA;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAA;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAA;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAA;AACjD,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AACnD,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAA;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AACnD,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAA;AACrD,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAA;AAC7C,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAA;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAA;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AACnD,OAAO,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAA;AAC7D,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AACnD,OAAO,oBAAoB,MAAM,gCAAgC,CAAA;AACjE,OAAO,cAAc,MAAM,iCAAiC,CAAA;AAC5D,OAAO,iBAAiB,MAAM,oCAAoC,CAAA;AAClE,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AACnD,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAA;AAC7C,OAAO,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAA;AACzD,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAA;AAE3C,OAAO,EACL,SAAS,EACT,SAAS,EACT,OAAO,EACP,UAAU,EACV,WAAW,EACX,WAAW,EACX,YAAY,EACZ,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,WAAW,EACX,WAAW,EACX,gBAAgB,EAChB,OAAO,EACP,WAAW,EACX,oBAAoB,EACpB,cAAc,EACd,iBAAiB,EACjB,WAAW,EACX,QAAQ,EACR,cAAc,EACd,OAAO,GACR,CAAA"}

package/dist/esm/utils/loginQuery.d.ts

@@ -0,0 +1 @@
+export declare const getUserInfo: import("@apollo/client").DocumentNode;

package/dist/esm/utils/loginQuery.js

@@ -0,0 +1,5 @@
+import { __makeTemplateObject } from "tslib";
+import { gql } from '@apollo/client';
+export var getUserInfo = gql(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  query GetUsers($email: String, $password: String) {\n    users(where: { email: { _eq: $email }, v2_password: { _eq: $password } }) {\n      email\n      v2_password\n      id\n      school_info_id\n      user_id\n      user_role_id\n      user_type\n      avatar\n      name\n      created_at\n      deleted_at\n      updated_at\n    }\n  }\n"], ["\n  query GetUsers($email: String, $password: String) {\n    users(where: { email: { _eq: $email }, v2_password: { _eq: $password } }) {\n      email\n      v2_password\n      id\n      school_info_id\n      user_id\n      user_role_id\n      user_type\n      avatar\n      name\n      created_at\n      deleted_at\n      updated_at\n    }\n  }\n"])));
+var templateObject_1;
+//# sourceMappingURL=loginQuery.js.map

package/dist/esm/utils/loginQuery.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"loginQuery.js","sourceRoot":"","sources":["../../../src/utils/loginQuery.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,gBAAgB,CAAA;AAEpC,MAAM,CAAC,IAAM,WAAW,GAAG,GAAG,+ZAAA,4VAiB7B,IAAA,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "phx-react",
-  "version": "1.3.14",
+  "version": "1.3.15",
   "description": "My first react typescript package",
   "main": "./dist/cjs/index.js",
   "module": "./dist/esm/index.js",
@@ -81,7 +81,8 @@
     "tailwindcss": "^3.3.3",
     "ts-jest": "^28.0.4",
     "typescript": "^4.7.3",
-    "vite": "^4.3.9"
+    "vite": "^4.3.9",
+    "webpack": "^5.88.2"
   },
   "eslintConfig": {
     "extends": [
@@ -94,4 +95,4 @@
     "@fortawesome/react-fontawesome": "^0.2.0",
     "js-cookie": "^3.0.5"
   }
-}
+}