@preply/ds-web-lib 0.24.0 → 0.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/Avatar/Avatar.d.ts +2 -2
- package/dist/components/Avatar/Avatar.js +6 -6
- package/dist/components/Avatar/style/index.module.less.js +2 -2
- package/dist/components/Avatar/style/mixins.less +9 -6
- package/dist/components/Avatar/style/mixins.less.js +2 -2
- package/dist/components/Button/Button.d.ts +3 -17
- package/dist/components/Button/Button.js +5 -57
- package/dist/components/Heading/style/index.module.less.js +1 -1
- package/dist/components/Heading/style/mixins.less.js +2 -2
- package/dist/components/Icon/style/index.module.less.js +1 -1
- package/dist/components/Icon/style/mixins.less.js +2 -2
- package/dist/components/IconButton/IconButton.d.ts +9 -0
- package/dist/components/IconButton/IconButton.js +19 -0
- package/dist/components/Link/style/index.module.less.js +1 -1
- package/dist/components/Link/style/mixins.less.js +2 -2
- package/dist/components/Panel/style/index.module.less.js +1 -1
- package/dist/components/Panel/style/mixins.less.js +2 -2
- package/dist/components/PreplyLogo/PreplyLogo.d.ts +8 -0
- package/dist/components/PreplyLogo/PreplyLogo.js +23 -0
- package/dist/components/PreplyLogo/style/index.module.less +7 -0
- package/dist/components/PreplyLogo/style/index.module.less.js +9 -0
- package/dist/components/PreplyLogo/style/mixins.less +54 -0
- package/dist/components/{Button → PreplyLogo}/style/mixins.less.js +2 -2
- package/dist/components/PreplyLogo/svg/logo.svg.js +36 -0
- package/dist/components/Spinner/style/index.module.less.js +1 -1
- package/dist/components/Text/style/index.module.less.js +1 -1
- package/dist/components/Text/style/mixins.less.js +2 -2
- package/dist/components/TextHighlighted/style/index.module.less.js +1 -1
- package/dist/components/TextHighlighted/style/mixins.less.js +2 -2
- package/dist/components/TextInline/style/index.module.less.js +1 -1
- package/dist/components/TextInline/style/mixins.less.js +2 -2
- package/dist/components/index.d.ts +2 -0
- package/dist/components/index.js +3 -1
- package/dist/components/private/ButtonBase/ButtonBase.d.ts +19 -0
- package/dist/components/private/ButtonBase/ButtonBase.js +64 -0
- package/dist/components/{Button → private/ButtonBase}/style/index.module.less +4 -3
- package/dist/components/private/ButtonBase/style/index.module.less.js +9 -0
- package/dist/components/{Button → private/ButtonBase}/style/mixins.less +12 -38
- package/dist/components/private/ButtonBase/style/mixins.less.js +8 -0
- package/dist/index.js +3 -1
- package/package.json +12 -12
- package/dist/components/Button/style/index.module.less.js +0 -9
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import type { AvatarSize } from '@preply/ds-core';
|
|
1
|
+
import type { AvatarSize, Responsive } from '@preply/ds-core';
|
|
2
2
|
import { FC } from 'react';
|
|
3
3
|
export interface Props {
|
|
4
|
-
size?: AvatarSize
|
|
4
|
+
size?: Responsive<AvatarSize>;
|
|
5
5
|
round?: boolean;
|
|
6
6
|
src?: string;
|
|
7
7
|
alt?: string;
|
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
import { AVATAR_SIZE_DEFAULT, AVATAR_SRC_DEFAULT } from '@preply/ds-core';
|
|
2
|
-
import {
|
|
2
|
+
import { moduleClassNames, stringClassNames, booleanClassNames } from '@preply/ds-web-core';
|
|
3
3
|
import React__default from 'react';
|
|
4
4
|
import styles from './style/index.module.less.js';
|
|
5
5
|
|
|
6
6
|
const AVATAR = 'Avatar';
|
|
7
7
|
const Avatar = ({ size = AVATAR_SIZE_DEFAULT, round = true, src, alt = '', }) => {
|
|
8
|
-
const classNames = [
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
];
|
|
8
|
+
const classNames = moduleClassNames(styles, AVATAR, [
|
|
9
|
+
stringClassNames('size', size),
|
|
10
|
+
booleanClassNames('round', undefined, round),
|
|
11
|
+
]);
|
|
12
12
|
return (React__default.createElement("picture", { className: classNames.join(' ') },
|
|
13
13
|
React__default.createElement("img", { src: src || AVATAR_SRC_DEFAULT, alt: alt })));
|
|
14
14
|
};
|
|
15
15
|
|
|
16
16
|
export { Avatar };
|
|
17
|
-
//# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
17
|
+
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQXZhdGFyLmpzIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvY29tcG9uZW50cy9BdmF0YXIvQXZhdGFyLnRzeCJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgdHlwZSB7IEF2YXRhclNpemUsIFJlc3BvbnNpdmUgfSBmcm9tICdAcHJlcGx5L2RzLWNvcmUnO1xuaW1wb3J0IHsgQVZBVEFSX1NJWkVfREVGQVVMVCwgQVZBVEFSX1NSQ19ERUZBVUxUIH0gZnJvbSAnQHByZXBseS9kcy1jb3JlJztcbi8vIGltcG9ydCB7IGJvb2xlYW5Qcm9wLCBsb2NhbENsYXNzTmFtZXMsIG9wdGlvblByb3AsIHNhZmVDbGFzc05hbWUgfSBmcm9tICdAcHJlcGx5L2RzLXdlYi1jb3JlJztcbmltcG9ydCB7IGJvb2xlYW5DbGFzc05hbWVzLCBtb2R1bGVDbGFzc05hbWVzLCBzdHJpbmdDbGFzc05hbWVzIH0gZnJvbSAnQHByZXBseS9kcy13ZWItY29yZSc7XG5pbXBvcnQgUmVhY3QsIHsgRkMgfSBmcm9tICdyZWFjdCc7XG5cbmltcG9ydCBzdHlsZXMgZnJvbSAnLi9zdHlsZS9pbmRleC5tb2R1bGUubGVzcyc7XG5cbmV4cG9ydCBpbnRlcmZhY2UgUHJvcHMge1xuICAgIHNpemU/OiBSZXNwb25zaXZlPEF2YXRhclNpemU+O1xuICAgIHJvdW5kPzogYm9vbGVhbjtcbiAgICBzcmM/OiBzdHJpbmc7XG4gICAgYWx0Pzogc3RyaW5nO1xufVxuXG5jb25zdCBBVkFUQVIgPSAnQXZhdGFyJztcblxuZXhwb3J0IGNvbnN0IEF2YXRhcjogRkM8UHJvcHM+ID0gKHtcbiAgICBzaXplID0gQVZBVEFSX1NJWkVfREVGQVVMVCxcbiAgICByb3VuZCA9IHRydWUsXG4gICAgc3JjLFxuICAgIGFsdCA9ICcnLFxufTogUHJvcHMpID0+IHtcbiAgICBjb25zdCBjbGFzc05hbWVzID0gbW9kdWxlQ2xhc3NOYW1lcyhzdHlsZXMsIEFWQVRBUiwgW1xuICAgICAgICBzdHJpbmdDbGFzc05hbWVzKCdzaXplJywgc2l6ZSksXG4gICAgICAgIGJvb2xlYW5DbGFzc05hbWVzKCdyb3VuZCcsIHVuZGVmaW5lZCwgcm91bmQpLFxuICAgIF0pO1xuXG4gICAgcmV0dXJuIChcbiAgICAgICAgPHBpY3R1cmUgY2xhc3NOYW1lPXtjbGFzc05hbWVzLmpvaW4oJyAnKX0+XG4gICAgICAgICAgICA8aW1nIHNyYz17c3JjIHx8IEFWQVRBUl9TUkNfREVGQVVMVH0gYWx0PXthbHR9IC8+XG4gICAgICAgIDwvcGljdHVyZT5cbiAgICApO1xufTtcbiJdLCJuYW1lcyI6WyJSZWFjdCJdLCJtYXBwaW5ncyI6Ijs7Ozs7QUFlQSxNQUFNLE1BQU0sR0FBRyxRQUFRLENBQUM7TUFFWCxNQUFNLEdBQWMsQ0FBQyxFQUM5QixJQUFJLEdBQUcsbUJBQW1CLEVBQzFCLEtBQUssR0FBRyxJQUFJLEVBQ1osR0FBRyxFQUNILEdBQUcsR0FBRyxFQUFFLEdBQ0o7SUFDSixNQUFNLFVBQVUsR0FBRyxnQkFBZ0IsQ0FBQyxNQUFNLEVBQUUsTUFBTSxFQUFFO1FBQ2hELGdCQUFnQixDQUFDLE1BQU0sRUFBRSxJQUFJLENBQUM7UUFDOUIsaUJBQWlCLENBQUMsT0FBTyxFQUFFLFNBQVMsRUFBRSxLQUFLLENBQUM7S0FDL0MsQ0FBQyxDQUFDO0lBRUgsUUFDSUEsMENBQVMsU0FBUyxFQUFFLFVBQVUsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDO1FBQ3BDQSxzQ0FBSyxHQUFHLEVBQUUsR0FBRyxJQUFJLGtCQUFrQixFQUFFLEdBQUcsRUFBRSxHQUFHLEdBQUksQ0FDM0MsRUFDWjtBQUNOOzs7OyJ9
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../../external/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "
|
|
4
|
-
var styles = {__id:"/home/jenkins/workspace/design-system_main/packages/web-lib/src/components/Avatar/style/index.module.less",__css:css_248z,"Avatar":"_2lMMST","Avatar--size-2xs":"EoQhlu","Avatar--size-xs":"_2KHtX3","Avatar--size-s":"_14Oqba","Avatar--size-m":"_fVsFc","Avatar--size-l":"jzJqju","Avatar--size-xl":"_2Aq1PP","Avatar--round":"_3sb-3k"};
|
|
3
|
+
var css_248z = "._2lMMST{display:inline-block}._2lMMST img{border-radius:var(--dad9e);-o-object-fit:cover;object-fit:cover;vertical-align:bottom}.EoQhlu img{height:var(--d51f4);width:var(--d51f4)}._2KHtX3 img{height:var(--cfdb4);width:var(--cfdb4)}._14Oqba img{height:var(--2dafb);width:var(--2dafb)}._fVsFc img{height:var(--b5133);width:var(--b5133)}.jzJqju img{height:var(--d318a);width:var(--d318a)}._2Aq1PP img{height:var(--6eb1c);width:var(--6eb1c)}@media (min-width:400px){._1kKt12 img{height:var(--d51f4);width:var(--d51f4)}._2P5Ukj img{height:var(--cfdb4);width:var(--cfdb4)}._361PWc img{height:var(--2dafb);width:var(--2dafb)}._2fLsZ_ img{height:var(--b5133);width:var(--b5133)}._1HKK1v img{height:var(--d318a);width:var(--d318a)}._2GRaIq img{height:var(--6eb1c);width:var(--6eb1c)}}@media (min-width:700px){._3bW5Eu img{height:var(--d51f4);width:var(--d51f4)}._21AeKU img{height:var(--cfdb4);width:var(--cfdb4)}._1YFS_x img{height:var(--2dafb);width:var(--2dafb)}._3uaBDE img{height:var(--b5133);width:var(--b5133)}.phXmh6 img{height:var(--d318a);width:var(--d318a)}._2RTFG- img{height:var(--6eb1c);width:var(--6eb1c)}}@media (min-width:880px){._1zyB7N img{height:var(--d51f4);width:var(--d51f4)}.b8xwQV img{height:var(--cfdb4);width:var(--cfdb4)}._31eivK img{height:var(--2dafb);width:var(--2dafb)}._17lfXP img{height:var(--b5133);width:var(--b5133)}._18RfG6 img{height:var(--d318a);width:var(--d318a)}.s4ZSGJ img{height:var(--6eb1c);width:var(--6eb1c)}}@media (min-width:1200px){._12IxO0 img{height:var(--d51f4);width:var(--d51f4)}.zcfhZx img{height:var(--cfdb4);width:var(--cfdb4)}._1OAlTA img{height:var(--2dafb);width:var(--2dafb)}._1Mnw67 img{height:var(--b5133);width:var(--b5133)}._2cA8NE img{height:var(--d318a);width:var(--d318a)}._1e2J4O img{height:var(--6eb1c);width:var(--6eb1c)}}@media (min-width:1900px){.qbEHDO img{height:var(--d51f4);width:var(--d51f4)}._1T_PO1 img{height:var(--cfdb4);width:var(--cfdb4)}._1SSD9Y img{height:var(--2dafb);width:var(--2dafb)}._1qnMHb img{height:var(--b5133);width:var(--b5133)}._1wWnVz img{height:var(--d318a);width:var(--d318a)}._1KxQMf img{height:var(--6eb1c);width:var(--6eb1c)}}._3sb-3k img{border-radius:50%}";
|
|
4
|
+
var styles = {__id:"/home/jenkins/workspace/design-system_main/packages/web-lib/src/components/Avatar/style/index.module.less",__css:css_248z,"Avatar":"_2lMMST","Avatar--size-2xs":"EoQhlu","Avatar--size-xs":"_2KHtX3","Avatar--size-s":"_14Oqba","Avatar--size-m":"_fVsFc","Avatar--size-l":"jzJqju","Avatar--size-xl":"_2Aq1PP","Avatar__narrow-l--size-2xs":"_1kKt12","Avatar__narrow-l--size-xs":"_2P5Ukj","Avatar__narrow-l--size-s":"_361PWc","Avatar__narrow-l--size-m":"_2fLsZ_","Avatar__narrow-l--size-l":"_1HKK1v","Avatar__narrow-l--size-xl":"_2GRaIq","Avatar__medium-s--size-2xs":"_3bW5Eu","Avatar__medium-s--size-xs":"_21AeKU","Avatar__medium-s--size-s":"_1YFS_x","Avatar__medium-s--size-m":"_3uaBDE","Avatar__medium-s--size-l":"phXmh6","Avatar__medium-s--size-xl":"_2RTFG-","Avatar__medium-l--size-2xs":"_1zyB7N","Avatar__medium-l--size-xs":"b8xwQV","Avatar__medium-l--size-s":"_31eivK","Avatar__medium-l--size-m":"_17lfXP","Avatar__medium-l--size-l":"_18RfG6","Avatar__medium-l--size-xl":"s4ZSGJ","Avatar__wide-s--size-2xs":"_12IxO0","Avatar__wide-s--size-xs":"zcfhZx","Avatar__wide-s--size-s":"_1OAlTA","Avatar__wide-s--size-m":"_1Mnw67","Avatar__wide-s--size-l":"_2cA8NE","Avatar__wide-s--size-xl":"_1e2J4O","Avatar__wide-l--size-2xs":"qbEHDO","Avatar__wide-l--size-xs":"_1T_PO1","Avatar__wide-l--size-s":"_1SSD9Y","Avatar__wide-l--size-m":"_1qnMHb","Avatar__wide-l--size-l":"_1wWnVz","Avatar__wide-l--size-xl":"_1KxQMf","Avatar--round":"_3sb-3k"};
|
|
5
5
|
var stylesheet=css_248z;
|
|
6
6
|
styleInject(css_248z);
|
|
7
7
|
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
@import '@preply/ds-web-core/dist/generated/tokens.less';
|
|
2
2
|
@import '@preply/ds-web-core/dist/generated/options.less';
|
|
3
|
+
@import '@preply/ds-web-core/dist/responsive/style/mixins.less';
|
|
3
4
|
@import '@preply/ds-web-core/dist/theme/style/declarations.mixins.less';
|
|
4
5
|
|
|
5
6
|
@namespace: 'avatar';
|
|
@@ -15,13 +16,15 @@
|
|
|
15
16
|
}
|
|
16
17
|
|
|
17
18
|
.avatar-sizes() {
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
19
|
+
.responsive({
|
|
20
|
+
each(@AVATAR_SIZE_OPTIONS, {
|
|
21
|
+
&--size-@{value} {
|
|
22
|
+
img {
|
|
23
|
+
@token: 'size-@{value}';
|
|
24
|
+
.size(@namespace, @token);
|
|
25
|
+
}
|
|
23
26
|
}
|
|
24
|
-
}
|
|
27
|
+
});
|
|
25
28
|
});
|
|
26
29
|
}
|
|
27
30
|
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../../external/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "
|
|
4
|
-
var stylesheet="
|
|
3
|
+
var css_248z = "";
|
|
4
|
+
var stylesheet="";
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export { css_248z as default, stylesheet };
|
|
@@ -1,18 +1,4 @@
|
|
|
1
|
-
import
|
|
2
|
-
import {
|
|
3
|
-
export
|
|
4
|
-
variant?: ButtonVariant;
|
|
5
|
-
size?: ButtonSize;
|
|
6
|
-
fullWidth?: boolean;
|
|
7
|
-
wrap?: boolean;
|
|
8
|
-
url?: string;
|
|
9
|
-
opensInNewTab?: boolean;
|
|
10
|
-
submitsForm?: boolean;
|
|
11
|
-
a11yLabel?: string;
|
|
12
|
-
assistiveText?: string;
|
|
13
|
-
onClick?: (event: MouseEvent) => void;
|
|
14
|
-
disabled?: boolean;
|
|
15
|
-
busy?: boolean;
|
|
16
|
-
dataset?: Dataset;
|
|
17
|
-
}
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
import { ButtonBaseProps } from '../private/ButtonBase/ButtonBase';
|
|
3
|
+
export declare type Props = Omit<ButtonBaseProps, 'isIconButton'>;
|
|
18
4
|
export declare const Button: FC<Props>;
|
|
@@ -1,61 +1,9 @@
|
|
|
1
|
-
import
|
|
2
|
-
import {
|
|
3
|
-
import React__default, { useRef } from 'react';
|
|
4
|
-
import { Spinner } from '../Spinner/Spinner.js';
|
|
5
|
-
import styles from './style/index.module.less.js';
|
|
1
|
+
import React__default from 'react';
|
|
2
|
+
import { ButtonBase } from '../private/ButtonBase/ButtonBase.js';
|
|
6
3
|
|
|
7
|
-
const
|
|
8
|
-
|
|
9
|
-
const contentClassNames = [...localClasses(styles, BUTTON, ['content'])];
|
|
10
|
-
const busyClassNames = [...localClasses(styles, BUTTON, ['busy'])];
|
|
11
|
-
return (React__default.createElement(React__default.Fragment, null,
|
|
12
|
-
React__default.createElement("span", { className: contentClassNames.join(' ') }, children),
|
|
13
|
-
busy && (React__default.createElement("span", { className: busyClassNames.join(' ') },
|
|
14
|
-
React__default.createElement(Spinner, null)))));
|
|
15
|
-
};
|
|
16
|
-
const Button = ({ variant = BUTTON_VARIANT_DEFAULT, size = BUTTON_SIZE_DEFAULT, fullWidth, wrap, url, opensInNewTab, submitsForm, a11yLabel, assistiveText, onClick, disabled, busy, dataset, children, }) => {
|
|
17
|
-
useInstrument('render', { component: BUTTON, props: { variant, size, a11yLabel } });
|
|
18
|
-
useStyleExtract(styles);
|
|
19
|
-
const ref = useRef(null);
|
|
20
|
-
const handleClick = (event) => {
|
|
21
|
-
if (disabled || busy) {
|
|
22
|
-
event.preventDefault();
|
|
23
|
-
}
|
|
24
|
-
if (onClick) {
|
|
25
|
-
onClick(event);
|
|
26
|
-
}
|
|
27
|
-
};
|
|
28
|
-
const handleKeyPress = (event) => {
|
|
29
|
-
var _a;
|
|
30
|
-
const key = mapEdgeKeyToStandard(event.key);
|
|
31
|
-
if (key === ' ' || key === 'Enter') {
|
|
32
|
-
event.preventDefault();
|
|
33
|
-
(_a = ref.current) === null || _a === void 0 ? void 0 : _a.click();
|
|
34
|
-
}
|
|
35
|
-
};
|
|
36
|
-
const classNames = [
|
|
37
|
-
safeClassName(styles, BUTTON),
|
|
38
|
-
...localClasses(styles, BUTTON, [
|
|
39
|
-
['variant', variant],
|
|
40
|
-
['size', size],
|
|
41
|
-
{ if: !wrap, then: 'no-wrap' },
|
|
42
|
-
{ if: fullWidth, then: 'width-full' },
|
|
43
|
-
{ if: busy, then: 'is-busy' },
|
|
44
|
-
]),
|
|
45
|
-
];
|
|
46
|
-
const props = {
|
|
47
|
-
...getDatasetProps(dataset),
|
|
48
|
-
className: classNames.join(' '),
|
|
49
|
-
'aria-label': assistiveText || a11yLabel,
|
|
50
|
-
onClick: handleClick,
|
|
51
|
-
disabled,
|
|
52
|
-
'aria-disabled': disabled || busy ? true : undefined,
|
|
53
|
-
};
|
|
54
|
-
if (!url) {
|
|
55
|
-
return (React__default.createElement("button", Object.assign({}, props, { type: submitsForm ? 'submit' : 'button' }), renderContent({ children, busy })));
|
|
56
|
-
}
|
|
57
|
-
return (React__default.createElement("a", Object.assign({}, props, getExternalUrlProps(url, opensInNewTab), { ref: ref, role: "button", tabIndex: disabled ? -1 : 0, href: url, onKeyDown: handleKeyPress }), renderContent({ children, busy })));
|
|
4
|
+
const Button = props => {
|
|
5
|
+
return React__default.createElement(ButtonBase, Object.assign({}, props, { isIconButton: false }));
|
|
58
6
|
};
|
|
59
7
|
|
|
60
8
|
export { Button };
|
|
61
|
-
//# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
9
|
+
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQnV0dG9uLmpzIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvY29tcG9uZW50cy9CdXR0b24vQnV0dG9uLnRzeCJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QsIHsgRkMgfSBmcm9tICdyZWFjdCc7XG5cbmltcG9ydCB7IEJ1dHRvbkJhc2UsIEJ1dHRvbkJhc2VQcm9wcyB9IGZyb20gJy4uL3ByaXZhdGUvQnV0dG9uQmFzZS9CdXR0b25CYXNlJztcblxuZXhwb3J0IHR5cGUgUHJvcHMgPSBPbWl0PEJ1dHRvbkJhc2VQcm9wcywgJ2lzSWNvbkJ1dHRvbic+O1xuXG5leHBvcnQgY29uc3QgQnV0dG9uOiBGQzxQcm9wcz4gPSBwcm9wcyA9PiB7XG4gICAgcmV0dXJuIDxCdXR0b25CYXNlIHsuLi5wcm9wc30gaXNJY29uQnV0dG9uPXtmYWxzZX0gLz47XG59O1xuIl0sIm5hbWVzIjpbIlJlYWN0Il0sIm1hcHBpbmdzIjoiOzs7TUFNYSxNQUFNLEdBQWMsS0FBSztJQUNsQyxPQUFPQSw2QkFBQyxVQUFVLG9CQUFLLEtBQUssSUFBRSxZQUFZLEVBQUUsS0FBSyxJQUFJLENBQUM7QUFDMUQ7Ozs7In0=
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import styleInject from '../../../external/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "
|
|
3
|
+
var css_248z = "._3DJ88_{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;color:var(--aface);font-family:var(--0e309);font-size:var(--8d63e);font-weight:var(--73984);line-height:var(--d4313);margin:0}._2rnwCX{font-weight:var(--6e979)}.Mz4Kul{font-size:var(--1801d)}._39hW1C{font-size:var(--814fe)}._1Vkbje{font-size:var(--ace69)}._3j1kRK{font-size:var(--3e140)}._3nK_wK{font-size:var(--af282)}";
|
|
4
4
|
var styles = {__id:"/home/jenkins/workspace/design-system_main/packages/web-lib/src/components/Heading/style/index.module.less",__css:css_248z,"Heading":"_3DJ88_","Heading--strong":"_2rnwCX","Heading--level-h1":"Mz4Kul","Heading--level-h2":"_39hW1C","Heading--level-h3":"_1Vkbje","Heading--level-h4":"_3j1kRK","Heading--level-h5":"_3nK_wK"};
|
|
5
5
|
var stylesheet=css_248z;
|
|
6
6
|
styleInject(css_248z);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../../external/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "
|
|
4
|
-
var stylesheet="
|
|
3
|
+
var css_248z = "";
|
|
4
|
+
var stylesheet="";
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export { css_248z as default, stylesheet };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import styleInject from '../../../external/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "
|
|
3
|
+
var css_248z = ".nKoHrt{display:inline-block;vertical-align:text-top}.nKoHrt svg{fill:currentColor;display:block;max-height:100%;max-width:100%;min-width:100%;width:100%}._1HK8l-{height:var(--b21f6);width:var(--b21f6)}._2Sp9mC{height:var(--766f3);width:var(--766f3)}._2YELqy{height:var(--7c1b1);width:var(--7c1b1)}._18Hsfi{height:var(--2152b);width:var(--2152b)}.QeTxTN{height:var(--8f525);width:var(--8f525)}._2ML-d7 svg{fill:var(--937a6)}.idQhUK svg{fill:var(--fe08e)}._2FixNT svg{fill:var(--32ad9)}._1IcAUz svg{fill:var(--e0400)}";
|
|
4
4
|
var styles = {__id:"/home/jenkins/workspace/design-system_main/packages/web-lib/src/components/Icon/style/index.module.less",__css:css_248z,"Icon":"nKoHrt","Icon--size-2xs":"_1HK8l-","Icon--size-xs":"_2Sp9mC","Icon--size-s":"_2YELqy","Icon--size-m":"_18Hsfi","Icon--size-l":"QeTxTN","Icon--accent-normal":"_2ML-d7","Icon--accent-muted":"idQhUK","Icon--accent-brand":"_2FixNT","Icon--accent-positive":"_1IcAUz"};
|
|
5
5
|
var stylesheet=css_248z;
|
|
6
6
|
styleInject(css_248z);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../../external/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "
|
|
4
|
-
var stylesheet="
|
|
3
|
+
var css_248z = "";
|
|
4
|
+
var stylesheet="";
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export { css_248z as default, stylesheet };
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import React, { FC, SVGAttributes } from 'react';
|
|
2
|
+
import { ButtonBaseProps } from '../private/ButtonBase/ButtonBase';
|
|
3
|
+
export declare type ReactSVGComponentType = React.ComponentType<SVGAttributes<SVGElement>>;
|
|
4
|
+
export declare type IconButtonProps = Omit<ButtonBaseProps, 'fullWidth' | 'wrap' | 'isIconButton'>;
|
|
5
|
+
export declare type Props = IconButtonProps & {
|
|
6
|
+
assistiveText: string;
|
|
7
|
+
svg: ReactSVGComponentType;
|
|
8
|
+
};
|
|
9
|
+
export declare const IconButton: FC<Props>;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { BUTTON_VARIANT_DEFAULT, BUTTON_SIZE_DEFAULT } from '@preply/ds-core';
|
|
2
|
+
import { useInstrument, useStyleExtract } from '@preply/ds-web-core';
|
|
3
|
+
import React__default from 'react';
|
|
4
|
+
import { ButtonBase } from '../private/ButtonBase/ButtonBase.js';
|
|
5
|
+
import styles from '../private/ButtonBase/style/index.module.less.js';
|
|
6
|
+
|
|
7
|
+
const ICONBUTTON = 'IconButton';
|
|
8
|
+
const IconButton = ({ variant = BUTTON_VARIANT_DEFAULT, size = BUTTON_SIZE_DEFAULT, a11yLabel, svg: Svg, ...props }) => {
|
|
9
|
+
useInstrument('render', {
|
|
10
|
+
component: ICONBUTTON,
|
|
11
|
+
props: { variant, size, a11yLabel },
|
|
12
|
+
});
|
|
13
|
+
useStyleExtract(styles);
|
|
14
|
+
return (React__default.createElement(ButtonBase, Object.assign({}, props, { isIconButton: true, variant: variant, size: size, a11yLabel: a11yLabel }),
|
|
15
|
+
React__default.createElement(Svg, { "aria-hidden": "true", focusable: "false" })));
|
|
16
|
+
};
|
|
17
|
+
|
|
18
|
+
export { IconButton };
|
|
19
|
+
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSWNvbkJ1dHRvbi5qcyIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvSWNvbkJ1dHRvbi9JY29uQnV0dG9uLnRzeCJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBCVVRUT05fU0laRV9ERUZBVUxULCBCVVRUT05fVkFSSUFOVF9ERUZBVUxUIH0gZnJvbSAnQHByZXBseS9kcy1jb3JlJztcbmltcG9ydCB7IHVzZUluc3RydW1lbnQsIHVzZVN0eWxlRXh0cmFjdCB9IGZyb20gJ0BwcmVwbHkvZHMtd2ViLWNvcmUnO1xuaW1wb3J0IFJlYWN0LCB7IEZDLCBTVkdBdHRyaWJ1dGVzIH0gZnJvbSAncmVhY3QnO1xuXG5pbXBvcnQgeyBCdXR0b25CYXNlLCBCdXR0b25CYXNlUHJvcHMgfSBmcm9tICcuLi9wcml2YXRlL0J1dHRvbkJhc2UvQnV0dG9uQmFzZSc7XG5pbXBvcnQgc3R5bGVzIGZyb20gJy4uL3ByaXZhdGUvQnV0dG9uQmFzZS9zdHlsZS9pbmRleC5tb2R1bGUubGVzcyc7XG5cbmV4cG9ydCB0eXBlIFJlYWN0U1ZHQ29tcG9uZW50VHlwZSA9IFJlYWN0LkNvbXBvbmVudFR5cGU8U1ZHQXR0cmlidXRlczxTVkdFbGVtZW50Pj47XG5cbmNvbnN0IElDT05CVVRUT04gPSAnSWNvbkJ1dHRvbic7XG5cbmV4cG9ydCB0eXBlIEljb25CdXR0b25Qcm9wcyA9IE9taXQ8QnV0dG9uQmFzZVByb3BzLCAnZnVsbFdpZHRoJyB8ICd3cmFwJyB8ICdpc0ljb25CdXR0b24nPjtcblxuZXhwb3J0IHR5cGUgUHJvcHMgPSBJY29uQnV0dG9uUHJvcHMgJiB7XG4gICAgYXNzaXN0aXZlVGV4dDogc3RyaW5nO1xuICAgIHN2ZzogUmVhY3RTVkdDb21wb25lbnRUeXBlO1xufTtcblxuZXhwb3J0IGNvbnN0IEljb25CdXR0b246IEZDPFByb3BzPiA9ICh7XG4gICAgdmFyaWFudCA9IEJVVFRPTl9WQVJJQU5UX0RFRkFVTFQsXG4gICAgc2l6ZSA9IEJVVFRPTl9TSVpFX0RFRkFVTFQsXG4gICAgYTExeUxhYmVsLFxuICAgIHN2ZzogU3ZnLFxuICAgIC4uLnByb3BzXG59KSA9PiB7XG4gICAgdXNlSW5zdHJ1bWVudCgncmVuZGVyJywge1xuICAgICAgICBjb21wb25lbnQ6IElDT05CVVRUT04sXG4gICAgICAgIHByb3BzOiB7IHZhcmlhbnQsIHNpemUsIGExMXlMYWJlbCB9LFxuICAgIH0pO1xuICAgIHVzZVN0eWxlRXh0cmFjdChzdHlsZXMpO1xuXG4gICAgcmV0dXJuIChcbiAgICAgICAgPEJ1dHRvbkJhc2Ugey4uLnByb3BzfSBpc0ljb25CdXR0b24gdmFyaWFudD17dmFyaWFudH0gc2l6ZT17c2l6ZX0gYTExeUxhYmVsPXthMTF5TGFiZWx9PlxuICAgICAgICAgICAgPFN2ZyBhcmlhLWhpZGRlbj1cInRydWVcIiBmb2N1c2FibGU9XCJmYWxzZVwiIC8+XG4gICAgICAgIDwvQnV0dG9uQmFzZT5cbiAgICApO1xufTtcbiJdLCJuYW1lcyI6WyJSZWFjdCJdLCJtYXBwaW5ncyI6Ijs7Ozs7O0FBU0EsTUFBTSxVQUFVLEdBQUcsWUFBWSxDQUFDO01BU25CLFVBQVUsR0FBYyxDQUFDLEVBQ2xDLE9BQU8sR0FBRyxzQkFBc0IsRUFDaEMsSUFBSSxHQUFHLG1CQUFtQixFQUMxQixTQUFTLEVBQ1QsR0FBRyxFQUFFLEdBQUcsRUFDUixHQUFHLEtBQUssRUFDWDtJQUNHLGFBQWEsQ0FBQyxRQUFRLEVBQUU7UUFDcEIsU0FBUyxFQUFFLFVBQVU7UUFDckIsS0FBSyxFQUFFLEVBQUUsT0FBTyxFQUFFLElBQUksRUFBRSxTQUFTLEVBQUU7S0FDdEMsQ0FBQyxDQUFDO0lBQ0gsZUFBZSxDQUFDLE1BQU0sQ0FBQyxDQUFDO0lBRXhCLFFBQ0lBLDZCQUFDLFVBQVUsb0JBQUssS0FBSyxJQUFFLFlBQVksUUFBQyxPQUFPLEVBQUUsT0FBTyxFQUFFLElBQUksRUFBRSxJQUFJLEVBQUUsU0FBUyxFQUFFLFNBQVM7UUFDbEZBLDZCQUFDLEdBQUcsbUJBQWEsTUFBTSxFQUFDLFNBQVMsRUFBQyxPQUFPLEdBQUcsQ0FDbkMsRUFDZjtBQUNOOzs7OyJ9
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import styleInject from '../../../external/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "
|
|
3
|
+
var css_248z = "._3Ipr_0{border-radius:var(--5eeb2);color:var(--1e752);cursor:pointer;display:inline-block;font-weight:var(--6e979);text-decoration:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}._3Ipr_0:hover{color:var(--7d796)}._3Ipr_0:active{color:var(--17d30)}._3Ipr_0.ipUoad{outline-color:var(--603ec);outline-offset:var(--c0b12);outline-style:solid;outline-width:var(--99d31)}._3Ipr_0:focus-visible{outline-color:var(--603ec);outline-offset:var(--c0b12);outline-style:solid;outline-width:var(--99d31)}";
|
|
4
4
|
var styles = {__id:"/home/jenkins/workspace/design-system_main/packages/web-lib/src/components/Link/style/index.module.less",__css:css_248z,"Link":"_3Ipr_0","focus-visible":"ipUoad"};
|
|
5
5
|
var stylesheet=css_248z;
|
|
6
6
|
styleInject(css_248z);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../../external/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "
|
|
4
|
-
var stylesheet="
|
|
3
|
+
var css_248z = "";
|
|
4
|
+
var stylesheet="";
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export { css_248z as default, stylesheet };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import styleInject from '../../../external/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "
|
|
3
|
+
var css_248z = "._1P8hDa{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;background-color:var(--786b9);border-radius:var(--ff478);color:var(--aface);font-family:var(--0e309);font-size:var(--8d63e);line-height:var(--d4313)}._3UVnzc ._1YAsmT,._3UVnzc ._2AEx3V,._3UVnzc ._3eU6Ry,._3UVnzc>.AC9lsg{padding:var(--e8082)}.ytPqbT ._1YAsmT,.ytPqbT ._2AEx3V,.ytPqbT ._3eU6Ry,.ytPqbT>.AC9lsg{padding:var(--c8793)}._1q_-ys ._1YAsmT,._1q_-ys ._2AEx3V,._1q_-ys ._3eU6Ry,._1q_-ys>.AC9lsg{padding:var(--0c9f7)}._2HdQc_ ._1YAsmT,._2HdQc_ ._2AEx3V,._2HdQc_ ._3eU6Ry,._2HdQc_>.AC9lsg{padding:var(--1d829)}._1P8hDa>._2AEx3V+._1YAsmT,._1P8hDa>.AC9lsg+._2AEx3V{padding-top:0}._1P8hDa>._3eU6Ry{border-color:var(--66a60)}._1P8hDa>._3eU6Ry:not(:last-child){border-bottom-width:1px}._1P8hDa>._3eU6Ry:not(:first-child){border-top-width:1px}._1P8hDa>._3eU6Ry+._3eU6Ry{border-top:none}._3eU6Ry{border-style:solid;border-width:0}";
|
|
4
4
|
var styles = {__id:"/home/jenkins/workspace/design-system_main/packages/web-lib/src/components/Panel/style/index.module.less",__css:css_248z,"Panel":"_1P8hDa","Panel--padding-small":"_3UVnzc","PanelHeader":"AC9lsg","PanelBody":"_2AEx3V","PanelFooter":"_1YAsmT","PanelSection":"_3eU6Ry","Panel--padding-base":"ytPqbT","Panel--padding-medium":"_1q_-ys","Panel--padding-large":"_2HdQc_"};
|
|
5
5
|
var stylesheet=css_248z;
|
|
6
6
|
styleInject(css_248z);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../../external/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "
|
|
4
|
-
var stylesheet="
|
|
3
|
+
var css_248z = "";
|
|
4
|
+
var stylesheet="";
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export { css_248z as default, stylesheet };
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { PREPLY_LOGO_VARIANT_DEFAULT } from '@preply/ds-core';
|
|
2
|
+
import { moduleClassNames, stringClassNames, booleanClassNames } from '@preply/ds-web-core';
|
|
3
|
+
import React__default from 'react';
|
|
4
|
+
import styles from './style/index.module.less.js';
|
|
5
|
+
import SvgLogo from './svg/logo.svg.js';
|
|
6
|
+
|
|
7
|
+
const PREPLY_LOGO = 'PreplyLogo';
|
|
8
|
+
const MODES = {
|
|
9
|
+
COMPLETE: { width: 130, viewBox: '0 0 130 40' },
|
|
10
|
+
ICON_ONLY: { width: 20, viewBox: '0 0 20 40' },
|
|
11
|
+
};
|
|
12
|
+
const PreplyLogo = ({ variant = PREPLY_LOGO_VARIANT_DEFAULT, iconOnly = false, inverted = false, }) => {
|
|
13
|
+
const classNames = moduleClassNames(styles, PREPLY_LOGO, [
|
|
14
|
+
stringClassNames('variant', variant),
|
|
15
|
+
booleanClassNames('inverted', undefined, inverted),
|
|
16
|
+
]);
|
|
17
|
+
const { width, viewBox } = iconOnly ? MODES.ICON_ONLY : MODES.COMPLETE;
|
|
18
|
+
return (React__default.createElement("span", { className: classNames.join(' ') },
|
|
19
|
+
React__default.createElement(SvgLogo, { role: "img", focusable: "false", "aria-label": "Preply", viewBox: viewBox, width: width })));
|
|
20
|
+
};
|
|
21
|
+
|
|
22
|
+
export { PreplyLogo };
|
|
23
|
+
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiUHJlcGx5TG9nby5qcyIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvUHJlcGx5TG9nby9QcmVwbHlMb2dvLnRzeCJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgdHlwZSB7IFByZXBseUxvZ29WYXJpYW50IH0gZnJvbSAnQHByZXBseS9kcy1jb3JlJztcbmltcG9ydCB7IFBSRVBMWV9MT0dPX1ZBUklBTlRfREVGQVVMVCB9IGZyb20gJ0BwcmVwbHkvZHMtY29yZSc7XG5pbXBvcnQgeyBib29sZWFuQ2xhc3NOYW1lcywgbW9kdWxlQ2xhc3NOYW1lcywgc3RyaW5nQ2xhc3NOYW1lcyB9IGZyb20gJ0BwcmVwbHkvZHMtd2ViLWNvcmUnO1xuaW1wb3J0IFJlYWN0LCB7IEZDIH0gZnJvbSAncmVhY3QnO1xuXG5pbXBvcnQgc3R5bGVzIGZyb20gJy4vc3R5bGUvaW5kZXgubW9kdWxlLmxlc3MnO1xuaW1wb3J0IExvZ29TdmcgZnJvbSAnLi9zdmcvbG9nby5zdmcnO1xuXG5leHBvcnQgaW50ZXJmYWNlIFByb3BzIHtcbiAgICB2YXJpYW50PzogUHJlcGx5TG9nb1ZhcmlhbnQ7XG4gICAgaWNvbk9ubHk/OiBib29sZWFuO1xuICAgIGludmVydGVkPzogYm9vbGVhbjtcbn1cblxuY29uc3QgUFJFUExZX0xPR08gPSAnUHJlcGx5TG9nbyc7XG5cbmNvbnN0IE1PREVTID0ge1xuICAgIENPTVBMRVRFOiB7IHdpZHRoOiAxMzAsIHZpZXdCb3g6ICcwIDAgMTMwIDQwJyB9LFxuICAgIElDT05fT05MWTogeyB3aWR0aDogMjAsIHZpZXdCb3g6ICcwIDAgMjAgNDAnIH0sXG59O1xuXG5leHBvcnQgY29uc3QgUHJlcGx5TG9nbzogRkM8UHJvcHM+ID0gKHtcbiAgICB2YXJpYW50ID0gUFJFUExZX0xPR09fVkFSSUFOVF9ERUZBVUxULFxuICAgIGljb25Pbmx5ID0gZmFsc2UsXG4gICAgaW52ZXJ0ZWQgPSBmYWxzZSxcbn06IFByb3BzKSA9PiB7XG4gICAgY29uc3QgY2xhc3NOYW1lcyA9IG1vZHVsZUNsYXNzTmFtZXMoc3R5bGVzLCBQUkVQTFlfTE9HTywgW1xuICAgICAgICBzdHJpbmdDbGFzc05hbWVzKCd2YXJpYW50JywgdmFyaWFudCksXG4gICAgICAgIGJvb2xlYW5DbGFzc05hbWVzKCdpbnZlcnRlZCcsIHVuZGVmaW5lZCwgaW52ZXJ0ZWQpLFxuICAgIF0pO1xuXG4gICAgY29uc3QgeyB3aWR0aCwgdmlld0JveCB9ID0gaWNvbk9ubHkgPyBNT0RFUy5JQ09OX09OTFkgOiBNT0RFUy5DT01QTEVURTtcblxuICAgIHJldHVybiAoXG4gICAgICAgIDxzcGFuIGNsYXNzTmFtZT17Y2xhc3NOYW1lcy5qb2luKCcgJyl9PlxuICAgICAgICAgICAgPExvZ29TdmdcbiAgICAgICAgICAgICAgICByb2xlPVwiaW1nXCJcbiAgICAgICAgICAgICAgICBmb2N1c2FibGU9XCJmYWxzZVwiXG4gICAgICAgICAgICAgICAgYXJpYS1sYWJlbD1cIlByZXBseVwiXG4gICAgICAgICAgICAgICAgdmlld0JveD17dmlld0JveH1cbiAgICAgICAgICAgICAgICB3aWR0aD17d2lkdGh9XG4gICAgICAgICAgICAvPlxuICAgICAgICA8L3NwYW4+XG4gICAgKTtcbn07XG4iXSwibmFtZXMiOlsiUmVhY3QiLCJMb2dvU3ZnIl0sIm1hcHBpbmdzIjoiOzs7Ozs7QUFjQSxNQUFNLFdBQVcsR0FBRyxZQUFZLENBQUM7QUFFakMsTUFBTSxLQUFLLEdBQUc7SUFDVixRQUFRLEVBQUUsRUFBRSxLQUFLLEVBQUUsR0FBRyxFQUFFLE9BQU8sRUFBRSxZQUFZLEVBQUU7SUFDL0MsU0FBUyxFQUFFLEVBQUUsS0FBSyxFQUFFLEVBQUUsRUFBRSxPQUFPLEVBQUUsV0FBVyxFQUFFO0NBQ2pELENBQUM7TUFFVyxVQUFVLEdBQWMsQ0FBQyxFQUNsQyxPQUFPLEdBQUcsMkJBQTJCLEVBQ3JDLFFBQVEsR0FBRyxLQUFLLEVBQ2hCLFFBQVEsR0FBRyxLQUFLLEdBQ1o7SUFDSixNQUFNLFVBQVUsR0FBRyxnQkFBZ0IsQ0FBQyxNQUFNLEVBQUUsV0FBVyxFQUFFO1FBQ3JELGdCQUFnQixDQUFDLFNBQVMsRUFBRSxPQUFPLENBQUM7UUFDcEMsaUJBQWlCLENBQUMsVUFBVSxFQUFFLFNBQVMsRUFBRSxRQUFRLENBQUM7S0FDckQsQ0FBQyxDQUFDO0lBRUgsTUFBTSxFQUFFLEtBQUssRUFBRSxPQUFPLEVBQUUsR0FBRyxRQUFRLEdBQUcsS0FBSyxDQUFDLFNBQVMsR0FBRyxLQUFLLENBQUMsUUFBUSxDQUFDO0lBRXZFLFFBQ0lBLHVDQUFNLFNBQVMsRUFBRSxVQUFVLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQztRQUNqQ0EsNkJBQUNDLE9BQU8sSUFDSixJQUFJLEVBQUMsS0FBSyxFQUNWLFNBQVMsRUFBQyxPQUFPLGdCQUNOLFFBQVEsRUFDbkIsT0FBTyxFQUFFLE9BQU8sRUFDaEIsS0FBSyxFQUFFLEtBQUssR0FDZCxDQUNDLEVBQ1Q7QUFDTjs7OzsifQ==
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import styleInject from '../../../external/style-inject/dist/style-inject.es.js';
|
|
2
|
+
|
|
3
|
+
var css_248z = "._3Ubdzh{display:inline-block}._3Ubdzh svg{display:block}._2RBCvP [data-name=preply] path{fill:var(--14567)}._6mjWbg [data-name=top]{fill:var(--f72cd)}._6mjWbg [data-name=bottom]{fill:var(--b706b)}._1wZt-U [data-name=logomark] path{fill:var(--c9575)}._1wZt-U._2RBCvP [data-name=logomark] path{fill:var(--14567)}._2PuzId [data-name=top]{fill:#0057b7}._2PuzId [data-name=bottom]{fill:gold}";
|
|
4
|
+
var styles = {__id:"/home/jenkins/workspace/design-system_main/packages/web-lib/src/components/PreplyLogo/style/index.module.less",__css:css_248z,"PreplyLogo":"_3Ubdzh","PreplyLogo--inverted":"_2RBCvP","PreplyLogo--variant-default":"_6mjWbg","PreplyLogo--variant-monochrome":"_1wZt-U","PreplyLogo--variant-ua":"_2PuzId"};
|
|
5
|
+
var stylesheet=css_248z;
|
|
6
|
+
styleInject(css_248z);
|
|
7
|
+
|
|
8
|
+
export { styles as default, stylesheet };
|
|
9
|
+
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
@import '@preply/ds-web-core/dist/generated/tokens.less';
|
|
2
|
+
@import '@preply/ds-web-core/dist/generated/options.less';
|
|
3
|
+
@import '@preply/ds-web-core/dist/responsive/style/mixins.less';
|
|
4
|
+
@import '@preply/ds-web-core/dist/theme/style/declarations.mixins.less';
|
|
5
|
+
|
|
6
|
+
@namespace: 'preply-logo';
|
|
7
|
+
|
|
8
|
+
.preply-logo-base() {
|
|
9
|
+
display: inline-block;
|
|
10
|
+
|
|
11
|
+
svg {
|
|
12
|
+
display: block;
|
|
13
|
+
}
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
.preply-logo-inverted() {
|
|
17
|
+
&--inverted {
|
|
18
|
+
[data-name='preply'] path {
|
|
19
|
+
fill: @root-palette-white;
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
.preply-logo-variants() {
|
|
25
|
+
&--variant-default {
|
|
26
|
+
[data-name='top'] {
|
|
27
|
+
fill: @root-palette-magenta-300;
|
|
28
|
+
}
|
|
29
|
+
[data-name='bottom'] {
|
|
30
|
+
fill: @root-palette-teal-200;
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
&--variant-monochrome {
|
|
35
|
+
[data-name='logomark'] path {
|
|
36
|
+
fill: @root-palette-gray-500;
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
&--variant-monochrome&--inverted {
|
|
41
|
+
[data-name='logomark'] path {
|
|
42
|
+
fill: @root-palette-white;
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
&--variant-ua {
|
|
47
|
+
[data-name='top'] {
|
|
48
|
+
fill: #0057b7;
|
|
49
|
+
}
|
|
50
|
+
[data-name='bottom'] {
|
|
51
|
+
fill: #ffd700;
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../../external/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "
|
|
4
|
-
var stylesheet="
|
|
3
|
+
var css_248z = "";
|
|
4
|
+
var stylesheet="";
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export { css_248z as default, stylesheet };
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
|
|
3
|
+
var _g, _g2;
|
|
4
|
+
|
|
5
|
+
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
6
|
+
|
|
7
|
+
function SvgLogo(props) {
|
|
8
|
+
return /*#__PURE__*/React.createElement("svg", _extends({
|
|
9
|
+
width: 130,
|
|
10
|
+
height: 40,
|
|
11
|
+
fill: "none",
|
|
12
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
13
|
+
}, props), _g || (_g = /*#__PURE__*/React.createElement("g", {
|
|
14
|
+
"data-name": "logomark"
|
|
15
|
+
}, /*#__PURE__*/React.createElement("path", {
|
|
16
|
+
"data-name": "top",
|
|
17
|
+
d: "M18.556 8.56a2.157 2.157 0 011.052 2.551 2.122 2.122 0 01-.808 1.116l-.039.03c-.19.15-.353.236-.353.236l-4.83 2.488-11.824 6.242c-.07.04-.14.078-.226.119l-.09.04a.762.762 0 01-.269.046.718.718 0 01-.075 0C.49 21.428 0 20.98 0 20.436c0-.348.234-.619.502-.83l4.175-3.448c-.97-.521-2.15-1.133-2.608-1.38C.889 14.14.779 13.12.779 12.73V2.117c0-.188-.01-.349.006-.47.015-.199.06-.373.117-.563A1.51 1.51 0 012.803.072c.141.045.253.116.387.19L18.556 8.56z",
|
|
18
|
+
fill: "#CD4A86"
|
|
19
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
20
|
+
"data-name": "bottom",
|
|
21
|
+
d: "M18.238 15.244c1.247-.66 2.257-.054 2.257 1.355v4.803l.003.001v5.957c0 1.409-1.01 3.086-2.257 3.745l-5.996 3.208.005.002-9.994 5.297C1.01 40.272 0 39.666 0 38.257V27.495c0-1.409 1.01-3.085 2.256-3.745l1.577-.869v-.002l8.33-4.415 6.075-3.22z",
|
|
22
|
+
fill: "#27E0F6"
|
|
23
|
+
}))), _g2 || (_g2 = /*#__PURE__*/React.createElement("g", {
|
|
24
|
+
"data-name": "preply",
|
|
25
|
+
fill: "#192435"
|
|
26
|
+
}, /*#__PURE__*/React.createElement("path", {
|
|
27
|
+
d: "M109.213 25.942h-4.851V4.392c0-.644.233-1.189.694-1.63a2.32 2.32 0 011.665-.659h2.492v23.84zM52.375 25.942v-8.939c0-1.804.268-3.315.798-4.539.53-1.224 1.258-2.205 2.18-2.943.877-.694 1.908-1.2 3.082-1.526a13.725 13.725 0 013.637-.486h.694v4.92H61.17c-1.337 0-2.334.322-2.978.972-.649.649-.97 1.665-.97 3.047v9.494h-4.847zM115.398 32.597l-1.041.002v-.77h.001v-3.186h1.318c.922 0 1.65-.218 2.18-.66.53-.44.634-1.144.312-2.11l-6.441-18.36h5.336l3.741 13.028 3.256-11.362c.277-1.11 1.016-1.665 2.215-1.665h3.325l-7.066 20.995c-.555 1.526-1.249 2.611-2.076 3.255-.833.555-2.196.833-4.088.833h-.972z"
|
|
28
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
29
|
+
fillRule: "evenodd",
|
|
30
|
+
clipRule: "evenodd",
|
|
31
|
+
d: "M80.865 20.18h-3.464c-.555 0-.98.114-1.283.352a2.931 2.931 0 00-.412.375c-.14.163-.507.587-.873.805a.521.521 0 00-.018.011c-.547.315-1.214.474-1.987.474-1.2 0-2.101-.371-2.7-1.11-.65-.693-.997-1.754-1.041-3.186h11.981c.045-.094.07-.253.07-.485v-.764c0-3.047-.739-5.425-2.215-7.135-1.522-1.66-3.672-2.492-6.442-2.492-2.631 0-4.688.852-6.164 2.561-1.432 1.66-2.146 3.974-2.146 6.928 0 3.092.738 5.47 2.215 7.135 1.477 1.71 3.533 2.562 6.164 2.562 2.17 0 3.974-.535 5.406-1.596 1.432-1.015 2.399-2.492 2.909-4.434zm-5.683-8.175c.555.6.877 1.52.97 2.77h-7.065c.044-1.2.391-2.121 1.04-2.77.644-.65 1.477-.972 2.493-.972 1.105 0 1.962.327 2.561.972zM49.51 16.96c.003-.113.005-.228.005-.342v-.044-.055c0-.585-.03-1.148-.09-1.689-.166-1.623-.642-3.698-1.983-5.247a6.476 6.476 0 00-.898-.855c-1.158-.91-2.496-1.338-3.652-1.536a9.396 9.396 0 00-1.93-.166 8.054 8.054 0 00-.441.004c-1.544.046-4.598.479-6.504 2.523a.133.133 0 01-.004.004c-1.254 1.269-1.881 3.222-1.881 5.852v.184c-.004.29-.003.557-.002.79l.002.28v16h2.354c.649 0 1.204-.233 1.665-.694.46-.466.693-1.021.693-1.665h-.005v-6.858c.55.966 1.289 1.685 2.215 2.145.877.417 1.893.625 3.048.625 2.17 0 3.949-.877 5.337-2.631 1.311-1.707 2.003-3.918 2.07-6.625zm-5.808-4.39c.694.97 1.04 2.353 1.04 4.157 0 1.66-.341 2.978-1.04 3.949-.693.971-1.64 1.457-2.839 1.457-1.293 0-2.284-.486-2.978-1.457-.694-.877-1.04-2.195-1.04-3.95 0-1.892.322-3.28.97-4.157.694-.97 1.66-1.456 2.91-1.456 1.292 0 2.284.485 2.977 1.456zM101.476 16.96c.004-.114.006-.228.006-.342v-.043-.056c0-.585-.03-1.148-.09-1.689-.166-1.623-.641-3.698-1.983-5.247a6.476 6.476 0 00-.898-.855c-1.158-.91-2.496-1.338-3.652-1.536a9.396 9.396 0 00-1.93-.166 8.054 8.054 0 00-.441.004c-1.543.046-4.597.479-6.504 2.523l-.004.004c-1.254 1.269-1.88 3.222-1.88 5.852v.184c-.005.29-.004.557-.002.79v.28h.001v16h2.354c.649 0 1.204-.233 1.665-.694.46-.466.693-1.021.693-1.665h-.005v-6.858c.55.966 1.289 1.685 2.215 2.145.877.417 1.893.625 3.048.625 2.17 0 3.949-.877 5.337-2.631 1.311-1.707 2.003-3.918 2.07-6.625zm-5.807-4.39c.694.97 1.04 2.353 1.04 4.157 0 1.66-.341 2.978-1.04 3.949-.693.971-1.64 1.457-2.839 1.457-1.293 0-2.284-.486-2.978-1.457-.694-.877-1.04-2.195-1.04-3.95 0-1.892.322-3.28.97-4.157.694-.97 1.66-1.456 2.91-1.456 1.293 0 2.284.485 2.977 1.456z"
|
|
32
|
+
}))));
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
export { SvgLogo as default };
|
|
36
|
+
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibG9nby5zdmcuanMiLCJzb3VyY2VzIjpbXSwic291cmNlc0NvbnRlbnQiOltdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7In0=
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import styleInject from '../../../external/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "@-webkit-keyframes vH81in
|
|
3
|
+
var css_248z = "@-webkit-keyframes vH81in{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes vH81in{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}._2CO-wm{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}._2CO-wm>*{width:24px}._3-RII9{display:none}._3-RII9 svg{fill:currentColor}._2OI3Pv{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}._2OI3Pv svg{stroke:currentColor;stroke-linecap:round;stroke-width:2px;-webkit-animation:vH81in 1s cubic-bezier(.46,.17,.58,.87) infinite;animation:vH81in 1s cubic-bezier(.46,.17,.58,.87) infinite}@media (prefers-reduced-motion){._3-RII9{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}._2OI3Pv{display:none}}";
|
|
4
4
|
var styles = {__id:"/home/jenkins/workspace/design-system_main/packages/web-lib/src/components/Spinner/style/index.module.less",__css:css_248z,"Spinner":"_2CO-wm","Spinner--static":"_3-RII9","Spinner--animated":"_2OI3Pv","spin":"vH81in"};
|
|
5
5
|
var stylesheet=css_248z;
|
|
6
6
|
styleInject(css_248z);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import styleInject from '../../../external/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "
|
|
3
|
+
var css_248z = ".khPkeq{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;color:var(--aface);font-family:var(--0e309);font-size:var(--8d63e);font-weight:var(--73984);line-height:var(--d4313);margin:0}._3mi36Z{font-weight:var(--6e979)}._1qPoch{color:var(--937a6)}._3_4tFY{color:var(--fe08e)}._33WHuG{color:var(--32ad9)}._3OF4Qh{color:var(--e0400)}._2RfMiY{font-size:var(--45133)}.gaw4M4{font-size:var(--619ce)}._36gqA-{font-size:var(--9f728)}._1nWKi2{font-size:var(--08192)}._1zStZk{font-size:var(--da41a)}._3Zhulg{font-size:var(--698b6)}";
|
|
4
4
|
var styles = {__id:"/home/jenkins/workspace/design-system_main/packages/web-lib/src/components/Text/style/index.module.less",__css:css_248z,"Text":"khPkeq","Text--strong":"_3mi36Z","Text--accent-normal":"_1qPoch","Text--accent-muted":"_3_4tFY","Text--accent-brand":"_33WHuG","Text--accent-positive":"_3OF4Qh","Text--size-2xs":"_2RfMiY","Text--size-xs":"gaw4M4","Text--size-s":"_36gqA-","Text--size-m":"_1nWKi2","Text--size-l":"_1zStZk","Text--size-xl":"_3Zhulg"};
|
|
5
5
|
var stylesheet=css_248z;
|
|
6
6
|
styleInject(css_248z);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../../external/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "
|
|
4
|
-
var stylesheet="
|
|
3
|
+
var css_248z = "";
|
|
4
|
+
var stylesheet="";
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export { css_248z as default, stylesheet };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import styleInject from '../../../external/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "
|
|
3
|
+
var css_248z = "._3iSZ5y{border-radius:var(--330e4);display:inline-block;font-style:normal;font-weight:var(--73984);margin:0;padding-left:var(--58c1e);padding-right:var(--58c1e)}._1stXqA{font-weight:var(--6e979)}._1E8XoK{background-color:var(--2d51a);color:var(--68bd1)}._1AG38P{background-color:var(--29200);color:var(--c5023)}";
|
|
4
4
|
var styles = {__id:"/home/jenkins/workspace/design-system_main/packages/web-lib/src/components/TextHighlighted/style/index.module.less",__css:css_248z,"TextHighlighted":"_3iSZ5y","TextHighlighted--strong":"_1stXqA","TextHighlighted--highlight-blue":"_1E8XoK","TextHighlighted--highlight-green":"_1AG38P"};
|
|
5
5
|
var stylesheet=css_248z;
|
|
6
6
|
styleInject(css_248z);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../../external/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "
|
|
4
|
-
var stylesheet="
|
|
3
|
+
var css_248z = "";
|
|
4
|
+
var stylesheet="";
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export { css_248z as default, stylesheet };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import styleInject from '../../../external/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "
|
|
3
|
+
var css_248z = "._2iIfiT{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;color:var(--aface);font-family:var(--0e309);font-size:var(--8d63e);font-style:normal;font-weight:var(--73984);line-height:var(--d4313);margin:0}._2qHWNi{font-weight:var(--6e979)}._2XIA2T{color:var(--937a6)}._3ttusQ{color:var(--fe08e)}._2eU8R6{color:var(--32ad9)}._2C_Wto{color:var(--e0400)}";
|
|
4
4
|
var styles = {__id:"/home/jenkins/workspace/design-system_main/packages/web-lib/src/components/TextInline/style/index.module.less",__css:css_248z,"TextInline":"_2iIfiT","TextInline--strong":"_2qHWNi","TextInline--accent-normal":"_2XIA2T","TextInline--accent-muted":"_3ttusQ","TextInline--accent-brand":"_2eU8R6","TextInline--accent-positive":"_2C_Wto"};
|
|
5
5
|
var stylesheet=css_248z;
|
|
6
6
|
styleInject(css_248z);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../../external/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "
|
|
4
|
-
var stylesheet="
|
|
3
|
+
var css_248z = "";
|
|
4
|
+
var stylesheet="";
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export { css_248z as default, stylesheet };
|
|
@@ -2,6 +2,7 @@ export { Avatar } from './Avatar/Avatar';
|
|
|
2
2
|
export { Button } from './Button/Button';
|
|
3
3
|
export { Heading } from './Heading/Heading';
|
|
4
4
|
export { Icon } from './Icon/Icon';
|
|
5
|
+
export { IconButton } from './IconButton/IconButton';
|
|
5
6
|
export { LayoutFlex } from './LayoutFlex/LayoutFlex';
|
|
6
7
|
export { LayoutGrid } from './LayoutGrid/LayoutGrid';
|
|
7
8
|
export { Link } from './Link/Link';
|
|
@@ -10,6 +11,7 @@ export { PanelHeader } from './Panel/private/PanelHeader';
|
|
|
10
11
|
export { PanelBody } from './Panel/private/PanelBody';
|
|
11
12
|
export { PanelSection } from './Panel/private/PanelSection';
|
|
12
13
|
export { PanelFooter } from './Panel/private/PanelFooter';
|
|
14
|
+
export { PreplyLogo } from './PreplyLogo/PreplyLogo';
|
|
13
15
|
export { Text } from './Text/Text';
|
|
14
16
|
export { TextHighlighted } from './TextHighlighted/TextHighlighted';
|
|
15
17
|
export { TextInline } from './TextInline/TextInline';
|
package/dist/components/index.js
CHANGED
|
@@ -2,6 +2,7 @@ export { Avatar } from './Avatar/Avatar.js';
|
|
|
2
2
|
export { Button } from './Button/Button.js';
|
|
3
3
|
export { Heading } from './Heading/Heading.js';
|
|
4
4
|
export { Icon } from './Icon/Icon.js';
|
|
5
|
+
export { IconButton } from './IconButton/IconButton.js';
|
|
5
6
|
export { LayoutFlex } from './LayoutFlex/LayoutFlex.js';
|
|
6
7
|
export { LayoutGrid } from './LayoutGrid/LayoutGrid.js';
|
|
7
8
|
export { Link } from './Link/Link.js';
|
|
@@ -10,7 +11,8 @@ export { PanelHeader } from './Panel/private/PanelHeader.js';
|
|
|
10
11
|
export { PanelBody } from './Panel/private/PanelBody.js';
|
|
11
12
|
export { PanelSection } from './Panel/private/PanelSection.js';
|
|
12
13
|
export { PanelFooter } from './Panel/private/PanelFooter.js';
|
|
14
|
+
export { PreplyLogo } from './PreplyLogo/PreplyLogo.js';
|
|
13
15
|
export { Text } from './Text/Text.js';
|
|
14
16
|
export { TextHighlighted } from './TextHighlighted/TextHighlighted.js';
|
|
15
17
|
export { TextInline } from './TextInline/TextInline.js';
|
|
16
|
-
//# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
18
|
+
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VzIjpbXSwic291cmNlc0NvbnRlbnQiOltdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7Ozs7OyJ9
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import type { ButtonSize, ButtonVariant, Dataset } from '@preply/ds-core';
|
|
2
|
+
import { FC, MouseEvent } from 'react';
|
|
3
|
+
export interface ButtonBaseProps {
|
|
4
|
+
variant?: ButtonVariant;
|
|
5
|
+
size?: ButtonSize;
|
|
6
|
+
fullWidth?: boolean;
|
|
7
|
+
wrap?: boolean;
|
|
8
|
+
url?: string;
|
|
9
|
+
opensInNewTab?: boolean;
|
|
10
|
+
submitsForm?: boolean;
|
|
11
|
+
a11yLabel?: string;
|
|
12
|
+
assistiveText?: string;
|
|
13
|
+
onClick?: (event: MouseEvent) => void;
|
|
14
|
+
disabled?: boolean;
|
|
15
|
+
busy?: boolean;
|
|
16
|
+
dataset?: Dataset;
|
|
17
|
+
isIconButton: boolean;
|
|
18
|
+
}
|
|
19
|
+
export declare const ButtonBase: FC<ButtonBaseProps>;
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
import { BUTTON_VARIANT_DEFAULT, BUTTON_SIZE_DEFAULT } from '@preply/ds-core';
|
|
2
|
+
import { useStyleExtract, safeClassName, localClasses, getDatasetProps, getExternalUrlProps, mapEdgeKeyToStandard } from '@preply/ds-web-core';
|
|
3
|
+
import React__default, { useRef } from 'react';
|
|
4
|
+
import { Spinner } from '../../Spinner/Spinner.js';
|
|
5
|
+
import styles from './style/index.module.less.js';
|
|
6
|
+
|
|
7
|
+
const BUTTON_BASE = 'ButtonBase';
|
|
8
|
+
const renderContent = ({ children, busy }) => {
|
|
9
|
+
const contentClassNames = [...localClasses(styles, BUTTON_BASE, ['content'])];
|
|
10
|
+
const busyClassNames = [...localClasses(styles, BUTTON_BASE, ['busy'])];
|
|
11
|
+
return (React__default.createElement(React__default.Fragment, null,
|
|
12
|
+
React__default.createElement("span", { className: contentClassNames.join(' ') }, children),
|
|
13
|
+
busy && (React__default.createElement("span", { className: busyClassNames.join(' ') },
|
|
14
|
+
React__default.createElement(Spinner, null)))));
|
|
15
|
+
};
|
|
16
|
+
const ButtonBase = ({ variant = BUTTON_VARIANT_DEFAULT, size = BUTTON_SIZE_DEFAULT, fullWidth, wrap, url, opensInNewTab, submitsForm, a11yLabel, assistiveText, onClick, disabled, busy, dataset, isIconButton, children, }) => {
|
|
17
|
+
useStyleExtract(styles);
|
|
18
|
+
const ref = useRef(null);
|
|
19
|
+
const handleClick = (event) => {
|
|
20
|
+
if (disabled || busy) {
|
|
21
|
+
event.preventDefault();
|
|
22
|
+
}
|
|
23
|
+
if (onClick) {
|
|
24
|
+
onClick(event);
|
|
25
|
+
}
|
|
26
|
+
};
|
|
27
|
+
const handleKeyPress = (event) => {
|
|
28
|
+
var _a;
|
|
29
|
+
const key = mapEdgeKeyToStandard(event.key);
|
|
30
|
+
if (key === ' ' || key === 'Enter') {
|
|
31
|
+
event.preventDefault();
|
|
32
|
+
(_a = ref.current) === null || _a === void 0 ? void 0 : _a.click();
|
|
33
|
+
}
|
|
34
|
+
};
|
|
35
|
+
const classNames = [
|
|
36
|
+
safeClassName(styles, BUTTON_BASE),
|
|
37
|
+
...localClasses(styles, BUTTON_BASE, [
|
|
38
|
+
['variant', variant],
|
|
39
|
+
['size', size],
|
|
40
|
+
{ if: !wrap, then: 'no-wrap' },
|
|
41
|
+
{ if: fullWidth, then: 'width-full' },
|
|
42
|
+
{ if: busy, then: 'is-busy' },
|
|
43
|
+
{ if: isIconButton, then: 'is-icon-button' },
|
|
44
|
+
]),
|
|
45
|
+
];
|
|
46
|
+
const title = isIconButton ? assistiveText || a11yLabel : undefined;
|
|
47
|
+
const ariaLabel = !isIconButton ? assistiveText || a11yLabel : undefined;
|
|
48
|
+
const props = {
|
|
49
|
+
...getDatasetProps(dataset),
|
|
50
|
+
className: classNames.join(' '),
|
|
51
|
+
title,
|
|
52
|
+
'aria-label': ariaLabel,
|
|
53
|
+
onClick: handleClick,
|
|
54
|
+
disabled,
|
|
55
|
+
'aria-disabled': disabled || busy ? true : undefined,
|
|
56
|
+
};
|
|
57
|
+
if (url) {
|
|
58
|
+
return (React__default.createElement("a", Object.assign({}, props, getExternalUrlProps(url, opensInNewTab), { ref: ref, role: "button", tabIndex: disabled ? -1 : 0, href: url, onKeyDown: handleKeyPress }), renderContent({ children, busy, isIconButton })));
|
|
59
|
+
}
|
|
60
|
+
return (React__default.createElement("button", Object.assign({}, props, { type: submitsForm ? 'submit' : 'button' }), renderContent({ children, busy, isIconButton })));
|
|
61
|
+
};
|
|
62
|
+
|
|
63
|
+
export { ButtonBase };
|
|
64
|
+
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQnV0dG9uQmFzZS5qcyIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvcHJpdmF0ZS9CdXR0b25CYXNlL0J1dHRvbkJhc2UudHN4Il0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB0eXBlIHsgQnV0dG9uU2l6ZSwgQnV0dG9uVmFyaWFudCwgRGF0YXNldCB9IGZyb20gJ0BwcmVwbHkvZHMtY29yZSc7XG5pbXBvcnQgeyBCVVRUT05fU0laRV9ERUZBVUxULCBCVVRUT05fVkFSSUFOVF9ERUZBVUxUIH0gZnJvbSAnQHByZXBseS9kcy1jb3JlJztcbmltcG9ydCB7XG4gICAgZ2V0RGF0YXNldFByb3BzLFxuICAgIGdldEV4dGVybmFsVXJsUHJvcHMsXG4gICAgbG9jYWxDbGFzc2VzLFxuICAgIG1hcEVkZ2VLZXlUb1N0YW5kYXJkLFxuICAgIHNhZmVDbGFzc05hbWUsXG4gICAgdXNlU3R5bGVFeHRyYWN0LFxufSBmcm9tICdAcHJlcGx5L2RzLXdlYi1jb3JlJztcbmltcG9ydCBSZWFjdCwgeyBGQywgS2V5Ym9hcmRFdmVudCwgTW91c2VFdmVudCwgdXNlUmVmIH0gZnJvbSAncmVhY3QnO1xuXG5pbXBvcnQgeyBTcGlubmVyIH0gZnJvbSAnLi4vLi4vU3Bpbm5lci9TcGlubmVyJztcblxuaW1wb3J0IHN0eWxlcyBmcm9tICcuL3N0eWxlL2luZGV4Lm1vZHVsZS5sZXNzJztcblxuZXhwb3J0IGludGVyZmFjZSBCdXR0b25CYXNlUHJvcHMge1xuICAgIHZhcmlhbnQ/OiBCdXR0b25WYXJpYW50O1xuICAgIHNpemU/OiBCdXR0b25TaXplO1xuICAgIGZ1bGxXaWR0aD86IGJvb2xlYW47XG4gICAgd3JhcD86IGJvb2xlYW47XG4gICAgdXJsPzogc3RyaW5nO1xuICAgIG9wZW5zSW5OZXdUYWI/OiBib29sZWFuO1xuICAgIHN1Ym1pdHNGb3JtPzogYm9vbGVhbjtcbiAgICBhMTF5TGFiZWw/OiBzdHJpbmc7XG4gICAgYXNzaXN0aXZlVGV4dD86IHN0cmluZztcbiAgICBvbkNsaWNrPzogKGV2ZW50OiBNb3VzZUV2ZW50KSA9PiB2b2lkO1xuICAgIGRpc2FibGVkPzogYm9vbGVhbjtcbiAgICBidXN5PzogYm9vbGVhbjtcbiAgICBkYXRhc2V0PzogRGF0YXNldDtcbiAgICBpc0ljb25CdXR0b246IGJvb2xlYW47XG59XG5cbmNvbnN0IEJVVFRPTl9CQVNFID0gJ0J1dHRvbkJhc2UnO1xuXG5jb25zdCByZW5kZXJDb250ZW50OiBGQzxCdXR0b25CYXNlUHJvcHM+ID0gKHsgY2hpbGRyZW4sIGJ1c3kgfSkgPT4ge1xuICAgIGNvbnN0IGNvbnRlbnRDbGFzc05hbWVzID0gWy4uLmxvY2FsQ2xhc3NlcyhzdHlsZXMsIEJVVFRPTl9CQVNFLCBbJ2NvbnRlbnQnXSldO1xuICAgIGNvbnN0IGJ1c3lDbGFzc05hbWVzID0gWy4uLmxvY2FsQ2xhc3NlcyhzdHlsZXMsIEJVVFRPTl9CQVNFLCBbJ2J1c3knXSldO1xuICAgIHJldHVybiAoXG4gICAgICAgIDw+XG4gICAgICAgICAgICA8c3BhbiBjbGFzc05hbWU9e2NvbnRlbnRDbGFzc05hbWVzLmpvaW4oJyAnKX0+e2NoaWxkcmVufTwvc3Bhbj5cbiAgICAgICAgICAgIHtidXN5ICYmIChcbiAgICAgICAgICAgICAgICA8c3BhbiBjbGFzc05hbWU9e2J1c3lDbGFzc05hbWVzLmpvaW4oJyAnKX0+XG4gICAgICAgICAgICAgICAgICAgIDxTcGlubmVyIC8+XG4gICAgICAgICAgICAgICAgPC9zcGFuPlxuICAgICAgICAgICAgKX1cbiAgICAgICAgPC8+XG4gICAgKTtcbn07XG5cbmV4cG9ydCBjb25zdCBCdXR0b25CYXNlOiBGQzxCdXR0b25CYXNlUHJvcHM+ID0gKHtcbiAgICB2YXJpYW50ID0gQlVUVE9OX1ZBUklBTlRfREVGQVVMVCxcbiAgICBzaXplID0gQlVUVE9OX1NJWkVfREVGQVVMVCxcbiAgICBmdWxsV2lkdGgsXG4gICAgd3JhcCxcbiAgICB1cmwsXG4gICAgb3BlbnNJbk5ld1RhYixcbiAgICBzdWJtaXRzRm9ybSxcbiAgICBhMTF5TGFiZWwsXG4gICAgYXNzaXN0aXZlVGV4dCxcbiAgICBvbkNsaWNrLFxuICAgIGRpc2FibGVkLFxuICAgIGJ1c3ksXG4gICAgZGF0YXNldCxcbiAgICBpc0ljb25CdXR0b24sXG4gICAgY2hpbGRyZW4sXG59KSA9PiB7XG4gICAgdXNlU3R5bGVFeHRyYWN0KHN0eWxlcyk7XG5cbiAgICBjb25zdCByZWYgPSB1c2VSZWY8SFRNTEFuY2hvckVsZW1lbnQ+KG51bGwpO1xuXG4gICAgY29uc3QgaGFuZGxlQ2xpY2sgPSAoZXZlbnQ6IE1vdXNlRXZlbnQpID0+IHtcbiAgICAgICAgaWYgKGRpc2FibGVkIHx8IGJ1c3kpIHtcbiAgICAgICAgICAgIGV2ZW50LnByZXZlbnREZWZhdWx0KCk7XG4gICAgICAgIH1cbiAgICAgICAgaWYgKG9uQ2xpY2spIHtcbiAgICAgICAgICAgIG9uQ2xpY2soZXZlbnQpO1xuICAgICAgICB9XG4gICAgfTtcblxuICAgIGNvbnN0IGhhbmRsZUtleVByZXNzID0gKGV2ZW50OiBLZXlib2FyZEV2ZW50KSA9PiB7XG4gICAgICAgIGNvbnN0IGtleSA9IG1hcEVkZ2VLZXlUb1N0YW5kYXJkKGV2ZW50LmtleSk7XG4gICAgICAgIGlmIChrZXkgPT09ICcgJyB8fCBrZXkgPT09ICdFbnRlcicpIHtcbiAgICAgICAgICAgIGV2ZW50LnByZXZlbnREZWZhdWx0KCk7XG4gICAgICAgICAgICByZWYuY3VycmVudD8uY2xpY2soKTtcbiAgICAgICAgfVxuICAgIH07XG5cbiAgICBjb25zdCBjbGFzc05hbWVzID0gW1xuICAgICAgICBzYWZlQ2xhc3NOYW1lKHN0eWxlcywgQlVUVE9OX0JBU0UpLFxuICAgICAgICAuLi5sb2NhbENsYXNzZXMoc3R5bGVzLCBCVVRUT05fQkFTRSwgW1xuICAgICAgICAgICAgWyd2YXJpYW50JywgdmFyaWFudF0sXG4gICAgICAgICAgICBbJ3NpemUnLCBzaXplXSxcbiAgICAgICAgICAgIHsgaWY6ICF3cmFwLCB0aGVuOiAnbm8td3JhcCcgfSxcbiAgICAgICAgICAgIHsgaWY6IGZ1bGxXaWR0aCwgdGhlbjogJ3dpZHRoLWZ1bGwnIH0sXG4gICAgICAgICAgICB7IGlmOiBidXN5LCB0aGVuOiAnaXMtYnVzeScgfSxcbiAgICAgICAgICAgIHsgaWY6IGlzSWNvbkJ1dHRvbiwgdGhlbjogJ2lzLWljb24tYnV0dG9uJyB9LFxuICAgICAgICBdKSxcbiAgICBdO1xuXG4gICAgY29uc3QgdGl0bGUgPSBpc0ljb25CdXR0b24gPyBhc3Npc3RpdmVUZXh0IHx8IGExMXlMYWJlbCA6IHVuZGVmaW5lZDtcbiAgICBjb25zdCBhcmlhTGFiZWwgPSAhaXNJY29uQnV0dG9uID8gYXNzaXN0aXZlVGV4dCB8fCBhMTF5TGFiZWwgOiB1bmRlZmluZWQ7XG5cbiAgICBjb25zdCBwcm9wcyA9IHtcbiAgICAgICAgLi4uZ2V0RGF0YXNldFByb3BzKGRhdGFzZXQpLFxuICAgICAgICBjbGFzc05hbWU6IGNsYXNzTmFtZXMuam9pbignICcpLFxuICAgICAgICB0aXRsZSxcbiAgICAgICAgJ2FyaWEtbGFiZWwnOiBhcmlhTGFiZWwsXG4gICAgICAgIG9uQ2xpY2s6IGhhbmRsZUNsaWNrLFxuICAgICAgICBkaXNhYmxlZCxcbiAgICAgICAgJ2FyaWEtZGlzYWJsZWQnOiBkaXNhYmxlZCB8fCBidXN5ID8gdHJ1ZSA6IHVuZGVmaW5lZCxcbiAgICB9O1xuXG4gICAgaWYgKHVybCkge1xuICAgICAgICByZXR1cm4gKFxuICAgICAgICAgICAgPGFcbiAgICAgICAgICAgICAgICB7Li4ucHJvcHN9XG4gICAgICAgICAgICAgICAgey4uLmdldEV4dGVybmFsVXJsUHJvcHModXJsLCBvcGVuc0luTmV3VGFiKX1cbiAgICAgICAgICAgICAgICByZWY9e3JlZn1cbiAgICAgICAgICAgICAgICByb2xlPVwiYnV0dG9uXCJcbiAgICAgICAgICAgICAgICB0YWJJbmRleD17ZGlzYWJsZWQgPyAtMSA6IDB9XG4gICAgICAgICAgICAgICAgaHJlZj17dXJsfVxuICAgICAgICAgICAgICAgIG9uS2V5RG93bj17aGFuZGxlS2V5UHJlc3N9XG4gICAgICAgICAgICA+XG4gICAgICAgICAgICAgICAge3JlbmRlckNvbnRlbnQoeyBjaGlsZHJlbiwgYnVzeSwgaXNJY29uQnV0dG9uIH0pfVxuICAgICAgICAgICAgPC9hPlxuICAgICAgICApO1xuICAgIH1cblxuICAgIHJldHVybiAoXG4gICAgICAgIDxidXR0b24gey4uLnByb3BzfSB0eXBlPXtzdWJtaXRzRm9ybSA/ICdzdWJtaXQnIDogJ2J1dHRvbid9PlxuICAgICAgICAgICAge3JlbmRlckNvbnRlbnQoeyBjaGlsZHJlbiwgYnVzeSwgaXNJY29uQnV0dG9uIH0pfVxuICAgICAgICA8L2J1dHRvbj5cbiAgICApO1xufTtcbiJdLCJuYW1lcyI6WyJSZWFjdCJdLCJtYXBwaW5ncyI6Ijs7Ozs7O0FBaUNBLE1BQU0sV0FBVyxHQUFHLFlBQVksQ0FBQztBQUVqQyxNQUFNLGFBQWEsR0FBd0IsQ0FBQyxFQUFFLFFBQVEsRUFBRSxJQUFJLEVBQUU7SUFDMUQsTUFBTSxpQkFBaUIsR0FBRyxDQUFDLEdBQUcsWUFBWSxDQUFDLE1BQU0sRUFBRSxXQUFXLEVBQUUsQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDLENBQUM7SUFDOUUsTUFBTSxjQUFjLEdBQUcsQ0FBQyxHQUFHLFlBQVksQ0FBQyxNQUFNLEVBQUUsV0FBVyxFQUFFLENBQUMsTUFBTSxDQUFDLENBQUMsQ0FBQyxDQUFDO0lBQ3hFLFFBQ0lBO1FBQ0lBLHVDQUFNLFNBQVMsRUFBRSxpQkFBaUIsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLElBQUcsUUFBUSxDQUFRO1FBQzlELElBQUksS0FDREEsdUNBQU0sU0FBUyxFQUFFLGNBQWMsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDO1lBQ3JDQSw2QkFBQyxPQUFPLE9BQUcsQ0FDUixDQUNWLENBQ0YsRUFDTDtBQUNOLENBQUMsQ0FBQztNQUVXLFVBQVUsR0FBd0IsQ0FBQyxFQUM1QyxPQUFPLEdBQUcsc0JBQXNCLEVBQ2hDLElBQUksR0FBRyxtQkFBbUIsRUFDMUIsU0FBUyxFQUNULElBQUksRUFDSixHQUFHLEVBQ0gsYUFBYSxFQUNiLFdBQVcsRUFDWCxTQUFTLEVBQ1QsYUFBYSxFQUNiLE9BQU8sRUFDUCxRQUFRLEVBQ1IsSUFBSSxFQUNKLE9BQU8sRUFDUCxZQUFZLEVBQ1osUUFBUSxHQUNYO0lBQ0csZUFBZSxDQUFDLE1BQU0sQ0FBQyxDQUFDO0lBRXhCLE1BQU0sR0FBRyxHQUFHLE1BQU0sQ0FBb0IsSUFBSSxDQUFDLENBQUM7SUFFNUMsTUFBTSxXQUFXLEdBQUcsQ0FBQyxLQUFpQjtRQUNsQyxJQUFJLFFBQVEsSUFBSSxJQUFJLEVBQUU7WUFDbEIsS0FBSyxDQUFDLGNBQWMsRUFBRSxDQUFDO1NBQzFCO1FBQ0QsSUFBSSxPQUFPLEVBQUU7WUFDVCxPQUFPLENBQUMsS0FBSyxDQUFDLENBQUM7U0FDbEI7S0FDSixDQUFDO0lBRUYsTUFBTSxjQUFjLEdBQUcsQ0FBQyxLQUFvQjs7UUFDeEMsTUFBTSxHQUFHLEdBQUcsb0JBQW9CLENBQUMsS0FBSyxDQUFDLEdBQUcsQ0FBQyxDQUFDO1FBQzVDLElBQUksR0FBRyxLQUFLLEdBQUcsSUFBSSxHQUFHLEtBQUssT0FBTyxFQUFFO1lBQ2hDLEtBQUssQ0FBQyxjQUFjLEVBQUUsQ0FBQztZQUN2QixNQUFBLEdBQUcsQ0FBQyxPQUFPLDBDQUFFLEtBQUssR0FBRztTQUN4QjtLQUNKLENBQUM7SUFFRixNQUFNLFVBQVUsR0FBRztRQUNmLGFBQWEsQ0FBQyxNQUFNLEVBQUUsV0FBVyxDQUFDO1FBQ2xDLEdBQUcsWUFBWSxDQUFDLE1BQU0sRUFBRSxXQUFXLEVBQUU7WUFDakMsQ0FBQyxTQUFTLEVBQUUsT0FBTyxDQUFDO1lBQ3BCLENBQUMsTUFBTSxFQUFFLElBQUksQ0FBQztZQUNkLEVBQUUsRUFBRSxFQUFFLENBQUMsSUFBSSxFQUFFLElBQUksRUFBRSxTQUFTLEVBQUU7WUFDOUIsRUFBRSxFQUFFLEVBQUUsU0FBUyxFQUFFLElBQUksRUFBRSxZQUFZLEVBQUU7WUFDckMsRUFBRSxFQUFFLEVBQUUsSUFBSSxFQUFFLElBQUksRUFBRSxTQUFTLEVBQUU7WUFDN0IsRUFBRSxFQUFFLEVBQUUsWUFBWSxFQUFFLElBQUksRUFBRSxnQkFBZ0IsRUFBRTtTQUMvQyxDQUFDO0tBQ0wsQ0FBQztJQUVGLE1BQU0sS0FBSyxHQUFHLFlBQVksR0FBRyxhQUFhLElBQUksU0FBUyxHQUFHLFNBQVMsQ0FBQztJQUNwRSxNQUFNLFNBQVMsR0FBRyxDQUFDLFlBQVksR0FBRyxhQUFhLElBQUksU0FBUyxHQUFHLFNBQVMsQ0FBQztJQUV6RSxNQUFNLEtBQUssR0FBRztRQUNWLEdBQUcsZUFBZSxDQUFDLE9BQU8sQ0FBQztRQUMzQixTQUFTLEVBQUUsVUFBVSxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUM7UUFDL0IsS0FBSztRQUNMLFlBQVksRUFBRSxTQUFTO1FBQ3ZCLE9BQU8sRUFBRSxXQUFXO1FBQ3BCLFFBQVE7UUFDUixlQUFlLEVBQUUsUUFBUSxJQUFJLElBQUksR0FBRyxJQUFJLEdBQUcsU0FBUztLQUN2RCxDQUFDO0lBRUYsSUFBSSxHQUFHLEVBQUU7UUFDTCxRQUNJQSxvREFDUSxLQUFLLEVBQ0wsbUJBQW1CLENBQUMsR0FBRyxFQUFFLGFBQWEsQ0FBQyxJQUMzQyxHQUFHLEVBQUUsR0FBRyxFQUNSLElBQUksRUFBQyxRQUFRLEVBQ2IsUUFBUSxFQUFFLFFBQVEsR0FBRyxDQUFDLENBQUMsR0FBRyxDQUFDLEVBQzNCLElBQUksRUFBRSxHQUFHLEVBQ1QsU0FBUyxFQUFFLGNBQWMsS0FFeEIsYUFBYSxDQUFDLEVBQUUsUUFBUSxFQUFFLElBQUksRUFBRSxZQUFZLEVBQUUsQ0FBQyxDQUNoRCxFQUNOO0tBQ0w7SUFFRCxRQUNJQSx5REFBWSxLQUFLLElBQUUsSUFBSSxFQUFFLFdBQVcsR0FBRyxRQUFRLEdBQUcsUUFBUSxLQUNyRCxhQUFhLENBQUMsRUFBRSxRQUFRLEVBQUUsSUFBSSxFQUFFLFlBQVksRUFBRSxDQUFDLENBQzNDLEVBQ1g7QUFDTjs7OzsifQ==
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
@import '@preply/ds-web-core/dist/typography/style/mixins.less';
|
|
2
|
+
@import '@preply/ds-web-core/dist/actions/style/action.mixins.less';
|
|
2
3
|
@import './mixins.less';
|
|
3
4
|
|
|
4
|
-
.
|
|
5
|
+
.ButtonBase {
|
|
5
6
|
.type-base();
|
|
6
7
|
.button-base();
|
|
7
|
-
.
|
|
8
|
-
.
|
|
8
|
+
.action-sizes();
|
|
9
|
+
.action-variants();
|
|
9
10
|
|
|
10
11
|
&--width-full {
|
|
11
12
|
width: 100%;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import styleInject from '../../../../external/style-inject/dist/style-inject.es.js';
|
|
2
|
+
|
|
3
|
+
var css_248z = "._31l8bu{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;background-color:transparent;border:1px solid transparent;border-radius:var(--8d513);color:var(--aface);cursor:pointer;font-family:var(--0e309);font-size:var(--8d63e);font-weight:var(--6e979);line-height:var(--d4313);position:relative;text-decoration:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}._1Mv9ye,._31l8bu{-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;justify-content:center}._1Mv9ye{grid-gap:var(--0aee7);gap:var(--0aee7);vertical-align:baseline}._3B1mWU ._1Mv9ye svg{height:var(--f02c4);width:var(--f02c4)}._3B1mWU ._1Mv9ye svg path{fill:currentColor}.dDiXSd{-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;height:100%;justify-content:center;left:0;position:absolute;top:0;width:100%}._31l8bu[disabled]{background-color:var(--04dae);border-color:var(--e0528);color:var(--a8b89);cursor:default;pointer-events:none}._31l8bu._1FbZSm{outline-color:var(--603ec);outline-offset:var(--c0b12);outline-style:solid;outline-width:var(--99d31)}._31l8bu:focus-visible{outline-color:var(--603ec);outline-offset:var(--c0b12);outline-style:solid;outline-width:var(--99d31)}._1S4uD4{cursor:default;pointer-events:none}._1S4uD4 ._1Mv9ye{visibility:hidden}._2UUzTb{font-size:var(--357dd);min-height:var(--50cc6);padding:var(--fec17) var(--29b03)}._3B1mWU._2UUzTb{height:var(--50cc6);padding:0;width:var(--50cc6)}.f5AXpU{font-size:var(--b47a6);min-height:var(--2f2e0);padding:var(--9a573) var(--65766)}._3B1mWU.f5AXpU{height:var(--2f2e0);padding:0;width:var(--2f2e0)}._1jI8S4{font-size:var(--89a35);min-height:var(--bcfcb);padding:var(--3b902) var(--0f2d7)}._3B1mWU._1jI8S4{height:var(--bcfcb);padding:0;width:var(--bcfcb)}._3MD2lP{font-size:var(--a899b);min-height:var(--26156);padding:var(--303c6) var(--b1c76)}._3B1mWU._3MD2lP{height:var(--26156);padding:0;width:var(--26156)}._33xIkb{font-size:var(--f7be0);min-height:var(--d6bfc);padding:var(--da188) var(--88eef)}._3B1mWU._33xIkb{height:var(--d6bfc);padding:0;width:var(--d6bfc)}._hzLAU{background-color:var(--508b3);border-color:var(--44bfe);color:var(--d2baa)}._hzLAU:hover{background-color:var(--902b5);color:var(--df615)}._hzLAU:active{background-color:var(--c1c1c);color:var(--15cee)}.wj4gqc{background-color:var(--e5616);border-color:var(--ab736);color:var(--1614c)}.wj4gqc:hover{background-color:var(--0d124);color:var(--0d6ae)}.wj4gqc:active{background-color:var(--33b43);color:var(--22cb4)}._3xhNOP{background-color:var(--28f3c);border-color:var(--10556);color:var(--93754)}._3xhNOP:hover{background-color:var(--ec17b);color:var(--175a7)}._3xhNOP:active{background-color:var(--b0bf5);color:var(--8274e)}._3A21nR{background-color:var(--e4644);border-color:var(--0e9e0);color:var(--9cf6e)}._3A21nR:hover{background-color:var(--afc17);color:var(--6609c)}._3A21nR:active{background-color:var(--2ee55);color:var(--e9f22)}._2ssLbd{background-color:var(--bbb35);border-color:var(--0cad8);color:var(--122a9)}._2ssLbd:hover{background-color:var(--df2ac);color:var(--1265d)}._2ssLbd:active{background-color:var(--435fa);color:var(--a4162)}._2Uo_yl{background-color:var(--118bd);border-color:var(--ab597);color:var(--efde5)}._2Uo_yl:hover{background-color:var(--e0b0f);color:var(--6f5d5)}._2Uo_yl:active{background-color:var(--a5eaa);color:var(--6b4e9)}.WxNTfY{width:100%}._1rbWLs{min-width:-webkit-max-content;min-width:-moz-max-content;min-width:max-content}";
|
|
4
|
+
var styles = {__id:"/home/jenkins/workspace/design-system_main/packages/web-lib/src/components/private/ButtonBase/style/index.module.less",__css:css_248z,"ButtonBase":"_31l8bu","ButtonBase--content":"_1Mv9ye","ButtonBase--is-icon-button":"_3B1mWU","ButtonBase--busy":"dDiXSd","focus-visible":"_1FbZSm","ButtonBase--is-busy":"_1S4uD4","ButtonBase--size-xs":"_2UUzTb","ButtonBase--size-s":"f5AXpU","ButtonBase--size-m":"_1jI8S4","ButtonBase--size-l":"_3MD2lP","ButtonBase--size-xl":"_33xIkb","ButtonBase--variant-primary":"_hzLAU","ButtonBase--variant-secondary":"wj4gqc","ButtonBase--variant-tertiary":"_3xhNOP","ButtonBase--variant-quaternary":"_3A21nR","ButtonBase--variant-plain":"_2ssLbd","ButtonBase--variant-dangerous":"_2Uo_yl","ButtonBase--width-full":"WxNTfY","ButtonBase--no-wrap":"_1rbWLs"};
|
|
5
|
+
var stylesheet=css_248z;
|
|
6
|
+
styleInject(css_248z);
|
|
7
|
+
|
|
8
|
+
export { styles as default, stylesheet };
|
|
9
|
+
|
|
@@ -27,6 +27,15 @@
|
|
|
27
27
|
vertical-align: baseline;
|
|
28
28
|
}
|
|
29
29
|
|
|
30
|
+
&--is-icon-button &--content svg {
|
|
31
|
+
width: @root-size-300;
|
|
32
|
+
height: @root-size-300;
|
|
33
|
+
|
|
34
|
+
path {
|
|
35
|
+
fill: currentColor;
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
|
|
30
39
|
&--busy {
|
|
31
40
|
position: absolute;
|
|
32
41
|
top: 0;
|
|
@@ -56,44 +65,9 @@
|
|
|
56
65
|
&--is-busy {
|
|
57
66
|
cursor: default;
|
|
58
67
|
pointer-events: none;
|
|
59
|
-
|
|
60
|
-
.Button--content {
|
|
61
|
-
visibility: hidden;
|
|
62
|
-
}
|
|
63
68
|
}
|
|
64
|
-
}
|
|
65
69
|
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
@token: 'size-@{value}';
|
|
70
|
-
.min-height('action', @token);
|
|
71
|
-
.verticalAndHorizontalPadding('action', @token);
|
|
72
|
-
.font-size('action', @token);
|
|
73
|
-
}
|
|
74
|
-
});
|
|
75
|
-
}
|
|
76
|
-
|
|
77
|
-
.button-variants() {
|
|
78
|
-
each(@BUTTON_VARIANT_OPTIONS, #(@variant) {
|
|
79
|
-
&--variant-@{variant} {
|
|
80
|
-
@token: 'variant-@{variant}';
|
|
81
|
-
|
|
82
|
-
.color('action', @token);
|
|
83
|
-
.bg-color('action', @token);
|
|
84
|
-
.border-color('action', @token);
|
|
85
|
-
|
|
86
|
-
&:hover {
|
|
87
|
-
@token: 'variant-@{variant}-hover';
|
|
88
|
-
.color('action', @token);
|
|
89
|
-
.bg-color('action', @token);
|
|
90
|
-
}
|
|
91
|
-
|
|
92
|
-
&:active {
|
|
93
|
-
@token: 'variant-@{variant}-active';
|
|
94
|
-
.color('action', @token);
|
|
95
|
-
.bg-color('action', @token);
|
|
96
|
-
}
|
|
97
|
-
}
|
|
98
|
-
});
|
|
70
|
+
&--is-busy &--content {
|
|
71
|
+
visibility: hidden;
|
|
72
|
+
}
|
|
99
73
|
}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import styleInject from '../../../../external/style-inject/dist/style-inject.es.js';
|
|
2
|
+
|
|
3
|
+
var css_248z = "";
|
|
4
|
+
var stylesheet="";
|
|
5
|
+
styleInject(css_248z);
|
|
6
|
+
|
|
7
|
+
export { css_248z as default, stylesheet };
|
|
8
|
+
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjpudWxsLCJzb3VyY2VzIjpbbnVsbF0sInNvdXJjZXNDb250ZW50IjpbbnVsbF0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLHdCQUF3QiwyREFBK0Q7QUFDdkY7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBOyJ9
|
package/dist/index.js
CHANGED
|
@@ -3,6 +3,7 @@ export { Avatar } from './components/Avatar/Avatar.js';
|
|
|
3
3
|
export { Button } from './components/Button/Button.js';
|
|
4
4
|
export { Heading } from './components/Heading/Heading.js';
|
|
5
5
|
export { Icon } from './components/Icon/Icon.js';
|
|
6
|
+
export { IconButton } from './components/IconButton/IconButton.js';
|
|
6
7
|
export { LayoutFlex } from './components/LayoutFlex/LayoutFlex.js';
|
|
7
8
|
export { LayoutGrid } from './components/LayoutGrid/LayoutGrid.js';
|
|
8
9
|
export { Link } from './components/Link/Link.js';
|
|
@@ -11,7 +12,8 @@ export { PanelHeader } from './components/Panel/private/PanelHeader.js';
|
|
|
11
12
|
export { PanelBody } from './components/Panel/private/PanelBody.js';
|
|
12
13
|
export { PanelSection } from './components/Panel/private/PanelSection.js';
|
|
13
14
|
export { PanelFooter } from './components/Panel/private/PanelFooter.js';
|
|
15
|
+
export { PreplyLogo } from './components/PreplyLogo/PreplyLogo.js';
|
|
14
16
|
export { Text } from './components/Text/Text.js';
|
|
15
17
|
export { TextHighlighted } from './components/TextHighlighted/TextHighlighted.js';
|
|
16
18
|
export { TextInline } from './components/TextInline/TextInline.js';
|
|
17
|
-
//# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
19
|
+
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VzIjpbXSwic291cmNlc0NvbnRlbnQiOltdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7Ozs7OzsifQ==
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@preply/ds-web-lib",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.27.0",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -19,25 +19,25 @@
|
|
|
19
19
|
"dev": "run build:rollup -w"
|
|
20
20
|
},
|
|
21
21
|
"dependencies": {
|
|
22
|
-
"@preply/ds-core": "0.
|
|
23
|
-
"@preply/ds-media-icons": "0.
|
|
24
|
-
"@preply/ds-web-core": "0.
|
|
25
|
-
"@preply/ds-web-root": "0.
|
|
22
|
+
"@preply/ds-core": "0.27.0",
|
|
23
|
+
"@preply/ds-media-icons": "0.27.0",
|
|
24
|
+
"@preply/ds-web-core": "0.27.0",
|
|
25
|
+
"@preply/ds-web-root": "0.27.0"
|
|
26
26
|
},
|
|
27
27
|
"peerDependencies": {
|
|
28
|
-
"@preply/ds-core": "0.
|
|
29
|
-
"@preply/ds-media-icons": "0.
|
|
30
|
-
"@preply/ds-web-core": "0.
|
|
31
|
-
"@preply/ds-web-root": "0.
|
|
28
|
+
"@preply/ds-core": "0.27.0",
|
|
29
|
+
"@preply/ds-media-icons": "0.27.0",
|
|
30
|
+
"@preply/ds-web-core": "0.27.0",
|
|
31
|
+
"@preply/ds-web-root": "0.27.0",
|
|
32
32
|
"react": "^16.8.3",
|
|
33
33
|
"react-dom": "^16.8.3"
|
|
34
34
|
},
|
|
35
35
|
"devDependencies": {
|
|
36
|
-
"@preply/ds-docs-toolkit": "0.
|
|
37
|
-
"@preply/ds-theme-base-ui": "0.
|
|
36
|
+
"@preply/ds-docs-toolkit": "0.27.0",
|
|
37
|
+
"@preply/ds-theme-base-ui": "0.27.0",
|
|
38
38
|
"@storybook/addon-docs": "6.4.18",
|
|
39
39
|
"@storybook/react": "6.4.18",
|
|
40
40
|
"@testing-library/react": "11.2.7"
|
|
41
41
|
},
|
|
42
|
-
"gitHead": "
|
|
42
|
+
"gitHead": "19302b48bbfd60f068d35f6e98159c4f1a762176"
|
|
43
43
|
}
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import styleInject from '../../../external/style-inject/dist/style-inject.es.js';
|
|
2
|
-
|
|
3
|
-
var css_248z = "/* AUTO GENERATED @Wed Apr 13 2022 17:23:23 GMT+0000 (Coordinated Universal Time) */\n/* AUTO GENERATED @Wed Apr 13 2022 17:23:23 GMT+0000 (Coordinated Universal Time) */\n._2K2A6a {\n font-family: var(--0e309);\n font-size: var(--8d63e);\n line-height: var(--d4313);\n color: var(--aface);\n -webkit-font-smoothing: antialiased;\n text-rendering: optimizeLegibility;\n position: relative;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n font-weight: var(--6e979);\n text-decoration: none;\n background-color: transparent;\n border-radius: var(--8d513);\n border-width: 1px;\n border-style: solid;\n border-color: transparent;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n cursor: pointer;\n}\n._1Wa9oz {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n grid-gap: var(--0aee7);\n gap: var(--0aee7);\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n vertical-align: baseline;\n}\n._15fNhn {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n}\n._2K2A6a[disabled] {\n cursor: default;\n pointer-events: none;\n color: var(--a8b89);\n background-color: var(--04dae);\n border-color: var(--e0528);\n}\n._2K2A6a._2l4V5u {\n outline-style: solid;\n outline-color: var(--603ec);\n outline-width: var(--99d31);\n outline-offset: var(--c0b12);\n}\n._2K2A6a:focus-visible {\n outline-style: solid;\n outline-color: var(--603ec);\n outline-width: var(--99d31);\n outline-offset: var(--c0b12);\n}\n._2vrhF4 {\n cursor: default;\n pointer-events: none;\n}\n._2vrhF4 ._1Wa9oz {\n visibility: hidden;\n}\n._2cFsf0 {\n min-height: var(--50cc6);\n padding: var(--fec17) var(--29b03);\n font-size: var(--357dd);\n}\n.sMUHXO {\n min-height: var(--2f2e0);\n padding: var(--9a573) var(--65766);\n font-size: var(--b47a6);\n}\n._25alve {\n min-height: var(--bcfcb);\n padding: var(--3b902) var(--0f2d7);\n font-size: var(--89a35);\n}\n._3SuAaY {\n min-height: var(--26156);\n padding: var(--303c6) var(--b1c76);\n font-size: var(--a899b);\n}\n._2-lhss {\n min-height: var(--d6bfc);\n padding: var(--da188) var(--88eef);\n font-size: var(--f7be0);\n}\n._2oPEsT {\n color: var(--d2baa);\n background-color: var(--508b3);\n border-color: var(--44bfe);\n}\n._2oPEsT:hover {\n color: var(--df615);\n background-color: var(--902b5);\n}\n._2oPEsT:active {\n color: var(--15cee);\n background-color: var(--c1c1c);\n}\n.M4_8bJ {\n color: var(--1614c);\n background-color: var(--e5616);\n border-color: var(--ab736);\n}\n.M4_8bJ:hover {\n color: var(--0d6ae);\n background-color: var(--0d124);\n}\n.M4_8bJ:active {\n color: var(--22cb4);\n background-color: var(--33b43);\n}\n._3pHOqs {\n color: var(--93754);\n background-color: var(--28f3c);\n border-color: var(--10556);\n}\n._3pHOqs:hover {\n color: var(--175a7);\n background-color: var(--ec17b);\n}\n._3pHOqs:active {\n color: var(--8274e);\n background-color: var(--b0bf5);\n}\n._2wKHX3 {\n color: var(--9cf6e);\n background-color: var(--e4644);\n border-color: var(--0e9e0);\n}\n._2wKHX3:hover {\n color: var(--6609c);\n background-color: var(--afc17);\n}\n._2wKHX3:active {\n color: var(--e9f22);\n background-color: var(--2ee55);\n}\n._2MKEet {\n color: var(--122a9);\n background-color: var(--bbb35);\n border-color: var(--0cad8);\n}\n._2MKEet:hover {\n color: var(--1265d);\n background-color: var(--df2ac);\n}\n._2MKEet:active {\n color: var(--a4162);\n background-color: var(--435fa);\n}\n._3efdqm {\n color: var(--efde5);\n background-color: var(--118bd);\n border-color: var(--ab597);\n}\n._3efdqm:hover {\n color: var(--6f5d5);\n background-color: var(--e0b0f);\n}\n._3efdqm:active {\n color: var(--6b4e9);\n background-color: var(--a5eaa);\n}\n._31304r {\n width: 100%;\n}\n._18Yfzb {\n min-width: -webkit-max-content;\n min-width: -moz-max-content;\n min-width: max-content;\n}\n";
|
|
4
|
-
var styles = {__id:"/home/jenkins/workspace/design-system_main/packages/web-lib/src/components/Button/style/index.module.less",__css:css_248z,"Button":"_2K2A6a","Button--content":"_1Wa9oz","Button--busy":"_15fNhn","focus-visible":"_2l4V5u","Button--is-busy":"_2vrhF4","Button--size-xs":"_2cFsf0","Button--size-s":"sMUHXO","Button--size-m":"_25alve","Button--size-l":"_3SuAaY","Button--size-xl":"_2-lhss","Button--variant-primary":"_2oPEsT","Button--variant-secondary":"M4_8bJ","Button--variant-tertiary":"_3pHOqs","Button--variant-quaternary":"_2wKHX3","Button--variant-plain":"_2MKEet","Button--variant-dangerous":"_3efdqm","Button--width-full":"_31304r","Button--no-wrap":"_18Yfzb"};
|
|
5
|
-
var stylesheet=css_248z;
|
|
6
|
-
styleInject(css_248z);
|
|
7
|
-
|
|
8
|
-
export { styles as default, stylesheet };
|
|
9
|
-
|