UNPKG

myprojectpackageprav

Version:
74 lines 7.03 kB
import React, { useState } from "react"; import Buttons from "../../../components/buttons/buttons"; import { FormTooltipsdata } from './formtooltips-data'; import InputText from "../../../utils/controls/input-text"; var FormTooltips = function () { var _a = useState(false), showedit = _a[0], setshowedit = _a[1]; var listItems = FormTooltipsdata.map(function (links) { return React.createElement(React.Fragment, null, React.createElement("li", { tabIndex: 0, "aria-live": "polite", className: "border-radius my-2 p-relative list-type-none bordered1 whitebg" }, React.createElement("div", { className: "d-flex flex-row flex-lg-row align-items-center justify-content-lg-between w-100 flex-wrap settingformtooltips py-2 px-3" }, React.createElement("div", { className: "my-1 col-12 Labelname" }, React.createElement("div", { className: "subtitle-color font-12 montserratSemibold pb-1" }, links.titlelabel), React.createElement("div", { className: "darktext font-12 montserratSemibold" }, links.titlelabelname)), React.createElement("div", { className: "dividerdashed vertical mx-2 d-none d-lg-block" }), React.createElement("div", { className: "my-1 col-12 LabelID" }, React.createElement("div", { className: "subtitle-color font-12 montserratSemibold pb-1" }, links.labelid), React.createElement("div", { className: "darktext font-12 montserratSemibold" }, links.titlelabelid)), React.createElement("div", { className: "dividerdashed vertical mx-2 d-none d-lg-block" }), React.createElement("div", { className: "my-1 col-12 Description" }, React.createElement("div", { className: "subtitle-color font-12 montserratSemibold pb-1" }, links.Descriptionlabel), React.createElement("div", { className: "darktext font-12 montserratSemibold" }, links.Descriptioncontent)), React.createElement("div", { className: "dividerdashed vertical mx-2 d-none d-lg-block" }), React.createElement("div", { className: "my-1 col-12 Modified" }, React.createElement("div", { className: "subtitle-color font-12 montserratSemibold pb-1" }, links.modifiedlabel), React.createElement("div", { className: "darktext font-12 montserratSemibold" }, links.modifiedcontent)), React.createElement("div", { className: "dividerdashed vertical mx-2 d-none d-lg-block" }), React.createElement("div", { className: "d-flex align-items-center col-12 Actions flex-wrap me-2" }, React.createElement(Buttons, { label: "Edit", className: 'btn-sm sourcesansprosemibold font-12 btn-bgcolor10 title-color1 border-radius text-uppercase text-nowrap my-1 mx-2', icon: "icon-pencil font-10 pe-1", type: "button", onClick: function () { setshowedit(true); } }))), showedit ? (React.createElement("div", { className: "settingseditpopup w-100 position-relative p-3 mb-3 bordered0 border-top " }, React.createElement("div", { className: "row" }, React.createElement("div", { className: "col-sm-12 col-lg-12 mb-2" }, React.createElement(InputText, { inputProps: { id: " LabelName ", name: " Label Name", placeholder: "Enter Label Name", className: "latomedium font-13 darktext mb-2", }, label: "Label Name", isMandatory: true, infoClassName: "tool-tip tooltip-top", info: "Label Name", infoIcon: "icon-info", isInfo: true, readonly: true, formClassName: "d-flex flex-column" })), React.createElement("div", { className: "col-sm-12 col-lg-12 mb-2" }, React.createElement(InputText, { inputProps: { id: "LabelID", name: "Label Id", placeholder: "Enter Label Id", className: "latomedium font-13 darktext mb-2", }, label: " Label Id", infoClassName: "tool-tip tooltip-top font-12 p-1", info: "Label Id", infoIcon: "icon-info", isInfo: true, isMandatory: true, readonly: true, formClassName: "d-flex flex-column" })), React.createElement("div", { className: "col-sm-12 col-lg-12 mb-2" }, React.createElement(InputText, { inputProps: { id: "Description ", name: "Description", placeholder: "Enter Description", className: "latomedium font-13 darktext mb-2", }, label: "Description", infoClassName: "tool-tip tooltip-top font-12 p-1", info: "Description", infoIcon: "icon-info", isInfo: true, isMandatory: true, formClassName: "d-flex flex-column" }))), React.createElement("div", { className: "d-flex py-1 flex-wrap" }, React.createElement("div", { className: "ms-auto settingsbtns d-flex" }, React.createElement(Buttons, { label: "Update", className: "border-radius py-1 px-2 btn-bgcolor11 ms-2 whitetext montserratbold font-12 text-uppercase btn-xs", icon: "icon-update font-11 pe-1", type: "button" }), React.createElement(Buttons, { label: "Cancel", className: "py-1 px-2 border-radius btn-border1 ms-2 montserratbold font-12 text-uppercase btn-xs", icon: "icon-close color-primary font-9 pe-1", type: "button", onClick: function () { setshowedit(false); } }))))) : (""))); }); return (React.createElement(React.Fragment, null, React.createElement("div", { className: "mb-2 d-flex align-items-center bgcolor-primary px-2 py-1 whitetext border-radius1 " }, React.createElement("div", { className: "d-flex align-items-center py-2" }, React.createElement("h2", { tabIndex: 0, "aria-label": 'Form Tooltips', className: "font-14 d-flex align-items-center" }, " ", React.createElement("span", { className: "icon-info font-13 pe-2" }), "Form Tooltips"))), React.createElement("div", { className: "py-0" }, React.createElement("div", { className: "" }, React.createElement("div", { className: "list w-100" }, React.createElement("ul", { className: "m-0 p-0" }, listItems)))))); }; export default FormTooltips; //# sourceMappingURL=formtooltips.js.map