@paro.io/expert-shared-components 1.8.2 → 1.8.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (33) hide show
  1. package/lib/components/ClientReferencesSection/DeleteButton.js +11 -11
  2. package/lib/components/ClientReferencesSection/ParoError.js +10 -10
  3. package/lib/components/ClientReferencesSection/TagsSection.js +2 -2
  4. package/lib/components/ClientReferencesSection/styles/BrandedTypography.js +2 -2
  5. package/lib/components/ClientReferencesSection/styles/Buttons.js +15 -15
  6. package/lib/components/ClientReferencesSection/styles/Name.js +5 -5
  7. package/lib/components/ClientReferencesSection/styles/NullContentConditionalColor.js +4 -4
  8. package/lib/components/ClientReferencesSection/styles/SectionBody.js +11 -11
  9. package/lib/components/ClientReferencesSection/styles/SectionTitle.js +6 -6
  10. package/lib/components/ClientReferencesSection/styles/Tags.js +2 -2
  11. package/lib/components/DocumentCenter/DocumentTable.d.ts +15 -15
  12. package/lib/components/DocumentCenter/DocumentTable.js +350 -350
  13. package/lib/components/DocumentCenter/UploadFilesButton.d.ts +6 -6
  14. package/lib/components/DocumentCenter/UploadFilesButton.js +29 -29
  15. package/lib/components/ExpertProfileHeader/ActionButtonSection.js +6 -6
  16. package/lib/components/ExpertProfileHeader/ProfileSection.js +7 -7
  17. package/lib/components/OrganizationChart/OrganizationChart.js +7 -7
  18. package/lib/components/Reviews/Pagination.js +6 -6
  19. package/lib/components/ReviewsTab/RatingHeader.js +6 -6
  20. package/lib/components/ReviewsTab/expert-shared-components.code-workspace +20 -20
  21. package/lib/components/ReviewsTab/reviewRequestModal.js +5 -5
  22. package/lib/components/ServiceLinesTemplate/index.d.ts +1 -1
  23. package/lib/components/ServiceLinesTemplate/index.js +31 -29
  24. package/lib/components/shared/Error.d.ts +6 -6
  25. package/lib/components/shared/Error.js +40 -40
  26. package/lib/components/shared/Image.js +13 -13
  27. package/lib/components/shared/ProfileTextField.d.ts +18 -18
  28. package/lib/components/shared/ProfileTextField.js +16 -16
  29. package/lib/components/shared/StyledActionButtons.d.ts +7 -7
  30. package/lib/components/shared/StyledActionButtons.js +15 -15
  31. package/lib/components/shared/ToastNotification.d.ts +10 -10
  32. package/lib/components/shared/ToastNotification.js +63 -63
  33. package/package.json +59 -59
