oolib 2.26.8 → 2.27.0
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/OKELink/index.d.ts +1 -18
- package/dist/components/OKELink/index.js +102 -34
- package/dist/components/OKELink/styled.d.ts +7 -0
- package/dist/components/OKELink/styled.js +31 -35
- package/dist/components/Typo/index.d.ts +1 -0
- package/dist/components/Typo/index.js +3 -1
- package/dist/components/Typo/index.styled.d.ts +1 -0
- package/dist/components/Typo/index.styled.js +7 -6
- package/dist/themes/typo.d.ts +2 -0
- package/dist/themes/typo.js +22 -4
- package/package.json +1 -1
- package/dist/components/OKELink/comps/AvatarDisplay/index.d.ts +0 -7
- package/dist/components/OKELink/comps/AvatarDisplay/index.js +0 -19
- package/dist/components/OKELink/comps/AvatarDisplay/styled.d.ts +0 -2
- package/dist/components/OKELink/comps/AvatarDisplay/styled.js +0 -48
- package/dist/components/OKELink/utils/index.d.ts +0 -6
- package/dist/components/OKELink/utils/index.js +0 -20
|
@@ -1,18 +1 @@
|
|
|
1
|
-
export function OKELink(
|
|
2
|
-
invert: any;
|
|
3
|
-
disabled: any;
|
|
4
|
-
color: any;
|
|
5
|
-
invertUnderline: any;
|
|
6
|
-
linkType: any;
|
|
7
|
-
link: any;
|
|
8
|
-
to: any;
|
|
9
|
-
storyBookTheme: any;
|
|
10
|
-
text: any;
|
|
11
|
-
children: any;
|
|
12
|
-
onClick: any;
|
|
13
|
-
icon: any;
|
|
14
|
-
iconAfter: any;
|
|
15
|
-
iconSize?: number;
|
|
16
|
-
avatar: any;
|
|
17
|
-
avatarTitle: any;
|
|
18
|
-
}): any;
|
|
1
|
+
export function OKELink(props: any): any;
|
|
@@ -10,46 +10,114 @@ var __assign = (this && this.__assign) || function () {
|
|
|
10
10
|
};
|
|
11
11
|
return __assign.apply(this, arguments);
|
|
12
12
|
};
|
|
13
|
-
var
|
|
14
|
-
|
|
13
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
14
|
+
if (k2 === undefined) k2 = k;
|
|
15
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
16
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
17
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
18
|
+
}
|
|
19
|
+
Object.defineProperty(o, k2, desc);
|
|
20
|
+
}) : (function(o, m, k, k2) {
|
|
21
|
+
if (k2 === undefined) k2 = k;
|
|
22
|
+
o[k2] = m[k];
|
|
23
|
+
}));
|
|
24
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
25
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
26
|
+
}) : function(o, v) {
|
|
27
|
+
o["default"] = v;
|
|
28
|
+
});
|
|
29
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
30
|
+
if (mod && mod.__esModule) return mod;
|
|
31
|
+
var result = {};
|
|
32
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
33
|
+
__setModuleDefault(result, mod);
|
|
34
|
+
return result;
|
|
15
35
|
};
|
|
16
36
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
37
|
exports.OKELink = void 0;
|
|
18
|
-
var react_1 =
|
|
38
|
+
var react_1 = __importStar(require("react"));
|
|
19
39
|
var react_router_dom_1 = require("react-router-dom");
|
|
20
|
-
var styled_components_1 = require("styled-components");
|
|
21
|
-
var utilsOolib_1 = require("../../utilsOolib");
|
|
22
|
-
var _EXPORTS_1 = require("../../utils/_EXPORTS");
|
|
23
40
|
var icons_1 = require("../../icons");
|
|
41
|
+
// import { ProfileImageDisplay } from '../../inputs/ImageInput/derivedComps/ProfileImageDisplay'
|
|
24
42
|
var styled_1 = require("./styled");
|
|
25
|
-
var
|
|
26
|
-
var
|
|
27
|
-
var
|
|
28
|
-
|
|
29
|
-
|
|
43
|
+
var utilsOolib_1 = require("../../utilsOolib");
|
|
44
|
+
var styled_components_1 = require("styled-components");
|
|
45
|
+
var themes_1 = require("../../themes");
|
|
46
|
+
var injectHttps_1 = require("../../utils/injectHttps");
|
|
47
|
+
var comps_1 = require("../../utils/comps");
|
|
48
|
+
var OKELink = function (props) {
|
|
49
|
+
var _to = props.to, link = props.link, //link is deprecated. use to instead
|
|
50
|
+
onClick = props.onClick, icon = props.icon, iconAfter = props.iconAfter, text = props.text, children = props.children, invertUnderline = props.invertUnderline, color = props.color, invert = props.invert, disabled = props.disabled, className = props.className, style = props.style, avatar = props.avatar, // imageData // [ {...} ] OR {...}
|
|
51
|
+
//imageSize ??
|
|
52
|
+
iconSize = props.iconSize;
|
|
53
|
+
var to = link || _to;
|
|
30
54
|
var theme = (0, styled_components_1.useTheme)();
|
|
31
|
-
var
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
55
|
+
var localize = (0, utilsOolib_1.useLocale)();
|
|
56
|
+
/**
|
|
57
|
+
* if location object is passed through then its internal
|
|
58
|
+
* if string then if first character is '/' then internal. else external
|
|
59
|
+
* all other cases, return external
|
|
60
|
+
*/
|
|
61
|
+
var getLinkType = function (_a) {
|
|
62
|
+
var to = _a.to, onClick = _a.onClick;
|
|
63
|
+
if (onClick)
|
|
64
|
+
return 'action';
|
|
65
|
+
if (!to)
|
|
66
|
+
return 'external'; //this shouldnt exist at all. but for now, if we dont handle this we get a blank screen from footer.
|
|
67
|
+
if (to.pathname)
|
|
68
|
+
return 'internal'; //means its a route;
|
|
69
|
+
if (to instanceof Function)
|
|
70
|
+
return 'internal';
|
|
71
|
+
if (typeof to === 'string')
|
|
72
|
+
return to.substring(0, 1) === '/' ? 'internal' : 'external';
|
|
73
|
+
//else
|
|
74
|
+
return 'external';
|
|
75
|
+
};
|
|
76
|
+
var linkType = getLinkType({ to: to, onClick: onClick });
|
|
77
|
+
var textComp = (react_1.default.createElement(styled_1.StyledLinkText, { id: 'StyledLinkText' }, localize(children || text)));
|
|
78
|
+
var genIcon = function (icon) {
|
|
79
|
+
return react_1.default.createElement(comps_1.DisplayIcon, __assign({}, {
|
|
80
|
+
icon: icon,
|
|
81
|
+
size: iconSize || 15,
|
|
82
|
+
color: (0, styled_1.genColor)({ color: color, theme: theme, invert: invert, disabled: disabled })
|
|
83
|
+
}));
|
|
84
|
+
};
|
|
85
|
+
var genAvatar = function (avatar) {
|
|
86
|
+
var _a;
|
|
87
|
+
if (!avatar)
|
|
88
|
+
return;
|
|
89
|
+
//else
|
|
90
|
+
return (react_1.default.createElement("div", { style: { marginRight: '1rem', flex: '0 0 auto' } },
|
|
91
|
+
react_1.default.createElement("img", { src: (_a = avatar === null || avatar === void 0 ? void 0 : avatar.userUploaded[0]) === null || _a === void 0 ? void 0 : _a.publicUrl, style: { height: 'auto', width: '100%' } })));
|
|
92
|
+
};
|
|
93
|
+
var linkContents = react_1.default.createElement(react_1.Fragment, null,
|
|
94
|
+
genAvatar(avatar),
|
|
95
|
+
icon && genIcon(icon, 'before'),
|
|
96
|
+
textComp,
|
|
97
|
+
iconAfter && genIcon(iconAfter, 'after'));
|
|
98
|
+
var commonProps = {
|
|
99
|
+
color: color,
|
|
100
|
+
invert: invert,
|
|
101
|
+
disabled: disabled,
|
|
102
|
+
className: className || '',
|
|
103
|
+
invertUnderline: invertUnderline,
|
|
104
|
+
style: style
|
|
105
|
+
};
|
|
106
|
+
var genLink = function () {
|
|
107
|
+
switch (linkType) {
|
|
108
|
+
case 'external':
|
|
109
|
+
return (react_1.default.createElement(styled_1.StyledLink, __assign({ as: 'a', href: !disabled ? (0, injectHttps_1.injectHttps)(to) : undefined, target: "_blank", onClick: function (e) { e.stopPropagation(); } }, commonProps), linkContents));
|
|
110
|
+
case 'action':
|
|
111
|
+
return (react_1.default.createElement(styled_1.StyledLink, __assign({ as: 'span', onClick: function (e) {
|
|
112
|
+
e.stopPropagation();
|
|
113
|
+
!disabled && onClick(e);
|
|
114
|
+
} }, commonProps), linkContents));
|
|
115
|
+
case 'internal':
|
|
116
|
+
default:
|
|
117
|
+
//internal
|
|
118
|
+
return (react_1.default.createElement(styled_1.StyledLink, __assign({ as: react_router_dom_1.Link, to: !disabled ? to : undefined, onClick: function (e) { e.stopPropagation(); } }, commonProps), linkContents));
|
|
119
|
+
}
|
|
120
|
+
};
|
|
121
|
+
return react_1.default.createElement(react_1.Fragment, null, genLink());
|
|
54
122
|
};
|
|
55
123
|
exports.OKELink = OKELink;
|
|
@@ -3,45 +3,41 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
|
|
|
3
3
|
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
4
4
|
return cooked;
|
|
5
5
|
};
|
|
6
|
-
var
|
|
7
|
-
|
|
8
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
9
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
10
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
11
|
-
}
|
|
12
|
-
Object.defineProperty(o, k2, desc);
|
|
13
|
-
}) : (function(o, m, k, k2) {
|
|
14
|
-
if (k2 === undefined) k2 = k;
|
|
15
|
-
o[k2] = m[k];
|
|
16
|
-
}));
|
|
17
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
18
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
19
|
-
}) : function(o, v) {
|
|
20
|
-
o["default"] = v;
|
|
21
|
-
});
|
|
22
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
23
|
-
if (mod && mod.__esModule) return mod;
|
|
24
|
-
var result = {};
|
|
25
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
26
|
-
__setModuleDefault(result, mod);
|
|
27
|
-
return result;
|
|
6
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
7
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
28
8
|
};
|
|
29
9
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
30
|
-
exports.StyledLink = void 0;
|
|
31
|
-
var styled_components_1 =
|
|
10
|
+
exports.StyledLinkText = exports.StyledLink = exports.genColor = void 0;
|
|
11
|
+
var styled_components_1 = __importDefault(require("styled-components"));
|
|
12
|
+
var themes_1 = require("../../themes");
|
|
32
13
|
var mixins_1 = require("../../themes/mixins");
|
|
33
|
-
var
|
|
34
|
-
|
|
14
|
+
var utilsOolib_1 = require("../../utilsOolib");
|
|
15
|
+
var genColor = function (_a) {
|
|
16
|
+
var color = _a.color, theme = _a.theme, invert = _a.invert, disabled = _a.disabled;
|
|
17
|
+
return disabled
|
|
18
|
+
? themes_1.colors.greyColor40
|
|
19
|
+
: invert
|
|
20
|
+
? (0, utilsOolib_1.getPrimaryColor40)(theme === null || theme === void 0 ? void 0 : theme.colors)
|
|
21
|
+
: color
|
|
22
|
+
? themes_1.colors[color]
|
|
23
|
+
: (0, utilsOolib_1.getPrimaryColorText)(theme === null || theme === void 0 ? void 0 : theme.colors);
|
|
24
|
+
};
|
|
25
|
+
exports.genColor = genColor;
|
|
26
|
+
exports.StyledLink = styled_components_1.default.a(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n \n cursor: ", ";\n display: inline-flex;\n gap: 0.7rem;\n align-items: center;\n max-width: calc(100vw - 4rem); //the margin on mobile is 2rem each on both sides \n text-decoration: none;\n position: relative;\n color: ", ";\n\n &::after{\n content: '';\n position: absolute;\n bottom: 0;\n left: 0;\n width: ", ";\n height: ", ";\n pointer-events: ", ";\n ", ";\n background-color: ", ";\n }\n\n &:hover{\n color: ", ";\n &::after{ width: ", "; }\n }\n"], ["\n \n cursor: ", ";\n display: inline-flex;\n gap: 0.7rem;\n align-items: center;\n max-width: calc(100vw - 4rem); //the margin on mobile is 2rem each on both sides \n text-decoration: none;\n position: relative;\n color: ", ";\n\n &::after{\n content: '';\n position: absolute;\n bottom: 0;\n left: 0;\n width: ", ";\n height: ", ";\n pointer-events: ", ";\n ", ";\n background-color: ", ";\n }\n\n &:hover{\n color: ", ";\n &::after{ width: ", "; }\n }\n"])), function (_a) {
|
|
35
27
|
var disabled = _a.disabled;
|
|
36
|
-
return disabled ? '
|
|
28
|
+
return !disabled ? 'pointer' : 'not-allowed';
|
|
29
|
+
}, exports.genColor, function (_a) {
|
|
30
|
+
var invertUnderline = _a.invertUnderline;
|
|
31
|
+
return invertUnderline ? 0 : '100%';
|
|
37
32
|
}, function (_a) {
|
|
38
|
-
var
|
|
39
|
-
|
|
40
|
-
return (0, mixins_1.multilineUnderline)((0, utils_1.setLinkColor)({ theme: theme, invert: invert, color: color }), '1px', invertUnderline, true);
|
|
41
|
-
}
|
|
33
|
+
var disabled = _a.disabled;
|
|
34
|
+
return !disabled ? '1px' : 0;
|
|
42
35
|
}, function (_a) {
|
|
43
|
-
var
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
36
|
+
var disabled = _a.disabled;
|
|
37
|
+
return !disabled ? 'unset' : 'none';
|
|
38
|
+
}, (0, mixins_1.transition)('width'), exports.genColor, exports.genColor, function (_a) {
|
|
39
|
+
var invertUnderline = _a.invertUnderline;
|
|
40
|
+
return invertUnderline ? '100%' : 0;
|
|
41
|
+
});
|
|
42
|
+
exports.StyledLinkText = styled_components_1.default.span(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n white-space: nowrap;\n /** might need some ellipsis stuff here. but it doesnt work with inline-flex. which is on StyledLink */ \n"], ["\n white-space: nowrap;\n /** might need some ellipsis stuff here. but it doesnt work with inline-flex. which is on StyledLink */ \n"])));
|
|
47
43
|
var templateObject_1, templateObject_2;
|
|
@@ -13,6 +13,7 @@ export function SERIF_4_5(props: any): any;
|
|
|
13
13
|
export function SERIF_5_6(props: any): any;
|
|
14
14
|
export function SERIF_6_7(props: any): any;
|
|
15
15
|
export function SERIF_7_8(props: any): any;
|
|
16
|
+
export function SERIF_8_9(props: any): any;
|
|
16
17
|
export function SERIF_9_10(props: any): any;
|
|
17
18
|
export function BLOCKQUOTE(props: any): any;
|
|
18
19
|
export function TypoClassesProvider(props: any): any;
|
|
@@ -14,7 +14,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
14
14
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
15
15
|
};
|
|
16
16
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
-
exports.TypoClassesProvider = exports.BLOCKQUOTE = exports.SERIF_9_10 = exports.SERIF_7_8 = exports.SERIF_6_7 = exports.SERIF_5_6 = exports.SERIF_4_5 = exports.SERIF_3_4 = exports.SERIF_3 = exports.SANS_7_8 = exports.SANS_5_6 = exports.SANS_4_5 = exports.SANS_4 = exports.SANS_3_4 = exports.SANS_3 = exports.SANS_2 = exports.SANS_0 = exports.LABEL = void 0;
|
|
17
|
+
exports.TypoClassesProvider = exports.BLOCKQUOTE = exports.SERIF_9_10 = exports.SERIF_8_9 = exports.SERIF_7_8 = exports.SERIF_6_7 = exports.SERIF_5_6 = exports.SERIF_4_5 = exports.SERIF_3_4 = exports.SERIF_3 = exports.SANS_7_8 = exports.SANS_5_6 = exports.SANS_4_5 = exports.SANS_4 = exports.SANS_3_4 = exports.SANS_3 = exports.SANS_2 = exports.SANS_0 = exports.LABEL = void 0;
|
|
18
18
|
var react_1 = __importDefault(require("react"));
|
|
19
19
|
var index_styled_1 = require("./index.styled");
|
|
20
20
|
var utilsOolib_1 = require("../../utilsOolib");
|
|
@@ -87,6 +87,8 @@ var SERIF_6_7 = function (props) { return (react_1.default.createElement(GenComp
|
|
|
87
87
|
exports.SERIF_6_7 = SERIF_6_7;
|
|
88
88
|
var SERIF_7_8 = function (props) { return (react_1.default.createElement(GenComp, { props: props, Comp: index_styled_1.SERIF_7_8_STYLED })); };
|
|
89
89
|
exports.SERIF_7_8 = SERIF_7_8;
|
|
90
|
+
var SERIF_8_9 = function (props) { return (react_1.default.createElement(GenComp, { props: props, Comp: index_styled_1.SERIF_8_9_STYLED })); };
|
|
91
|
+
exports.SERIF_8_9 = SERIF_8_9;
|
|
90
92
|
var SERIF_9_10 = function (props) { return (react_1.default.createElement(GenComp, { props: props, Comp: index_styled_1.SERIF_9_10_STYLED })); };
|
|
91
93
|
exports.SERIF_9_10 = SERIF_9_10;
|
|
92
94
|
var BLOCKQUOTE = function (props) { return (react_1.default.createElement(GenComp, { props: __assign(__assign({}, props), { italic: true }), Comp: index_styled_1.BLOCKQUOTE_STYLED })); };
|
|
@@ -12,6 +12,7 @@ export const SERIF_4_5_STYLED: any;
|
|
|
12
12
|
export const SERIF_5_6_STYLED: any;
|
|
13
13
|
export const SERIF_6_7_STYLED: any;
|
|
14
14
|
export const SERIF_7_8_STYLED: any;
|
|
15
|
+
export const SERIF_8_9_STYLED: any;
|
|
15
16
|
export const SERIF_9_10_STYLED: any;
|
|
16
17
|
export const LABEL_STYLED: any;
|
|
17
18
|
export const BLOCKQUOTE_STYLED: any;
|
|
@@ -7,7 +7,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
7
7
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
8
8
|
};
|
|
9
9
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
10
|
-
exports.TYPOCLASSES = exports.BLOCKQUOTE_STYLED = exports.LABEL_STYLED = exports.SERIF_9_10_STYLED = exports.SERIF_7_8_STYLED = exports.SERIF_6_7_STYLED = exports.SERIF_5_6_STYLED = exports.SERIF_4_5_STYLED = exports.SERIF_3_4_STYLED = exports.SERIF_3_STYLED = exports.SANS_7_8_STYLED = exports.SANS_5_6_STYLED = exports.SANS_4_5_STYLED = exports.SANS_4_STYLED = exports.SANS_3_4_STYLED = exports.SANS_3_STYLED = exports.SANS_2_STYLED = exports.SANS_0_STYLED = void 0;
|
|
10
|
+
exports.TYPOCLASSES = exports.BLOCKQUOTE_STYLED = exports.LABEL_STYLED = exports.SERIF_9_10_STYLED = exports.SERIF_8_9_STYLED = exports.SERIF_7_8_STYLED = exports.SERIF_6_7_STYLED = exports.SERIF_5_6_STYLED = exports.SERIF_4_5_STYLED = exports.SERIF_3_4_STYLED = exports.SERIF_3_STYLED = exports.SANS_7_8_STYLED = exports.SANS_5_6_STYLED = exports.SANS_4_5_STYLED = exports.SANS_4_STYLED = exports.SANS_3_4_STYLED = exports.SANS_3_STYLED = exports.SANS_2_STYLED = exports.SANS_0_STYLED = void 0;
|
|
11
11
|
var styled_components_1 = __importDefault(require("styled-components"));
|
|
12
12
|
var index_1 = require("../../themes/index");
|
|
13
13
|
exports.SANS_0_STYLED = styled_components_1.default.h6(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), index_1.typo.SANS_0);
|
|
@@ -24,8 +24,9 @@ exports.SERIF_4_5_STYLED = styled_components_1.default.h2(templateObject_11 || (
|
|
|
24
24
|
exports.SERIF_5_6_STYLED = styled_components_1.default.h3(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), index_1.typo.SERIF_5_6);
|
|
25
25
|
exports.SERIF_6_7_STYLED = styled_components_1.default.h2(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), index_1.typo.SERIF_6_7);
|
|
26
26
|
exports.SERIF_7_8_STYLED = styled_components_1.default.h2(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), index_1.typo.SERIF_7_8);
|
|
27
|
-
exports.
|
|
28
|
-
exports.
|
|
29
|
-
exports.
|
|
30
|
-
exports.
|
|
31
|
-
|
|
27
|
+
exports.SERIF_8_9_STYLED = styled_components_1.default.h2(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), index_1.typo.SERIF_8_9);
|
|
28
|
+
exports.SERIF_9_10_STYLED = styled_components_1.default.h1(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), index_1.typo.SERIF_9_10);
|
|
29
|
+
exports.LABEL_STYLED = styled_components_1.default.h6(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), index_1.typo.LABEL);
|
|
30
|
+
exports.BLOCKQUOTE_STYLED = styled_components_1.default.h3(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), index_1.typo.BLOCKQUOTE);
|
|
31
|
+
exports.TYPOCLASSES = styled_components_1.default.div(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n .SANS_0 {\n ", "\n }\n\n .SANS_2 {\n ", "\n }\n\n .SANS_3 {\n ", "\n }\n\n .SANS_4 {\n ", "\n }\n\n .SERIF_3 {\n ", "\n }\n\n .SANS_4_5 {\n ", "\n }\n\n .SANS_5_6 {\n ", "\n }\n\n .SERIF_3_4 {\n ", "\n }\n\n .SERIF_4_5 {\n ", "\n }\n\n .SERIF_5_6 {\n ", "\n }\n\n .SERIF_6_7 {\n ", "\n }\n\n .SERIF_7_8 {\n ", "\n }\n\n .SERIF_8_9 {\n ", "\n }\n\n .SERIF_9_10 {\n ", "\n }\n\n .LABEL {\n ", "\n }\n\n .SANS_7_8 {\n ", "\n }\n\n .BLOCKQUOTE {\n ", "\n }\n\n .OKE-markdown {\n a,\n p {\n ", "\n }\n }\n"], ["\n .SANS_0 {\n ", "\n }\n\n .SANS_2 {\n ", "\n }\n\n .SANS_3 {\n ", "\n }\n\n .SANS_4 {\n ", "\n }\n\n .SERIF_3 {\n ", "\n }\n\n .SANS_4_5 {\n ", "\n }\n\n .SANS_5_6 {\n ", "\n }\n\n .SERIF_3_4 {\n ", "\n }\n\n .SERIF_4_5 {\n ", "\n }\n\n .SERIF_5_6 {\n ", "\n }\n\n .SERIF_6_7 {\n ", "\n }\n\n .SERIF_7_8 {\n ", "\n }\n\n .SERIF_8_9 {\n ", "\n }\n\n .SERIF_9_10 {\n ", "\n }\n\n .LABEL {\n ", "\n }\n\n .SANS_7_8 {\n ", "\n }\n\n .BLOCKQUOTE {\n ", "\n }\n\n .OKE-markdown {\n a,\n p {\n ", "\n }\n }\n"])), index_1.typo.SANS_0, index_1.typo.SANS_2, index_1.typo.SANS_3, index_1.typo.SANS_4, index_1.typo.SERIF_3, index_1.typo.SANS_4_5, index_1.typo.SANS_5_6, index_1.typo.SERIF_3_4, index_1.typo.SERIF_4_5, index_1.typo.SERIF_5_6, index_1.typo.SERIF_6_7, index_1.typo.SERIF_7_8, index_1.typo.SERIF_8_9, index_1.typo.SERIF_9_10, index_1.typo.LABEL, index_1.typo.SANS_7_8, index_1.typo.BLOCKQUOTE, index_1.typo.SANS_3);
|
|
32
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19;
|
package/dist/themes/typo.d.ts
CHANGED
|
@@ -14,6 +14,7 @@ export namespace typo {
|
|
|
14
14
|
export { SERIF_4_5 };
|
|
15
15
|
export { SERIF_6_7 };
|
|
16
16
|
export { SERIF_7_8 };
|
|
17
|
+
export { SERIF_8_9 };
|
|
17
18
|
export { SANS_4_5 };
|
|
18
19
|
export { SANS_7_8 };
|
|
19
20
|
export { SANS_5_6 };
|
|
@@ -34,6 +35,7 @@ declare const SERIF_9_10: any;
|
|
|
34
35
|
declare const SERIF_4_5: any;
|
|
35
36
|
declare const SERIF_6_7: any;
|
|
36
37
|
declare const SERIF_7_8: any;
|
|
38
|
+
declare const SERIF_8_9: any;
|
|
37
39
|
declare const SANS_4_5: any;
|
|
38
40
|
declare const SANS_7_8: any;
|
|
39
41
|
declare const SANS_5_6: any;
|
package/dist/themes/typo.js
CHANGED
|
@@ -237,7 +237,24 @@ var SERIF_7_8 = (0, styled_components_1.css)(templateObject_17 || (templateObjec
|
|
|
237
237
|
return "".concat(msW(8), "px");
|
|
238
238
|
}
|
|
239
239
|
});
|
|
240
|
-
var
|
|
240
|
+
var SERIF_8_9 = (0, styled_components_1.css)(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n font-size: ", ";\n line-height: 1.6em;\n ", "\n ", "\n ", " {\n font-size: ", ";\n }\n"], ["\n font-size: ", ";\n line-height: 1.6em;\n ", "\n ", "\n ", " {\n font-size: ", ";\n }\n"])), function (_a) {
|
|
241
|
+
var theme = _a.theme;
|
|
242
|
+
switch (theme === null || theme === void 0 ? void 0 : theme.lang) {
|
|
243
|
+
case 'hi':
|
|
244
|
+
return "".concat(msW(9), "px");
|
|
245
|
+
default:
|
|
246
|
+
return "".concat(msW(8), "px");
|
|
247
|
+
}
|
|
248
|
+
}, fontCss, serif, (0, mixins_1.mediaQuery)('md'), function (_a) {
|
|
249
|
+
var theme = _a.theme;
|
|
250
|
+
switch (theme === null || theme === void 0 ? void 0 : theme.lang) {
|
|
251
|
+
case 'hi':
|
|
252
|
+
return "".concat(msW(10), "px");
|
|
253
|
+
default:
|
|
254
|
+
return "".concat(msW(9), "px");
|
|
255
|
+
}
|
|
256
|
+
});
|
|
257
|
+
var SERIF_9_10 = (0, styled_components_1.css)(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n font-size: ", ";\n line-height: 1.5em;\n ", "\n ", "\n ", " {\n font-size: ", ";\n }\n"], ["\n font-size: ", ";\n line-height: 1.5em;\n ", "\n ", "\n ", " {\n font-size: ", ";\n }\n"])), function (_a) {
|
|
241
258
|
var theme = _a.theme;
|
|
242
259
|
switch (theme === null || theme === void 0 ? void 0 : theme.lang) {
|
|
243
260
|
case 'hi':
|
|
@@ -254,7 +271,7 @@ var SERIF_9_10 = (0, styled_components_1.css)(templateObject_18 || (templateObje
|
|
|
254
271
|
return "".concat(msW(10), "px");
|
|
255
272
|
}
|
|
256
273
|
});
|
|
257
|
-
var LABEL = (0, styled_components_1.css)(
|
|
274
|
+
var LABEL = (0, styled_components_1.css)(templateObject_20 || (templateObject_20 = __makeTemplateObject(["\n letter-spacing: ", "em;\n font-size: ", ";\n color: ", ";\n line-height: 1.6em;\n font-weight: 600;\n text-transform: uppercase;\n ", "\n"], ["\n letter-spacing: ", "em;\n font-size: ", ";\n color: ", ";\n line-height: 1.6em;\n font-weight: 600;\n text-transform: uppercase;\n ", "\n"])), function (_a) {
|
|
258
275
|
var theme = _a.theme;
|
|
259
276
|
return ((theme === null || theme === void 0 ? void 0 : theme.lang) === 'hi' ? 0 : 0.1);
|
|
260
277
|
}, function (_a) {
|
|
@@ -269,7 +286,7 @@ var LABEL = (0, styled_components_1.css)(templateObject_19 || (templateObject_19
|
|
|
269
286
|
var color = _a.color, invert = _a.invert;
|
|
270
287
|
return (invert ? white : color);
|
|
271
288
|
}, sansSerif);
|
|
272
|
-
var BLOCKQUOTE = (0, styled_components_1.css)(
|
|
289
|
+
var BLOCKQUOTE = (0, styled_components_1.css)(templateObject_21 || (templateObject_21 = __makeTemplateObject(["\n padding: 1.5rem;\n border-left: 4px solid\n ", ";\n ", ";\n font-style: italic;\n color: ", ";\n margin-inline-start: 25px;\n margin-inline-end: 25px;\n"], ["\n padding: 1.5rem;\n border-left: 4px solid\n ", ";\n ", ";\n font-style: italic;\n color: ", ";\n margin-inline-start: 25px;\n margin-inline-end: 25px;\n"])), function (_a) {
|
|
273
290
|
var invert = _a.invert, colors = _a.theme.colors;
|
|
274
291
|
return invert ? greyColor40 : (0, utilsOolib_1.getPrimaryColor100)(colors);
|
|
275
292
|
}, SERIF_4_5, greyColor80);
|
|
@@ -289,9 +306,10 @@ exports.typo = {
|
|
|
289
306
|
SERIF_4_5: SERIF_4_5,
|
|
290
307
|
SERIF_6_7: SERIF_6_7,
|
|
291
308
|
SERIF_7_8: SERIF_7_8,
|
|
309
|
+
SERIF_8_9: SERIF_8_9,
|
|
292
310
|
SANS_4_5: SANS_4_5,
|
|
293
311
|
SANS_7_8: SANS_7_8,
|
|
294
312
|
SANS_5_6: SANS_5_6,
|
|
295
313
|
BLOCKQUOTE: BLOCKQUOTE,
|
|
296
314
|
};
|
|
297
|
-
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20;
|
|
315
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21;
|
package/package.json
CHANGED
|
@@ -1,19 +0,0 @@
|
|
|
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.AvatarDisplay = void 0;
|
|
7
|
-
var react_1 = __importDefault(require("react"));
|
|
8
|
-
var styled_js_1 = require("./styled.js");
|
|
9
|
-
var AvatarDisplay = function (_a) {
|
|
10
|
-
var value = _a.value, titleProp = _a.title, style = _a.style, _b = _a.size, size = _b === void 0 ? 2.5 : _b, invert = _a.invert;
|
|
11
|
-
var title = titleProp || value.title;
|
|
12
|
-
var titleInitial = title && title[0].toUpperCase();
|
|
13
|
-
var imageURL = (value === null || value === void 0 ? void 0 : value.userUploaded) && (value === null || value === void 0 ? void 0 : value.userUploaded[0].publicUrl);
|
|
14
|
-
return (imageURL ?
|
|
15
|
-
react_1.default.createElement(styled_js_1.StyledAvatarImg, { invert: invert, size: size, style: style, src: imageURL, alt: "profile picture" })
|
|
16
|
-
:
|
|
17
|
-
react_1.default.createElement(styled_js_1.StyledAvatarTXT, { invert: invert, size: size, style: style }, titleInitial));
|
|
18
|
-
};
|
|
19
|
-
exports.AvatarDisplay = AvatarDisplay;
|
|
@@ -1,48 +0,0 @@
|
|
|
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 __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
7
|
-
if (k2 === undefined) k2 = k;
|
|
8
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
9
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
10
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
11
|
-
}
|
|
12
|
-
Object.defineProperty(o, k2, desc);
|
|
13
|
-
}) : (function(o, m, k, k2) {
|
|
14
|
-
if (k2 === undefined) k2 = k;
|
|
15
|
-
o[k2] = m[k];
|
|
16
|
-
}));
|
|
17
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
18
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
19
|
-
}) : function(o, v) {
|
|
20
|
-
o["default"] = v;
|
|
21
|
-
});
|
|
22
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
23
|
-
if (mod && mod.__esModule) return mod;
|
|
24
|
-
var result = {};
|
|
25
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
26
|
-
__setModuleDefault(result, mod);
|
|
27
|
-
return result;
|
|
28
|
-
};
|
|
29
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
30
|
-
exports.StyledAvatarTXT = exports.StyledAvatarImg = void 0;
|
|
31
|
-
var styled_components_1 = __importStar(require("styled-components"));
|
|
32
|
-
var utilsOolib_1 = require("../../../../utilsOolib");
|
|
33
|
-
var themes_1 = require("../../../../themes");
|
|
34
|
-
var index_styled_1 = require("../../../Typo/index.styled");
|
|
35
|
-
var greyColor80 = themes_1.colors.greyColor80, white = themes_1.colors.white;
|
|
36
|
-
var commonStyle = function (_a) {
|
|
37
|
-
var size = _a.size, invert = _a.invert, theme = _a.theme;
|
|
38
|
-
return (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n width: ", ";\n height: ", ";\n border-radius: 50%;\n background-color: ", ";\n color: ", ";\n \n"], ["\n width: ", ";\n height: ", ";\n border-radius: 50%;\n background-color: ", ";\n color: ", ";\n \n"])), isNaN(size) ? size : size + 'rem', isNaN(size) ? size : size + 'rem', invert ? greyColor80 : (0, utilsOolib_1.getPrimaryColor10)(theme.colors), white);
|
|
39
|
-
};
|
|
40
|
-
exports.StyledAvatarImg = styled_components_1.default.img(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n ", "\n font-size: 8px;\n"], ["\n ", "\n font-size: 8px;\n"])), function (_a) {
|
|
41
|
-
var theme = _a.theme, invert = _a.invert, size = _a.size;
|
|
42
|
-
return commonStyle({ theme: theme, invert: invert, size: size });
|
|
43
|
-
});
|
|
44
|
-
exports.StyledAvatarTXT = (0, styled_components_1.default)(index_styled_1.SANS_3_STYLED)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n ", "\n display: inline-grid;\n place-items: center;\n"], ["\n ", "\n display: inline-grid;\n place-items: center;\n"])), function (_a) {
|
|
45
|
-
var theme = _a.theme, invert = _a.invert, size = _a.size;
|
|
46
|
-
return commonStyle({ theme: theme, invert: invert, size: size });
|
|
47
|
-
});
|
|
48
|
-
var templateObject_1, templateObject_2, templateObject_3;
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.setLinkColor = void 0;
|
|
4
|
-
var themes_1 = require("../../../themes");
|
|
5
|
-
var utilsOolib_1 = require("../../../utilsOolib");
|
|
6
|
-
var greyColor40 = themes_1.colors.greyColor40;
|
|
7
|
-
var setLinkColor = function (_a) {
|
|
8
|
-
var disabled = _a.disabled, color = _a.color, invert = _a.invert, theme = _a.theme;
|
|
9
|
-
switch (true) {
|
|
10
|
-
case disabled:
|
|
11
|
-
return greyColor40;
|
|
12
|
-
case !!color:
|
|
13
|
-
return color;
|
|
14
|
-
case invert:
|
|
15
|
-
return (0, utilsOolib_1.getPrimaryColor40)(theme.colors);
|
|
16
|
-
default:
|
|
17
|
-
return (0, utilsOolib_1.getPrimaryColorText)(theme.colors);
|
|
18
|
-
}
|
|
19
|
-
};
|
|
20
|
-
exports.setLinkColor = setLinkColor;
|