@learncard/react 2.8.61 → 2.9.2

package/dist/cjs/NotificationBoostCard-abb23722.js

@@ -0,0 +1,142 @@
+'use strict';
+
+var React = require('react');
+var X = require('./X.svg');
+var types = require('./types-91d0677b.js');
+var notifications = require('./notifications-56c6fc94.js');
+var Checkmark = require('./Checkmark-74444a78.js');
+var ArrowArcLeft = require('./ArrowArcLeft.svg');
+var UserProfilePicture = require('./UserProfilePicture-d69fe4f0.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var X__default = /*#__PURE__*/_interopDefaultLegacy(X);
+var ArrowArcLeft__default = /*#__PURE__*/_interopDefaultLegacy(ArrowArcLeft);
+
+const NotificationBoostCard = ({
+  title,
+  customThumbComponent,
+  className,
+  thumbImage,
+  notificationType = notifications.NotificationTypeEnum.Achievement,
+  issueDate,
+  issuerInfo,
+  claimStatus = false,
+  loadingState = false,
+  handleButtonClick,
+  handleCancelClick,
+  handleCardClick,
+  showIssuerInfo = true,
+  isArchived
+}) => {
+  var _a, _b;
+  const [isClaimed, setIsClaimed] = React.useState(claimStatus || false);
+  const [isLoading, setIsLoading] = React.useState(loadingState || false);
+  React.useEffect(() => {
+    setIsClaimed(claimStatus);
+  }, [claimStatus]);
+  React.useEffect(() => {
+    setIsLoading(loadingState);
+  }, [loadingState]);
+  const {
+    iconCircleStyles,
+    textStyles,
+    viewButtonStyles,
+    claimedButtonStyles,
+    unclaimedButtonStyles,
+    typeText
+  } = types.NotificationTypeStyles[notificationType];
+  const claimButtonStyles = isClaimed ? claimedButtonStyles : unclaimedButtonStyles;
+  let buttonText = "";
+  if (isClaimed) {
+    buttonText = "Claimed";
+  } else if (!isClaimed) {
+    buttonText = "Claim";
+  }
+  return /* @__PURE__ */ React__default["default"].createElement(
+    "div",
+    {
+      className: `flex justify-start max-w-[600px] items-start relative w-full rounded-3xl shadow-bottom py-[10px] px-[10px] bg-white ${className}`
+    },
+    /* @__PURE__ */ React__default["default"].createElement("div", { className: "notification-card-left-side px-[0px] flex" }, !customThumbComponent && /* @__PURE__ */ React__default["default"].createElement(
+      "div",
+      {
+        onClick: handleCardClick,
+        className: `overflow-hidden cursor-pointer w-[90px] h-[90px] rounded-full flex items-start ${iconCircleStyles} notification-card-thumbnail`
+      },
+      /* @__PURE__ */ React__default["default"].createElement(
+        "img",
+        {
+          src: thumbImage,
+          alt: "Notification Thumb",
+          className: "w-full h-full w-[100px] h-[100px] object-cover"
+        }
+      )
+    ), customThumbComponent && { customThumbComponent }),
+    /* @__PURE__ */ React__default["default"].createElement("div", { className: "flex flex-col justify-center items-start relative w-full" }, /* @__PURE__ */ React__default["default"].createElement("div", { className: "text-left ml-3 flex flex-col items-start justify-start w-full" }, /* @__PURE__ */ React__default["default"].createElement(
+      "h4",
+      {
+        onClick: handleCardClick,
+        className: "cursor-pointer font-bold tracking-wide line-clamp-2 text-black text-[14px] pr-[20px] notification-card-title",
+        "data-testid": "notification-title"
+      },
+      title
+    ), /* @__PURE__ */ React__default["default"].createElement(
+      "p",
+      {
+        className: `font-semibold p-0 mt-[10px] leading-none tracking-wide line-clamp-1 text-[12px] notification-card-type-text ${textStyles}`,
+        "data-testid": "notification-type"
+      },
+      typeText,
+      " ",
+      issueDate && /* @__PURE__ */ React__default["default"].createElement(
+        "span",
+        {
+          className: "text-grayscale-600 normal-case font-normal text-[12px] notification-card-type-issue-date",
+          "data-testid": "notification-cred-issue-date"
+        },
+        "\u2022 ",
+        issueDate
+      )
+    ), showIssuerInfo && /* @__PURE__ */ React__default["default"].createElement("div", { className: "notification-card-issuer-info flex items-center mt-[10px]" }, /* @__PURE__ */ React__default["default"].createElement("div", { className: "profile-thumb-img border-[2px] border-white border-solid  vc-issuee-image h-[35px] w-[35px] rounded-full overflow-hidden mx-[-5px]" }, /* @__PURE__ */ React__default["default"].createElement(
+      UserProfilePicture.UserProfilePicture,
+      {
+        customContainerClass: `h-full w-full object-cover text-xl ${!(issuerInfo == null ? void 0 : issuerInfo.image) ? "pt-[3px]" : ""}`,
+        user: { image: issuerInfo == null ? void 0 : issuerInfo.image, name: issuerInfo == null ? void 0 : issuerInfo.fullName },
+        alt: "profile"
+      }
+    )), /* @__PURE__ */ React__default["default"].createElement("div", { className: "notification-issuer-info-text flex items-center px-[10px]" }, /* @__PURE__ */ React__default["default"].createElement("p", { className: "text-[13px] text-gray-700 font-medium" }, "From ", (issuerInfo == null ? void 0 : issuerInfo.fullName) || (issuerInfo == null ? void 0 : issuerInfo.displayName)))), /* @__PURE__ */ React__default["default"].createElement("div", { className: "flex items-center justify-between mt-3 w-full" }, /* @__PURE__ */ React__default["default"].createElement(
+      "button",
+      {
+        className: `notification-claim-btn flex items-center mr-[15px] w-[143px] justify-center flex-1 rounded-[24px] border-2 border-solid font-semibold py-2 px-3 tracking-wide ${claimButtonStyles}`,
+        onClick: handleButtonClick,
+        role: "button",
+        name: "notification-claim-button"
+      },
+      isClaimed && /* @__PURE__ */ React__default["default"].createElement(Checkmark.Checkmark, { className: "h-[24px] p-0 m-0" }),
+      " ",
+      isLoading ? "Loading..." : buttonText
+    ), /* @__PURE__ */ React__default["default"].createElement(
+      "button",
+      {
+        onClick: handleCancelClick,
+        className: `rounded-[24px] flex items-center justify-center  h-[42px] w-[42px] shadow-bottom bg-white font-semibold mr-2 p-[0px] tracking-wide ${viewButtonStyles}`,
+        role: "button",
+        name: "notification-view-button"
+      },
+      !isArchived && /* @__PURE__ */ React__default["default"].createElement("img", { src: (_a = X__default["default"]) != null ? _a : "", alt: "Cancel", className: "notification-card-x" }),
+      isArchived && /* @__PURE__ */ React__default["default"].createElement(
+        "img",
+        {
+          src: (_b = ArrowArcLeft__default["default"]) != null ? _b : "",
+          alt: "Cancel",
+          className: "notification-card-x"
+        }
+      )
+    ))))
+  );
+};
+
+exports.NotificationBoostCard = NotificationBoostCard;
+//# sourceMappingURL=NotificationBoostCard-abb23722.js.map

package/dist/cjs/{NotificationBoostCard-cf2140c0.js.map → NotificationBoostCard-abb23722.js.map}

@@ -1 +1 @@
-{"version":3,"file":"NotificationBoostCard-cf2140c0.js","sources":["../../src/components/NotificationBoostCard/NotificationBoostCard.tsx"],"sourcesContent":["import React, { useState, useEffect } from 'react';\nimport X from '../../assets/images/X.svg';\nimport { NotificationBoostCardProps } from './types';\nimport { NotificationTypeStyles } from '../Notification/types';\nimport { NotificationTypeEnum } from '../../constants/notifications';\nimport Checkmark from '../svgs/Checkmark';\nimport ArrowArcLeft from '../../assets/images/ArrowArcLeft.svg';\nimport UserProfilePicture from '../UserProfilePicture/UserProfilePicture';\n\nexport const NotificationBoostCard: React.FC<NotificationBoostCardProps> = ({\n    title,\n    customThumbComponent,\n    className,\n    thumbImage,\n    notificationType = NotificationTypeEnum.Achievement,\n    issueDate,\n    issuerInfo,\n    claimStatus = false,\n    loadingState = false,\n    handleButtonClick,\n    handleCancelClick,\n    handleCardClick,\n    showIssuerInfo = true,\n    isArchived,\n}) => {\n    const [isClaimed, setIsClaimed] = useState<boolean>(claimStatus || false);\n    const [isLoading, setIsLoading] = useState<boolean>(loadingState || false);\n\n    useEffect(() => {\n        setIsClaimed(claimStatus);\n    }, [claimStatus]);\n\n    useEffect(() => {\n        setIsLoading(loadingState);\n    }, [loadingState]);\n\n    const {\n        iconCircleStyles,\n        textStyles,\n        viewButtonStyles,\n        claimedButtonStyles,\n        unclaimedButtonStyles,\n        typeText,\n    } = NotificationTypeStyles[notificationType];\n\n    const claimButtonStyles = isClaimed ? claimedButtonStyles : unclaimedButtonStyles;\n\n    let buttonText: string = '';\n\n    if (isClaimed) {\n        buttonText = 'Claimed';\n    } else if (!isClaimed) {\n        buttonText = 'Claim';\n    }\n\n    return (\n        <div\n            className={`flex justify-start max-w-[600px] items-start relative w-full rounded-3xl shadow-bottom py-[10px] px-[10px] bg-white ${className}`}\n        >\n            <div className=\"notification-card-left-side px-[0px] flex\">\n                {!customThumbComponent && (\n                    <div\n                        onClick={handleCardClick}\n                        className={`overflow-hidden cursor-pointer w-[90px] h-[90px] rounded-full flex items-start ${iconCircleStyles} notification-card-thumbnail`}\n                    >\n                        <img\n                            src={thumbImage}\n                            alt=\"Notification Thumb\"\n                            className=\"w-full h-full w-[100px] h-[100px] object-cover\"\n                        />\n                    </div>\n                )}\n                {customThumbComponent && { customThumbComponent }}\n            </div>\n            <div className=\"flex flex-col justify-center items-start relative w-full\">\n                <div className=\"text-left ml-3 flex flex-col items-start justify-start w-full\">\n                    <h4\n                        onClick={handleCardClick}\n                        className=\"cursor-pointer font-bold tracking-wide line-clamp-2 text-black text-[14px] pr-[20px] notification-card-title\"\n                        data-testid=\"notification-title\"\n                    >\n                        {title}\n                    </h4>\n                    <p\n                        className={`font-semibold p-0 mt-[10px] leading-none tracking-wide line-clamp-1 text-[12px] notification-card-type-text ${textStyles}`}\n                        data-testid=\"notification-type\"\n                    >\n                        {typeText}{' '}\n                        {issueDate && (\n                            <span\n                                className=\"text-grayscale-600 normal-case font-normal text-[12px] notification-card-type-issue-date\"\n                                data-testid=\"notification-cred-issue-date\"\n                            >\n                                • {issueDate}\n                            </span>\n                        )}\n                    </p>\n\n                    {showIssuerInfo && (\n                        <div className=\"notification-card-issuer-info flex items-center mt-[10px]\">\n                            <div className=\"profile-thumb-img border-[2px] border-white border-solid  vc-issuee-image h-[35px] w-[35px] rounded-full overflow-hidden mx-[-5px]\">\n                                <UserProfilePicture\n                                    customContainerClass={`h-full w-full object-cover text-xl ${\n                                        !issuerInfo?.image ? 'pt-[3px]' : ''\n                                    }`}\n                                    user={{ image: issuerInfo?.image, name: issuerInfo?.fullName }}\n                                    alt=\"profile\"\n                                />\n                            </div>\n                            <div className=\"notification-issuer-info-text flex items-center px-[10px]\">\n                                <p className=\"text-[13px] text-gray-700 font-medium\">\n                                    From {issuerInfo?.fullName || issuerInfo?.displayName}\n                                </p>\n                            </div>\n                        </div>\n                    )}\n\n                    <div className=\"flex items-center justify-between mt-3 w-full\">\n                        <button\n                            className={`notification-claim-btn flex items-center mr-[15px] w-[143px] justify-center flex-1 rounded-[24px] border-2 border-solid font-semibold py-2 px-3 tracking-wide ${claimButtonStyles}`}\n                            onClick={handleButtonClick}\n                            role=\"button\"\n                            name=\"notification-claim-button\"\n                        >\n                            {isClaimed && <Checkmark className=\"h-[24px] p-0 m-0\" />}{' '}\n                            {isLoading ? 'Loading...' : buttonText}\n                        </button>\n\n                        <button\n                            onClick={handleCancelClick}\n                            className={`rounded-[24px] flex items-center justify-center  h-[42px] w-[42px] shadow-bottom bg-white font-semibold mr-2 p-[0px] tracking-wide ${viewButtonStyles}`}\n                            role=\"button\"\n                            name=\"notification-view-button\"\n                        >\n                            {!isArchived && (\n                                <img src={X ?? ''} alt=\"Cancel\" className=\"notification-card-x\" />\n                            )}\n                            {isArchived && (\n                                <img\n                                    src={ArrowArcLeft ?? ''}\n                                    alt=\"Cancel\"\n                                    className=\"notification-card-x\"\n                                />\n                            )}\n                        </button>\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n};\n\nexport default NotificationBoostCard;\n"],"names":["NotificationTypeEnum","useState","useEffect","NotificationTypeStyles","React","UserProfilePicture","Checkmark","X","ArrowArcLeft"],"mappings":"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"}
+{"version":3,"file":"NotificationBoostCard-abb23722.js","sources":["../../src/components/NotificationBoostCard/NotificationBoostCard.tsx"],"sourcesContent":["import React, { useState, useEffect } from 'react';\nimport X from '../../assets/images/X.svg';\nimport { NotificationBoostCardProps } from './types';\nimport { NotificationTypeStyles } from '../Notification/types';\nimport { NotificationTypeEnum } from '../../constants/notifications';\nimport Checkmark from '../svgs/Checkmark';\nimport ArrowArcLeft from '../../assets/images/ArrowArcLeft.svg';\nimport UserProfilePicture from '../UserProfilePicture/UserProfilePicture';\n\nexport const NotificationBoostCard: React.FC<NotificationBoostCardProps> = ({\n    title,\n    customThumbComponent,\n    className,\n    thumbImage,\n    notificationType = NotificationTypeEnum.Achievement,\n    issueDate,\n    issuerInfo,\n    claimStatus = false,\n    loadingState = false,\n    handleButtonClick,\n    handleCancelClick,\n    handleCardClick,\n    showIssuerInfo = true,\n    isArchived,\n}) => {\n    const [isClaimed, setIsClaimed] = useState<boolean>(claimStatus || false);\n    const [isLoading, setIsLoading] = useState<boolean>(loadingState || false);\n\n    useEffect(() => {\n        setIsClaimed(claimStatus);\n    }, [claimStatus]);\n\n    useEffect(() => {\n        setIsLoading(loadingState);\n    }, [loadingState]);\n\n    const {\n        iconCircleStyles,\n        textStyles,\n        viewButtonStyles,\n        claimedButtonStyles,\n        unclaimedButtonStyles,\n        typeText,\n    } = NotificationTypeStyles[notificationType];\n\n    const claimButtonStyles = isClaimed ? claimedButtonStyles : unclaimedButtonStyles;\n\n    let buttonText: string = '';\n\n    if (isClaimed) {\n        buttonText = 'Claimed';\n    } else if (!isClaimed) {\n        buttonText = 'Claim';\n    }\n\n    return (\n        <div\n            className={`flex justify-start max-w-[600px] items-start relative w-full rounded-3xl shadow-bottom py-[10px] px-[10px] bg-white ${className}`}\n        >\n            <div className=\"notification-card-left-side px-[0px] flex\">\n                {!customThumbComponent && (\n                    <div\n                        onClick={handleCardClick}\n                        className={`overflow-hidden cursor-pointer w-[90px] h-[90px] rounded-full flex items-start ${iconCircleStyles} notification-card-thumbnail`}\n                    >\n                        <img\n                            src={thumbImage}\n                            alt=\"Notification Thumb\"\n                            className=\"w-full h-full w-[100px] h-[100px] object-cover\"\n                        />\n                    </div>\n                )}\n                {customThumbComponent && { customThumbComponent }}\n            </div>\n            <div className=\"flex flex-col justify-center items-start relative w-full\">\n                <div className=\"text-left ml-3 flex flex-col items-start justify-start w-full\">\n                    <h4\n                        onClick={handleCardClick}\n                        className=\"cursor-pointer font-bold tracking-wide line-clamp-2 text-black text-[14px] pr-[20px] notification-card-title\"\n                        data-testid=\"notification-title\"\n                    >\n                        {title}\n                    </h4>\n                    <p\n                        className={`font-semibold p-0 mt-[10px] leading-none tracking-wide line-clamp-1 text-[12px] notification-card-type-text ${textStyles}`}\n                        data-testid=\"notification-type\"\n                    >\n                        {typeText}{' '}\n                        {issueDate && (\n                            <span\n                                className=\"text-grayscale-600 normal-case font-normal text-[12px] notification-card-type-issue-date\"\n                                data-testid=\"notification-cred-issue-date\"\n                            >\n                                • {issueDate}\n                            </span>\n                        )}\n                    </p>\n\n                    {showIssuerInfo && (\n                        <div className=\"notification-card-issuer-info flex items-center mt-[10px]\">\n                            <div className=\"profile-thumb-img border-[2px] border-white border-solid  vc-issuee-image h-[35px] w-[35px] rounded-full overflow-hidden mx-[-5px]\">\n                                <UserProfilePicture\n                                    customContainerClass={`h-full w-full object-cover text-xl ${\n                                        !issuerInfo?.image ? 'pt-[3px]' : ''\n                                    }`}\n                                    user={{ image: issuerInfo?.image, name: issuerInfo?.fullName }}\n                                    alt=\"profile\"\n                                />\n                            </div>\n                            <div className=\"notification-issuer-info-text flex items-center px-[10px]\">\n                                <p className=\"text-[13px] text-gray-700 font-medium\">\n                                    From {issuerInfo?.fullName || issuerInfo?.displayName}\n                                </p>\n                            </div>\n                        </div>\n                    )}\n\n                    <div className=\"flex items-center justify-between mt-3 w-full\">\n                        <button\n                            className={`notification-claim-btn flex items-center mr-[15px] w-[143px] justify-center flex-1 rounded-[24px] border-2 border-solid font-semibold py-2 px-3 tracking-wide ${claimButtonStyles}`}\n                            onClick={handleButtonClick}\n                            role=\"button\"\n                            name=\"notification-claim-button\"\n                        >\n                            {isClaimed && <Checkmark className=\"h-[24px] p-0 m-0\" />}{' '}\n                            {isLoading ? 'Loading...' : buttonText}\n                        </button>\n\n                        <button\n                            onClick={handleCancelClick}\n                            className={`rounded-[24px] flex items-center justify-center  h-[42px] w-[42px] shadow-bottom bg-white font-semibold mr-2 p-[0px] tracking-wide ${viewButtonStyles}`}\n                            role=\"button\"\n                            name=\"notification-view-button\"\n                        >\n                            {!isArchived && (\n                                <img src={X ?? ''} alt=\"Cancel\" className=\"notification-card-x\" />\n                            )}\n                            {isArchived && (\n                                <img\n                                    src={ArrowArcLeft ?? ''}\n                                    alt=\"Cancel\"\n                                    className=\"notification-card-x\"\n                                />\n                            )}\n                        </button>\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n};\n\nexport default NotificationBoostCard;\n"],"names":["NotificationTypeEnum","useState","useEffect","NotificationTypeStyles","React","UserProfilePicture","Checkmark","ArrowArcLeft"],"mappings":"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"}

package/dist/cjs/NotificationUserAcceptedBoostCard-31d8a89e.js

@@ -0,0 +1,98 @@
+'use strict';
+
+var React = require('react');
+var X = require('./X.svg');
+var types = require('./types-e4d9a257.js');
+var notifications = require('./notifications-56c6fc94.js');
+var ArrowArcLeft = require('./ArrowArcLeft.svg');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var X__default = /*#__PURE__*/_interopDefaultLegacy(X);
+var ArrowArcLeft__default = /*#__PURE__*/_interopDefaultLegacy(ArrowArcLeft);
+
+const NotificationUserAcceptedBoostCard = ({
+  title,
+  customThumbComponent,
+  className,
+  thumbImage,
+  notificationType = notifications.UserNotificationTypeEnum.AcceptedBoost,
+  issueDate,
+  loadingState = false,
+  handleCancelClick,
+  isArchived
+}) => {
+  var _a, _b;
+  const [isLoading, setIsLoading] = React.useState(loadingState || false);
+  React.useEffect(() => {
+    setIsLoading(loadingState);
+  }, [loadingState]);
+  const { textStyles, viewButtonStyles, typeText } = types.UserNotificationTypeStyles[notificationType];
+  return /* @__PURE__ */ React__default["default"].createElement(
+    "div",
+    {
+      className: `flex justify-start max-w-[600px] items-start relative w-full rounded-3xl shadow-bottom py-[10px] px-[10px] bg-white ${className}`
+    },
+    /* @__PURE__ */ React__default["default"].createElement("div", { className: "notification-card-left-side px-[0px] flex" }, !customThumbComponent && /* @__PURE__ */ React__default["default"].createElement(
+      "div",
+      {
+        className: `overflow-hidden w-[50px] h-[50px] rounded-full flex items-start notification-card-thumbnail`
+      },
+      /* @__PURE__ */ React__default["default"].createElement(
+        "img",
+        {
+          src: thumbImage,
+          alt: "Notification Thumb",
+          className: "w-full h-full w-[50px] h-[50px] object-cover"
+        }
+      )
+    ), customThumbComponent && { customThumbComponent }),
+    /* @__PURE__ */ React__default["default"].createElement("div", { className: "flex flex-col justify-center items-start relative w-full" }, /* @__PURE__ */ React__default["default"].createElement("div", { className: "text-left ml-3 flex flex-col items-start justify-start w-full" }, /* @__PURE__ */ React__default["default"].createElement(
+      "h4",
+      {
+        className: "font-bold tracking-wide line-clamp-2 text-black text-[14px] pr-[20px] notification-card-title",
+        "data-testid": "notification-title"
+      },
+      title
+    ), /* @__PURE__ */ React__default["default"].createElement(
+      "p",
+      {
+        className: `font-semibold p-0 mt-[10px] leading-none tracking-wide line-clamp-1 text-[12px] notification-card-type-text ${textStyles}`,
+        "data-testid": "notification-type"
+      },
+      typeText,
+      " ",
+      issueDate && /* @__PURE__ */ React__default["default"].createElement(
+        "span",
+        {
+          className: "text-grayscale-600 normal-case font-normal text-[12px] notification-card-type-issue-date",
+          "data-testid": "notification-cred-issue-date"
+        },
+        typeText && "\u2022",
+        " ",
+        issueDate
+      )
+    ), /* @__PURE__ */ React__default["default"].createElement("div", { className: "flex items-center justify-end w-full mt-3" }, /* @__PURE__ */ React__default["default"].createElement(
+      "button",
+      {
+        onClick: handleCancelClick,
+        className: `rounded-[24px] flex items-center justify-center  h-[42px] w-[42px] shadow-bottom bg-white font-semibold mr-2 p-[0px] tracking-wide ${viewButtonStyles}`,
+        role: "button",
+        name: "notification-view-button"
+      },
+      !isArchived && /* @__PURE__ */ React__default["default"].createElement("img", { src: (_a = X__default["default"]) != null ? _a : "", alt: "Cancel", className: "notification-card-x" }),
+      isArchived && /* @__PURE__ */ React__default["default"].createElement(
+        "img",
+        {
+          src: (_b = ArrowArcLeft__default["default"]) != null ? _b : "",
+          alt: "Cancel",
+          className: "notification-card-x"
+        }
+      )
+    ))))
+  );
+};
+
+exports.NotificationUserAcceptedBoostCard = NotificationUserAcceptedBoostCard;
+//# sourceMappingURL=NotificationUserAcceptedBoostCard-31d8a89e.js.map

package/dist/cjs/{NotificationUserAcceptedBoostCard-423b9320.js.map → NotificationUserAcceptedBoostCard-31d8a89e.js.map}

@@ -1 +1 @@
-{"version":3,"file":"NotificationUserAcceptedBoostCard-423b9320.js","sources":["../../src/components/NotificationUserAcceptedBoostCard/NotificationUserAcceptedBoostCard.tsx"],"sourcesContent":["import React, { useState, useEffect } from 'react';\nimport X from '../../assets/images/X.svg';\nimport { NotificationUserAcceptedBoostCardProps } from './types';\nimport { UserNotificationTypeStyles } from '../NotificationUserCard/types';\n\nimport { UserNotificationTypeEnum } from '../../constants/notifications';\nimport ArrowArcLeft from '../../assets/images/ArrowArcLeft.svg';\n\nexport const NotificationUserAcceptedBoostCard: React.FC<\n    NotificationUserAcceptedBoostCardProps\n> = ({\n    title,\n    customThumbComponent,\n    className,\n    thumbImage,\n    notificationType = UserNotificationTypeEnum.AcceptedBoost,\n    issueDate,\n    loadingState = false,\n    handleCancelClick,\n    isArchived,\n}) => {\n    const [isLoading, setIsLoading] = useState<boolean>(loadingState || false);\n\n    useEffect(() => {\n        setIsLoading(loadingState);\n    }, [loadingState]);\n\n    const { textStyles, viewButtonStyles, typeText } = UserNotificationTypeStyles[notificationType];\n\n    return (\n        <div\n            className={`flex justify-start max-w-[600px] items-start relative w-full rounded-3xl shadow-bottom py-[10px] px-[10px] bg-white ${className}`}\n        >\n            <div className=\"notification-card-left-side px-[0px] flex\">\n                {!customThumbComponent && (\n                    <div\n                        className={`overflow-hidden w-[50px] h-[50px] rounded-full flex items-start notification-card-thumbnail`}\n                    >\n                        <img\n                            src={thumbImage}\n                            alt=\"Notification Thumb\"\n                            className=\"w-full h-full w-[50px] h-[50px] object-cover\"\n                        />\n                    </div>\n                )}\n                {customThumbComponent && { customThumbComponent }}\n            </div>\n            <div className=\"flex flex-col justify-center items-start relative w-full\">\n                <div className=\"text-left ml-3 flex flex-col items-start justify-start w-full\">\n                    <h4\n                        className=\"font-bold tracking-wide line-clamp-2 text-black text-[14px] pr-[20px] notification-card-title\"\n                        data-testid=\"notification-title\"\n                    >\n                        {title}\n                    </h4>\n                    <p\n                        className={`font-semibold p-0 mt-[10px] leading-none tracking-wide line-clamp-1 text-[12px] notification-card-type-text ${textStyles}`}\n                        data-testid=\"notification-type\"\n                    >\n                        {typeText}{' '}\n                        {issueDate && (\n                            <span\n                                className=\"text-grayscale-600 normal-case font-normal text-[12px] notification-card-type-issue-date\"\n                                data-testid=\"notification-cred-issue-date\"\n                            >\n                                {typeText && '•'} {issueDate}\n                            </span>\n                        )}\n                    </p>\n\n                    <div className=\"flex items-center justify-end w-full mt-3\">\n                        <button\n                            onClick={handleCancelClick}\n                            className={`rounded-[24px] flex items-center justify-center  h-[42px] w-[42px] shadow-bottom bg-white font-semibold mr-2 p-[0px] tracking-wide ${viewButtonStyles}`}\n                            role=\"button\"\n                            name=\"notification-view-button\"\n                        >\n                            {!isArchived && (\n                                <img src={X ?? ''} alt=\"Cancel\" className=\"notification-card-x\" />\n                            )}\n                            {isArchived && (\n                                <img\n                                    src={ArrowArcLeft ?? ''}\n                                    alt=\"Cancel\"\n                                    className=\"notification-card-x\"\n                                />\n                            )}\n                        </button>\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n};\n\nexport default NotificationUserAcceptedBoostCard;\n"],"names":["UserNotificationTypeEnum","useState","useEffect","UserNotificationTypeStyles","React","X","ArrowArcLeft"],"mappings":"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"}
+{"version":3,"file":"NotificationUserAcceptedBoostCard-31d8a89e.js","sources":["../../src/components/NotificationUserAcceptedBoostCard/NotificationUserAcceptedBoostCard.tsx"],"sourcesContent":["import React, { useState, useEffect } from 'react';\nimport X from '../../assets/images/X.svg';\nimport { NotificationUserAcceptedBoostCardProps } from './types';\nimport { UserNotificationTypeStyles } from '../NotificationUserCard/types';\n\nimport { UserNotificationTypeEnum } from '../../constants/notifications';\nimport ArrowArcLeft from '../../assets/images/ArrowArcLeft.svg';\n\nexport const NotificationUserAcceptedBoostCard: React.FC<\n    NotificationUserAcceptedBoostCardProps\n> = ({\n    title,\n    customThumbComponent,\n    className,\n    thumbImage,\n    notificationType = UserNotificationTypeEnum.AcceptedBoost,\n    issueDate,\n    loadingState = false,\n    handleCancelClick,\n    isArchived,\n}) => {\n    const [isLoading, setIsLoading] = useState<boolean>(loadingState || false);\n\n    useEffect(() => {\n        setIsLoading(loadingState);\n    }, [loadingState]);\n\n    const { textStyles, viewButtonStyles, typeText } = UserNotificationTypeStyles[notificationType];\n\n    return (\n        <div\n            className={`flex justify-start max-w-[600px] items-start relative w-full rounded-3xl shadow-bottom py-[10px] px-[10px] bg-white ${className}`}\n        >\n            <div className=\"notification-card-left-side px-[0px] flex\">\n                {!customThumbComponent && (\n                    <div\n                        className={`overflow-hidden w-[50px] h-[50px] rounded-full flex items-start notification-card-thumbnail`}\n                    >\n                        <img\n                            src={thumbImage}\n                            alt=\"Notification Thumb\"\n                            className=\"w-full h-full w-[50px] h-[50px] object-cover\"\n                        />\n                    </div>\n                )}\n                {customThumbComponent && { customThumbComponent }}\n            </div>\n            <div className=\"flex flex-col justify-center items-start relative w-full\">\n                <div className=\"text-left ml-3 flex flex-col items-start justify-start w-full\">\n                    <h4\n                        className=\"font-bold tracking-wide line-clamp-2 text-black text-[14px] pr-[20px] notification-card-title\"\n                        data-testid=\"notification-title\"\n                    >\n                        {title}\n                    </h4>\n                    <p\n                        className={`font-semibold p-0 mt-[10px] leading-none tracking-wide line-clamp-1 text-[12px] notification-card-type-text ${textStyles}`}\n                        data-testid=\"notification-type\"\n                    >\n                        {typeText}{' '}\n                        {issueDate && (\n                            <span\n                                className=\"text-grayscale-600 normal-case font-normal text-[12px] notification-card-type-issue-date\"\n                                data-testid=\"notification-cred-issue-date\"\n                            >\n                                {typeText && '•'} {issueDate}\n                            </span>\n                        )}\n                    </p>\n\n                    <div className=\"flex items-center justify-end w-full mt-3\">\n                        <button\n                            onClick={handleCancelClick}\n                            className={`rounded-[24px] flex items-center justify-center  h-[42px] w-[42px] shadow-bottom bg-white font-semibold mr-2 p-[0px] tracking-wide ${viewButtonStyles}`}\n                            role=\"button\"\n                            name=\"notification-view-button\"\n                        >\n                            {!isArchived && (\n                                <img src={X ?? ''} alt=\"Cancel\" className=\"notification-card-x\" />\n                            )}\n                            {isArchived && (\n                                <img\n                                    src={ArrowArcLeft ?? ''}\n                                    alt=\"Cancel\"\n                                    className=\"notification-card-x\"\n                                />\n                            )}\n                        </button>\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n};\n\nexport default NotificationUserAcceptedBoostCard;\n"],"names":["UserNotificationTypeEnum","useState","useEffect","UserNotificationTypeStyles","React","ArrowArcLeft"],"mappings":"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"}

package/dist/cjs/NotificationUserCard-59431df3.js

@@ -0,0 +1,121 @@
+'use strict';
+
+var React = require('react');
+var X = require('./X.svg');
+var types = require('./types-e4d9a257.js');
+var notifications = require('./notifications-56c6fc94.js');
+var Checkmark = require('./Checkmark-74444a78.js');
+var ArrowArcLeft = require('./ArrowArcLeft.svg');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var X__default = /*#__PURE__*/_interopDefaultLegacy(X);
+var ArrowArcLeft__default = /*#__PURE__*/_interopDefaultLegacy(ArrowArcLeft);
+
+const NotificationUserCard = ({
+  title,
+  customThumbComponent,
+  className,
+  thumbImage,
+  issueDate,
+  acceptStatus = false,
+  loadingState = false,
+  handleButtonClick,
+  handleCancelClick,
+  isArchived
+}) => {
+  var _a, _b;
+  const [isAccepted, setisAccepted] = React.useState(acceptStatus || false);
+  const [isLoading, setIsLoading] = React.useState(loadingState || false);
+  React.useEffect(() => {
+    setisAccepted(acceptStatus);
+  }, [acceptStatus]);
+  React.useEffect(() => {
+    setIsLoading(loadingState);
+  }, [loadingState]);
+  const { textStyles, viewButtonStyles, claimedButtonStyles, unclaimedButtonStyles, typeText } = types.UserNotificationTypeStyles[notifications.UserNotificationTypeEnum.ConnectionRequest];
+  const claimButtonStyles = isAccepted ? claimedButtonStyles : unclaimedButtonStyles;
+  let buttonText = "";
+  if (isAccepted) {
+    buttonText = "Accepted";
+  } else if (!isAccepted) {
+    buttonText = "Accept";
+  }
+  return /* @__PURE__ */ React__default["default"].createElement(
+    "div",
+    {
+      className: `flex justify-start max-w-[600px] items-start relative w-full rounded-3xl shadow-bottom py-[10px] px-[10px] bg-white ${className}`
+    },
+    /* @__PURE__ */ React__default["default"].createElement("div", { className: "notification-card-left-side px-[0px] flex" }, !customThumbComponent && /* @__PURE__ */ React__default["default"].createElement(
+      "div",
+      {
+        className: `overflow-hidden cursor-pointer w-[68px] h-[68px] rounded-full flex items-start notification-card-thumbnail`
+      },
+      /* @__PURE__ */ React__default["default"].createElement(
+        "img",
+        {
+          src: thumbImage,
+          alt: "Notification Thumb",
+          className: "w-full h-full w-[68px] h-[68px] object-cover"
+        }
+      )
+    ), customThumbComponent && { customThumbComponent }),
+    /* @__PURE__ */ React__default["default"].createElement("div", { className: "flex flex-col justify-center items-start relative w-full" }, /* @__PURE__ */ React__default["default"].createElement("div", { className: "text-left ml-3 flex flex-col items-start justify-start w-full" }, /* @__PURE__ */ React__default["default"].createElement(
+      "h4",
+      {
+        className: "cursor-pointer font-bold tracking-wide line-clamp-2 text-black text-[14px] pr-[20px] notification-card-title",
+        "data-testid": "notification-title"
+      },
+      title
+    ), /* @__PURE__ */ React__default["default"].createElement(
+      "p",
+      {
+        className: `font-semibold p-0 mt-[10px] leading-none tracking-wide line-clamp-1 text-[12px] notification-card-type-text ${textStyles}`,
+        "data-testid": "notification-type"
+      },
+      typeText,
+      " ",
+      issueDate && /* @__PURE__ */ React__default["default"].createElement(
+        "span",
+        {
+          className: "text-grayscale-600 normal-case font-normal text-[12px] notification-card-type-issue-date",
+          "data-testid": "notification-cred-issue-date"
+        },
+        "\u2022 ",
+        issueDate
+      )
+    ), /* @__PURE__ */ React__default["default"].createElement("div", { className: "flex items-center justify-between mt-3 w-full" }, /* @__PURE__ */ React__default["default"].createElement(
+      "button",
+      {
+        className: `notification-claim-btn flex items-center mr-[15px] w-[143px] justify-center flex-1 rounded-[24px] border-2 border-solid font-semibold py-2 px-3 tracking-wide ${claimButtonStyles}`,
+        onClick: handleButtonClick,
+        role: "button",
+        name: "notification-claim-button"
+      },
+      isAccepted && /* @__PURE__ */ React__default["default"].createElement(Checkmark.Checkmark, { className: "h-[24px] p-0 m-0" }),
+      " ",
+      isLoading ? "Loading..." : buttonText
+    ), /* @__PURE__ */ React__default["default"].createElement(
+      "button",
+      {
+        onClick: handleCancelClick,
+        className: `rounded-[24px] flex items-center justify-center  h-[42px] w-[42px] shadow-bottom bg-white font-semibold mr-2 p-[0px] tracking-wide ${viewButtonStyles}`,
+        role: "button",
+        name: "notification-view-button"
+      },
+      !isArchived && /* @__PURE__ */ React__default["default"].createElement("img", { src: (_a = X__default["default"]) != null ? _a : "", alt: "Cancel", className: "notification-card-x" }),
+      isArchived && /* @__PURE__ */ React__default["default"].createElement(
+        "img",
+        {
+          src: (_b = ArrowArcLeft__default["default"]) != null ? _b : "",
+          alt: "Cancel",
+          className: "notification-card-x"
+        }
+      )
+    ))))
+  );
+};
+
+exports.NotificationUserCard = NotificationUserCard;
+//# sourceMappingURL=NotificationUserCard-59431df3.js.map

package/dist/cjs/{NotificationUserCard-d4dab06c.js.map → NotificationUserCard-59431df3.js.map}

@@ -1 +1 @@
-{"version":3,"file":"NotificationUserCard-d4dab06c.js","sources":["../../src/components/NotificationUserCard/NotificationUserCard.tsx"],"sourcesContent":["import React, { useState, useEffect } from 'react';\nimport X from '../../assets/images/X.svg';\nimport { NotificationUserCardProps, UserNotificationTypeStyles } from './types';\n\nimport { UserNotificationTypeEnum } from '../../constants/notifications';\nimport Checkmark from '../svgs/Checkmark';\nimport ArrowArcLeft from '../../assets/images/ArrowArcLeft.svg';\n\nexport const NotificationUserCard: React.FC<NotificationUserCardProps> = ({\n    title,\n    customThumbComponent,\n    className,\n    thumbImage,\n    issueDate,\n    acceptStatus = false,\n    loadingState = false,\n    handleButtonClick,\n    handleCancelClick,\n    isArchived,\n}) => {\n    const [isAccepted, setisAccepted] = useState<boolean>(acceptStatus || false);\n    const [isLoading, setIsLoading] = useState<boolean>(loadingState || false);\n\n    useEffect(() => {\n        setisAccepted(acceptStatus);\n    }, [acceptStatus]);\n\n    useEffect(() => {\n        setIsLoading(loadingState);\n    }, [loadingState]);\n\n    const { textStyles, viewButtonStyles, claimedButtonStyles, unclaimedButtonStyles, typeText } =\n        UserNotificationTypeStyles[UserNotificationTypeEnum.ConnectionRequest];\n\n    const claimButtonStyles = isAccepted ? claimedButtonStyles : unclaimedButtonStyles;\n\n    let buttonText: string = '';\n\n    if (isAccepted) {\n        buttonText = 'Accepted';\n    } else if (!isAccepted) {\n        buttonText = 'Accept';\n    }\n\n    return (\n        <div\n            className={`flex justify-start max-w-[600px] items-start relative w-full rounded-3xl shadow-bottom py-[10px] px-[10px] bg-white ${className}`}\n        >\n            <div className=\"notification-card-left-side px-[0px] flex\">\n                {!customThumbComponent && (\n                    <div\n                        className={`overflow-hidden cursor-pointer w-[68px] h-[68px] rounded-full flex items-start notification-card-thumbnail`}\n                    >\n                        <img\n                            src={thumbImage}\n                            alt=\"Notification Thumb\"\n                            className=\"w-full h-full w-[68px] h-[68px] object-cover\"\n                        />\n                    </div>\n                )}\n                {customThumbComponent && { customThumbComponent }}\n            </div>\n            <div className=\"flex flex-col justify-center items-start relative w-full\">\n                <div className=\"text-left ml-3 flex flex-col items-start justify-start w-full\">\n                    <h4\n                        className=\"cursor-pointer font-bold tracking-wide line-clamp-2 text-black text-[14px] pr-[20px] notification-card-title\"\n                        data-testid=\"notification-title\"\n                    >\n                        {title}\n                    </h4>\n                    <p\n                        className={`font-semibold p-0 mt-[10px] leading-none tracking-wide line-clamp-1 text-[12px] notification-card-type-text ${textStyles}`}\n                        data-testid=\"notification-type\"\n                    >\n                        {typeText}{' '}\n                        {issueDate && (\n                            <span\n                                className=\"text-grayscale-600 normal-case font-normal text-[12px] notification-card-type-issue-date\"\n                                data-testid=\"notification-cred-issue-date\"\n                            >\n                                • {issueDate}\n                            </span>\n                        )}\n                    </p>\n\n                    <div className=\"flex items-center justify-between mt-3 w-full\">\n                        <button\n                            className={`notification-claim-btn flex items-center mr-[15px] w-[143px] justify-center flex-1 rounded-[24px] border-2 border-solid font-semibold py-2 px-3 tracking-wide ${claimButtonStyles}`}\n                            onClick={handleButtonClick}\n                            role=\"button\"\n                            name=\"notification-claim-button\"\n                        >\n                            {isAccepted && <Checkmark className=\"h-[24px] p-0 m-0\" />}{' '}\n                            {isLoading ? 'Loading...' : buttonText}\n                        </button>\n\n                        <button\n                            onClick={handleCancelClick}\n                            className={`rounded-[24px] flex items-center justify-center  h-[42px] w-[42px] shadow-bottom bg-white font-semibold mr-2 p-[0px] tracking-wide ${viewButtonStyles}`}\n                            role=\"button\"\n                            name=\"notification-view-button\"\n                        >\n                            {!isArchived && (\n                                <img src={X ?? ''} alt=\"Cancel\" className=\"notification-card-x\" />\n                            )}\n                            {isArchived && (\n                                <img\n                                    src={ArrowArcLeft ?? ''}\n                                    alt=\"Cancel\"\n                                    className=\"notification-card-x\"\n                                />\n                            )}\n                        </button>\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n};\n\nexport default NotificationUserCard;\n"],"names":["useState","useEffect","UserNotificationTypeStyles","UserNotificationTypeEnum","React","Checkmark","X","ArrowArcLeft"],"mappings":";;;;;;;;;;;;;;;AAQO,MAAM,uBAA4D,CAAC;AAAA,EACtE,KAAA;AAAA,EACA,oBAAA;AAAA,EACA,SAAA;AAAA,EACA,UAAA;AAAA,EACA,SAAA;AAAA,EACA,YAAe,GAAA,KAAA;AAAA,EACf,YAAe,GAAA,KAAA;AAAA,EACf,iBAAA;AAAA,EACA,iBAAA;AAAA,EACA,UAAA;AACJ,CAAM,KAAA;AAnBN,EAAA,IAAA,EAAA,EAAA,EAAA,CAAA;AAoBI,EAAA,MAAM,CAAC,UAAY,EAAA,aAAa,CAAI,GAAAA,cAAA,CAAkB,gBAAgB,KAAK,CAAA,CAAA;AAC3E,EAAA,MAAM,CAAC,SAAW,EAAA,YAAY,CAAI,GAAAA,cAAA,CAAkB,gBAAgB,KAAK,CAAA,CAAA;AAEzE,EAAAC,eAAA,CAAU,MAAM;AACZ,IAAA,aAAA,CAAc,YAAY,CAAA,CAAA;AAAA,GAC9B,EAAG,CAAC,YAAY,CAAC,CAAA,CAAA;AAEjB,EAAAA,eAAA,CAAU,MAAM;AACZ,IAAA,YAAA,CAAa,YAAY,CAAA,CAAA;AAAA,GAC7B,EAAG,CAAC,YAAY,CAAC,CAAA,CAAA;AAEjB,EAAM,MAAA,EAAE,YAAY,gBAAkB,EAAA,mBAAA,EAAqB,uBAAuB,QAAS,EAAA,GACvFC,iCAA2BC,sCAAyB,CAAA,iBAAA,CAAA,CAAA;AAExD,EAAM,MAAA,iBAAA,GAAoB,aAAa,mBAAsB,GAAA,qBAAA,CAAA;AAE7D,EAAA,IAAI,UAAqB,GAAA,EAAA,CAAA;AAEzB,EAAA,IAAI,UAAY,EAAA;AACZ,IAAa,UAAA,GAAA,UAAA,CAAA;AAAA,GACjB,MAAA,IAAW,CAAC,UAAY,EAAA;AACpB,IAAa,UAAA,GAAA,QAAA,CAAA;AAAA,GACjB;AAEA,EAAA,uBACKC,yBAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IACG,WAAW,CAAuH,oHAAA,EAAA,SAAA,CAAA,CAAA;AAAA,GAAA,kBAEjIA,yBAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAU,EAAA,2CAAA;AAAA,GACV,EAAA,CAAC,wCACGA,yBAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IACG,SAAW,EAAA,CAAA,0GAAA,CAAA;AAAA,GAAA,kBAEVA,yBAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IACG,GAAK,EAAA,UAAA;AAAA,IACL,GAAI,EAAA,oBAAA;AAAA,IACJ,SAAU,EAAA,8CAAA;AAAA,GACd,CACJ,CAEH,EAAA,oBAAA,IAAwB,EAAE,oBAAqB,EACpD,mBACCA,yBAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAU,EAAA,0DAAA;AAAA,GAAA,kBACVA,yBAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAU,EAAA,+DAAA;AAAA,GAAA,kBACVA,yBAAA,CAAA,aAAA,CAAA,IAAA,EAAA;AAAA,IACG,SAAU,EAAA,8GAAA;AAAA,IACV,aAAY,EAAA,oBAAA;AAAA,GAEX,EAAA,KACL,mBACCA,yBAAA,CAAA,aAAA,CAAA,GAAA,EAAA;AAAA,IACG,WAAW,CAA+G,4GAAA,EAAA,UAAA,CAAA,CAAA;AAAA,IAC1H,aAAY,EAAA,mBAAA;AAAA,GAEX,EAAA,QAAA,EAAU,GACV,EAAA,SAAA,oBACIA,yBAAA,CAAA,aAAA,CAAA,MAAA,EAAA;AAAA,IACG,SAAU,EAAA,0FAAA;AAAA,IACV,aAAY,EAAA,8BAAA;AAAA,GAAA,EACf,SACM,EAAA,SACP,CAER,CAAA,kBAECA,yBAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAU,EAAA,+CAAA;AAAA,GAAA,kBACVA,yBAAA,CAAA,aAAA,CAAA,QAAA,EAAA;AAAA,IACG,WAAW,CAAiK,8JAAA,EAAA,iBAAA,CAAA,CAAA;AAAA,IAC5K,OAAS,EAAA,iBAAA;AAAA,IACT,IAAK,EAAA,QAAA;AAAA,IACL,IAAK,EAAA,2BAAA;AAAA,GAAA,EAEJ,8BAAeA,yBAAA,CAAA,aAAA,CAAAC,mBAAA,EAAA;AAAA,IAAU,SAAU,EAAA,kBAAA;AAAA,GAAmB,GAAI,GAC1D,EAAA,SAAA,GAAY,YAAe,GAAA,UAChC,mBAECD,yBAAA,CAAA,aAAA,CAAA,QAAA,EAAA;AAAA,IACG,OAAS,EAAA,iBAAA;AAAA,IACT,WAAW,CAAsI,mIAAA,EAAA,gBAAA,CAAA,CAAA;AAAA,IACjJ,IAAK,EAAA,QAAA;AAAA,IACL,IAAK,EAAA,0BAAA;AAAA,GAEJ,EAAA,CAAC,8BACGA,yBAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IAAI,MAAK,EAAK,GAAAE,qBAAA,KAAA,IAAA,GAAA,EAAA,GAAA,EAAA;AAAA,IAAI,GAAI,EAAA,QAAA;AAAA,IAAS,SAAU,EAAA,qBAAA;AAAA,GAAsB,CAAA,EAEnE,8BACIF,yBAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IACG,MAAK,EAAgB,GAAAG,gCAAA,KAAA,IAAA,GAAA,EAAA,GAAA,EAAA;AAAA,IACrB,GAAI,EAAA,QAAA;AAAA,IACJ,SAAU,EAAA,qBAAA;AAAA,GACd,CAER,CACJ,CACJ,CACJ,CACJ,CAAA,CAAA;AAER;;;;"}
+{"version":3,"file":"NotificationUserCard-59431df3.js","sources":["../../src/components/NotificationUserCard/NotificationUserCard.tsx"],"sourcesContent":["import React, { useState, useEffect } from 'react';\nimport X from '../../assets/images/X.svg';\nimport { NotificationUserCardProps, UserNotificationTypeStyles } from './types';\n\nimport { UserNotificationTypeEnum } from '../../constants/notifications';\nimport Checkmark from '../svgs/Checkmark';\nimport ArrowArcLeft from '../../assets/images/ArrowArcLeft.svg';\n\nexport const NotificationUserCard: React.FC<NotificationUserCardProps> = ({\n    title,\n    customThumbComponent,\n    className,\n    thumbImage,\n    issueDate,\n    acceptStatus = false,\n    loadingState = false,\n    handleButtonClick,\n    handleCancelClick,\n    isArchived,\n}) => {\n    const [isAccepted, setisAccepted] = useState<boolean>(acceptStatus || false);\n    const [isLoading, setIsLoading] = useState<boolean>(loadingState || false);\n\n    useEffect(() => {\n        setisAccepted(acceptStatus);\n    }, [acceptStatus]);\n\n    useEffect(() => {\n        setIsLoading(loadingState);\n    }, [loadingState]);\n\n    const { textStyles, viewButtonStyles, claimedButtonStyles, unclaimedButtonStyles, typeText } =\n        UserNotificationTypeStyles[UserNotificationTypeEnum.ConnectionRequest];\n\n    const claimButtonStyles = isAccepted ? claimedButtonStyles : unclaimedButtonStyles;\n\n    let buttonText: string = '';\n\n    if (isAccepted) {\n        buttonText = 'Accepted';\n    } else if (!isAccepted) {\n        buttonText = 'Accept';\n    }\n\n    return (\n        <div\n            className={`flex justify-start max-w-[600px] items-start relative w-full rounded-3xl shadow-bottom py-[10px] px-[10px] bg-white ${className}`}\n        >\n            <div className=\"notification-card-left-side px-[0px] flex\">\n                {!customThumbComponent && (\n                    <div\n                        className={`overflow-hidden cursor-pointer w-[68px] h-[68px] rounded-full flex items-start notification-card-thumbnail`}\n                    >\n                        <img\n                            src={thumbImage}\n                            alt=\"Notification Thumb\"\n                            className=\"w-full h-full w-[68px] h-[68px] object-cover\"\n                        />\n                    </div>\n                )}\n                {customThumbComponent && { customThumbComponent }}\n            </div>\n            <div className=\"flex flex-col justify-center items-start relative w-full\">\n                <div className=\"text-left ml-3 flex flex-col items-start justify-start w-full\">\n                    <h4\n                        className=\"cursor-pointer font-bold tracking-wide line-clamp-2 text-black text-[14px] pr-[20px] notification-card-title\"\n                        data-testid=\"notification-title\"\n                    >\n                        {title}\n                    </h4>\n                    <p\n                        className={`font-semibold p-0 mt-[10px] leading-none tracking-wide line-clamp-1 text-[12px] notification-card-type-text ${textStyles}`}\n                        data-testid=\"notification-type\"\n                    >\n                        {typeText}{' '}\n                        {issueDate && (\n                            <span\n                                className=\"text-grayscale-600 normal-case font-normal text-[12px] notification-card-type-issue-date\"\n                                data-testid=\"notification-cred-issue-date\"\n                            >\n                                • {issueDate}\n                            </span>\n                        )}\n                    </p>\n\n                    <div className=\"flex items-center justify-between mt-3 w-full\">\n                        <button\n                            className={`notification-claim-btn flex items-center mr-[15px] w-[143px] justify-center flex-1 rounded-[24px] border-2 border-solid font-semibold py-2 px-3 tracking-wide ${claimButtonStyles}`}\n                            onClick={handleButtonClick}\n                            role=\"button\"\n                            name=\"notification-claim-button\"\n                        >\n                            {isAccepted && <Checkmark className=\"h-[24px] p-0 m-0\" />}{' '}\n                            {isLoading ? 'Loading...' : buttonText}\n                        </button>\n\n                        <button\n                            onClick={handleCancelClick}\n                            className={`rounded-[24px] flex items-center justify-center  h-[42px] w-[42px] shadow-bottom bg-white font-semibold mr-2 p-[0px] tracking-wide ${viewButtonStyles}`}\n                            role=\"button\"\n                            name=\"notification-view-button\"\n                        >\n                            {!isArchived && (\n                                <img src={X ?? ''} alt=\"Cancel\" className=\"notification-card-x\" />\n                            )}\n                            {isArchived && (\n                                <img\n                                    src={ArrowArcLeft ?? ''}\n                                    alt=\"Cancel\"\n                                    className=\"notification-card-x\"\n                                />\n                            )}\n                        </button>\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n};\n\nexport default NotificationUserCard;\n"],"names":["useState","useEffect","UserNotificationTypeStyles","UserNotificationTypeEnum","React","Checkmark","ArrowArcLeft"],"mappings":"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"}

package/dist/cjs/PuzzlePiece-e64f4596.js

@@ -0,0 +1,97 @@
+'use strict';
+
+var React = require('react');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+const PuzzlePiece = ({ className = "", size = "21", fill = "none", version = "outline" }) => {
+  if (version === "outline") {
+    return /* @__PURE__ */ React__default["default"].createElement(
+      "svg",
+      {
+        width: size,
+        height: size,
+        viewBox: "0 0 26 26",
+        fill,
+        className,
+        "data-testid": "skill-icon"
+      },
+      /* @__PURE__ */ React__default["default"].createElement(
+        "path",
+        {
+          d: "M6.49991 21.9374C6.39321 21.9374 6.28756 21.9164 6.18898 21.8756C6.0904 21.8347 6.00083 21.7749 5.92538 21.6994C5.84994 21.624 5.79009 21.5344 5.74926 21.4358C5.70843 21.3372 5.68741 21.2316 5.68741 21.1249L5.68747 16.7887C5.25402 16.994 4.7757 17.0863 4.29699 17.0571C3.81827 17.0279 3.35473 16.8781 2.94947 16.6216C2.5442 16.3651 2.21039 16.0103 1.97908 15.5902C1.74776 15.1701 1.62646 14.6983 1.62646 14.2187C1.62646 13.7391 1.74776 13.2672 1.97908 12.8471C2.21039 12.427 2.5442 12.0722 2.94947 11.8157C3.35473 11.5592 3.81827 11.4094 4.29699 11.3802C4.7757 11.351 5.25402 11.4433 5.68747 11.6486L5.68741 7.31241C5.68741 7.20571 5.70843 7.10005 5.74926 7.00148C5.79009 6.9029 5.84994 6.81333 5.92539 6.73788C6.00084 6.66243 6.09041 6.60258 6.18899 6.56175C6.28757 6.52092 6.39322 6.4999 6.49993 6.4999L11.2423 6.49996C11.0371 6.06651 10.9447 5.58819 10.9739 5.10948C11.0031 4.63077 11.153 4.16722 11.4094 3.76196C11.6659 3.3567 12.0207 3.02289 12.4409 2.79158C12.861 2.56026 13.3328 2.43896 13.8124 2.43896C14.292 2.43896 14.7638 2.56026 15.1839 2.79158C15.6041 3.02289 15.9589 3.3567 16.2154 3.76196C16.4718 4.16722 16.6216 4.63077 16.6509 5.10948C16.6801 5.58819 16.5877 6.06651 16.3825 6.49996L21.1249 6.4999C21.3404 6.4999 21.547 6.5855 21.6994 6.73787C21.8518 6.89024 21.9374 7.0969 21.9374 7.31239L21.9374 11.6486C21.504 11.4433 21.0257 11.351 20.5469 11.3802C20.0682 11.4094 19.6047 11.5592 19.1994 11.8157C18.7942 12.0722 18.4604 12.427 18.229 12.8471C17.9977 13.2672 17.8764 13.739 17.8764 14.2187C17.8764 14.6983 17.9977 15.1701 18.229 15.5902C18.4604 16.0103 18.7942 16.3651 19.1994 16.6216C19.6047 16.8781 20.0682 17.0279 20.5469 17.0571C21.0257 17.0863 21.504 16.994 21.9374 16.7887L21.9374 21.1249C21.9374 21.3404 21.8518 21.5471 21.6994 21.6994C21.547 21.8518 21.3404 21.9374 21.1249 21.9374L6.49991 21.9374Z",
+          stroke: "currentColor",
+          strokeWidth: "2",
+          strokeLinecap: "round",
+          strokeLinejoin: "round"
+        }
+      )
+    );
+  } else if (version === "filled") {
+    return /* @__PURE__ */ React__default["default"].createElement(
+      "svg",
+      {
+        width: size,
+        height: size,
+        viewBox: "0 0 20 20",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        className
+      },
+      /* @__PURE__ */ React__default["default"].createElement(
+        "path",
+        {
+          d: "M7.98568 4.5553C7.98343 4.30027 8.02149 4.02612 8.10099 3.7348C8.48783 2.31721 9.51754 1.73347 10.9613 2.11331C12.405 2.49316 12.9995 3.50422 12.6127 4.92181C12.5332 5.21313 12.4265 5.46924 12.2947 5.689C13.1188 5.95141 13.9369 6.22525 14.5182 6.42268C15.0089 6.58936 15.3237 7.05717 15.2988 7.5664L15.2907 7.73448C15.2562 8.44639 15.1845 9.15653 15.0762 9.86126C15.1259 9.87224 15.176 9.88439 15.2267 9.8977C16.6758 10.279 17.2724 11.2938 16.8842 12.7166C16.4959 14.1394 15.4624 14.7253 14.0133 14.3441C13.9663 14.3317 13.9202 14.3186 13.875 14.305C13.6191 14.9537 13.3298 15.5898 13.0079 16.2098L12.9265 16.3665C12.6907 16.8212 12.181 17.0747 11.6702 16.9805C8.64907 16.4237 5.67688 15.6417 2.77696 14.6407C2.28678 14.4714 1.97434 14.0017 2.00166 13.4922L2.01102 13.3165C2.0496 12.5913 2.08683 11.8911 2.17738 11.154C2.36284 11.2449 2.57011 11.3208 2.79865 11.3809C4.24239 11.7608 5.2721 11.177 5.65894 9.75943C6.04579 8.34183 5.4513 7.33077 4.00756 6.95092C3.78313 6.89188 3.56869 6.85612 3.36513 6.84316C3.67005 6.15033 4.00362 5.51517 4.3499 4.85582L4.42837 4.70637C4.66617 4.25312 5.17702 4.00255 5.68688 4.09913C6.2907 4.21351 7.13852 4.378 7.98568 4.5553Z",
+          fill: "currentColor"
+        }
+      )
+    );
+  } else if (version === "with-plus") {
+    return /* @__PURE__ */ React__default["default"].createElement(
+      "svg",
+      {
+        width: size,
+        height: size,
+        viewBox: "0 0 25 25",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        className
+      },
+      /* @__PURE__ */ React__default["default"].createElement("g", { clipPath: "url(#clip0_6520_365435)" }, /* @__PURE__ */ React__default["default"].createElement(
+        "path",
+        {
+          d: "M10.178 4.91813C10.1746 4.52708 10.233 4.10672 10.3548 3.66003C10.948 1.48639 12.5269 0.591323 14.7406 1.17375C16.9544 1.75618 17.8659 3.30647 17.2728 5.48011C17.1509 5.9268 16.9873 6.3195 16.7852 6.65646C18.0488 7.05882 19.3033 7.47872 20.1945 7.78145C20.947 8.03702 21.4297 8.75432 21.3915 9.53515L21.3791 9.79286C21.3262 10.8845 21.2162 11.9734 21.0502 13.0539C21.1263 13.0708 21.2033 13.0894 21.2809 13.1098C23.5028 13.6944 24.4177 15.2504 23.8224 17.4321C23.227 19.6138 21.6423 20.5122 19.4204 19.9276C19.3483 19.9086 19.2777 19.8886 19.2084 19.8676C18.8159 20.8624 18.3723 21.8376 17.8788 22.7883L17.754 23.0287C17.3924 23.7259 16.6108 24.1145 15.8277 23.9701C11.1952 23.1164 6.63788 21.9173 2.19133 20.3824C1.43973 20.1228 0.960661 19.4026 1.00254 18.6214L1.01689 18.352C1.07606 17.24 1.13314 16.1663 1.27199 15.0361C1.55636 15.1755 1.87417 15.2919 2.2246 15.3841C4.43834 15.9665 6.01722 15.0714 6.61038 12.8978C7.20355 10.7241 6.292 9.17384 4.07826 8.59141C3.73413 8.50088 3.40533 8.44605 3.0932 8.42617C3.56074 7.36385 4.07222 6.38992 4.60317 5.37893L4.7235 5.14977C5.08813 4.45479 5.87143 4.07058 6.65321 4.21867C7.57907 4.39405 8.87907 4.64627 10.178 4.91813Z",
+          stroke: "white",
+          strokeWidth: "2",
+          strokeLinecap: "round",
+          strokeLinejoin: "round"
+        }
+      ), /* @__PURE__ */ React__default["default"].createElement(
+        "path",
+        {
+          d: "M13 10V16",
+          stroke: "white",
+          strokeWidth: "2",
+          strokeLinecap: "round",
+          strokeLinejoin: "round"
+        }
+      ), /* @__PURE__ */ React__default["default"].createElement(
+        "path",
+        {
+          d: "M10 13H16",
+          stroke: "white",
+          strokeWidth: "2",
+          strokeLinecap: "round",
+          strokeLinejoin: "round"
+        }
+      )),
+      /* @__PURE__ */ React__default["default"].createElement("defs", null, /* @__PURE__ */ React__default["default"].createElement("clipPath", { id: "clip0_6520_365435" }, /* @__PURE__ */ React__default["default"].createElement("rect", { width: "25", height: "25", fill: "white" })))
+    );
+  }
+  return null;
+};
+
+exports.PuzzlePiece = PuzzlePiece;
+//# sourceMappingURL=PuzzlePiece-e64f4596.js.map