oolib 2.64.15 → 2.64.17
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.
- package/dist/components/cards/CardProfile/index.d.ts +9 -0
- package/dist/components/cards/CardProfile/index.js +54 -0
- package/dist/components/cards/CardProfile/styled.d.ts +9 -0
- package/dist/components/cards/CardProfile/styled.js +25 -0
- package/dist/components/cards/ListProfile/index.d.ts +10 -0
- package/dist/components/cards/ListProfile/index.js +27 -0
- package/dist/index.d.ts +3 -0
- package/dist/index.js +9 -1
- package/package.json +1 -1
|
@@ -0,0 +1,54 @@
|
|
|
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.CardProfile = void 0;
|
|
7
|
+
var react_1 = __importDefault(require("react"));
|
|
8
|
+
var styled_1 = require("./styled");
|
|
9
|
+
var styled_2 = require("../styled");
|
|
10
|
+
// import { MetaSecondary } from "../../../generalUI/V2_MetaComps/MetaSecondary";
|
|
11
|
+
var MetaBlock_1 = __importDefault(require("../../MetaBlock"));
|
|
12
|
+
var styled_components_1 = require("styled-components");
|
|
13
|
+
var utilsOolib_1 = require("../../../utilsOolib");
|
|
14
|
+
var dontRenderIfBothOnClickAndTo_1 = require("../utils/dontRenderIfBothOnClickAndTo");
|
|
15
|
+
var decideLinkCompAndTarget_1 = require("../utils/decideLinkCompAndTarget");
|
|
16
|
+
var ProfileImageInput_1 = require("../../ImageInput/derivedComps/ProfileImageInput");
|
|
17
|
+
var injectHttps_1 = require("../../../utils/injectHttps");
|
|
18
|
+
var Typo_1 = require("../../Typo");
|
|
19
|
+
var Tags_1 = require("../../Tags");
|
|
20
|
+
var parseCardConfig_1 = require("../utils/parseCardConfig");
|
|
21
|
+
var LineClampWrapper_1 = require("../comps/LineClampWrapper");
|
|
22
|
+
var CardProfile = function (_a) {
|
|
23
|
+
var id = _a.id, data = _a.data, config = _a.config, to = _a.to, onClick = _a.onClick, openInNewTab = _a.openInNewTab;
|
|
24
|
+
var theme = (0, styled_components_1.useTheme)();
|
|
25
|
+
var parseSpecialSyntax = (theme || {}).parseSpecialSyntax;
|
|
26
|
+
var _b = (0, parseCardConfig_1.parseCardConfig)({ config: config, data: data, parseSpecialSyntax: parseSpecialSyntax }), cardLabel = _b.cardLabel, title = _b.title, image = _b.image, tagDisplay = _b.tagDisplay, metaBlock = _b.metaBlock;
|
|
27
|
+
var dontRenderRes = (0, dontRenderIfBothOnClickAndTo_1.dontRenderIfBothOnClickAndTo)({ onClick: onClick, to: to });
|
|
28
|
+
if (dontRenderRes)
|
|
29
|
+
return dontRenderRes;
|
|
30
|
+
var _c = (0, decideLinkCompAndTarget_1.decideLinkCompAndTarget)({
|
|
31
|
+
to: to,
|
|
32
|
+
openInNewTab: openInNewTab,
|
|
33
|
+
}), LinkComp = _c.LinkComp, target = _c.target, externalUrl = _c.externalUrl;
|
|
34
|
+
return (react_1.default.createElement(LinkComp, { target: target, href: (0, injectHttps_1.injectHttps)(to), to: to },
|
|
35
|
+
react_1.default.createElement("div", { style: { position: 'relative' } },
|
|
36
|
+
react_1.default.createElement(styled_1.StyledHoverBlocker, null),
|
|
37
|
+
" ",
|
|
38
|
+
react_1.default.createElement(styled_1.StyledCardUserProfile, { onClick: onClick, id: id },
|
|
39
|
+
react_1.default.createElement(styled_1.StyledLinkWrapper, null,
|
|
40
|
+
react_1.default.createElement(styled_1.StyledImageWrapper, null,
|
|
41
|
+
react_1.default.createElement(ProfileImageInput_1.ProfileImageInput, { readOnly: true, id: "CardUserProfileImage", value: image, size: 120, imageTitle: title })),
|
|
42
|
+
react_1.default.createElement(styled_1.StyledCardDetails, { className: 'StyledCardDetails', style: !config.image ? { marginTop: 0 } : {} },
|
|
43
|
+
title && (react_1.default.createElement(LineClampWrapper_1.LineClampWrapper, { noOfLines_M: 3, title: title },
|
|
44
|
+
react_1.default.createElement(styled_1.StyledCardProfileTitle, { className: "StyledTitle" },
|
|
45
|
+
react_1.default.createElement(styled_2.StyledTitleSpan, { className: "StyledTitleSpan" }, title)))),
|
|
46
|
+
cardLabel && (react_1.default.createElement(LineClampWrapper_1.LineClampWrapper, { noOfLines_M: 2, title: title },
|
|
47
|
+
react_1.default.createElement(styled_1.StyledLabel, null,
|
|
48
|
+
react_1.default.createElement(Typo_1.LABEL, { color: (0, utilsOolib_1.getPrimaryColorText)(theme === null || theme === void 0 ? void 0 : theme.colors) }, cardLabel)))),
|
|
49
|
+
tagDisplay && (react_1.default.createElement(styled_1.StyledTag, null,
|
|
50
|
+
react_1.default.createElement(Tags_1.TagDisplay, { variant: "secondary", display: tagDisplay }))),
|
|
51
|
+
(metaBlock === null || metaBlock === void 0 ? void 0 : metaBlock.length) > 0 ? (react_1.default.createElement(styled_1.StyledMeta, null,
|
|
52
|
+
react_1.default.createElement(MetaBlock_1.default, { orientation: "vertical", data: data, config: metaBlock, align: "center" }))) : null))))));
|
|
53
|
+
};
|
|
54
|
+
exports.CardProfile = CardProfile;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
export const StyledCardUserProfile: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
2
|
+
export const StyledHoverBlocker: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
3
|
+
export const StyledLinkWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
4
|
+
export const StyledImageWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
5
|
+
export const StyledCardDetails: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
6
|
+
export const StyledCardProfileTitle: import("styled-components").StyledComponent<(props: any) => import("react").JSX.Element, any, {}, never>;
|
|
7
|
+
export const StyledLabel: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
8
|
+
export const StyledTag: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
9
|
+
export const StyledMeta: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
|
|
3
|
+
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
4
|
+
return cooked;
|
|
5
|
+
};
|
|
6
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
7
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
8
|
+
};
|
|
9
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
10
|
+
exports.StyledMeta = exports.StyledTag = exports.StyledLabel = exports.StyledCardProfileTitle = exports.StyledCardDetails = exports.StyledImageWrapper = exports.StyledLinkWrapper = exports.StyledHoverBlocker = exports.StyledCardUserProfile = void 0;
|
|
11
|
+
var styled_components_1 = __importDefault(require("styled-components"));
|
|
12
|
+
var themes_1 = require("../../../themes");
|
|
13
|
+
var Typo_1 = require("../../Typo");
|
|
14
|
+
var mixins_1 = require("../../../themes/mixins");
|
|
15
|
+
var styled_1 = require("../styled");
|
|
16
|
+
exports.StyledCardUserProfile = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n position: relative;\n height: 100%;\n cursor: pointer;\n // margin-bottom: 3rem;\n @media (hover: hover){\n &:hover {\n ", ";\n .StyledCardDetails{\n background-color: white;\n }\n \n }\n }\n"], ["\n position: relative;\n height: 100%;\n cursor: pointer;\n // margin-bottom: 3rem;\n @media (hover: hover){\n &:hover {\n ", ";\n .StyledCardDetails{\n background-color: white;\n }\n \n }\n }\n"])), styled_1.CSSTitleAnimationOnHover);
|
|
17
|
+
exports.StyledHoverBlocker = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n width: 100%;\n height: 7rem;\n position: absolute; \n z-index: 2;\n"], ["\n width: 100%;\n height: 7rem;\n position: absolute; \n z-index: 2;\n"])));
|
|
18
|
+
exports.StyledLinkWrapper = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n position: relative;\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n flex-direction: column;\n"], ["\n position: relative;\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n flex-direction: column;\n"])));
|
|
19
|
+
exports.StyledImageWrapper = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n position: relative;\n width: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n position: relative;\n z-index: 1;\n"], ["\n position: relative;\n width: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n position: relative;\n z-index: 1;\n"])));
|
|
20
|
+
exports.StyledCardDetails = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n position: relative;\n margin-top: -5rem;\n padding: 2rem 2rem;\n padding-top: 6rem;\n border: 2px solid ", ";\n background-color: ", ";\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n ", "\n /* @media (hover: hover){\n &:hover {\n ", ";\n background-color: white;\n }\n } */\n"], ["\n position: relative;\n margin-top: -5rem;\n padding: 2rem 2rem;\n padding-top: 6rem;\n border: 2px solid ", ";\n background-color: ", ";\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n ", "\n /* @media (hover: hover){\n &:hover {\n ", ";\n background-color: white;\n }\n } */\n"])), themes_1.colors.greyColor5, themes_1.colors.greyColor5, (0, mixins_1.transition)('background-color'), styled_1.CSSTitleAnimationOnHover);
|
|
21
|
+
exports.StyledCardProfileTitle = (0, styled_components_1.default)(Typo_1.SERIF_5_6)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n width: 100%;\n text-align: center;\n word-wrap: break-word;\n ", "\n"], ["\n width: 100%;\n text-align: center;\n word-wrap: break-word;\n ", "\n"])), (0, mixins_1.transition)('color'));
|
|
22
|
+
exports.StyledLabel = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n margin-top: 1rem;\n text-align: center;\n"], ["\n margin-top: 1rem;\n text-align: center;\n"])));
|
|
23
|
+
exports.StyledTag = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n margin-top: 1rem;\n max-width: 100%; // need this for ellipsis to work inside on vertical orientation meta block\n"], ["\n margin-top: 1rem;\n max-width: 100%; // need this for ellipsis to work inside on vertical orientation meta block\n"])));
|
|
24
|
+
exports.StyledMeta = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n margin-top: 1rem;\n max-width: 100%; // need this for ellipsis to work inside on vertical orientation meta block\n"], ["\n margin-top: 1rem;\n max-width: 100%; // need this for ellipsis to work inside on vertical orientation meta block\n"])));
|
|
25
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
export function ListProfile({ id, data, config, to, onClick, openInNewTab, actions }: {
|
|
2
|
+
id: any;
|
|
3
|
+
data: any;
|
|
4
|
+
config: any;
|
|
5
|
+
to: any;
|
|
6
|
+
onClick: any;
|
|
7
|
+
openInNewTab: any;
|
|
8
|
+
actions: any;
|
|
9
|
+
}, ...args: any[]): React.JSX.Element;
|
|
10
|
+
import React from "react";
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
13
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
14
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
15
|
+
};
|
|
16
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
+
exports.ListProfile = void 0;
|
|
18
|
+
var react_1 = __importDefault(require("react"));
|
|
19
|
+
var ListContent_1 = require("../ListContent");
|
|
20
|
+
//we destructure only to make this comp easy to use for developers
|
|
21
|
+
function ListProfile(_a) {
|
|
22
|
+
var id = _a.id, data = _a.data, config = _a.config, to = _a.to, onClick = _a.onClick, openInNewTab = _a.openInNewTab, actions = _a.actions;
|
|
23
|
+
var props = arguments[0];
|
|
24
|
+
return (react_1.default.createElement(ListContent_1.ListContent, __assign({}, props, { variant: 'profile' })));
|
|
25
|
+
}
|
|
26
|
+
exports.ListProfile = ListProfile;
|
|
27
|
+
;
|
package/dist/index.d.ts
CHANGED
|
@@ -39,6 +39,9 @@ export { TextLoader } from "./components/LoadersAndProgress/TextLoader";
|
|
|
39
39
|
export { CardContent } from "./components/cards/CardContent";
|
|
40
40
|
export { ListContent } from "./components/cards/ListContent";
|
|
41
41
|
export { CardEmbed } from "./components/cards/CardEmbed";
|
|
42
|
+
export { CardProfile } from "./components/cards/CardProfile";
|
|
43
|
+
export { ListProfile } from "./components/cards/ListProfile";
|
|
44
|
+
export { parseCardConfig } from "./components/cards/utils/parseCardConfig";
|
|
42
45
|
export { DropdownSingle } from "./components/Dropdowns/DropdownSingle";
|
|
43
46
|
export { DropdownMulti } from "./components/Dropdowns/DropdownMulti";
|
|
44
47
|
export { OptionsSingle } from "./components/Dropdowns/comps/OptionsSingle";
|
package/dist/index.js
CHANGED
|
@@ -17,7 +17,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
17
17
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
18
18
|
};
|
|
19
19
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
20
|
-
exports.BannerProvider = exports.useBannerContext = exports.BannerContext = exports.BannerInfo = exports.BannerAlert = exports.VideoInput = exports.ProfileImageInput = exports.ImageInput = exports.MetaBlock = exports.HintsProvider = exports.genTagComp = exports.generateOptions = exports.OptionsSingle = exports.DropdownMulti = exports.DropdownSingle = exports.CardEmbed = exports.ListContent = exports.CardContent = exports.TextLoader = exports.BarChart = exports.DateRangePicker = exports.DatePicker = exports.PageScrollIndicator = exports.HomeCover = exports.EmptyStates = exports.ModalSmall = exports.ModalLarge = exports.ModalConfirm = exports.SkeletonLoader = exports.Divider = exports.PercentCompletedPie = exports.Accordion = exports.ActionMenu = exports.Tooltip = exports.OKELink = exports.UserRoleBadge = exports.Section = exports.LoaderOverlay = exports.Loader = exports.ProgressBar = exports.LoaderCircle = exports.icons = exports.colors = exports.GlobalStyles = void 0;
|
|
20
|
+
exports.BannerProvider = exports.useBannerContext = exports.BannerContext = exports.BannerInfo = exports.BannerAlert = exports.VideoInput = exports.ProfileImageInput = exports.ImageInput = exports.MetaBlock = exports.HintsProvider = exports.genTagComp = exports.generateOptions = exports.OptionsSingle = exports.DropdownMulti = exports.DropdownSingle = exports.parseCardConfig = exports.ListProfile = exports.CardProfile = exports.CardEmbed = exports.ListContent = exports.CardContent = exports.TextLoader = exports.BarChart = exports.DateRangePicker = exports.DatePicker = exports.PageScrollIndicator = exports.HomeCover = exports.EmptyStates = exports.ModalSmall = exports.ModalLarge = exports.ModalConfirm = exports.SkeletonLoader = exports.Divider = exports.PercentCompletedPie = exports.Accordion = exports.ActionMenu = exports.Tooltip = exports.OKELink = exports.UserRoleBadge = exports.Section = exports.LoaderOverlay = exports.Loader = exports.ProgressBar = exports.LoaderCircle = exports.icons = exports.colors = exports.GlobalStyles = void 0;
|
|
21
21
|
//css and styling related ( styled-components )
|
|
22
22
|
var globalStyles_1 = require("./globalStyles");
|
|
23
23
|
Object.defineProperty(exports, "GlobalStyles", { enumerable: true, get: function () { return globalStyles_1.GlobalStyles; } });
|
|
@@ -93,6 +93,14 @@ var ListContent_1 = require("./components/cards/ListContent");
|
|
|
93
93
|
Object.defineProperty(exports, "ListContent", { enumerable: true, get: function () { return ListContent_1.ListContent; } });
|
|
94
94
|
var CardEmbed_1 = require("./components/cards/CardEmbed");
|
|
95
95
|
Object.defineProperty(exports, "CardEmbed", { enumerable: true, get: function () { return CardEmbed_1.CardEmbed; } });
|
|
96
|
+
var CardProfile_1 = require("./components/cards/CardProfile");
|
|
97
|
+
Object.defineProperty(exports, "CardProfile", { enumerable: true, get: function () { return CardProfile_1.CardProfile; } });
|
|
98
|
+
var ListProfile_1 = require("./components/cards/ListProfile");
|
|
99
|
+
Object.defineProperty(exports, "ListProfile", { enumerable: true, get: function () { return ListProfile_1.ListProfile; } });
|
|
100
|
+
//because share link related stuff uses parse card config
|
|
101
|
+
//maybe this can change in the future if sharelink stuff is componentized and shifted to oolib
|
|
102
|
+
var parseCardConfig_1 = require("./components/cards/utils/parseCardConfig");
|
|
103
|
+
Object.defineProperty(exports, "parseCardConfig", { enumerable: true, get: function () { return parseCardConfig_1.parseCardConfig; } });
|
|
96
104
|
//dropdowns & options
|
|
97
105
|
var DropdownSingle_1 = require("./components/Dropdowns/DropdownSingle");
|
|
98
106
|
Object.defineProperty(exports, "DropdownSingle", { enumerable: true, get: function () { return DropdownSingle_1.DropdownSingle; } });
|