myprojectpackageprav
Version:
My package in npm
81 lines • 6.93 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var react_1 = tslib_1.__importStar(require("react"));
var buttons_1 = tslib_1.__importDefault(require("../../components/buttons/buttons"));
var instractions_1 = tslib_1.__importDefault(require("../../components/instractions/instractions"));
var formvalidation_msgs_1 = tslib_1.__importDefault(require("../../components/formvalidation-msgs/formvalidation-msgs"));
require("./createform.css");
//export default function CreateForm() {
var CreateForm = function (props, ref) {
var _a = (0, react_1.useState)(false), show = _a[0], setShow = _a[1];
var handleOpen = function () {
setShow(!show); // Toggle accordion
};
var _b = (0, react_1.useState)(false), showSubmit = _b[0], setSubmit = _b[1];
var _c = (0, react_1.useState)(false), showbottomSubmit = _c[0], setbottomSubmit = _c[1];
var _d = (0, react_1.useState)({
close: false
}), btnActionshowhide = _d[0], setActionbtnshowhide = _d[1];
var closeRef = null;
var clickedType = '';
function popupCloseOpenFunctionality(type, val) {
clickedType = type;
setActionbtnshowhide(tslib_1.__assign(tslib_1.__assign({}, btnActionshowhide), { close: false }));
if (type) {
setActionbtnshowhide(tslib_1.__assign(tslib_1.__assign({}, btnActionshowhide), { type: true }));
buttonRefferences(type);
}
if (val === "top") {
setSubmit(!showSubmit);
}
else {
setbottomSubmit(!showbottomSubmit);
}
}
function buttonRefferences(type) {
var _a;
if (type !== "close") {
(_a = closeRef === null || closeRef === void 0 ? void 0 : closeRef.current) === null || _a === void 0 ? void 0 : _a.closeBtn();
}
}
return (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement("div", { className: "py-2 px-3 whitebg shadow1 d-flex flex-column flex-sm-row align-items-md-center" },
react_1.default.createElement("div", { className: "d-flex align-items-center py-1" },
" ",
react_1.default.createElement("h2", { className: "poppins-semibold font-18", tabIndex: 0, "aria-label": "Form Title" }, "Form Title"),
react_1.default.createElement(buttons_1.default, { label: "Instructions", className: 'mx-2 btn-sm d-flex align-items-center whitetext btn-bgcolor3 btn-border-radius3 sourcesanspro font-13', ricon: show ? 'icon-arrow-down ms-1 font-12 rotate' : 'icon-arrow-down ms-1 font-12', type: "button", onClick: handleOpen })),
react_1.default.createElement("div", { className: "ms-auto formbuttons" },
react_1.default.createElement("ul", { className: 'd-flex list-type-none gap-1' },
react_1.default.createElement("li", null,
react_1.default.createElement(buttons_1.default, { label: "Close", className: 'btn-border1 btn-border-radius3 montserratbold font-0 font-md-12 text-uppercase title-color5 btn-hover', icon: "icon-close font-10 pe-md-1 title-color6", type: "button" })),
react_1.default.createElement("li", null,
react_1.default.createElement(buttons_1.default, { label: "Save As Draft", className: 'btn-border1 btn-border-radius3 montserratbold font-0 font-md-12 text-uppercase title-color5 btn-hover', icon: "icon-save font-10 pe-md-1 title-color6", type: "button" })),
react_1.default.createElement("li", null,
react_1.default.createElement(buttons_1.default, { label: "Submit", className: showSubmit ? 'btn-border1 btn-border-radius3 montserratbold font-0 font-md-12 text-uppercase title-color5 btn-hover active' : 'btn-border1 btn-border-radius3 montserratbold font-0 font-md-12 text-uppercase title-color5 btn-hover', icon: "icon-submite font-11 pe-md-1 title-color6", type: "button", onClick: function () {
setSubmit(!showSubmit);
setbottomSubmit(false);
} }))))),
react_1.default.createElement("div", { className: "container" },
react_1.default.createElement("div", { className: " mt-3" },
react_1.default.createElement("div", null, show && (react_1.default.createElement(instractions_1.default, null))),
react_1.default.createElement("div", { style: { display: showSubmit ? '' : 'none' } },
react_1.default.createElement(formvalidation_msgs_1.default, { popupCloseOpenFunctionality: popupCloseOpenFunctionality, ref: closeRef, qwer: "top" })),
react_1.default.createElement("div", { className: "whitebg border-radius p-3 min-h-400" }),
react_1.default.createElement("div", { style: { display: showbottomSubmit ? '' : 'none' } },
react_1.default.createElement(formvalidation_msgs_1.default, { popupCloseOpenFunctionality: popupCloseOpenFunctionality, ref: closeRef, qwer: "bottom" })),
react_1.default.createElement("div", { className: "formheader d-flex p-3 whitebg mt-3 " },
react_1.default.createElement("div", { className: "ms-auto formbuttons" },
react_1.default.createElement("ul", { className: 'd-flex list-type-none gap-1' },
react_1.default.createElement("li", null,
react_1.default.createElement(buttons_1.default, { label: "Close", className: 'btn-border1 btn-border-radius3 montserratbold font-0 font-md-12 text-uppercase title-color5 btn-hover', icon: "icon-close font-10 pe-md-1 title-color6", type: "button" })),
react_1.default.createElement("li", null,
react_1.default.createElement(buttons_1.default, { label: "Save As Draft", className: 'btn-border1 btn-border-radius3 montserratbold font-0 font-md-12 text-uppercase title-color5 btn-hover', icon: "icon-save font-10 pe-md-1 title-color6", type: "button" })),
react_1.default.createElement("li", null,
react_1.default.createElement(buttons_1.default, { label: "Submit", className: showSubmit ? 'btn-border1 btn-border-radius3 montserratbold font-0 font-md-12 text-uppercase title-color5 btn-hover active' : 'btn-border1 btn-border-radius3 montserratbold font-0 font-md-12 text-uppercase title-color5 btn-hover', icon: "icon-submite font-11 pe-md-1 title-color6", type: "button", onClick: function () {
setbottomSubmit(!showbottomSubmit);
setSubmit(false);
} })))))))));
};
exports.default = (0, react_1.forwardRef)(CreateForm);
//# sourceMappingURL=createform.js.map