sccoreui 5.6.8 → 5.6.9

package/dist/components/{AG-Grid → ag-grid}/ParentForGrid.js

@@ -3,8 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const AgGrid_1 = tslib_1.__importDefault(require("./AgGrid"));
-function ParentForGrid(props) {
-    console.log(props, 'props');
+function ParentForGrid() {
     return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(AgGrid_1.default, {}) }));
 }
 exports.default = ParentForGrid;

package/dist/types/components/ag-grid/ParentForGrid.d.ts

@@ -0,0 +1,2 @@
+declare function ParentForGrid(): import("react/jsx-runtime").JSX.Element;
+export default ParentForGrid;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sccoreui",
-  "version": "5.6.8",
+  "version": "5.6.9",
   "description": "ui-sccore",
   "main": "./dist/index.js",
   "module": "./dist/index.js",

package/dist/components/AG-Grid/Ag-Grid.js

@@ -1,33 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("@ag-grid-community/react");
-// import { RowModelType,ClientSideRowModelStep } from "@ag-grid-community/core";
-require("ag-grid-community/styles/ag-grid.css");
-require("ag-grid-community/styles/ag-theme-quartz.css");
-const core_1 = require("@ag-grid-community/core");
-const client_side_row_model_1 = require("@ag-grid-community/client-side-row-model");
-core_1.ModuleRegistry.registerModules([client_side_row_model_1.ClientSideRowModelModule]);
-const core_2 = require("@ag-grid-enterprise/core");
-const react_2 = require("react");
-// import { ColDef } from '@ag-grid-community/core';
-core_2.LicenseManager.setLicenseKey("Using_this_{AG_Grid}_Enterprise_key_{AG-056800}_in_excess_of_the_licence_granted_is_not_permitted___Please_report_misuse_to_legal@ag-grid.com___For_help_with_changing_this_key_please_contact_info@ag-grid.com___{Sellers_Commerce_LLC}_is_granted_a_{Single_Application}_Developer_License_for_the_application_{SellersCommerce}_only_for_{2}_Front-End_JavaScript_developers___All_Front-End_JavaScript_developers_working_on_{SellersCommerce}_need_to_be_licensed___{SellersCommerce}_has_been_granted_a_Deployment_License_Add-on_for_{1}_Production_Environment___This_key_works_with_{AG_Grid}_Enterprise_versions_released_before_{14_April_2025}____[v3]_[01]_MTc0NDU4NTIwMDAwMA==895f2234e1659afcfba586110daf0549");
-const columnDefs = [
-    { field: "make" },
-    { field: "model" },
-    { field: "price" }
-];
-const rowData = [
-    { make: "Toyota", model: "Celica", price: 35000 },
-    { make: "Ford", model: "Mondeo", price: 32000 },
-    { make: "Porsche", model: "Boxster", price: 72000 }
-];
-const AgGrid = () => {
-    const [gridApi, setGridApi] = (0, react_2.useState)(null);
-    const onGridReady = (0, react_2.useCallback)((params) => {
-        setGridApi(params.api);
-    }, []);
-    console.log(gridApi, 'grid api');
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "ag-theme-alpine", style: { height: 400, width: 600 } }, { children: (0, jsx_runtime_1.jsx)(react_1.AgGridReact, { columnDefs: columnDefs, rowData: rowData, onGridReady: onGridReady }) })));
-};
-exports.default = AgGrid;

package/dist/components/AG-Grid/Grid-Parent.js

@@ -1,10 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const Ag_Grid_1 = tslib_1.__importDefault(require("./Ag-Grid"));
-const AGGridComponent = (props) => {
-    console.log(props);
-    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(Ag_Grid_1.default, {}) }));
-};
-exports.default = AGGridComponent;

package/dist/pages/ag-grid/agGridPage.js

@@ -1,10 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-// import React from 'react'
-const Grid_Parent_1 = tslib_1.__importDefault(require("../../components/ag-grid/Grid-Parent"));
-const AgGridPage = () => {
-    return ((0, jsx_runtime_1.jsx)(Grid_Parent_1.default, {}));
-};
-exports.default = AgGridPage;