package/lib/components/DocumentCenter/UploadFilesButton.d.ts CHANGED
@@ -1,6 +1,6 @@
1
- interface UploadFilesButtonProps {
2
- onFileSelect: (file: File) => void;
3
- isLoading?: boolean;
4
- }
5
- export declare const UploadFilesButton: ({ onFileSelect, isLoading, }: UploadFilesButtonProps) => JSX.Element;
6
- export {};
1
+ interface UploadFilesButtonProps {
2
+ onFileSelect: (file: File) => void;
3
+ isLoading?: boolean;
4
+ }
5
+ export declare const UploadFilesButton: ({ onFileSelect, isLoading, }: UploadFilesButtonProps) => JSX.Element;
6
+ export {};
package/lib/components/DocumentCenter/UploadFilesButton.js CHANGED
@@ -1,29 +1,29 @@
1
- "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
- Object.defineProperty(exports, "__esModule", { value: true });
6
- exports.UploadFilesButton = void 0;
7
- const react_1 = __importDefault(require("react"));
8
- const base_ui_1 = require("@paro.io/base-ui");
9
- const react_2 = require("react");
10
- const UploadFilesButton = ({ onFileSelect, isLoading, }) => {
11
- const fileInputRef = (0, react_2.useRef)(null);
12
- const handleClick = () => {
13
- var _a;
14
- (_a = fileInputRef.current) === null || _a === void 0 ? void 0 : _a.click();
15
- };
16
- const handleFileChange = (event) => {
17
- var _a;
18
- const file = (_a = event.target.files) === null || _a === void 0 ? void 0 : _a[0];
19
- if (file) {
20
- onFileSelect(file);
21
- }
22
- // Reset input value to allow uploading the same file again
23
- event.target.value = '';
24
- };
25
- return (react_1.default.createElement("div", null,
26
- react_1.default.createElement("input", { type: "file", ref: fileInputRef, onChange: handleFileChange, className: "hidden", accept: ".pdf,.doc,.docx,.xls,.xlsx,.ppt,.pptx" }),
27
- react_1.default.createElement(base_ui_1.Button, { onClick: handleClick, disabled: isLoading })));
28
- };
29
- exports.UploadFilesButton = UploadFilesButton;
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.UploadFilesButton = void 0;
7
+ const react_1 = __importDefault(require("react"));
8
+ const base_ui_1 = require("@paro.io/base-ui");
9
+ const react_2 = require("react");
10
+ const UploadFilesButton = ({ onFileSelect, isLoading, }) => {
11
+ const fileInputRef = (0, react_2.useRef)(null);
12
+ const handleClick = () => {
13
+ var _a;
14
+ (_a = fileInputRef.current) === null || _a === void 0 ? void 0 : _a.click();
15
+ };
16
+ const handleFileChange = (event) => {
17
+ var _a;
18
+ const file = (_a = event.target.files) === null || _a === void 0 ? void 0 : _a[0];
19
+ if (file) {
20
+ onFileSelect(file);
21
+ }
22
+ // Reset input value to allow uploading the same file again
23
+ event.target.value = '';
24
+ };
25
+ return (react_1.default.createElement("div", null,
26
+ react_1.default.createElement("input", { type: "file", ref: fileInputRef, onChange: handleFileChange, className: "hidden", accept: ".pdf,.doc,.docx,.xls,.xlsx,.ppt,.pptx" }),
27
+ react_1.default.createElement(base_ui_1.Button, { onClick: handleClick, disabled: isLoading })));
28
+ };
29
+ exports.UploadFilesButton = UploadFilesButton;
package/lib/components/ExpertProfileHeader/ActionButtonSection.js CHANGED
@@ -11,12 +11,12 @@ const CopyToClipboardAlert_1 = __importDefault(require("../shared/CopyToClipboar
11
11
  const colors_1 = __importDefault(require("../ClientReferencesSection/constants/colors"));
12
12
  const Banner_1 = __importDefault(require("./Banner"));
13
13
  const base_icons_1 = require("@paro.io/base-icons");
14
- const StyledButton = (0, styled_components_1.default)(core_1.Button) `
15
- margin: 0px !important;
16
- padding: 26px 0 18px 0 !important;
17
- span {
18
- color: ${colors_1.default.buttonText} !important
19
- }
14
+ const StyledButton = (0, styled_components_1.default)(core_1.Button) `
15
+ margin: 0px !important;
16
+ padding: 26px 0 18px 0 !important;
17
+ span {
18
+ color: ${colors_1.default.buttonText} !important
19
+ }
20
20
  `;
21
21
  const ActionButton = ({ title, ariaLabel, onClick, icon: Icon }) => (react_1.default.createElement(core_1.Tooltip, { arrow: true, placement: "top", interactive: true, className: "whitespace-nowrap", title: title },
22
22
  react_1.default.createElement(core_1.IconButton, { "aria-label": ariaLabel, onClick: onClick },
package/lib/components/ExpertProfileHeader/ProfileSection.js CHANGED
@@ -53,13 +53,13 @@ const formatPhoneNumber = (phone) => {
53
53
  return `(${numericPhone.slice(0, 3)}) ${numericPhone.slice(3, 6)} - ${numericPhone.slice(6)}`;
54
54
  };
55
55
  exports.formatPhoneNumber = formatPhoneNumber;
56
- exports.ProfilePhotoPreview = styled_components_1.default.img `
57
- height: 86px;
58
- width: 86px;
59
- border: 1px solid ${colors_1.default.lightGray};
60
- border-radius: 50%;
61
- object-fit: cover;
62
- object-position: top;
56
+ exports.ProfilePhotoPreview = styled_components_1.default.img `
57
+ height: 86px;
58
+ width: 86px;
59
+ border: 1px solid ${colors_1.default.lightGray};
60
+ border-radius: 50%;
61
+ object-fit: cover;
62
+ object-position: top;
63
63
  `;
64
64
  const ProfileSection = ({ legacyFreelancerId, imageUrl, shouldAllowEditProfile, firstName, lastName, primaryServiceLine, editServiceLine, city, stateAbbreviation, email, phone, setOpen, paroProjectsData, getUserDocument, uploadUserPhotoMutation, loadingNewImage, imageUpdateError, isInternal, getUserByEmail, updateUserEmail, updateUserMutation, getUserByEmailLazyQuery, updateUserPassword, verifyUserPassword, getExpertRates, }) => {
65
65
  var _a;
package/lib/components/OrganizationChart/OrganizationChart.js CHANGED
@@ -34,13 +34,13 @@ const Close_1 = __importDefault(require("@material-ui/icons/Close"));
34
34
  const cdn_1 = require("../shared/constants/cdn");
35
35
  const styled_components_1 = __importDefault(require("styled-components"));
36
36
  const defaultAvatar = cdn_1.CDN_URL + 'defaultAvatar.png';
37
- const ProfilePhotoPreview = styled_components_1.default.img `
38
- height: 86px;
39
- width: 86px;
40
- border: 1px solid #e4e5e4;
41
- border-radius: 50%;
42
- object-fit: cover;
43
- object-position: top;
37
+ const ProfilePhotoPreview = styled_components_1.default.img `
38
+ height: 86px;
39
+ width: 86px;
40
+ border: 1px solid #e4e5e4;
41
+ border-radius: 50%;
42
+ object-fit: cover;
43
+ object-position: top;
44
44
  `;
45
45
  const CustomDialog = (0, core_1.styled)(Dialog_1.default)(({ theme }) => ({
46
46
  '& .MuiDialog-paper': {
package/lib/components/Reviews/Pagination.js CHANGED
@@ -51,12 +51,12 @@ const Pagination = ({ total, currentPage = 1, setCurrentPage, perPageItems = 10,
51
51
  };
52
52
  const numberOfPages = Math.ceil(total / perPageItems);
53
53
  return (react_1.default.createElement("div", { className: "bg-white px-4 py-3 border-t border-gray-200 sm:px-6 flex flex-col md:flex-row md:items-center md:justify-between" },
54
- react_1.default.createElement("div", { className: "pb-2 md:pb-0" }, `Showing
55
- ${perPageItems * (currentPage - 1) + 1}
56
- to
57
- ${Math.min(total, perPageItems * currentPage)}
58
- of
59
- ${total}
54
+ react_1.default.createElement("div", { className: "pb-2 md:pb-0" }, `Showing
55
+ ${perPageItems * (currentPage - 1) + 1}
56
+ to
57
+ ${Math.min(total, perPageItems * currentPage)}
58
+ of
59
+ ${total}
60
60
  ${displayText}`),
61
61
  react_1.default.createElement("div", { className: "flex items-center justify-between" },
62
62
  react_1.default.createElement("div", { className: "flex-1 flex justify-between sm:hidden" },
package/lib/components/ReviewsTab/RatingHeader.js CHANGED
@@ -51,12 +51,12 @@ const isRatingExists = (rating) => {
51
51
  return false;
52
52
  };
53
53
  exports.isRatingExists = isRatingExists;
54
- const StyledButton = (0, styled_components_1.default)(core_2.Button) `
55
- margin: 0px !important;
56
- padding: 26px 0 18px 0 !important;
57
- span {
58
- color: #248384 !important
59
- }
54
+ const StyledButton = (0, styled_components_1.default)(core_2.Button) `
55
+ margin: 0px !important;
56
+ padding: 26px 0 18px 0 !important;
57
+ span {
58
+ color: #248384 !important
59
+ }
60
60
  `;
61
61
  const RatingHeader = ({ ratings, project, index, highlightedRatings, requestStatus, handleRatingRequest, loadingSubmitId, handleAddToProfile, ratingReviewButtonlabel, setOpenClientReviewModal, setShowReviewModelWithRecentlyRatedProjects, enableReviewModal, disableReviewModal, isClientPortal, isInternal, createOrUpdateRating, getParoProjectsDocument, projectIdToShow, }) => {
62
62
  var _a, _b, _c, _d;
package/lib/components/ReviewsTab/expert-shared-components.code-workspace CHANGED
@@ -1,20 +1,20 @@
1
- {
2
- "folders": [
3
- {
4
- "path": "../../.."
5
- },
6
- {
7
- "path": "../../../../internal-profile-app"
8
- },
9
- {
10
- "path": "../../../../availability-gantt-chart"
11
- },
12
- {
13
- "path": "../../../../client-portal"
14
- },
15
- {
16
- "path": "../../../../expert-portal"
17
- }
18
- ],
19
- "settings": {}
20
- }
1
+ {
2
+ "folders": [
3
+ {
4
+ "path": "../../.."
5
+ },
6
+ {
7
+ "path": "../../../../internal-profile-app"
8
+ },
9
+ {
10
+ "path": "../../../../availability-gantt-chart"
11
+ },
12
+ {
13
+ "path": "../../../../client-portal"
14
+ },
15
+ {
16
+ "path": "../../../../expert-portal"
17
+ }
18
+ ],
19
+ "settings": {}
20
+ }
package/lib/components/ReviewsTab/reviewRequestModal.js CHANGED
@@ -34,11 +34,11 @@ const react_hot_toast_1 = __importDefault(require("react-hot-toast"));
34
34
  const ReviewRequestModal = ({ project, requestModal, setRequestModal, expertName, freelancerId, setRequestStatus, selectedProject, setSelectedProject, clientId, refetchParoProjects, setHighlightedRatings, createOrUpdateRatingRequestMutation, getParoProjectsDocument, }) => {
35
35
  var _a;
36
36
  const [showError, setShowError] = (0, react_1.useState)(false);
37
- const [textareaValue, setTextareaValue] = (0, react_1.useState)(`Hi ${(_a = project === null || project === void 0 ? void 0 : project.client) === null || _a === void 0 ? void 0 : _a.name},
38
- I hope you are satisfied with the work I provided on ${project === null || project === void 0 ? void 0 : project.name}. Your feedback is very important to me and helps me improve my services and build my reputation on Paro. Could you please take a moment to leave a review of you experience? Your input is greatly appreciated!
39
-
40
- Thank you in advance for your time and feedback.
41
- Best regards,
37
+ const [textareaValue, setTextareaValue] = (0, react_1.useState)(`Hi ${(_a = project === null || project === void 0 ? void 0 : project.client) === null || _a === void 0 ? void 0 : _a.name},
38
+ I hope you are satisfied with the work I provided on ${project === null || project === void 0 ? void 0 : project.name}. Your feedback is very important to me and helps me improve my services and build my reputation on Paro. Could you please take a moment to leave a review of you experience? Your input is greatly appreciated!
39
+
40
+ Thank you in advance for your time and feedback.
41
+ Best regards,
42
42
  ${expertName}`);
43
43
  const handleTextArea = (e) => {
44
44
  setTextareaValue(e.target.value);
package/lib/components/ServiceLinesTemplate/index.d.ts CHANGED
@@ -16,7 +16,7 @@ type ServiceLinesTemplateProps = {
16
16
  isInternalProfile?: boolean;
17
17
  updateFreelancerPreferences?: any;
18
18
  getExpertVanityTitles?: any;
19
- reactAppUrl: string;
19
+ reactAppUrl?: string;
20
20
  };
21
21
  export declare const ServiceLinesTemplate: ({ getFreelancerDataResult, createOrUpdateRates, getRatesByExpertId, updateExpert, openServiceLinesTemplate, getServiceLines, legacyFreelancerId, expertId, isFirmProfile, serviceLineData, selectedServicesList, isInternalProfile, updateFreelancerPreferences, getExpertVanityTitles, reactAppUrl, }: ServiceLinesTemplateProps) => false | React.JSX.Element | undefined;
22
22
  export {};
package/lib/components/ServiceLinesTemplate/index.js CHANGED
@@ -255,31 +255,32 @@ const ServiceLinesTemplate = ({ getFreelancerDataResult, createOrUpdateRates, ge
255
255
  react_1.default.createElement(core_1.Grid, { container: true, className: "service-lines-header", direction: "column", justifyContent: "center" },
256
256
  react_1.default.createElement(core_1.Grid, { item: true, container: true, direction: "row", justifyContent: "space-between", alignItems: "flex-start" },
257
257
  react_1.default.createElement(core_1.Grid, { item: true, direction: "column", justifyContent: "flex-start" },
258
- react_1.default.createElement(core_1.Typography, { variant: "h6", style: { color: '#12756F', fontSize: '24px', fontWeight: 600 } }, "Expand Your Expertise"),
259
- react_1.default.createElement(core_1.Typography, { variant: "body2", style: { color: '#1C1F2B', fontSize: '16px', fontWeight: 600 } }, "Step 1: Add more services to your profile to stand out")),
260
- react_1.default.createElement(core_1.Grid, { item: true, style: { backgroundColor: '#0E3435', color: '#ffffff', borderRadius: '20px', padding: '6px 20px' } },
261
- "Step ",
262
- value + 1,
263
- " of 2")),
258
+ react_1.default.createElement(core_1.Typography, { variant: "h6", style: { color: '#12756F', fontSize: '18px', fontWeight: 600, fontFamily: "Roboto" } }, "Expand Your Expertise"),
259
+ react_1.default.createElement(core_1.Typography, { variant: "body2", style: { color: '#1C1F2B', fontSize: '12px', fontWeight: 600, fontFamily: "Roboto" } }, "Step 1: Add more services to your profile to stand out")),
260
+ !isInternalProfile && react_1.default.createElement(core_1.Grid, { item: true, style: { backgroundColor: '#0E3435', color: '#ffffff', borderRadius: '20px', padding: '4px 16px' } },
261
+ react_1.default.createElement(core_1.Typography, { variant: "body2", style: { fontSize: '10px', fontWeight: 600, fontFamily: "Roboto" } },
262
+ "Step ",
263
+ value + 1,
264
+ " of 2"))),
264
265
  react_1.default.createElement(core_1.Grid, { container: true, item: true, direction: "column", justifyContent: "center", alignItems: "center" },
265
- react_1.default.createElement(core_1.Typography, { variant: "subtitle1", style: { textDecoration: 'underline', fontStyle: 'italic', fontSize: '18px', fontWeight: 400, marginTop: '8px', marginBottom: '8px' } }, "Why Add More Services?")),
266
- react_1.default.createElement(core_1.Grid, { item: true, container: true, direction: "row", justifyContent: "space-between", alignItems: "center", xs: 10, style: { margin: 'auto' } },
266
+ react_1.default.createElement(core_1.Typography, { variant: "subtitle1", style: { textDecoration: 'underline', fontStyle: 'italic', fontSize: '14px', fontWeight: 400, marginTop: '8px', marginBottom: '8px', fontFamily: "Roboto" } }, "Why Add More Services?")),
267
+ react_1.default.createElement(core_1.Grid, { item: true, container: true, direction: "row", justifyContent: "space-between", alignItems: "center", style: { margin: 'auto' } },
267
268
  react_1.default.createElement(core_1.Box, { display: "flex", flexDirection: "row", alignItems: "center", width: '50%' },
268
269
  react_1.default.createElement(icons_1.AdjustRounded, { style: {
269
270
  marginRight: 8,
270
271
  color: '#248384',
271
- fontSize: '20px'
272
+ fontSize: '16px'
272
273
  }, className: "headerCircle" }),
273
- react_1.default.createElement(core_1.Typography, { className: "headerFeature", variant: "body2", style: { fontSize: '16px', fontWeight: 400 } }, "Increase your visibility to clients searching for diverse expertise")),
274
+ react_1.default.createElement(core_1.Typography, { className: "headerFeature", variant: "body2", style: { fontSize: '12px', fontWeight: 400, fontFamily: "Roboto" } }, "Increase your visibility to clients searching for diverse expertise")),
274
275
  react_1.default.createElement(core_1.Box, { display: "flex", flexDirection: "row", alignItems: "center", width: '50%' },
275
276
  react_1.default.createElement(icons_1.AdjustRounded, { style: {
276
277
  marginRight: 8,
277
278
  color: '#248384',
278
- fontSize: '20px'
279
+ fontSize: '16px'
279
280
  }, className: "headerCircle" }),
280
- react_1.default.createElement(core_1.Typography, { className: "headerFeature", variant: "body2", style: { fontSize: '16px', fontWeight: 400 } }, "Position yourself as a versatile professional"))),
281
+ react_1.default.createElement(core_1.Typography, { className: "headerFeature", variant: "body2", style: { fontSize: '12px', fontWeight: 400, fontFamily: "Roboto" } }, "Position yourself as a versatile professional"))),
281
282
  react_1.default.createElement(core_1.Grid, { item: true, container: true, style: { marginTop: '16px' } },
282
- react_1.default.createElement(core_1.Typography, { variant: "h6", style: { fontSize: '16px', fontWeight: 600 } }, "Add Service Lines to your profile:"),
283
+ react_1.default.createElement(core_1.Typography, { variant: "h6", style: { fontSize: '12px', fontWeight: 600, fontFamily: "Roboto" } }, "Add Service Lines to your profile:"),
283
284
  react_1.default.createElement(core_1.Grid, { item: true, container: true, direction: "row", justifyContent: "space-evenly", alignItems: "center" }, services === null || services === void 0 ? void 0 : services.map((service, index) => {
284
285
  const serviceExistsInArray = selectedServices.find((svc) => svc.service === service.title);
285
286
  const isExpanded = expandedServices.get(service.title) || false;
@@ -290,9 +291,9 @@ const ServiceLinesTemplate = ({ getFreelancerDataResult, createOrUpdateRates, ge
290
291
  react_1.default.createElement(core_1.Box, { sx: { flex: 1 } },
291
292
  react_1.default.createElement(core_1.Box, { sx: { display: "flex", justifyContent: "space-between", alignItems: "center" } },
292
293
  react_1.default.createElement(core_1.Box, { display: 'flex', alignItems: 'center' },
293
- react_1.default.createElement(core_1.Typography, { component: "div", style: { fontWeight: 600, fontSize: '16px', color: '#1C1F2B' } },
294
+ react_1.default.createElement(core_1.Typography, { component: "div", style: { fontWeight: 600, fontSize: '12px', color: '#1C1F2B', fontFamily: "Roboto" } },
294
295
  service.title,
295
- (serviceExistsInArray === null || serviceExistsInArray === void 0 ? void 0 : serviceExistsInArray.currentService) && (react_1.default.createElement(core_1.Typography, { variant: "caption", style: { fontWeight: 400, fontSize: '16px', fontStyle: 'italic' } }, "\u00A0(current service line)")))),
296
+ (serviceExistsInArray === null || serviceExistsInArray === void 0 ? void 0 : serviceExistsInArray.currentService) && (react_1.default.createElement(core_1.Typography, { variant: "caption", style: { fontWeight: 400, fontSize: '12px', fontStyle: 'italic', fontFamily: "Roboto" } }, "\u00A0(current service line)")))),
296
297
  react_1.default.createElement(core_1.Box, { display: 'flex', alignItems: 'center', ml: 4 },
297
298
  react_1.default.createElement(core_1.TextField, { size: "small", variant: "outlined", value: (serviceExistsInArray === null || serviceExistsInArray === void 0 ? void 0 : serviceExistsInArray.rate) || '', onChange: (e) => handlePriceChange(service.title, e.target.value ? parseInt(e.target.value) : 0, serviceExistsInArray === null || serviceExistsInArray === void 0 ? void 0 : serviceExistsInArray.currentService), InputProps: {
298
299
  startAdornment: react_1.default.createElement(core_1.Typography, null, "$\u00A0"),
@@ -300,42 +301,43 @@ const ServiceLinesTemplate = ({ getFreelancerDataResult, createOrUpdateRates, ge
300
301
  }, style: { width: 100 }, required: serviceExistsInArray, error: serviceExistsInArray && !serviceExistsInArray.rate, label: "Rate", className: "serviceLineRateInput" }),
301
302
  react_1.default.createElement(core_1.IconButton, { onClick: () => handleExpandToggle(service.title) }, isExpanded ? react_1.default.createElement(icons_1.ExpandLess, null) : react_1.default.createElement(icons_1.ExpandMore, null)))))),
302
303
  isExpanded && react_1.default.createElement(core_1.Box, { ml: 2 },
303
- react_1.default.createElement(core_1.Typography, { variant: "caption", style: { fontWeight: 400, fontSize: '16px' } }, service.description))));
304
+ react_1.default.createElement(core_1.Typography, { variant: "caption", style: { fontWeight: 400, fontSize: '12px', fontFamily: "Roboto" } }, service.description))));
304
305
  }))))
