sccoreui
Version:
ui-sccore
339 lines (338 loc) • 15.2 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("react/jsx-runtime");
// import { Button } from "primereact/button";
// import avatar from "../../assets/images/avatar.png";
// import SvgComponent from "../../directives/svg-component";
// import "./avatar.scss";
// import { Avatar } from "primereact/avatar";
// import { AvatarGroup } from "primereact/avatargroup";
// import profileimage from "../../assets/images/profile-square-image.png";
// // import FormComponent from "../../components/form/form";
// import FormFields from "../../components/form/form-fields/form-fields";
// import { object, number } from "yup";
// import TextEditor from "../../components/froala-editor/FroalaEditor";
// import { useState } from "react";
// const AvatarComponent = () => {
// const [text, setText] = useState<string>("");
// // const initVals = {
// // title: 0,
// // }
// const onChangeText = (e: any) => {
// setText(e);
// debugger
// }
// // const FormVals = (props: any) => {
// // const { errors, touched, isValid, values, setFieldValue } = props;
// // const triggerSubmit = (e: any) => {
// // console.log(e)
// // debugger
// // console.log(values);
// // // submitForm()
// // // resetForm()
// // }
// // return (
// // <div className="p-5">
// // <Button className={`p-button-xs ${isValid && Object.keys(touched).length === Object.keys(initVals).length ? '' : 'p-disabled'}`} type="submit" label="Create" onClick={(e: any) => triggerSubmit(e)} />
// // <FormFields.InputNumberField min={0} name={'title'} label={'Title'} setFieldValue={setFieldValue} length={'full'} placeholder={'Enter the plan title'} touched={touched} errors={errors} />
// // </div>
// // )
// // }
// // const validtionSchema = object().shape({
// // title: number().min(1,'error').max(24, 'err max').test("custom","invalid",(value: any) => {
// // if (value === "") {
// // return false
// // } else {
// // return true;
// // }
// // })
// // })
// const config = {
// placeholder: 'Enter text',
// charCounterCount: true,
// }
// return (
// <>
// <h2 className="flex bg-gray-200 p-3 justify-content-center mb-4">Tags</h2>
// <div className="grid">
// {/* <FormComponent values={initVals} validations={validtionSchema}>
// {
// ({errors, touched, isValid, values, actions,resetForm, submitForm, setFieldValue}: any) => (
// <FormVals errors={errors} touched={touched} isValid={isValid} values={values} actions={actions} resetForm={resetForm} submitForm={submitForm} setFieldValue={setFieldValue} />
// )
// }
// </FormComponent> */}
// <TextEditor config={config} model={text} onModelChange={onChangeText} />
// <div className="col-12 md:col-4 lg:col-3 px-7 flex align-items-center my-8 gap-3">
// <img
// src={avatar}
// className=" border-circle w-4rem h-4rem p-avatar-focus"
// />
// <div className="w-4rem h-4rem border-circle flex align-items-center justify-content-center relative ">
// <img
// src={avatar}
// className=" border-circle w-4rem h-4rem p-avatar-focus"
// />
// <span
// className="bg-green-500 w-1rem h-1rem border-circle absolute border-1 border-white"
// style={{
// position: "absolute",
// right: "0",
// bottom: "0",
// }}
// ></span>
// </div>
// <div className="w-4rem h-4rem border-circle flex align-items-center justify-content-center relative ">
// <img
// src={avatar}
// className=" border-circle w-4rem h-4rem p-avatar-focus"
// />
// <span
// className=" absolute "
// style={{
// right: "-2px",
// bottom: "-2px",
// }}
// >
// <SvgComponent icon="avatar-company-logo-2xl" />
// </span>
// </div>
// <div className="w-4rem h-4rem border-circle flex align-items-center justify-content-center relative ">
// <img
// src={avatar}
// className=" border-circle w-4rem h-4rem p-avatar-focus"
// />
// <span
// className=" absolute "
// style={{
// right: "-2px",
// bottom: "-2px",
// }}
// >
// <SvgComponent icon="verified-tick-2xl" />
// </span>
// </div>
// </div>
// <div className="col-12 md:col-4 lg:col-3 px-7 flex align-items-center my-8 gap-3">
// <span className="w-4rem h-4rem border-circle bg-gray-100 flex align-items-center relative justify-content-center border-3 border-transparent hover:border-gray-200">
// <SvgComponent icon="avatar-user-2xl" />
// </span>
// <span className="w-4rem h-4rem border-circle bg-gray-100 flex align-items-center relative justify-content-center border-3 border-transparent hover:border-gray-200">
// <SvgComponent icon="avatar-user-2xl" />
// <span
// className="bg-green-500 w-1rem h-1rem border-circle border-1 border-white"
// style={{
// position: "absolute",
// right: "0px",
// bottom: "0px",
// }}
// ></span>
// </span>
// <span className="w-4rem h-4rem border-circle bg-gray-100 text-2xl flex align-items-center text-gray-600 font-medium justify-content-center border-3 border-transparent hover:border-gray-200">
// OR
// </span>
// <span
// className="w-4rem h-4rem border-circle relative bg-gray-100 text-2xl flex align-items-center text-gray-600 font-medium relative justify-content-center border-3 border-transparent hover:border-gray-200"
// style={{ fontSize: "18px" }}
// >
// OR
// <span
// className="bg-green-500 w-1rem h-1rem border-circle absolute border-1 border-white"
// style={{
// position: "absolute",
// right: "0px",
// bottom: "0px",
// }}
// ></span>
// </span>
// <span className="w-4rem h-4rem border-circle relative bg-gray-100 text-xl flex align-items-center text-gray-600 font-medium relative justify-content-center border-3 border-transparent hover:border-gray-200">
// OR
// <span
// className="absolute "
// style={{
// position: "absolute",
// right: "-2px",
// bottom: "-2px",
// }}
// >
// <SvgComponent icon="avatar-company-logo-xl" />
// </span>
// </span>
// </div>
// <div className="col-12 md:col-4 lg:col-3 px-7 flex align-items-center my-8 gap-3">
// <Button
// rounded
// tooltipOptions={{ position: "top" }}
// tooltip="Add user"
// className="w-3rem h-3rem border-gray-300 border-1 bg-white avatar-button p-dark-tooltip border-dashed p-0 flex align-items-center justify-content-center"
// >
// <SvgComponent icon="avatar-button-plus" />
// </Button>
// <Button
// disabled
// rounded
// tooltipOptions={{ position: "top" }}
// tooltip="Add user"
// className="border-gray-300 border-1 avatar-button bg-white p-dark-tooltip border-dashed w-3rem h-3rem flex align-items-center justify-content-center"
// >
// <SvgComponent icon="avatar-button-plus" />
// </Button>
// </div>
// <div className="col-12 md:col-4 lg:col-3 px-7 flex align-items-center my-8 gap-3 my-8">
// <div className="flex align-items-center">
// <AvatarGroup>
// {/* you can define the size of the avatar using size property with "noraml, large, xlarge" values */}
// <Avatar image={avatar} shape="circle" size="large" />
// <Avatar image={avatar} shape="circle" size="large" />
// <Avatar image={avatar} shape="circle" size="large" />
// <Avatar image={avatar} shape="circle" size="large" />
// <Avatar image={avatar} shape="circle" size="large" />
// <Avatar
// label="+2"
// shape="circle"
// size="large"
// className="bg-gray-100 text-gray-600 text-base font-medium"
// />
// </AvatarGroup>
// <Button
// rounded
// tooltipOptions={{ position: "top" }}
// tooltip="Add user"
// className="border-gray-300 p-0 border-1 ml-1 bg-white avatar-button p-dark-tooltip border-dashed h-2rem w-2rem flex align-items-center justify-content-center"
// >
// <SvgComponent icon="avatar-button-plus" />
// </Button>
// </div>
// </div>
// <div className="col-12 md:col-4 lg:col-3 px-7 flex flex-wrap align-items-center my-8 gap-3 my-8">
// <div className="flex align-items-center gap-3">
// <img
// src={avatar}
// className=" border-circle w-2rem h-2rem p-avatar-focus"
// />
// <div className="flex flex-column">
// <span className="text-base font-semibold line-height-2">
// Olivia Rhye
// </span>
// <span className="text-sm font-normal line-height-2">
// olivia@untitledui.com
// </span>
// </div>
// </div>
// <div className="flex align-items-center gap-3">
// <div className="w-2rem h-2rem border-circle flex align-items-center justify-content-center relative ">
// <img
// src={avatar}
// className=" border-circle w-2rem h-2rem p-avatar-focus"
// />
// <span
// className="bg-green-500 green-online-indicator-sm border-circle absolute border-1 border-white"
// style={{
// position: "absolute",
// right: "0",
// bottom: "0",
// }}
// ></span>
// </div>
// <div className="flex flex-column">
// <span className="text-base font-semibold line-height-2">
// Olivia Rhye
// </span>
// <span className="text-sm font-normal line-height-2">
// olivia@untitledui.com
// </span>
// </div>
// </div>
// <div className="flex align-items-center gap-3">
// <div className="w-3rem h-3rem border-circle flex align-items-center justify-content-center relative ">
// <img
// src={avatar}
// className=" border-circle w-3rem h-3rem p-avatar-focus"
// />
// <span
// className=" absolute "
// style={{
// right: "-2px",
// bottom: "-2px",
// }}
// >
// <SvgComponent icon="avatar-company-logo-lg" />
// </span>
// </div>
// <div className="flex flex-column">
// <span className="text-lg font-semibold line-height-3">
// Olivia Rhye
// </span>
// <span className="text-lg font-normal line-height-3">
// olivia@untitledui.com
// </span>
// </div>
// </div>
// <div className="flex align-items-center gap-3">
// <div className="w-4rem h-4rem border-circle flex align-items-center justify-content-center relative ">
// <img
// src={avatar}
// className=" border-circle w-4rem h-4rem p-avatar-focus"
// />
// <span
// className=" absolute "
// style={{
// right: "-2px",
// bottom: "-2px",
// }}
// >
// <SvgComponent icon="verified-tick-xl" />
// </span>
// </div>
// <div className="flex flex-column">
// <span className="text-lg font-semibold line-height-3">
// Olivia Rhye
// </span>
// <span className="text-lg font-normal line-height-3">
// olivia@untitledui.com
// </span>
// </div>
// </div>
// </div>
// <div className="col-12 md:col-4 lg:col-3 px-7 flex flex-wrap align-items-center my-8 gap-3 my-8">
// <div className="w-6rem h-6rem border-circle flex align-items-center justify-content-center relative ">
// <img
// src={avatar}
// className=" border-circle border-3 border-white w-6rem h-6rem shadow-4"
// />
// <span
// className=" absolute "
// style={{
// right: "2px",
// bottom: "2px",
// }}
// >
// <SvgComponent icon="verified-tick-3xl" />
// </span>
// </div>
// </div>
// <div className="col-12 md:col-4 lg:col-3 px-7 flex flex-wrap align-items-center my-8 gap-3 my-8">
// <div className="w-10rem flex flex-column align-items-start">
// <img src={profileimage} alt="profile" className="h-10rem " />
// <span className="text-lg text-gray-900 line-height-3 pt-2">
// Olivia Rhye
// </span>
// <span className="flex align-items-center gap-2 line-height-3 ">
// <a href="www.google.com">
// <SvgComponent icon="link-01" />
// </a>
// <a href="www.google.com" className="text-gray-500 font-normal">
// Source
// </a>
// </span>
// </div>
// </div>
// </div>
// </>
// );
// };
// export default AvatarComponent;
const avatar = () => {
return ((0, jsx_runtime_1.jsx)("div", { children: "avatar" }));
};
exports.default = avatar;