package/dist/pages/avatar/avatar.js

@@ -1,338 +0,0 @@
-"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;

package/dist/pages/badges/badge.js

@@ -1,73 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const badge_1 = require("primereact/badge");
-require("./badge.scss");
-const svg_component_1 = tslib_1.__importDefault(require("../../directives/svg-component"));
-const label_image_png_1 = tslib_1.__importDefault(require("../../assets/images/label-image.png"));
-const avatar_png_1 = tslib_1.__importDefault(require("../../assets/images/avatar.png"));
-const dropdown_1 = require("primereact/dropdown");
-const react_1 = require("react");
-const button_1 = require("primereact/button");
-const BadgeComponent = () => {
-    // dropdown badge state
-    const [selectedLabel, setSelectedLabel] = (0, react_1.useState)({
-        name: "Error",
-        code: "bg-red-500",
-        text_code: "text-red-700",
-        bg: "bg-red-50",
-    });
-    //dropdown badge options list
-    const labels = [
-        {
-            name: "Error",
-            code: "bg-red-500",
-            text_code: "text-red-700",
-            bg: "bg-red-50",
-        },
-        {
-            name: "Pending",
-            code: "bg-primary-500",
-            text_code: "text-primary-700",
-            bg: "bg-primary-50",
-        },
-        {
-            name: "Success",
-            code: "bg-green-500",
-            text_code: "text-green-700",
-            bg: "bg-green-50",
-        },
-    ];
-    // badge dropdown selected lablel templete
-    const selectedlabelTemplate = (option) => {
-        if (option) {
-            return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-2" }, { children: [(0, jsx_runtime_1.jsx)("span", { className: `${option.code} p-1 border-circle` }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: `${option.text_code}` }, { children: option.name }))] })));
-        }
-        return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-2" }, { children: [(0, jsx_runtime_1.jsx)("span", { className: `${selectedLabel.code} p-1 border-circle` }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: `${selectedLabel.text_code}` }, { children: selectedLabel.name }))] })));
-    };
-    // badge dropdown option lablel templete
-    const labelOptionTemplate = (option) => {
-        return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-2" }, { children: [(0, jsx_runtime_1.jsx)("span", { className: `${option.code} p-1 border-circle` }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: `${option.text_code}` }, { children: option.name }))] })));
-    };
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("h2", Object.assign({ className: "flex bg-gray-200 p-3 justify-content-center mb-4" }, { children: "Badges" })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "p-8 h-full w-full flex flex-column" }, { children: (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "grid " }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex col-12 md:col-6 lg:col-3 justify-content-around px-3" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "bg-green-50 border-round-2xl px-3 py-1 text-green-700" }, { children: "Label" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "bg-primary-50 border-round-2xl px-3 py-1 text-primary-700" }, { children: "Label" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "bg-red-50 border-round-2xl px-3 py-1 text-red-700" }, { children: "Label" }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex col-12 md:col-6 lg:col-3 justify-content-around px-3" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "bg-green-50 border-round-2xl px-3 border-1 border-green-600 py-1 text-green-700" }, { children: "Label" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "bg-primary-50 border-round-2xl px-3 border-1 border-primary-600 py-1 text-primary-700" }, { children: "Label" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "bg-red-50 border-round-2xl px-3 border-1 border-red-600 py-1 text-red-700" }, { children: "Label" }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex col-6 md:col-6 lg:col-3 justify-content-around px-3" }, { children: [(0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-green-50 border-round-2xl flex align-items-center gap-2 px-3 py-1 text-green-700" }, { children: [(0, jsx_runtime_1.jsx)("span", { className: "border-circle bg-green-600  p-1" }), " Label"] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-primary-50 border-round-2xl flex align-items-center gap-2 px-3 py-1 text-primary-700" }, { children: [(0, jsx_runtime_1.jsx)("span", { className: "border-circle bg-primary-600  p-1" }), " Label"] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-red-50 border-round-2xl flex align-items-center gap-2 px-3 py-1 text-red-700" }, { children: [(0, jsx_runtime_1.jsx)("span", { className: "border-circle bg-red-600  p-1" }), " Label"] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex col-6 md:col-6 lg:col-3 justify-content-around px-3" }, { children: [(0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-green-50 border-round-2xl flex align-items-center border-green-600 border-1 gap-2 px-3 py-1 text-green-700" }, { children: [(0, jsx_runtime_1.jsx)("span", { className: "border-circle bg-green-600 p-1" }), " Label"] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-primary-50 border-round-2xl flex align-items-center border-primary-600 border-1 gap-2 px-3 py-1 text-primary-700" }, { children: [(0, jsx_runtime_1.jsx)("span", { className: "border-circle bg-gray-600 p-1" }), " Label"] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-red-50 border-round-2xl flex align-items-center border-red-600 border-1 gap-2 px-3 py-1 text-red-700" }, { children: [(0, jsx_runtime_1.jsx)("span", { className: "border-circle bg-red-600 p-1" }), " Label"] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex col-6 md:col-6 lg:col-3 justify-content-around px-3" }, { children: [(0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-green-50 border-round-2xl flex align-items-center gap-2 px-3 py-1 text-green-700" }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_png_1.default, className: "h-1rem w-1rem" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "font-medium" }, { children: "Label" }))] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-primary-50 border-round-2xl flex align-items-center gap-2 px-3 py-1 text-primary-700" }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_png_1.default, className: "h-1rem w-1rem" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "font-medium" }, { children: "Label" }))] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-red-50 border-round-2xl flex align-items-center gap-2 px-3 py-1 text-red-700" }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_png_1.default, className: "h-1rem w-1rem" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "font-medium" }, { children: "Label" }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex col-6 md:col-6 lg:col-3 justify-content-around px-3" }, { children: [(0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-green-50 border-round-2xl flex align-items-center border-green-600 border-1 gap-2 px-3 py-1 text-green-700" }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_png_1.default, className: "h-1rem w-1rem" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "font-medium" }, { children: "Label" }))] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-primary-50 border-round-2xl flex align-items-center border-primary-600 border-1 gap-2 px-3 py-1 text-primary-700" }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_png_1.default, className: "h-1rem w-1rem" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "font-medium" }, { children: "Label" }))] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-red-50 border-round-2xl flex align-items-center border-red-600 border-1 gap-2 px-3 py-1 text-red-700" }, { children: [(0, jsx_runtime_1.jsx)("img", { src: avatar_png_1.default, className: "h-1rem w-1rem" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "font-medium" }, { children: "Label" }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex col-6 md:col-6 lg:col-3 justify-content-around px-3" }, { children: [(0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-green-50 border-round-2xl flex align-items-center gap-2 px-3 py-1 text-green-700" }, { children: [(0, jsx_runtime_1.jsx)("img", { src: label_image_png_1.default, className: "h-1rem w-1rem" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "font-medium" }, { children: "Label" }))] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: " bg-primary-50 border-round-2xl flex align-items-center gap-2 px-3 py-1 text-primary-700" }, { children: [(0, jsx_runtime_1.jsx)("img", { src: label_image_png_1.default, className: "h-1rem w-1rem" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "font-medium" }, { children: "Label" }))] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-red-50 border-round-2xl flex align-items-center gap-2 px-3 py-1 text-red-700" }, { children: [(0, jsx_runtime_1.jsx)("img", { src: label_image_png_1.default, className: "h-1rem w-1rem" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "font-medium" }, { children: "Label" }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex col-6 md:col-6 lg:col-3 justify-content-around px-3" }, { children: [(0, jsx_runtime_1.jsxs)("span", Object.assign({ className: " bg-green-50 border-round-2xl flex align-items-center border-green-600 border-1 gap-2 px-3 py-1 text-green-700" }, { children: [(0, jsx_runtime_1.jsx)("img", { src: label_image_png_1.default, className: "h-1rem w-1rem" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "font-medium" }, { children: "Label" }))] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-primary-50 border-round-2xl flex align-items-center border-primary-600 border-1 gap-2 px-3 py-1 text-primary-700" }, { children: [(0, jsx_runtime_1.jsx)("img", { src: label_image_png_1.default, className: "h-1rem w-1rem" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "font-medium" }, { children: "Label" }))] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-red-50 border-round-2xl flex align-items-center border-red-600 border-1 gap-2 px-3 py-1 text-red-700" }, { children: [(0, jsx_runtime_1.jsx)("img", { src: label_image_png_1.default, className: "h-1rem w-1rem" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "font-medium" }, { children: "Label" }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex col-6 md:col-6 lg:col-3 justify-content-around px-3" }, { children: [(0, jsx_runtime_1.jsxs)("span", Object.assign({ id: "badge-1-a", className: "bg-green-50 border-round-2xl font-medium flex align-items-center py-1 gap-2 px-3 text-green-700" }, { children: ["Label", (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "cursor-pointer", onClick: () => {
-                                                const el = document.getElementById("badge-1-a");
-                                                el.remove();
-                                            } }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "close-chip-green-500" }) }))] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ id: "badge-1-b", className: "bg-primary-50 border-round-2xl flex align-items-center py-1 gap-2 px-3 text-primary-700" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "font-medium" }, { children: "Label" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "cursor-pointer", onClick: () => {
-                                                const el = document.getElementById("badge-1-b");
-                                                el.remove();
-                                            } }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "close-chip-primary-500" }) }))] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ id: "badge-1-c", className: "bg-red-50 border-round-2xl flex align-items-center py-1 gap-2 px-3 text-red-700" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "font-medium" }, { children: "Label" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "cursor-pointer", onClick: () => {
-                                                const el = document.getElementById("badge-1-c");
-                                                el.remove();
-                                            } }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "close-chip-red-500" }) }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex col-6 md:col-6 lg:col-3 justify-content-around px-3" }, { children: [(0, jsx_runtime_1.jsxs)("span", Object.assign({ id: "badge-2-a", className: "bg-green-50 border-round-2xl flex align-items-center border-green-700 border-1 py-1 gap-2 px-3 text-green-700" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "font-medium" }, { children: "Label" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "cursor-pointer", onClick: () => {
-                                                const el = document.getElementById("badge-2-a");
-                                                el.remove();
-                                            } }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "close-chip-green-500" }) }))] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ id: "badge-2-b", className: "bg-primary-50 border-round-2xl flex align-items-center border-primary-700 border-1 py-1 gap-2 px-3 text-primary-700" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "font-medium" }, { children: "Label" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "cursor-pointer", onClick: () => {
-                                                const el = document.getElementById("badge-2-b");
-                                                el.remove();
-                                            } }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "close-chip-primary-500" }) }))] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ id: "badge-2-c", className: "bg-red-50 border-round-2xl flex align-items-center border-red-700 border-1 py-1 gap-2 px-3 text-red-700" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "font-medium" }, { children: "Label" })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "cursor-pointer", onClick: () => {
-                                                const el = document.getElementById("badge-2-c");
-                                                el.remove();
-                                            } }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "close-chip-red-500" }) }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex col-6 md:col-6 lg:col-3 justify-content-around px-3" }, { children: [(0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-green-50 border-round-2xl flex align-items-center  py-1 gap-2 px-3 text-green-700" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "font-medium" }, { children: "Label" })), (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-green-600" })] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-primary-50 border-round-2xl flex align-items-center  py-1 gap-2 px-3 text-primary-700" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "font-medium" }, { children: "Label" })), (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-primary-600" })] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-red-50 border-round-2xl flex align-items-center  py-1 gap-2 px-3 text-red-700" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "font-medium" }, { children: "Label" })), (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-red-600" })] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex col-6 md:col-6 lg:col-3 justify-content-around px-3" }, { children: [(0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-green-50 border-round-2xl flex align-items-center border-green-700 border-1 py-1 gap-2 px-3 text-green-700" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "font-medium" }, { children: "Label" })), (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-green-600" })] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-primary-50 border-round-2xl flex align-items-center border-primary-700 border-1 py-1 gap-2 px-3 text-primary-700" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "font-medium" }, { children: "Label" })), (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-primary-600" })] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-red-100 border-round-2xl flex align-items-center border-red-700 border-1 py-1 gap-2 px-3 text-red-700" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "font-medium" }, { children: "Label" })), (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-red-600" })] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex col-6 md:col-6 lg:col-3 justify-content-around px-3" }, { children: [(0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-green-50 border-round-2xl flex align-items-center border-green-600 border-1 py-1 gap-2 px-3 text-green-700" }, { children: [(0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-top-green-600" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "font-medium" }, { children: "Label" }))] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-primary-50 border-round-2xl flex align-items-center border-primary-600 border-1 py-1 gap-2 px-3 text-primary-700" }, { children: [(0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-top-primary-600" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "font-medium" }, { children: "Label" }))] })), (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-red-50 border-round-2xl flex align-items-center border-red-600 border-1 py-1 gap-2 px-3 text-red-700" }, { children: [(0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-top-red-600" }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "font-medium" }, { children: "Label" }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex col-6 md:col-6 lg:col-3 justify-content-around px-3" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "bg-green-50 border-circle flex align-items-center justify-content-center border-green-600 border-1 p-3 text-green-700" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-top-green-600" }) })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "bg-primary-50 border-circle flex align-items-center justify-content-center border-primary-600 border-1 p-3 text-primary-700" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-top-primary-600" }) })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "bg-red-50 border-circle flex align-items-center justify-content-center border-red-600 border-1 p-3 text-red-700" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-top-red-600" }) }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex col-6 md:col-6 lg:col-3 justify-content-around px-3" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "bg-green-50 border-circle flex align-items-center justify-content-center  p-3 text-green-700" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-top-green-600" }) })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "bg-primary-50 border-circle flex align-items-center justify-content-center  p-3 text-primary-700" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-top-primary-600" }) })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "bg-red-50 border-circle flex align-items-center justify-content-center  p-3 text-red-700" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-top-red-600" }) }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex col-6 md:col-6 lg:col-3 justify-content-around px-3" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "bg-green-50 border-circle flex align-items-center justify-content-center  p-3 text-green-700" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "plus-icon-green-600" }) })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "bg-primary-100 border-circle flex align-items-center justify-content-center  p-3 text-primary-700" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "plus-icon-primary-600" }) })), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "bg-red-100 border-circle flex align-items-center justify-content-center  p-3 text-red-700" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "plus-icon-red-600" }) }))] })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "flex col-6 md:col-6 lg:col-3 justify-content-around px-3" }, { children: (0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { value: selectedLabel, onChange: (e) => setSelectedLabel(e.value), options: labels, optionLabel: "name", placeholder: selectedLabel.name, className: `shadow-none p-dropdown-badge py-0 ${selectedLabel.bg} border-0 text-red-500  flex align-items-center justify-content-center border-round-3xl`, valueTemplate: selectedlabelTemplate, itemTemplate: labelOptionTemplate }) })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "col-6 md:col-6 lg:col-3 px-3 gap-3 flex flex-column" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "bg-green-50  pl-1 pr-4 py-1 flex align-items-center justify-content-between border-round-3xl text-md font-medium text-green-700" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "bg-white flex align-items-center justify-content-center border-round-2xl py-1 px-3 text-green-700 text-md font-medium" }, { children: "Sample text" })), "We\u2019ve just released a new feature", (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-green-600" })] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "bg-primary-50  pl-1 pr-4 py-1 flex align-items-center justify-content-between border-round-3xl text-md font-medium text-gray-700" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "bg-white  flex align-items-center justify-content-center border-round-2xl py-1 px-3 text-gray-700 text-md font-medium" }, { children: "Sample text" })), "We\u2019ve just released a new feature", (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-primary-600" })] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "bg-red-50 pl-1 pr-4 py-1 flex align-items-center justify-content-between border-round-3xl text-md font-medium text-red-700" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "bg-white flex align-items-center justify-content-center border-round-2xl py-1 px-3 text-red-700 text-md font-medium" }, { children: "Sample text" })), "We\u2019ve just released a new feature", (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-red-600" })] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "col-6 md:col-6 lg:col-3 px-3 flex flex-column gap-3" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "bg-green-50 pl-1 pr-4 py-1 flex align-items-center justify-content-between border-round-3xl text-md font-medium text-green-700" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "bg-green-600 flex align-items-center justify-content-center border-round-2xl py-1 px-3 text-white text-md font-medium" }, { children: "Sample text" })), "We\u2019ve just released a new feature", (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-green-600" })] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "bg-primary-50 pl-1 pr-4 py-1 flex align-items-center justify-content-between border-round-3xl text-md font-medium text-gray-700" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "bg-primary-600 flex align-items-center justify-content-center border-round-2xl py-1 px-3 text-white text-md font-medium" }, { children: "Sample text" })), "We\u2019ve just released a new feature", (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-primary-600" })] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "bg-red-50 pl-1 pr-4 py-1 flex align-items-center justify-content-between border-round-3xl text-md font-medium text-red-700" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "bg-red-600 flex align-items-center justify-content-center border-round-2xl py-1 px-3 text-white text-md font-medium" }, { children: "Sample text" })), "We\u2019ve just released a new feature", (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-red-600" })] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "col-6 md:col-6 lg:col-3 px-3 flex flex-column gap-3" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "bg-white pl-1 pr-4 py-1 flex align-items-center justify-content-between border-round-3xl border-1 border-green-600 text-md font-medium text-green-700 " }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "border-1 border-green-600 bg-white px-3 flex align-items-center justify-content-center border-round-2xl py-1 text-md font-medium text-green-700" }, { children: "Sample text" })), "We\u2019ve just released a new feature", (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-green-600" })] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "bg-white pl-1 pr-4 py-1 flex align-items-center justify-content-between  border-round-3xl border-1 border-primary-600 text-md font-medium text-gray-700" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "border-1 border-primary-600 bg-white px-3 flex align-items-center justify-content-center border-round-2xl py-1 text-md font-medium text-gray-700" }, { children: "Sample text" })), "We\u2019ve just released a new feature", (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-primary-600" })] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "bg-white pl-1 pr-4 py-1 flex align-items-center justify-content-between border-round-3xl border-1 border-red-600 text-md font-medium text-red-700   " }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "border-1 border-red-600 bg-white px-3 flex align-items-center justify-content-center border-round-2xl py-1 text-md font-medium text-red-700" }, { children: "Sample text" })), "We\u2019ve just released a new feature", (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-red-600" })] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "col-6 md:col-6 lg:col-3 px-3 flex flex-column gap-3" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "bg-green-100 pl-1 pr-4 py-1 flex align-items-center justify-content-between border-round-3xl text-md font-medium text-gray-700" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "bg-green-50 flex align-items-center justify-content-center border-round-2xl py-1 px-3 text-green-700 text-md font-medium" }, { children: "Sample text" })), "We\u2019ve just released a new feature", (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-green-600" })] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "bg-primary-100 pl-1 pr-4 py-1 flex align-items-center text-md font-medium justify-content-between border-round-3xl text-primary-700 gap-2 " }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "bg-primary-50 text-primary-700 text-md font-medium flex align-items-center justify-content-center border-round-2xl py-1 px-3" }, { children: "Sample text" })), "We\u2019ve just released a new feature", (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-primary-600" })] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "bg-red-100 text-red-700 pl-1 pr-4 py-1 flex align-items-center text-md font-medium justify-content-between border-round-3xl gap-2 text-gray-700" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "text-red-700 text-gray-700 bg-red-50 text-md font-medium px-3 flex align-items-center justify-content-center border-round-2xl py-1 " }, { children: "Sample text" })), "We\u2019ve just released a new feature", (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-red-600" })] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "col-6 md:col-6 lg:col-3 px-3 flex flex-column gap-3" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "bg-green-50 pl-3 pr-1 py-1 flex align-items-center justify-content-between border-round-3xl text-md font-medium text-green-700" }, { children: ["We\u2019ve just released a new feature", (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-white flex align-items-center gap-2 border-round-2xl py-1 px-3 text-md font-medium text-green-700" }, { children: ["Sample text", (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-green-600" })] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "bg-primary-50 pl-3 pr-1 py-1 flex align-items-center justify-content-between border-round-3xl text-md font-medium text-primary-700" }, { children: ["We\u2019ve just released a new feature", (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-white flex align-items-center gap-2 border-round-2xl py-1 px-3 text-md font-medium text-primary-700" }, { children: ["Sample text", (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-primary-600" })] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "bg-red-50 pl-3 pr-1 py-1 flex align-items-center justify-content-between border-round-3xl text-md font-medium text-red-700" }, { children: ["We\u2019ve just released a new feature", (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-white flex align-items-center gap-2 border-round-2xl py-1 px-3 text-md font-medium text-red-700" }, { children: ["Sample text", (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-red-600" })] }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "col-6 md:col-6 lg:col-3 px-3 flex flex-column gap-3" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "bg-green-100 pl-3 pr-1 py-1 flex align-items-center justify-content-between border-round-3xl  text-md font-medium text-green-700" }, { children: ["We\u2019ve just released a new feature", (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-green-50 text-md font-medium px-3 flex align-items-center gap-2 border-round-2xl py-1 text-green-700" }, { children: ["Sample text", (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-green-600" })] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "bg-primary-100 pl-3 pr-1 py-1 flex align-items-center justify-content-between border-round-3xl text-md font-medium text-primary-700" }, { children: ["We\u2019ve just released a new featur", (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-primary-50 text-md font-medium px-3 flex align-items-center gap-2  border-round-2xl py-1 text-primary-700" }, { children: ["Sample text", (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-primary-600" })] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "bg-red-100 pl-3 pr-1 py-1 flex align-items-center justify-content-between border-round-3xl text-md font-medium text-gray-700" }, { children: ["We\u2019ve just released a new feature", (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-red-50 text-md font-medium px-3 flex align-items-center gap-2 border-round-2xl py-1 text-red-700" }, { children: ["Sample text", (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-red-600" })] }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "col-6 md:col-6 lg:col-3 px-3 flex flex-column gap-3" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "bg-green-50 pl-3 pr-1 py-1 flex align-items-center justify-content-between border-round-3xl text-md font-medium text-green-700" }, { children: ["We\u2019ve just released a new feature", (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-green-600 text-md font-medium px-3 flex align-items-center gap-2 border-round-2xl py-1 text-white " }, { children: ["Sample text", (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-white" })] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "bg-primary-50 pl-3 pr-1 py-1 flex align-items-center justify-content-between border-round-3xl text-md font-medium text-primary-700" }, { children: ["We\u2019ve just released a new feature", (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-primary-600 text-md font-medium px-3 flex align-items-center gap-2 border-round-2xl py-1 text-white" }, { children: ["Sample text", (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-white" })] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "bg-red-50 pl-3 pr-1 py-1 flex align-items-center justify-content-between border-round-3xl text-md font-medium text-red-700" }, { children: ["We\u2019ve just released a new feature", (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "bg-red-600 text-md font-medium px-3 flex align-items-center gap-2 border-round-2xl py-1 text-white" }, { children: ["Sample text", (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-white" })] }))] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "col-6 md:col-6 lg:col-3 px-3 flex flex-column gap-3" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "bg-white pl-3 pr-1 py-1 flex align-items-center justify-content-between border-round-3xl border-1 border-green-600 text-md font-medium text-green-700" }, { children: ["We\u2019ve just released a new feature", (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "border-1 border-green-600 bg-white px-3 flex align-items-center gap-2 border-round-2xl py-1 text-md font-medium text-green-700 " }, { children: ["Sample text", (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-green-600" })] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "bg-white pl-3 pr-1 py-1 flex align-items-center justify-content-between border-round-3xl border-1 border-primary-600 text-md font-medium text-primary-700" }, { children: ["We\u2019ve just released a new feature", (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "border-1 border-primary-600 bg-white px-3 flex align-items-center gap-2 border-round-2xl py-1 text-md font-medium text-primary-700 " }, { children: ["Sample text", (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-primary-600" })] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "bg-white pl-3 pr-1 py-1 flex align-items-center justify-content-between border-round-3xl border-1 border-red-600 text-md font-medium text-red-700" }, { children: ["We\u2019ve just released a new feature", (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "border-1 border-red-600 bg-white px-3 flex align-items-center gap-2 border-round-2xl py-1 text-md font-medium text-red-700 " }, { children: ["Sample text", (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "arrow-right-red-600" })] }))] }))] })), (0, jsx_runtime_1.jsx)(button_1.Button, Object.assign({ type: "button", label: "Emails", className: "bg-primary-500 p-auto m-auto" }, { children: (0, jsx_runtime_1.jsx)(badge_1.Badge, { value: "8" }) }))] })) }))] }));
-};
-exports.default = BadgeComponent;

package/dist/pages/breadcrumb/breadcrumb.js

@@ -1,14 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const breadcrumb_1 = require("primereact/breadcrumb");
-const svg_component_1 = tslib_1.__importDefault(require("../../directives/svg-component"));
-const BreadCrumbComponent = () => {
-    ///menu of breadcrumbs +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
-    const items = [{ label: 'Setting', className: "text-gray-600 px-3 py-2" }, { label: 'Project', className: "px-3 py-2" }, { label: "Team", className: "px-3 py-2 last-element" }];
-    // home icon of breadcrumbs ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
-    const home = { icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "home-line-gray-500" }), url: "", className: "pr-4" };
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("h2", Object.assign({ className: "flex bg-gray-200 p-3 justify-content-center mt-0 mb-4" }, { children: "BreadCrumbs" })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "grid " }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "col-12 md:col-4  my-8 px-4" }, { children: (0, jsx_runtime_1.jsx)(breadcrumb_1.BreadCrumb, { model: items, home: home, separatorIcon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "chevron-right-gray-300" }) }) })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "col-12 md:col-4  my-8 px-4" }, { children: (0, jsx_runtime_1.jsx)(breadcrumb_1.BreadCrumb, { model: items, home: home, separatorIcon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "slash-divider-gray-300" }) }) })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "col-12 md:col-4  my-8 px-4" }, { children: (0, jsx_runtime_1.jsx)(breadcrumb_1.BreadCrumb, { model: items, home: home, className: 'border-1 border-x-none border-gray-200', separatorIcon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "slash-divider-gray-300" }) }) })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "col-12 md:col-4  my-8 px-4" }, { children: (0, jsx_runtime_1.jsx)(breadcrumb_1.BreadCrumb, { model: items, home: home, className: 'border-1 border-x-none border-gray-200', separatorIcon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "chevron-right-gray-300" }) }) })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "col-12 md:col-4  my-8 px-4" }, { children: (0, jsx_runtime_1.jsx)(breadcrumb_1.BreadCrumb, { model: items, home: home, className: 'last-item-bg-color', separatorIcon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "slash-divider-gray-300" }) }) })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "col-12 md:col-4  my-8 px-4" }, { children: (0, jsx_runtime_1.jsx)(breadcrumb_1.BreadCrumb, { model: items, home: home, className: 'last-item-bg-color', separatorIcon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "chevron-right-gray-300" }) }) })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "col-12 md:col-4  my-8 px-4" }, { children: (0, jsx_runtime_1.jsx)(breadcrumb_1.BreadCrumb, { model: items, home: home, className: 'last-item-bg-color-gray-50', separatorIcon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "slash-divider-gray-300" }) }) })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "col-12 md:col-4  my-8 px-4" }, { children: (0, jsx_runtime_1.jsx)(breadcrumb_1.BreadCrumb, { model: items, home: home, className: 'last-item-bg-color-gray-50', separatorIcon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "chevron-right-gray-300" }) }) })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "col-12 md:col-4  my-8 px-4" }, { children: (0, jsx_runtime_1.jsx)(breadcrumb_1.BreadCrumb, { model: items, home: home, className: 'bg-gray-50', separatorIcon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "slash-divider-gray-300" }) }) })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "col-12 md:col-4  my-8 px-4" }, { children: (0, jsx_runtime_1.jsx)(breadcrumb_1.BreadCrumb, { model: items, home: home, className: 'bg-gray-50', separatorIcon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "chevron-right-gray-300" }) }) }))] }))] }));
-};
-exports.default = BreadCrumbComponent;