305
306
  :
306
307
  react_1.default.createElement(core_1.Grid, { container: true, className: "service-lines-header", direction: "column", justifyContent: "center" },
307
308
  react_1.default.createElement(core_1.Grid, { item: true, container: true, direction: "row", justifyContent: "space-between", alignItems: "flex-start" },
308
309
  react_1.default.createElement(core_1.Grid, { item: true, direction: "column", justifyContent: "flex-start" },
309
- react_1.default.createElement(core_1.Typography, { variant: "h6", style: { color: '#12756F', fontSize: '24px', fontWeight: 600 } }, "Give your Expertise a Title"),
310
- react_1.default.createElement(core_1.Typography, { variant: "body2", style: { color: '#1C1F2B', fontSize: '16px', fontWeight: 600 } }, "Step 2: Showcase your profile with a title")),
311
- react_1.default.createElement(core_1.Grid, { item: true, style: { backgroundColor: '#0E3435', color: '#ffffff', borderRadius: '20px', padding: '6px 20px' } },
312
- "Step ",
313
- value + 1,
314
- " of 2")),
310
+ react_1.default.createElement(core_1.Typography, { variant: "h6", style: { color: '#12756F', fontSize: '18px', fontWeight: 600, fontFamily: "Roboto" } }, "Give your Expertise a Title"),
311
+ react_1.default.createElement(core_1.Typography, { variant: "body2", style: { color: '#1C1F2B', fontSize: '12px', fontWeight: 600, fontFamily: "Roboto" } }, "Step 2: Showcase your profile with a title")),
312
+ react_1.default.createElement(core_1.Grid, { item: true, style: { backgroundColor: '#0E3435', color: '#ffffff', borderRadius: '20px', padding: '4px 16px' } },
313
+ react_1.default.createElement(core_1.Typography, { variant: "body2", style: { fontSize: '10px', fontWeight: 600, fontFamily: "Roboto" } },
314
+ "Step ",
315
+ value + 1,
316
+ " of 2"))),
315
317
  react_1.default.createElement(core_1.Grid, { container: true, item: true, direction: "column", justifyContent: "center", alignItems: "center" },
316
- react_1.default.createElement(core_1.Typography, { variant: "subtitle1", style: { textDecoration: 'underline', fontStyle: 'italic', fontSize: '16px', fontWeight: 400, marginTop: '16px', marginBottom: '16px' } }, "Why Add a Job Title to Your Profile?")),
317
- react_1.default.createElement(core_1.Grid, { container: true, item: true, direction: "row", justifyContent: "space-between", alignItems: "center", xs: 10, spacing: 1, style: { margin: 'auto' } },
318
+ react_1.default.createElement(core_1.Typography, { variant: "subtitle1", style: { textDecoration: 'underline', fontStyle: 'italic', fontSize: '14px', fontWeight: 400, marginTop: '16px', marginBottom: '16px', fontFamily: "Roboto" } }, "Why Add a Job Title to Your Profile?")),
319
+ react_1.default.createElement(core_1.Grid, { container: true, item: true, direction: "row", justifyContent: "space-between", alignItems: "center", spacing: 1, style: { margin: 'auto' } },
318
320
  react_1.default.createElement(core_1.Box, { display: "flex", flexDirection: "row", alignItems: "center", width: '50%' },
319
321
  react_1.default.createElement(icons_1.AdjustRounded, { style: {
320
322
  marginRight: 8,
321
323
  color: '#248384',
322
- fontSize: '20px'
324
+ fontSize: '16px'
323
325
  }, className: "headerCircle" }),
324
- react_1.default.createElement(core_1.Typography, { className: "headerFeature", variant: "body2", style: { fontSize: '16px', fontWeight: 400 } },
326
+ react_1.default.createElement(core_1.Typography, { className: "headerFeature", variant: "body2", style: { fontSize: '12px', fontWeight: 400, fontFamily: "Roboto" } },
325
327
  react_1.default.createElement("b", { style: { display: 'inline', whiteSpace: 'nowrap' } }, "Showcase Your Brand:"),
326
328
  " Your job title is the first impression Clients get of your professional identity")),
327
329
  react_1.default.createElement(core_1.Box, { display: "flex", flexDirection: "row", alignItems: "center", width: '50%' },
328
330
  react_1.default.createElement(icons_1.AdjustRounded, { style: {
329
331
  marginRight: 8,
330
332
  color: '#248384',
331
- fontSize: '20px'
333
+ fontSize: '16px'
332
334
  }, className: "headerCircle" }),
333
- react_1.default.createElement(core_1.Typography, { className: "headerFeature", variant: "body2", style: { fontSize: '16px', fontWeight: 400 } },
335
+ react_1.default.createElement(core_1.Typography, { className: "headerFeature", variant: "body2", style: { fontSize: '12px', fontWeight: 400, fontFamily: "Roboto" } },
334
336
  react_1.default.createElement("b", { style: { display: 'inline', whiteSpace: 'nowrap' } }, "Control Your Narrative:"),
335
337
  " Your job title gives you the opportunity to shape how Clients perceive you, positioning yourself as a trusted expert in your field."))),
336
338
  react_1.default.createElement(core_1.Grid, { xs: 12, style: { marginTop: 16 }, container: true, direction: "column", justifyContent: "center", alignItems: "center" },
337
339
  react_1.default.createElement(core_1.Box, null,
338
- react_1.default.createElement(core_1.Typography, { variant: "h5", style: { fontWeight: 500 } }, "Select from the following Expertise titles:")),
340
+ react_1.default.createElement(core_1.Typography, { variant: "h5", style: { fontWeight: 500, fontFamily: "Roboto", fontSize: '12px' } }, "Select from the following Expertise titles:")),
339
341
  react_1.default.createElement(core_1.Grid, { item: true, style: { marginBottom: 12, width: '50%' } },
340
342
  react_1.default.createElement(core_1.Select, { required: true, autoWidth: false, variant: "outlined", fullWidth: true, defaultValue: titleOptions, onChange: (event) => handleChangeTitle(event), value: selectedTitle !== null && selectedTitle !== void 0 ? selectedTitle : (_a = titleOptions[0]) === null || _a === void 0 ? void 0 : _a.title },
341
343
  titleOptions.length > 1 && (react_1.default.createElement(core_1.MenuItem, { disabled: true, value: "" },
package/lib/components/shared/Error.d.ts CHANGED
@@ -1,6 +1,6 @@
1
- type SectionContents = {
2
- handleClose?: (...args: any) => void;
3
- formError?: boolean;
4
- };
5
- declare const Error: ({ handleClose }: SectionContents) => JSX.Element;
6
- export default Error;
1
+ type SectionContents = {
2
+ handleClose?: (...args: any) => void;
3
+ formError?: boolean;
4
+ };
5
+ declare const Error: ({ handleClose }: SectionContents) => JSX.Element;
6
+ export default Error;
package/lib/components/shared/Error.js CHANGED
@@ -1,40 +1,40 @@
1
- "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
- Object.defineProperty(exports, "__esModule", { value: true });
6
- const react_1 = __importDefault(require("react"));
7
- const core_1 = require("@material-ui/core");
8
- const styled_components_1 = __importDefault(require("styled-components"));
9
- const colors_1 = __importDefault(require("../shared/constants/colors"));
10
- const CopyToClipboardAlert_1 = __importDefault(require("./CopyToClipboardAlert"));
11
- const ErrorBox = (0, styled_components_1.default)(core_1.Box) `
12
- width: 100%;
13
- padding-bottom: 100;
14
- `;
15
- const ParoTitle = (0, styled_components_1.default)(core_1.Box) `
16
- color: ${colors_1.default.paroBlack};
17
- padding: 0px 0px 18px 0px;
18
- `;
19
- const ParoSubtitle = styled_components_1.default.div `
20
- color: ${colors_1.default.paroBlack};
21
- margin-bottom: 24px;
22
- font-size: 1rem;
23
- `;
24
- const reloadWindow = () => {
25
- window.location.reload();
26
- };
27
- const Error = ({ handleClose }) => {
28
- const handleCancel = handleClose ? handleClose : reloadWindow;
29
- const handleCancelLanguage = handleClose ? 'Close' : 'Retry';
30
- return (react_1.default.createElement(ErrorBox, null,
31
- react_1.default.createElement(core_1.Box, { display: 'flex', alignContent: 'center', alignItems: 'center', justifyContent: 'center', flexDirection: 'column', padding: '100px 0px 36px 5px;' },
32
- react_1.default.createElement(core_1.Typography, { variant: 'h6', gutterBottom: true },
33
- react_1.default.createElement(ParoTitle, null, "Oops! We had a misstep.")),
34
- react_1.default.createElement(core_1.Typography, { component: 'span', gutterBottom: true },
35
- react_1.default.createElement(ParoSubtitle, null, "Contact support if the issue persists")),
36
- react_1.default.createElement(core_1.DialogActions, null,
37
- react_1.default.createElement(core_1.Button, { variant: 'outlined', onClick: handleCancel, color: 'primary' }, handleCancelLanguage),
38
- react_1.default.createElement(CopyToClipboardAlert_1.default, { alertMessage: 'Email address copied to clipboard', button: core_1.Button, buttonContent: 'Copy support email', copyContent: 'people@paro.io', variant: 'contained' })))));
39
- };
40
- exports.default = Error;
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ const react_1 = __importDefault(require("react"));
7
+ const core_1 = require("@material-ui/core");
8
+ const styled_components_1 = __importDefault(require("styled-components"));
9
+ const colors_1 = __importDefault(require("../shared/constants/colors"));
10
+ const CopyToClipboardAlert_1 = __importDefault(require("./CopyToClipboardAlert"));
11
+ const ErrorBox = (0, styled_components_1.default)(core_1.Box) `
12
+ width: 100%;
13
+ padding-bottom: 100;
14
+ `;
15
+ const ParoTitle = (0, styled_components_1.default)(core_1.Box) `
16
+ color: ${colors_1.default.paroBlack};
17
+ padding: 0px 0px 18px 0px;
18
+ `;
19
+ const ParoSubtitle = styled_components_1.default.div `
20
+ color: ${colors_1.default.paroBlack};
21
+ margin-bottom: 24px;
22
+ font-size: 1rem;
23
+ `;
24
+ const reloadWindow = () => {
25
+ window.location.reload();
26
+ };
27
+ const Error = ({ handleClose }) => {
28
+ const handleCancel = handleClose ? handleClose : reloadWindow;
29
+ const handleCancelLanguage = handleClose ? 'Close' : 'Retry';
30
+ return (react_1.default.createElement(ErrorBox, null,
31
+ react_1.default.createElement(core_1.Box, { display: 'flex', alignContent: 'center', alignItems: 'center', justifyContent: 'center', flexDirection: 'column', padding: '100px 0px 36px 5px;' },
32
+ react_1.default.createElement(core_1.Typography, { variant: 'h6', gutterBottom: true },
33
+ react_1.default.createElement(ParoTitle, null, "Oops! We had a misstep.")),
34
+ react_1.default.createElement(core_1.Typography, { component: 'span', gutterBottom: true },
35
+ react_1.default.createElement(ParoSubtitle, null, "Contact support if the issue persists")),
36
+ react_1.default.createElement(core_1.DialogActions, null,
37
+ react_1.default.createElement(core_1.Button, { variant: 'outlined', onClick: handleCancel, color: 'primary' }, handleCancelLanguage),
38
+ react_1.default.createElement(CopyToClipboardAlert_1.default, { alertMessage: 'Email address copied to clipboard', button: core_1.Button, buttonContent: 'Copy support email', copyContent: 'people@paro.io', variant: 'contained' })))));
39
+ };
40
+ exports.default = Error;
package/lib/components/shared/Image.js CHANGED
@@ -31,20 +31,20 @@ const react_1 = __importStar(require("react"));
31
31
  const core_1 = require("@material-ui/core");
32
32
  const styled_components_1 = __importDefault(require("styled-components"));
33
33
  const cdn_1 = require("./constants/cdn");
34
- const ProfilePhotoPreview = styled_components_1.default.img `
35
- height: 86px;
36
- width: 86px;
37
- border: 4px solid #F8FAFC;
38
- border-radius: 10px;
39
- object-fit: cover;
40
- object-position: top;
34
+ const ProfilePhotoPreview = styled_components_1.default.img `
35
+ height: 86px;
36
+ width: 86px;
37
+ border: 4px solid #F8FAFC;
38
+ border-radius: 10px;
39
+ object-fit: cover;
40
+ object-position: top;
41
41
  `;
42
- const PhotoChangeButton = (0, styled_components_1.default)(core_1.Typography) `
43
- text-decoration: underline;
44
- cursor: pointer;
45
- :active {
46
- text-decoration: none !important;
47
- }
42
+ const PhotoChangeButton = (0, styled_components_1.default)(core_1.Typography) `
43
+ text-decoration: underline;
44
+ cursor: pointer;
45
+ :active {
46
+ text-decoration: none !important;
47
+ }
48
48
  `;
49
49
  exports.defaultAvatar = cdn_1.CDN_URL + 'defaultAvatar.png';
50
50
  const Image = ({ imageUrl, getUserDocument, uploadUserPhotoMutation, loadingNewImage, imageUpdateError, legacyFreelancerId, }) => {
package/lib/components/shared/ProfileTextField.d.ts CHANGED
@@ -1,18 +1,18 @@
1
- import { FieldError } from 'react-hook-form/dist/types/form';
2
- type SectionContents = {
3
- defaultValue?: string | number;
4
- error?: boolean;
5
- helperText: string | undefined | (FieldError | undefined)[];
6
- inputRef?: ((instance: any) => void) | null | undefined;
7
- label?: string;
8
- multiline?: boolean;
9
- name?: string;
10
- placeholder?: string;
11
- props?: unknown;
12
- size?: 'small' | 'medium' | undefined;
13
- onChange?: ((value: any) => void) | undefined;
14
- width?: boolean;
15
- InputProps?: any;
16
- };
17
- declare const ProfileTextField: ({ defaultValue, error, helperText, inputRef, label, multiline, name, placeholder, props, size, width, onChange, InputProps }: SectionContents) => JSX.Element;
18
- export default ProfileTextField;
1
+ import { FieldError } from 'react-hook-form/dist/types/form';
2
+ type SectionContents = {
3
+ defaultValue?: string | number;
4
+ error?: boolean;
5
+ helperText: string | undefined | (FieldError | undefined)[];
6
+ inputRef?: ((instance: any) => void) | null | undefined;
7
+ label?: string;
8
+ multiline?: boolean;
9
+ name?: string;
10
+ placeholder?: string;
11
+ props?: unknown;
12
+ size?: 'small' | 'medium' | undefined;
13
+ onChange?: ((value: any) => void) | undefined;
14
+ width?: boolean;
15
+ InputProps?: any;
16
+ };
17
+ declare const ProfileTextField: ({ defaultValue, error, helperText, inputRef, label, multiline, name, placeholder, props, size, width, onChange, InputProps }: SectionContents) => JSX.Element;
18
+ export default ProfileTextField;
package/lib/components/shared/ProfileTextField.js CHANGED
@@ -1,16 +1,16 @@
1
- "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
- Object.defineProperty(exports, "__esModule", { value: true });
6
- const react_1 = __importDefault(require("react"));
7
- const TextField_1 = __importDefault(require("@material-ui/core/TextField"));
8
- const ProfileTextField = ({ defaultValue, error, helperText, inputRef, label, multiline = false, name, placeholder, props, size, width = false, onChange, InputProps }) => {
9
- return (onChange ? react_1.default.createElement(TextField_1.default, Object.assign({ InputProps: InputProps, "x-id": 'TextField' }, props, { defaultValue: defaultValue, error: error, fullWidth: true, helperText: helperText, InputLabelProps: {
10
- shrink: true
11
- }, inputRef: inputRef, label: label, margin: 'normal', multiline: multiline, name: name, placeholder: placeholder, size: size, style: Object.assign({ marginTop: '8px' }, (width && { width: '100%' })), variant: 'outlined', onChange: onChange, classes: { root: 'inputCurrency' } })) :
12
- react_1.default.createElement(TextField_1.default, Object.assign({ InputProps: InputProps, "x-id": 'TextField' }, props, { defaultValue: defaultValue, error: error, fullWidth: true, helperText: helperText, InputLabelProps: {
13
- shrink: true
14
- }, inputRef: inputRef, label: label, margin: 'normal', multiline: multiline, name: name, placeholder: placeholder, size: size, style: Object.assign({ marginTop: '8px' }, (width && { width: '100%' })), variant: 'outlined' })));
15
- };
16
- exports.default = ProfileTextField;
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ const react_1 = __importDefault(require("react"));
7
+ const TextField_1 = __importDefault(require("@material-ui/core/TextField"));
8
+ const ProfileTextField = ({ defaultValue, error, helperText, inputRef, label, multiline = false, name, placeholder, props, size, width = false, onChange, InputProps }) => {
9
+ return (onChange ? react_1.default.createElement(TextField_1.default, Object.assign({ InputProps: InputProps, "x-id": 'TextField' }, props, { defaultValue: defaultValue, error: error, fullWidth: true, helperText: helperText, InputLabelProps: {
10
+ shrink: true
11
+ }, inputRef: inputRef, label: label, margin: 'normal', multiline: multiline, name: name, placeholder: placeholder, size: size, style: Object.assign({ marginTop: '8px' }, (width && { width: '100%' })), variant: 'outlined', onChange: onChange, classes: { root: 'inputCurrency' } })) :
12
+ react_1.default.createElement(TextField_1.default, Object.assign({ InputProps: InputProps, "x-id": 'TextField' }, props, { defaultValue: defaultValue, error: error, fullWidth: true, helperText: helperText, InputLabelProps: {
13
+ shrink: true
14
+ }, inputRef: inputRef, label: label, margin: 'normal', multiline: multiline, name: name, placeholder: placeholder, size: size, style: Object.assign({ marginTop: '8px' }, (width && { width: '100%' })), variant: 'outlined' })));
15
+ };
16
+ exports.default = ProfileTextField;
package/lib/components/shared/StyledActionButtons.d.ts CHANGED
@@ -1,7 +1,7 @@
1
- declare const StyledActionButtons: ({ closeOnClick, isDisabled, isLoading, handleSubmit }: {
2
- closeOnClick: () => void;
3
- isDisabled: boolean;
4
- isLoading: boolean;
5
- handleSubmit?: () => void;
6
- }) => JSX.Element;
7
- export default StyledActionButtons;
1
+ declare const StyledActionButtons: ({ closeOnClick, isDisabled, isLoading, handleSubmit }: {
2
+ closeOnClick: () => void;
3
+ isDisabled: boolean;
4
+ isLoading: boolean;
5
+ handleSubmit?: () => void;
6
+ }) => JSX.Element;
7
+ export default StyledActionButtons;