@mrshmllw/smores-react 3.1.11 → 3.1.13
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/Button/Button.js +1 -1
- package/dist/Button/Button.js.map +1 -1
- package/dist/Button/LegacyButton.d.ts +15 -0
- package/dist/Button/LegacyButton.js +50 -0
- package/dist/Button/LegacyButton.js.map +1 -0
- package/dist/ConfirmationRadioButtons/Confirmation.d.ts +17 -0
- package/dist/ConfirmationRadioButtons/Confirmation.js +100 -0
- package/dist/ConfirmationRadioButtons/Confirmation.js.map +1 -0
- package/dist/ConfirmationRadioButtons/Confirmation.stories.d.ts +21 -0
- package/dist/ConfirmationRadioButtons/Confirmation.stories.js +76 -0
- package/dist/ConfirmationRadioButtons/Confirmation.stories.js.map +1 -0
- package/dist/ConfirmationRadioButtons/Container.d.ts +2 -0
- package/dist/ConfirmationRadioButtons/Container.js +8 -0
- package/dist/ConfirmationRadioButtons/Container.js.map +1 -0
- package/dist/ConfirmationRadioButtons/RadioButtonStyled.d.ts +17 -0
- package/dist/ConfirmationRadioButtons/RadioButtonStyled.js +41 -0
- package/dist/ConfirmationRadioButtons/RadioButtonStyled.js.map +1 -0
- package/dist/ConfirmationRadioButtons/__tests__/Confirmation.d.ts +1 -0
- package/dist/ConfirmationRadioButtons/__tests__/Confirmation.js +8 -0
- package/dist/ConfirmationRadioButtons/__tests__/Confirmation.js.map +1 -0
- package/dist/ConfirmationRadioButtons/index.d.ts +1 -0
- package/dist/ConfirmationRadioButtons/index.js +2 -0
- package/dist/ConfirmationRadioButtons/index.js.map +1 -0
- package/dist/Message/Message.d.ts +21 -0
- package/dist/Message/Message.js +45 -0
- package/dist/Message/Message.js.map +1 -0
- package/dist/Message/Message.stories.d.ts +13 -0
- package/dist/Message/Message.stories.js +38 -0
- package/dist/Message/Message.stories.js.map +1 -0
- package/dist/Message/__tests__/Message.d.ts +1 -0
- package/dist/Message/__tests__/Message.js +26 -0
- package/dist/Message/__tests__/Message.js.map +1 -0
- package/dist/Message/index.d.ts +1 -0
- package/dist/Message/index.js +2 -0
- package/dist/Message/index.js.map +1 -0
- package/dist/RadioButton/Container.d.ts +2 -0
- package/dist/RadioButton/Container.js +9 -0
- package/dist/RadioButton/Container.js.map +1 -0
- package/dist/RadioButton/RadioButton.d.ts +10 -0
- package/dist/RadioButton/RadioButton.js +68 -0
- package/dist/RadioButton/RadioButton.js.map +1 -0
- package/dist/RadioButton/RadioButton.stories.d.ts +15 -0
- package/dist/RadioButton/RadioButton.stories.js +29 -0
- package/dist/RadioButton/RadioButton.stories.js.map +1 -0
- package/dist/RadioButton/__tests__/RadioButton.d.ts +1 -0
- package/dist/RadioButton/__tests__/RadioButton.js +13 -0
- package/dist/RadioButton/__tests__/RadioButton.js.map +1 -0
- package/dist/RadioButton/index.d.ts +1 -0
- package/dist/RadioButton/index.js +2 -0
- package/dist/RadioButton/index.js.map +1 -0
- package/dist/Table/storyUtils.js +1 -1
- package/dist/Table/storyUtils.js.map +1 -1
- package/dist/Tooltip/Tooltip.d.ts +1 -1
- package/dist/Tooltip/Tooltip.js +6 -6
- package/dist/Tooltip/Tooltip.js.map +1 -1
- package/package.json +1 -1
package/dist/Button/Button.js
CHANGED
@@ -7,7 +7,7 @@ import { theme } from '../theme';
|
|
7
7
|
import { focusOutlineStyle } from '../utils/focusOutline';
|
8
8
|
export const Button = forwardRef((props, ref) => {
|
9
9
|
const { children, id, className = '', disabled = false, handleClick, loading = false, primary = false, secondary = false, fallbackStyle = false, textBtn = false, smallButton = false, icon = '', trailingIcon = false, forcedWidth = '', form, type, ...otherProps } = props;
|
10
|
-
return (React.createElement(Container, { as: "button", id: id, className: className, disabled: disabled, onClick: handleClick, "$loading": loading, primary: primary, secondary: secondary, fallbackStyle: fallbackStyle, textBtn: textBtn, smallButton: smallButton, icon: icon, trailingIcon: trailingIcon, forcedWidth: forcedWidth, ...(form ? { form } : {}), type: type, ...otherProps, ref: ref },
|
10
|
+
return (React.createElement(Container, { as: "button", id: id, className: className, disabled: disabled || loading, onClick: handleClick, "$loading": loading, primary: primary, secondary: secondary, fallbackStyle: fallbackStyle, textBtn: textBtn, smallButton: smallButton, icon: icon, trailingIcon: trailingIcon, forcedWidth: forcedWidth, ...(form ? { form } : {}), type: type, ...otherProps, ref: ref },
|
11
11
|
loading && (React.createElement(LoaderContainer, null,
|
12
12
|
React.createElement(Loader, { color: 'liquorice', height: "16" }))),
|
13
13
|
React.createElement(ContentContainer, { icon: icon, "$loading": loading },
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../src/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAuC,UAAU,EAAE,MAAM,OAAO,CAAA;AAC9E,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAE/C,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAC5B,OAAO,EAAE,IAAI,IAAI,aAAa,EAAE,MAAM,SAAS,CAAA;AAC/C,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAClC,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAChC,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAA;AAyBzD,MAAM,CAAC,MAAM,MAAM,GAAoB,UAAU,CAG/C,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACf,MAAM,EACJ,QAAQ,EACR,EAAE,EACF,SAAS,GAAG,EAAE,EACd,QAAQ,GAAG,KAAK,EAChB,WAAW,EACX,OAAO,GAAG,KAAK,EACf,OAAO,GAAG,KAAK,EACf,SAAS,GAAG,KAAK,EACjB,aAAa,GAAG,KAAK,EACrB,OAAO,GAAG,KAAK,EACf,WAAW,GAAG,KAAK,EACnB,IAAI,GAAG,EAAE,EACT,YAAY,GAAG,KAAK,EACpB,WAAW,GAAG,EAAE,EAChB,IAAI,EACJ,IAAI,EACJ,GAAG,UAAU,EACd,GAAG,KAAK,CAAA;IAET,OAAO,CACL,oBAAC,SAAS,IACR,EAAE,EAAC,QAAQ,EACX,EAAE,EAAE,EAAE,EACN,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,
|
1
|
+
{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../src/Button/Button.tsx"],"names":[],"mappings":"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"}
|
@@ -0,0 +1,15 @@
|
|
1
|
+
import React, { FC, ReactNode } from 'react';
|
2
|
+
import { Color } from '../theme';
|
3
|
+
type Props = {
|
4
|
+
children: ReactNode;
|
5
|
+
id?: string;
|
6
|
+
className?: string;
|
7
|
+
color?: Color;
|
8
|
+
block?: boolean;
|
9
|
+
inverted?: boolean;
|
10
|
+
disabled?: boolean;
|
11
|
+
outlined?: boolean;
|
12
|
+
handleClick: (e: React.FormEvent<HTMLButtonElement>) => void;
|
13
|
+
};
|
14
|
+
export declare const LegacyButton: FC<Props>;
|
15
|
+
export {};
|
@@ -0,0 +1,50 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import styled, { css } from 'styled-components';
|
3
|
+
import { theme } from '../theme';
|
4
|
+
export const LegacyButton = ({ children, id, className = '', color = 'secondary', block = false, inverted = false, disabled = false, outlined = false, handleClick, }) => (React.createElement(Container, { id: id, className: className, color: color, block: block, inverted: inverted, disabled: disabled, outlined: outlined, onClick: handleClick }, children));
|
5
|
+
const Container = styled.button(({ block, color, inverted, outlined }) => css `
|
6
|
+
position: relative;
|
7
|
+
display: inline-block;
|
8
|
+
box-sizing: border-box;
|
9
|
+
border: none;
|
10
|
+
border-radius: 8px;
|
11
|
+
font-size: 16px;
|
12
|
+
padding: 18px 16px 14px;
|
13
|
+
outline: none;
|
14
|
+
cursor: pointer;
|
15
|
+
width: ${block ? '100%' : 'auto'};
|
16
|
+
background-color: ${theme.colors[color]};
|
17
|
+
color: ${theme.colors.white};
|
18
|
+
font-weight: ${theme.font.weight.medium};
|
19
|
+
|
20
|
+
&:hover:not([disabled]) {
|
21
|
+
background-color: ${theme.colors[color]};
|
22
|
+
}
|
23
|
+
&:active:not([disabled]) {
|
24
|
+
background-color: ${theme.colors[color]};
|
25
|
+
}
|
26
|
+
&:disabled {
|
27
|
+
opacity: 0.5;
|
28
|
+
cursor: not-allowed;
|
29
|
+
}
|
30
|
+
|
31
|
+
${(inverted || outlined) &&
|
32
|
+
css `
|
33
|
+
background-color: transparent;
|
34
|
+
border: 1px solid ${outlined ? theme.colors.outline : 'transparent'};
|
35
|
+
color: ${outlined ? theme.colors.secondary : theme.colors[color]};
|
36
|
+
|
37
|
+
&:hover:not([disabled]) {
|
38
|
+
background-color: ${theme.colors.background};
|
39
|
+
}
|
40
|
+
&:active:not([disabled]) {
|
41
|
+
background-color: ${theme.colors.background};
|
42
|
+
}
|
43
|
+
`};
|
44
|
+
|
45
|
+
@media (min-width: 768px) {
|
46
|
+
padding: 16px 16px 15px;
|
47
|
+
font-size: 16px;
|
48
|
+
}
|
49
|
+
`);
|
50
|
+
//# sourceMappingURL=LegacyButton.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"LegacyButton.js","sourceRoot":"","sources":["../../src/Button/LegacyButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAA;AAC5C,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAE/C,OAAO,EAAS,KAAK,EAAE,MAAM,UAAU,CAAA;AA+BvC,MAAM,CAAC,MAAM,YAAY,GAAc,CAAC,EACtC,QAAQ,EACR,EAAE,EACF,SAAS,GAAG,EAAE,EACd,KAAK,GAAG,WAAW,EACnB,KAAK,GAAG,KAAK,EACb,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,KAAK,EAChB,WAAW,GACZ,EAAE,EAAE,CAAC,CACJ,oBAAC,SAAS,IACR,EAAE,EAAE,EAAE,EACN,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,WAAW,IAEnB,QAAQ,CACC,CACb,CAAA;AAED,MAAM,SAAS,GAAG,MAAM,CAAC,MAAM,CAC7B,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;;;;;;;;;;aAUlC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM;wBACZ,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;aAC9B,KAAK,CAAC,MAAM,CAAC,KAAK;mBACZ,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM;;;0BAGjB,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;;;0BAGnB,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;;;;;;;MAOvC,CAAC,QAAQ,IAAI,QAAQ,CAAC;IACxB,GAAG,CAAA;;0BAEmB,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,aAAa;eAC1D,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;;;4BAG1C,KAAK,CAAC,MAAM,CAAC,UAAU;;;4BAGvB,KAAK,CAAC,MAAM,CAAC,UAAU;;KAE9C;;;;;;GAMF,CACF,CAAA"}
|
@@ -0,0 +1,17 @@
|
|
1
|
+
import { FC, FocusEvent, ReactElement } from 'react';
|
2
|
+
import { MarginProps } from '../utils/space';
|
3
|
+
export type ConfirmationProps = {
|
4
|
+
onChange(value?: boolean): void;
|
5
|
+
checked?: boolean;
|
6
|
+
id?: string;
|
7
|
+
error?: boolean;
|
8
|
+
errorMsg?: string;
|
9
|
+
label?: string;
|
10
|
+
onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
|
11
|
+
sublabel?: string | ReactElement;
|
12
|
+
yesLabel?: string | ReactElement;
|
13
|
+
noLabel?: string | ReactElement;
|
14
|
+
required?: boolean;
|
15
|
+
disabled?: boolean;
|
16
|
+
} & MarginProps;
|
17
|
+
export declare const Confirmation: FC<ConfirmationProps>;
|
@@ -0,0 +1,100 @@
|
|
1
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
2
|
+
var t = {};
|
3
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
4
|
+
t[p] = s[p];
|
5
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
6
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
7
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
8
|
+
t[p[i]] = s[p[i]];
|
9
|
+
}
|
10
|
+
return t;
|
11
|
+
};
|
12
|
+
import React from 'react';
|
13
|
+
import styled, { css } from 'styled-components';
|
14
|
+
import { theme } from '../theme';
|
15
|
+
import { Box } from '../Box';
|
16
|
+
import { Text } from '../Text';
|
17
|
+
import { RadioButton } from './RadioButtonStyled';
|
18
|
+
import { useUniqueId } from '../utils/id';
|
19
|
+
import { useDeprecatedWarning } from '../utils/deprecated';
|
20
|
+
export const Confirmation = (props) => {
|
21
|
+
const { checked, onChange, id: idProp, error = false, errorMsg = '', label, onBlur, sublabel, yesLabel = 'Yes', noLabel = 'No', required = false, disabled = false } = props, marginProps = __rest(props, ["checked", "onChange", "id", "error", "errorMsg", "label", "onBlur", "sublabel", "yesLabel", "noLabel", "required", "disabled"]);
|
22
|
+
useDeprecatedWarning({
|
23
|
+
title: 'Confirmation',
|
24
|
+
message: 'The Confirmation component has been deprecated. Please use the new RadioGroup component instead.',
|
25
|
+
componentProps: props,
|
26
|
+
});
|
27
|
+
const id = useUniqueId(idProp);
|
28
|
+
return (React.createElement(ConfirmationWrapper, Object.assign({}, marginProps),
|
29
|
+
(label || sublabel) && (React.createElement(TextWrapper, null,
|
30
|
+
label && (React.createElement(SectionHeadingText, { tag: "h3" },
|
31
|
+
label,
|
32
|
+
required && React.createElement(Asterisk, null, "*"))),
|
33
|
+
sublabel && (React.createElement(Text, { tag: "p", typo: "base-small", color: "subtext" }, sublabel)))),
|
34
|
+
React.createElement(RadioButtonGroupWrapper, null,
|
35
|
+
React.createElement(RadioButtonGroup, null,
|
36
|
+
React.createElement(RadioButtonWrapper, { checked: checked === true, error: error, disabled: disabled },
|
37
|
+
React.createElement(RadioButton, { id: id, label: yesLabel, checked: checked === true, onChange: () => onChange(true), value: id, onBlur: onBlur, disabled: disabled })),
|
38
|
+
React.createElement(RadioButtonWrapper, { checked: checked === false, error: error, disabled: disabled },
|
39
|
+
React.createElement(RadioButton, { id: `${id}-1`, label: noLabel, checked: checked === false, onChange: () => onChange(false), value: `${id}-1`, onBlur: onBlur, disabled: disabled }))),
|
40
|
+
error && React.createElement(ErrorBox, null, errorMsg))));
|
41
|
+
};
|
42
|
+
const RadioButtonGroupWrapper = styled.div `
|
43
|
+
display: flex;
|
44
|
+
flex-direction: column;
|
45
|
+
`;
|
46
|
+
const RadioButtonGroup = styled.div `
|
47
|
+
display: flex;
|
48
|
+
flex-direction: row;
|
49
|
+
`;
|
50
|
+
const getColor = (checked, error) => {
|
51
|
+
if (error) {
|
52
|
+
return `2px solid ${theme.colors.error}`;
|
53
|
+
}
|
54
|
+
else if (checked) {
|
55
|
+
return `2px solid ${theme.colors.secondary}`;
|
56
|
+
}
|
57
|
+
else {
|
58
|
+
return 'none';
|
59
|
+
}
|
60
|
+
};
|
61
|
+
const RadioButtonWrapper = styled.div `
|
62
|
+
background-color: ${({ checked }) => !checked && `${theme.colors.background}`};
|
63
|
+
border: ${({ checked, error }) => getColor(checked, error)};
|
64
|
+
margin-right: 10px;
|
65
|
+
width: 139px;
|
66
|
+
display: flex;
|
67
|
+
align-items: center;
|
68
|
+
height: 56px;
|
69
|
+
padding-left: 12px;
|
70
|
+
border-radius: 5px;
|
71
|
+
font-weight: bold;
|
72
|
+
${({ disabled }) => disabled &&
|
73
|
+
css `
|
74
|
+
border-color: ${theme.colors.secondary};
|
75
|
+
opacity: 0.5;
|
76
|
+
`}
|
77
|
+
`;
|
78
|
+
const ErrorBox = styled.span `
|
79
|
+
margin-top: 7px;
|
80
|
+
margin-left: 12px;
|
81
|
+
font-size: 12px;
|
82
|
+
color: ${theme.colors.error};
|
83
|
+
`;
|
84
|
+
const ConfirmationWrapper = styled(Box) `
|
85
|
+
display: flex;
|
86
|
+
flex-direction: column;
|
87
|
+
`;
|
88
|
+
const SectionHeadingText = styled(Text) `
|
89
|
+
font-weight: bold;
|
90
|
+
`;
|
91
|
+
const TextWrapper = styled.div `
|
92
|
+
display: flex;
|
93
|
+
flex-direction: column;
|
94
|
+
margin-bottom: 8px;
|
95
|
+
`;
|
96
|
+
const Asterisk = styled.span `
|
97
|
+
font-size: 14px;
|
98
|
+
color: ${theme.colors.error};
|
99
|
+
`;
|
100
|
+
//# sourceMappingURL=Confirmation.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"Confirmation.js","sourceRoot":"","sources":["../../src/ConfirmationRadioButtons/Confirmation.tsx"],"names":[],"mappings":"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"}
|
@@ -0,0 +1,21 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import { ConfirmationProps } from './Confirmation';
|
3
|
+
declare const _default: {
|
4
|
+
title: string;
|
5
|
+
component: React.FC<ConfirmationProps>;
|
6
|
+
argTypes: {
|
7
|
+
onChange: {
|
8
|
+
action: string;
|
9
|
+
};
|
10
|
+
};
|
11
|
+
};
|
12
|
+
export default _default;
|
13
|
+
export declare const Default: any;
|
14
|
+
export declare const WithError: any;
|
15
|
+
export declare const WithSublabel: any;
|
16
|
+
export declare const WorkingExample: any;
|
17
|
+
export declare const WithCustomLabel: any;
|
18
|
+
export declare const WithNoLabel: any;
|
19
|
+
export declare const Required: any;
|
20
|
+
export declare const RequiredWithLongLabel: any;
|
21
|
+
export declare const Disabled: any;
|
@@ -0,0 +1,76 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import { noop } from '../utils/noop';
|
3
|
+
import { Confirmation } from './Confirmation';
|
4
|
+
import { Container } from './Container';
|
5
|
+
export default {
|
6
|
+
title: 'Confirmation Radio Button',
|
7
|
+
component: Confirmation,
|
8
|
+
argTypes: { onChange: { action: 'clicked' } },
|
9
|
+
};
|
10
|
+
const Template = (props) => React.createElement(Confirmation, Object.assign({}, props));
|
11
|
+
export const Default = Template.bind({});
|
12
|
+
Default.args = {
|
13
|
+
id: 'radioButton',
|
14
|
+
onChange: noop,
|
15
|
+
checked: false,
|
16
|
+
label: 'Do you like marshmallows?',
|
17
|
+
};
|
18
|
+
export const WithError = Template.bind({});
|
19
|
+
WithError.args = {
|
20
|
+
id: 'radioButton',
|
21
|
+
onChange: noop,
|
22
|
+
checked: undefined,
|
23
|
+
label: 'Do you like marshmallows?',
|
24
|
+
error: true,
|
25
|
+
errorMsg: 'This field is required.',
|
26
|
+
};
|
27
|
+
export const WithSublabel = Template.bind({});
|
28
|
+
WithSublabel.args = {
|
29
|
+
id: 'radioButton',
|
30
|
+
onChange: noop,
|
31
|
+
checked: undefined,
|
32
|
+
label: 'Do you like marshmallows?',
|
33
|
+
sublabel: 'This includes smores and hot chocolate topped with marshmallows.',
|
34
|
+
};
|
35
|
+
const ContainerTemplate = () => React.createElement(Container, null);
|
36
|
+
export const WorkingExample = ContainerTemplate.bind({});
|
37
|
+
export const WithCustomLabel = Template.bind({});
|
38
|
+
WithCustomLabel.args = {
|
39
|
+
id: 'radioButton',
|
40
|
+
onChange: noop,
|
41
|
+
checked: undefined,
|
42
|
+
label: 'Do you like marshmallows?',
|
43
|
+
yesLabel: 'Correct',
|
44
|
+
};
|
45
|
+
export const WithNoLabel = Template.bind({});
|
46
|
+
WithNoLabel.args = {
|
47
|
+
id: 'radioButton',
|
48
|
+
onChange: noop,
|
49
|
+
checked: undefined,
|
50
|
+
yesLabel: 'Yes',
|
51
|
+
};
|
52
|
+
export const Required = Template.bind({});
|
53
|
+
Required.args = {
|
54
|
+
id: 'radioButton',
|
55
|
+
label: 'Do you like ice cream?',
|
56
|
+
onChange: noop,
|
57
|
+
checked: undefined,
|
58
|
+
required: true,
|
59
|
+
};
|
60
|
+
export const RequiredWithLongLabel = Template.bind({});
|
61
|
+
RequiredWithLongLabel.args = {
|
62
|
+
id: 'radioButton',
|
63
|
+
label: 'This is a really long label to test the placement of the required asterisk. Do you like ice cream, pie, marshmallows, smores, cupcakes, cookies, and muffins?',
|
64
|
+
onChange: noop,
|
65
|
+
checked: undefined,
|
66
|
+
required: true,
|
67
|
+
};
|
68
|
+
export const Disabled = Template.bind({});
|
69
|
+
Disabled.args = {
|
70
|
+
id: 'radioButton',
|
71
|
+
label: 'Do you like marshmallows?',
|
72
|
+
onChange: noop,
|
73
|
+
checked: true,
|
74
|
+
disabled: true,
|
75
|
+
};
|
76
|
+
//# sourceMappingURL=Confirmation.stories.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"Confirmation.stories.js","sourceRoot":"","sources":["../../src/ConfirmationRadioButtons/Confirmation.stories.tsx"],"names":[],"mappings":"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"}
|
@@ -0,0 +1,8 @@
|
|
1
|
+
import React, { useState } from 'react';
|
2
|
+
import { Confirmation } from './Confirmation';
|
3
|
+
export const Container = () => {
|
4
|
+
const [checked, setChecked] = useState(undefined);
|
5
|
+
return (React.createElement("form", null,
|
6
|
+
React.createElement(Confirmation, { id: "radioButton", onChange: (selection) => setChecked(selection), checked: checked, label: 'Do you like marshmallows?', error: checked === undefined, errorMsg: "This field is required." })));
|
7
|
+
};
|
8
|
+
//# sourceMappingURL=Container.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"Container.js","sourceRoot":"","sources":["../../src/ConfirmationRadioButtons/Container.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAE7C,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,EAAE;IAC5B,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAsB,SAAS,CAAC,CAAA;IAEtE,OAAO,CACL;QACE,oBAAC,YAAY,IACX,EAAE,EAAC,aAAa,EAChB,QAAQ,EAAE,CAAC,SAAS,EAAE,EAAE,CAAC,UAAU,CAAC,SAAS,CAAC,EAC9C,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,2BAA2B,EAClC,KAAK,EAAE,OAAO,KAAK,SAAS,EAC5B,QAAQ,EAAC,yBAAyB,GAClC,CACG,CACR,CAAA;AACH,CAAC,CAAA"}
|
@@ -0,0 +1,17 @@
|
|
1
|
+
import { FC, ChangeEvent, FocusEvent, ReactElement } from 'react';
|
2
|
+
export interface FakeInput {
|
3
|
+
checked?: boolean;
|
4
|
+
error?: boolean;
|
5
|
+
disabled?: boolean;
|
6
|
+
}
|
7
|
+
type RadioButtonProps = {
|
8
|
+
id: string;
|
9
|
+
label: string | ReactElement;
|
10
|
+
checked?: boolean;
|
11
|
+
value: string;
|
12
|
+
onChange: (event: ChangeEvent<HTMLInputElement>) => void;
|
13
|
+
onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
|
14
|
+
disabled?: boolean;
|
15
|
+
};
|
16
|
+
export declare const RadioButton: FC<RadioButtonProps>;
|
17
|
+
export {};
|
@@ -0,0 +1,41 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import styled from 'styled-components';
|
3
|
+
import { theme } from '../theme';
|
4
|
+
import { Box } from '../Box';
|
5
|
+
export const RadioButton = ({ id, label, checked, value, onChange, onBlur, disabled = false, }) => (React.createElement(Box, { flex: true, alignItems: "center" },
|
6
|
+
React.createElement(RadioInput, { id: id, type: "radio", checked: checked, value: value, onChange: onChange, onBlur: onBlur, disabled: disabled }),
|
7
|
+
React.createElement(RadioLabel, { htmlFor: id },
|
8
|
+
React.createElement(FakeInput, { checked: checked }),
|
9
|
+
React.createElement(Text, null, label))));
|
10
|
+
const FakeInput = styled.div `
|
11
|
+
width: 24px;
|
12
|
+
height: 24px;
|
13
|
+
border-radius: 50%;
|
14
|
+
background-color: ${theme.colors.white};
|
15
|
+
margin-right: 10px;
|
16
|
+
border: ${({ checked }) => checked
|
17
|
+
? `8px solid ${theme.colors.secondary}`
|
18
|
+
: `1px solid ${theme.colors.secondary}`};
|
19
|
+
`;
|
20
|
+
const RadioInput = styled.input `
|
21
|
+
position: absolute;
|
22
|
+
opacity: 0;
|
23
|
+
height: 0;
|
24
|
+
width: 0;
|
25
|
+
`;
|
26
|
+
const RadioLabel = styled.label `
|
27
|
+
font-family: 'Gordita', sans-serif;
|
28
|
+
text-transform: none;
|
29
|
+
font-size: 16px;
|
30
|
+
line-height: 17px;
|
31
|
+
color: ${theme.colors.secondary};
|
32
|
+
margin-bottom: 0;
|
33
|
+
display: flex;
|
34
|
+
cursor: pointer;
|
35
|
+
`;
|
36
|
+
// needed because the text is top aligned in its viewbox
|
37
|
+
const Text = styled.span `
|
38
|
+
position: relative;
|
39
|
+
bottom: -5px;
|
40
|
+
`;
|
41
|
+
//# sourceMappingURL=RadioButtonStyled.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"RadioButtonStyled.js","sourceRoot":"","sources":["../../src/ConfirmationRadioButtons/RadioButtonStyled.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoD,MAAM,OAAO,CAAA;AACxE,OAAO,MAAM,MAAM,mBAAmB,CAAA;AACtC,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAChC,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAkB5B,MAAM,CAAC,MAAM,WAAW,GAAyB,CAAC,EAChD,EAAE,EACF,KAAK,EACL,OAAO,EACP,KAAK,EACL,QAAQ,EACR,MAAM,EACN,QAAQ,GAAG,KAAK,GACC,EAAE,EAAE,CAAC,CACtB,oBAAC,GAAG,IAAC,IAAI,QAAC,UAAU,EAAC,QAAQ;IAC3B,oBAAC,UAAU,IACT,EAAE,EAAE,EAAE,EACN,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,GAClB;IACF,oBAAC,UAAU,IAAC,OAAO,EAAE,EAAE;QACrB,oBAAC,SAAS,IAAC,OAAO,EAAE,OAAO,GAAI;QAC/B,oBAAC,IAAI,QAAE,KAAK,CAAQ,CACT,CACT,CACP,CAAA;AAED,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAAW;;;;sBAIjB,KAAK,CAAC,MAAM,CAAC,KAAK;;YAE5B,CAAC,EAAE,OAAO,EAAa,EAAE,EAAE,CACnC,OAAO;IACL,CAAC,CAAC,aAAa,KAAK,CAAC,MAAM,CAAC,SAAS,EAAE;IACvC,CAAC,CAAC,aAAa,KAAK,CAAC,MAAM,CAAC,SAAS,EAAE;CAC5C,CAAA;AAED,MAAM,UAAU,GAAG,MAAM,CAAC,KAAK,CAAA;;;;;CAK9B,CAAA;AAED,MAAM,UAAU,GAAG,MAAM,CAAC,KAAK,CAAA;;;;;WAKpB,KAAK,CAAC,MAAM,CAAC,SAAS;;;;CAIhC,CAAA;AAED,wDAAwD;AACxD,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,CAAA;;;CAGvB,CAAA"}
|
@@ -0,0 +1 @@
|
|
1
|
+
export {};
|
@@ -0,0 +1,8 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import { render } from '@testing-library/react';
|
3
|
+
import { Confirmation } from '../Confirmation';
|
4
|
+
test('renders', () => {
|
5
|
+
const { container } = render(React.createElement(Confirmation, null));
|
6
|
+
expect(container.firstChild).toMatchSnapshot();
|
7
|
+
});
|
8
|
+
//# sourceMappingURL=Confirmation.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"Confirmation.js","sourceRoot":"","sources":["../../../src/ConfirmationRadioButtons/__tests__/Confirmation.js"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAA;AAE/C,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAE9C,IAAI,CAAC,SAAS,EAAE,GAAG,EAAE;IACnB,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,oBAAC,YAAY,OAAG,CAAC,CAAA;IAC9C,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,eAAe,EAAE,CAAA;AAChD,CAAC,CAAC,CAAA"}
|
@@ -0,0 +1 @@
|
|
1
|
+
export { Confirmation } from './Confirmation';
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/ConfirmationRadioButtons/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA"}
|
@@ -0,0 +1,21 @@
|
|
1
|
+
import { FC, ReactNode } from 'react';
|
2
|
+
type BorderProps = {
|
3
|
+
hasBorder?: false;
|
4
|
+
borderColor?: never;
|
5
|
+
} | {
|
6
|
+
hasBorder: true;
|
7
|
+
borderColor: string;
|
8
|
+
};
|
9
|
+
export type MessageProps = {
|
10
|
+
className?: string;
|
11
|
+
children: ReactNode;
|
12
|
+
type?: 'info' | 'warning' | 'warning-bubble' | string;
|
13
|
+
alignIcon?: 'center' | 'flex-start' | 'flex-end';
|
14
|
+
backgroundColor?: string;
|
15
|
+
sizeSmall?: boolean;
|
16
|
+
} & BorderProps;
|
17
|
+
/**
|
18
|
+
* @deprecated Use Support Message instead
|
19
|
+
*/
|
20
|
+
export declare const Message: FC<MessageProps>;
|
21
|
+
export {};
|
@@ -0,0 +1,45 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import styled, { css } from 'styled-components';
|
3
|
+
import { Box } from '../Box';
|
4
|
+
import { Icon } from '../Icon';
|
5
|
+
import { theme } from '../theme';
|
6
|
+
import { useDeprecatedWarning } from '../utils/deprecated';
|
7
|
+
/**
|
8
|
+
* @deprecated Use Support Message instead
|
9
|
+
*/
|
10
|
+
export const Message = ({ className, children, type = 'info', alignIcon = 'center', backgroundColor, sizeSmall, hasBorder, borderColor, }) => {
|
11
|
+
useDeprecatedWarning({
|
12
|
+
title: 'Legacy Message component',
|
13
|
+
message: "You're using the legacy Message component. Please use the new Support Message component.",
|
14
|
+
});
|
15
|
+
return (React.createElement(Wrapper, { className: className, type: type, backgroundColor: backgroundColor, sizeSmall: sizeSmall, hasBorder: hasBorder, borderColor: borderColor },
|
16
|
+
React.createElement(IconWrapper, { alignIcon: alignIcon },
|
17
|
+
React.createElement(Icon, { size: sizeSmall ? 24 : 32, render: type, color: type === 'warning' ? 'error' : 'secondary' })),
|
18
|
+
children));
|
19
|
+
};
|
20
|
+
const IconWrapper = styled(Box) `
|
21
|
+
align-self: ${({ alignIcon }) => alignIcon};
|
22
|
+
`;
|
23
|
+
const Wrapper = styled.div(({ type, backgroundColor, sizeSmall, hasBorder, borderColor }) => css `
|
24
|
+
align-items: center;
|
25
|
+
background-color: ${backgroundColor
|
26
|
+
? backgroundColor
|
27
|
+
: type === 'warning'
|
28
|
+
? theme.colors.white
|
29
|
+
: theme.colors.background};
|
30
|
+
box-sizing: border-box;
|
31
|
+
${type === 'warning'
|
32
|
+
? `border: 1px solid ${theme.colors.error};`
|
33
|
+
: hasBorder && `border: 1px solid ${borderColor};`}
|
34
|
+
border-radius: 8px;
|
35
|
+
margin-bottom: 24px;
|
36
|
+
padding: 16px;
|
37
|
+
display: flex;
|
38
|
+
font-family: ${theme.font.system};
|
39
|
+
color: ${type === 'warning' ? theme.colors.error : theme.colors.secondary};
|
40
|
+
font-size: ${sizeSmall ? '12px' : '16px'};
|
41
|
+
span {
|
42
|
+
margin: 0 16px 0 0;
|
43
|
+
}
|
44
|
+
`);
|
45
|
+
//# sourceMappingURL=Message.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"Message.js","sourceRoot":"","sources":["../../src/Message/Message.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAA;AAC5C,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAE/C,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAC5B,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAChC,OAAO,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAA;AAe1D;;GAEG;AAEH,MAAM,CAAC,MAAM,OAAO,GAAqB,CAAC,EACxC,SAAS,EACT,QAAQ,EACR,IAAI,GAAG,MAAM,EACb,SAAS,GAAG,QAAQ,EACpB,eAAe,EACf,SAAS,EACT,SAAS,EACT,WAAW,GACZ,EAAE,EAAE;IACH,oBAAoB,CAAC;QACnB,KAAK,EAAE,0BAA0B;QACjC,OAAO,EACL,0FAA0F;KAC7F,CAAC,CAAA;IACF,OAAO,CACL,oBAAC,OAAO,IACN,SAAS,EAAE,SAAS,EACpB,IAAI,EAAE,IAAI,EACV,eAAe,EAAE,eAAe,EAChC,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,WAAW;QAExB,oBAAC,WAAW,IAAC,SAAS,EAAE,SAAS;YAC/B,oBAAC,IAAI,IACH,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,EACzB,MAAM,EAAE,IAAI,EACZ,KAAK,EAAE,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,WAAW,GACjD,CACU;QAEb,QAAQ,CACD,CACX,CAAA;AACH,CAAC,CAAA;AAcD,MAAM,WAAW,GAAG,MAAM,CAAC,GAAG,CAAC,CAAc;gBAC7B,CAAC,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC,SAAS;CAC3C,CAAA;AAED,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CACxB,CAAC,EAAE,IAAI,EAAE,eAAe,EAAE,SAAS,EAAE,SAAS,EAAE,WAAW,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;;wBAE/C,eAAe;IACjC,CAAC,CAAC,eAAe;IACjB,CAAC,CAAC,IAAI,KAAK,SAAS;QACpB,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK;QACpB,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,UAAU;;MAEzB,IAAI,KAAK,SAAS;IAClB,CAAC,CAAC,qBAAqB,KAAK,CAAC,MAAM,CAAC,KAAK,GAAG;IAC5C,CAAC,CAAC,SAAS,IAAI,qBAAqB,WAAW,GAAG;;;;;mBAKrC,KAAK,CAAC,IAAI,CAAC,MAAM;aACvB,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,SAAS;iBAC5D,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM;;;;GAIzC,CACF,CAAA"}
|
@@ -0,0 +1,13 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import { MessageProps } from './Message';
|
3
|
+
declare const _default: {
|
4
|
+
title: string;
|
5
|
+
component: React.FC<MessageProps>;
|
6
|
+
};
|
7
|
+
export default _default;
|
8
|
+
export declare const Default: any;
|
9
|
+
export declare const Info: any;
|
10
|
+
export declare const Warning: any;
|
11
|
+
export declare const WarningBubbleSmall: any;
|
12
|
+
export declare const InfoBubbleSmall: any;
|
13
|
+
export declare const CardWithBorder: any;
|
@@ -0,0 +1,38 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import { Message } from './Message';
|
3
|
+
import { theme } from '../theme';
|
4
|
+
export default {
|
5
|
+
title: 'Message',
|
6
|
+
component: Message,
|
7
|
+
};
|
8
|
+
const Template = (props) => (React.createElement(Message, Object.assign({}, props), "Customer currently in BACS queue"));
|
9
|
+
export const Default = Template.bind({});
|
10
|
+
export const Info = Template.bind({});
|
11
|
+
Info.args = {
|
12
|
+
type: 'info',
|
13
|
+
};
|
14
|
+
export const Warning = Template.bind({});
|
15
|
+
Warning.args = {
|
16
|
+
type: 'warning',
|
17
|
+
};
|
18
|
+
export const WarningBubbleSmall = Template.bind({});
|
19
|
+
WarningBubbleSmall.args = {
|
20
|
+
type: 'warning',
|
21
|
+
backgroundColor: theme.colors.bgSecondary,
|
22
|
+
sizeSmall: true,
|
23
|
+
};
|
24
|
+
export const InfoBubbleSmall = Template.bind({});
|
25
|
+
InfoBubbleSmall.args = {
|
26
|
+
type: 'info',
|
27
|
+
backgroundColor: theme.colors.bgSecondary,
|
28
|
+
sizeSmall: true,
|
29
|
+
};
|
30
|
+
export const CardWithBorder = Template.bind({});
|
31
|
+
CardWithBorder.args = {
|
32
|
+
type: 'card',
|
33
|
+
alignIcon: 'flex-start',
|
34
|
+
backgroundColor: theme.colors.white,
|
35
|
+
hasBorder: true,
|
36
|
+
borderColor: theme.colors.secondary,
|
37
|
+
};
|
38
|
+
//# sourceMappingURL=Message.stories.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"Message.stories.js","sourceRoot":"","sources":["../../src/Message/Message.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,OAAO,EAAgB,MAAM,WAAW,CAAA;AACjD,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAEhC,eAAe;IACb,KAAK,EAAE,SAAS;IAChB,SAAS,EAAE,OAAO;CACnB,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,KAAmB,EAAE,EAAE,CAAC,CACxC,oBAAC,OAAO,oBAAK,KAAK,sCAA4C,CAC/D,CAAA;AAED,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAExC,MAAM,CAAC,MAAM,IAAI,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAErC,IAAI,CAAC,IAAI,GAAG;IACV,IAAI,EAAE,MAAM;CACb,CAAA;AAED,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAExC,OAAO,CAAC,IAAI,GAAG;IACb,IAAI,EAAE,SAAS;CAChB,CAAA;AAED,MAAM,CAAC,MAAM,kBAAkB,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAEnD,kBAAkB,CAAC,IAAI,GAAG;IACxB,IAAI,EAAE,SAAS;IACf,eAAe,EAAE,KAAK,CAAC,MAAM,CAAC,WAAW;IACzC,SAAS,EAAE,IAAI;CAChB,CAAA;AAED,MAAM,CAAC,MAAM,eAAe,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAEhD,eAAe,CAAC,IAAI,GAAG;IACrB,IAAI,EAAE,MAAM;IACZ,eAAe,EAAE,KAAK,CAAC,MAAM,CAAC,WAAW;IACzC,SAAS,EAAE,IAAI;CAChB,CAAA;AAED,MAAM,CAAC,MAAM,cAAc,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAE/C,cAAc,CAAC,IAAI,GAAG;IACpB,IAAI,EAAE,MAAM;IACZ,SAAS,EAAE,YAAY;IACvB,eAAe,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK;IACnC,SAAS,EAAE,IAAI;IACf,WAAW,EAAE,KAAK,CAAC,MAAM,CAAC,SAAS;CACpC,CAAA"}
|
@@ -0,0 +1 @@
|
|
1
|
+
export {};
|
@@ -0,0 +1,26 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import { render } from '@testing-library/react';
|
3
|
+
import '@testing-library/jest-dom/extend-expect';
|
4
|
+
import 'jest-styled-components';
|
5
|
+
import { Message } from '../Message';
|
6
|
+
it('default renders correctly', () => {
|
7
|
+
const { container } = render(React.createElement(Message, null, "This is an infomation message for the customer!"));
|
8
|
+
expect(container).toMatchSnapshot();
|
9
|
+
});
|
10
|
+
it('warning renders correctly', () => {
|
11
|
+
const { container } = render(React.createElement(Message, { type: "warning", sizeSmall: false }, "This is a warning message for the customer!"));
|
12
|
+
expect(container).toMatchSnapshot();
|
13
|
+
});
|
14
|
+
it('info renders correctly', () => {
|
15
|
+
const { container } = render(React.createElement(Message, { type: "info" }, "This is a infomational message for the customer!"));
|
16
|
+
expect(container).toMatchSnapshot();
|
17
|
+
});
|
18
|
+
it('icon prop render correctly', () => {
|
19
|
+
const { container } = render(React.createElement(Message, { type: "warning" }, "This is a warning message for the customer!"));
|
20
|
+
expect(container).toHaveTextContent('This is a warning message for the customer!');
|
21
|
+
});
|
22
|
+
it('warning bubble size small renders correctly', () => {
|
23
|
+
const { container } = render(React.createElement(Message, { type: "warning-bubble", backgroundColor: "#FAF3EE", sizeSmall: true }, "This is a warning bubble message for the customer!"));
|
24
|
+
expect(container).toHaveTextContent('This is a warning bubble message for the customer!');
|
25
|
+
});
|
26
|
+
//# sourceMappingURL=Message.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"Message.js","sourceRoot":"","sources":["../../../src/Message/__tests__/Message.js"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAA;AAC/C,OAAO,yCAAyC,CAAA;AAChD,OAAO,wBAAwB,CAAA;AAE/B,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAA;AAEpC,EAAE,CAAC,2BAA2B,EAAE,GAAG,EAAE;IACnC,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAC1B,oBAAC,OAAO,0DAA0D,CACnE,CAAA;IAED,MAAM,CAAC,SAAS,CAAC,CAAC,eAAe,EAAE,CAAA;AACrC,CAAC,CAAC,CAAA;AAEF,EAAE,CAAC,2BAA2B,EAAE,GAAG,EAAE;IACnC,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAC1B,oBAAC,OAAO,IAAC,IAAI,EAAC,SAAS,EAAC,SAAS,EAAE,KAAK,kDAE9B,CACX,CAAA;IAED,MAAM,CAAC,SAAS,CAAC,CAAC,eAAe,EAAE,CAAA;AACrC,CAAC,CAAC,CAAA;AAEF,EAAE,CAAC,wBAAwB,EAAE,GAAG,EAAE;IAChC,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAC1B,oBAAC,OAAO,IAAC,IAAI,EAAC,MAAM,uDAEV,CACX,CAAA;IAED,MAAM,CAAC,SAAS,CAAC,CAAC,eAAe,EAAE,CAAA;AACrC,CAAC,CAAC,CAAA;AAEF,EAAE,CAAC,4BAA4B,EAAE,GAAG,EAAE;IACpC,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAC1B,oBAAC,OAAO,IAAC,IAAI,EAAC,SAAS,kDAEb,CACX,CAAA;IAED,MAAM,CAAC,SAAS,CAAC,CAAC,iBAAiB,CACjC,6CAA6C,CAC9C,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,EAAE,CAAC,6CAA6C,EAAE,GAAG,EAAE;IACrD,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAC1B,oBAAC,OAAO,IAAC,IAAI,EAAC,gBAAgB,EAAC,eAAe,EAAC,SAAS,EAAC,SAAS,EAAE,IAAI,yDAE9D,CACX,CAAA;IAED,MAAM,CAAC,SAAS,CAAC,CAAC,iBAAiB,CACjC,oDAAoD,CACrD,CAAA;AACH,CAAC,CAAC,CAAA"}
|
@@ -0,0 +1 @@
|
|
1
|
+
export * from './Message';
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/Message/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAA"}
|
@@ -0,0 +1,9 @@
|
|
1
|
+
import React, { useState } from 'react';
|
2
|
+
import { RadioButton } from './RadioButton';
|
3
|
+
export const Container = () => {
|
4
|
+
const [checked, setChecked] = useState('');
|
5
|
+
return (React.createElement("form", null,
|
6
|
+
React.createElement(RadioButton, { id: "radioButtonOne", label: "What a lovely label", value: checked, onChange: () => setChecked('radioButtonOne'), checked: checked === 'radioButtonOne' }),
|
7
|
+
React.createElement(RadioButton, { id: "radioButtonTwo", label: "What a lovely second label", value: checked, onChange: () => setChecked('radioButtonTwo'), checked: checked === 'radioButtonTwo' })));
|
8
|
+
};
|
9
|
+
//# sourceMappingURL=Container.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"Container.js","sourceRoot":"","sources":["../../src/RadioButton/Container.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAEvC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAE3C,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,EAAE;IAC5B,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAA;IAE1C,OAAO,CACL;QACE,oBAAC,WAAW,IACV,EAAE,EAAC,gBAAgB,EACnB,KAAK,EAAC,qBAAqB,EAC3B,KAAK,EAAE,OAAO,EACd,QAAQ,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,gBAAgB,CAAC,EAC5C,OAAO,EAAE,OAAO,KAAK,gBAAgB,GACrC;QAEF,oBAAC,WAAW,IACV,EAAE,EAAC,gBAAgB,EACnB,KAAK,EAAC,4BAA4B,EAClC,KAAK,EAAE,OAAO,EACd,QAAQ,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,gBAAgB,CAAC,EAC5C,OAAO,EAAE,OAAO,KAAK,gBAAgB,GACrC,CACG,CACR,CAAA;AACH,CAAC,CAAA"}
|
@@ -0,0 +1,10 @@
|
|
1
|
+
import { FC, ChangeEvent } from 'react';
|
2
|
+
import { MarginProps } from '../utils/space';
|
3
|
+
export type RadioButtonProps = {
|
4
|
+
id?: string;
|
5
|
+
label: string;
|
6
|
+
checked?: boolean;
|
7
|
+
value: string;
|
8
|
+
onChange: (event: ChangeEvent<HTMLInputElement>) => void;
|
9
|
+
} & MarginProps;
|
10
|
+
export declare const RadioButton: FC<RadioButtonProps>;
|
@@ -0,0 +1,68 @@
|
|
1
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
2
|
+
var t = {};
|
3
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
4
|
+
t[p] = s[p];
|
5
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
6
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
7
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
8
|
+
t[p[i]] = s[p[i]];
|
9
|
+
}
|
10
|
+
return t;
|
11
|
+
};
|
12
|
+
import React from 'react';
|
13
|
+
import styled from 'styled-components';
|
14
|
+
import { focusOutline } from '../utils/focusOutline';
|
15
|
+
import { Box } from '../Box';
|
16
|
+
import { theme } from '../theme';
|
17
|
+
import { useUniqueId } from '../utils/id';
|
18
|
+
import { useDeprecatedWarning } from '../utils/deprecated';
|
19
|
+
export const RadioButton = (props) => {
|
20
|
+
const { id: idProp, label, checked, value, onChange } = props, marginProps = __rest(props, ["id", "label", "checked", "value", "onChange"]);
|
21
|
+
useDeprecatedWarning({
|
22
|
+
title: 'RadioButton',
|
23
|
+
message: 'The RadioButton component has been deprecated. Please use the new RadioGroup component instead.',
|
24
|
+
componentProps: props,
|
25
|
+
});
|
26
|
+
const id = useUniqueId(idProp);
|
27
|
+
return (React.createElement(Box, Object.assign({ flex: true, alignItems: "center" }, marginProps),
|
28
|
+
React.createElement(RadioInput, { id: id, type: "radio", checked: checked, value: value, onChange: onChange }),
|
29
|
+
React.createElement(RadioLabel, { htmlFor: id },
|
30
|
+
React.createElement(FakeInput, { checked: checked }),
|
31
|
+
React.createElement(Text, null, label))));
|
32
|
+
};
|
33
|
+
const FakeInput = styled.div `
|
34
|
+
width: 24px;
|
35
|
+
height: 24px;
|
36
|
+
border-radius: 50%;
|
37
|
+
background-color: ${theme.colors.white};
|
38
|
+
margin-right: 10px;
|
39
|
+
border: ${({ checked }) => checked
|
40
|
+
? `8px solid ${theme.colors.success}`
|
41
|
+
: `1px solid ${theme.colors.outline}`};
|
42
|
+
`;
|
43
|
+
const RadioLabel = styled.label `
|
44
|
+
font-family: 'Gordita', sans-serif;
|
45
|
+
text-transform: none;
|
46
|
+
font-size: 16px;
|
47
|
+
line-height: 17px;
|
48
|
+
color: ${theme.colors.secondary};
|
49
|
+
margin-bottom: 0;
|
50
|
+
display: flex;
|
51
|
+
cursor: pointer;
|
52
|
+
`;
|
53
|
+
const RadioInput = styled.input `
|
54
|
+
position: absolute;
|
55
|
+
opacity: 0;
|
56
|
+
height: 0;
|
57
|
+
width: 0;
|
58
|
+
|
59
|
+
${focusOutline({
|
60
|
+
selector: `&:focus-visible ~ ${RadioLabel} ${FakeInput}`,
|
61
|
+
})}
|
62
|
+
`;
|
63
|
+
// needed because the text is top aligned in its viewbox
|
64
|
+
const Text = styled.span `
|
65
|
+
position: relative;
|
66
|
+
bottom: -5px;
|
67
|
+
`;
|
68
|
+
//# sourceMappingURL=RadioButton.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"RadioButton.js","sourceRoot":"","sources":["../../src/RadioButton/RadioButton.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAA0B,MAAM,OAAO,CAAA;AAC9C,OAAO,MAAM,MAAM,mBAAmB,CAAA;AACtC,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAA;AAEpD,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAE5B,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAChC,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAA;AAEzC,OAAO,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAA;AAc1D,MAAM,CAAC,MAAM,WAAW,GAAyB,CAAC,KAAK,EAAE,EAAE;IACzD,MAAM,EAAE,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,KAAqB,KAAK,EAArB,WAAW,UAAK,KAAK,EAAvE,+CAA+D,CAAQ,CAAA;IAE7E,oBAAoB,CAAC;QACnB,KAAK,EAAE,aAAa;QACpB,OAAO,EACL,iGAAiG;QACnG,cAAc,EAAE,KAAK;KACtB,CAAC,CAAA;IAEF,MAAM,EAAE,GAAG,WAAW,CAAC,MAAM,CAAC,CAAA;IAE9B,OAAO,CACL,oBAAC,GAAG,kBAAC,IAAI,QAAC,UAAU,EAAC,QAAQ,IAAK,WAAW;QAC3C,oBAAC,UAAU,IACT,EAAE,EAAE,EAAE,EACN,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,GAClB;QAEF,oBAAC,UAAU,IAAC,OAAO,EAAE,EAAE;YACrB,oBAAC,SAAS,IAAC,OAAO,EAAE,OAAO,GAAI;YAC/B,oBAAC,IAAI,QAAE,KAAK,CAAQ,CACT,CACT,CACP,CAAA;AACH,CAAC,CAAA;AAED,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAAY;;;;sBAIlB,KAAK,CAAC,MAAM,CAAC,KAAK;;YAE5B,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE,CACxB,OAAO;IACL,CAAC,CAAC,aAAa,KAAK,CAAC,MAAM,CAAC,OAAO,EAAE;IACrC,CAAC,CAAC,aAAa,KAAK,CAAC,MAAM,CAAC,OAAO,EAAE;CAC1C,CAAA;AAED,MAAM,UAAU,GAAG,MAAM,CAAC,KAAK,CAAA;;;;;WAKpB,KAAK,CAAC,MAAM,CAAC,SAAS;;;;CAIhC,CAAA;AAED,MAAM,UAAU,GAAG,MAAM,CAAC,KAAK,CAAA;;;;;;IAM3B,YAAY,CAAC;IACb,QAAQ,EAAE,qBAAqB,UAAU,IAAI,SAAS,EAAE;CACzD,CAAC;CACH,CAAA;AAED,wDAAwD;AACxD,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,CAAA;;;CAGvB,CAAA"}
|
@@ -0,0 +1,15 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import { RadioButtonProps } from './RadioButton';
|
3
|
+
declare const _default: {
|
4
|
+
title: string;
|
5
|
+
component: React.FC<RadioButtonProps>;
|
6
|
+
argTypes: {
|
7
|
+
onChange: {
|
8
|
+
action: string;
|
9
|
+
};
|
10
|
+
};
|
11
|
+
};
|
12
|
+
export default _default;
|
13
|
+
export declare const Default: any;
|
14
|
+
export declare const Checked: any;
|
15
|
+
export declare const WorkingExample: any;
|
@@ -0,0 +1,29 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import { RadioButton } from './RadioButton';
|
3
|
+
import { Container } from './Container';
|
4
|
+
import { noop } from '../utils/noop';
|
5
|
+
export default {
|
6
|
+
title: 'Radio Button',
|
7
|
+
component: RadioButton,
|
8
|
+
argTypes: { onChange: { action: 'clicked' } },
|
9
|
+
};
|
10
|
+
const Template = (props) => React.createElement(RadioButton, Object.assign({}, props));
|
11
|
+
export const Default = Template.bind({});
|
12
|
+
Default.args = {
|
13
|
+
id: 'radioButton',
|
14
|
+
label: 'What a lovely label',
|
15
|
+
value: 'radioButton',
|
16
|
+
onChange: noop,
|
17
|
+
checked: false,
|
18
|
+
};
|
19
|
+
export const Checked = Template.bind({});
|
20
|
+
Checked.args = {
|
21
|
+
id: 'radioButton',
|
22
|
+
label: 'What a lovely label',
|
23
|
+
value: 'radioButton',
|
24
|
+
onChange: noop,
|
25
|
+
checked: true,
|
26
|
+
};
|
27
|
+
const ContainerTemplate = () => React.createElement(Container, null);
|
28
|
+
export const WorkingExample = ContainerTemplate.bind({});
|
29
|
+
//# sourceMappingURL=RadioButton.stories.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"RadioButton.stories.js","sourceRoot":"","sources":["../../src/RadioButton/RadioButton.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,WAAW,EAAoB,MAAM,eAAe,CAAA;AAC7D,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AACvC,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAA;AAEpC,eAAe;IACb,KAAK,EAAE,cAAc;IACrB,SAAS,EAAE,WAAW;IACtB,QAAQ,EAAE,EAAE,QAAQ,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE;CAC9C,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,KAAuB,EAAE,EAAE,CAAC,oBAAC,WAAW,oBAAK,KAAK,EAAI,CAAA;AAExE,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAExC,OAAO,CAAC,IAAI,GAAG;IACb,EAAE,EAAE,aAAa;IACjB,KAAK,EAAE,qBAAqB;IAC5B,KAAK,EAAE,aAAa;IACpB,QAAQ,EAAE,IAAI;IACd,OAAO,EAAE,KAAK;CACf,CAAA;AAED,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAExC,OAAO,CAAC,IAAI,GAAG;IACb,EAAE,EAAE,aAAa;IACjB,KAAK,EAAE,qBAAqB;IAC5B,KAAK,EAAE,aAAa;IACpB,QAAQ,EAAE,IAAI;IACd,OAAO,EAAE,IAAI;CACd,CAAA;AAED,MAAM,iBAAiB,GAAG,GAAG,EAAE,CAAC,oBAAC,SAAS,OAAG,CAAA;AAE7C,MAAM,CAAC,MAAM,cAAc,GAAG,iBAAiB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA"}
|
@@ -0,0 +1 @@
|
|
1
|
+
export {};
|
@@ -0,0 +1,13 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import { render } from '@testing-library/react';
|
3
|
+
import 'jest-styled-components';
|
4
|
+
import { RadioButton } from '../RadioButton';
|
5
|
+
test('renders - checked', () => {
|
6
|
+
const { container } = render(React.createElement(RadioButton, { id: "radioButtonOne", label: "What a lovely label", value: true, checked: true, onChange: str => { } }));
|
7
|
+
expect(container.firstChild).toMatchSnapshot();
|
8
|
+
});
|
9
|
+
test('renders - unchecked', () => {
|
10
|
+
const { container } = render(React.createElement(RadioButton, { id: "radioButtonOne", label: "What a lovely label", value: false, checked: false, onChange: str => { } }));
|
11
|
+
expect(container.firstChild).toMatchSnapshot();
|
12
|
+
});
|
13
|
+
//# sourceMappingURL=RadioButton.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"RadioButton.js","sourceRoot":"","sources":["../../../src/RadioButton/__tests__/RadioButton.js"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,MAAM,EAAC,MAAM,wBAAwB,CAAC;AAC9C,OAAO,wBAAwB,CAAC;AAEhC,OAAO,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAE3C,IAAI,CAAC,mBAAmB,EAAE,GAAG,EAAE;IAC7B,MAAM,EAAC,SAAS,EAAC,GAAG,MAAM,CACxB,oBAAC,WAAW,IACV,EAAE,EAAC,gBAAgB,EACnB,KAAK,EAAC,qBAAqB,EAC3B,KAAK,EAAE,IAAI,EACX,OAAO,EAAE,IAAI,EACb,QAAQ,EAAE,GAAG,CAAC,EAAE,GAAE,CAAC,GACnB,CACH,CAAC;IACF,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,eAAe,EAAE,CAAC;AACjD,CAAC,CAAC,CAAC;AAEH,IAAI,CAAC,qBAAqB,EAAE,GAAG,EAAE;IAC/B,MAAM,EAAC,SAAS,EAAC,GAAG,MAAM,CACxB,oBAAC,WAAW,IACV,EAAE,EAAC,gBAAgB,EACnB,KAAK,EAAC,qBAAqB,EAC3B,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,KAAK,EACd,QAAQ,EAAE,GAAG,CAAC,EAAE,GAAE,CAAC,GACnB,CACH,CAAC;IACF,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,eAAe,EAAE,CAAC;AACjD,CAAC,CAAC,CAAC"}
|
@@ -0,0 +1 @@
|
|
1
|
+
export { RadioButton } from './RadioButton';
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/RadioButton/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA"}
|
package/dist/Table/storyUtils.js
CHANGED
@@ -150,7 +150,7 @@ export const columns = [
|
|
150
150
|
{
|
151
151
|
name: 'e.g1',
|
152
152
|
cell: (row) => (React.createElement(Box, { flex: true, justifyContent: "flex-start" },
|
153
|
-
React.createElement(Tooltip, { content: React.createElement(Text, { color: "cream" }, row.ability),
|
153
|
+
React.createElement(Tooltip, { content: React.createElement(Text, { color: "cream" }, row.ability), position: "top", fallbackStyle: true, underline: true }, "what ability?"))),
|
154
154
|
minWidth: '150px',
|
155
155
|
},
|
156
156
|
{
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"storyUtils.js","sourceRoot":"","sources":["../../src/Table/storyUtils.tsx"],"names":[],"mappings":"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
|
1
|
+
{"version":3,"file":"storyUtils.js","sourceRoot":"","sources":["../../src/Table/storyUtils.tsx"],"names":[],"mappings":"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"}
|
package/dist/Tooltip/Tooltip.js
CHANGED
@@ -6,11 +6,11 @@ import { Text } from '../Text';
|
|
6
6
|
import { useEventListener } from '../hooks';
|
7
7
|
import { theme } from '../theme';
|
8
8
|
import { debounce } from '../utils/debounce';
|
9
|
-
export const Tooltip = ({ children, title, content,
|
9
|
+
export const Tooltip = ({ children, title, content, position = 'top', maxWidth = 500, underline = false, fallbackStyle = false, }) => {
|
10
10
|
const documentRef = useRef(document);
|
11
11
|
const tipContainer = useRef(null);
|
12
12
|
const [showTip, setShowTip] = useState(false);
|
13
|
-
const [tooltipPosition, setTooltipPosition] = useState(
|
13
|
+
const [tooltipPosition, setTooltipPosition] = useState(position);
|
14
14
|
const [childEl, setChildEl] = useState(null);
|
15
15
|
const [tooltipCoords, setTooltipCoords] = useState({ top: 0, left: 0 });
|
16
16
|
const randomId = uuidv4();
|
@@ -55,8 +55,8 @@ export const Tooltip = ({ children, title, content, defaultArrowPosition = 'top'
|
|
55
55
|
setChildEl(document.getElementById(randomId));
|
56
56
|
}, []);
|
57
57
|
useEffect(() => {
|
58
|
-
setTooltipPosition(
|
59
|
-
}, [
|
58
|
+
setTooltipPosition(position);
|
59
|
+
}, [position]);
|
60
60
|
const arrowSize = 18;
|
61
61
|
const calculateTooltipPosition = () => {
|
62
62
|
if (!childEl)
|
@@ -112,7 +112,7 @@ export const Tooltip = ({ children, title, content, defaultArrowPosition = 'top'
|
|
112
112
|
setTooltipCoords(calculateTooltipPosition());
|
113
113
|
}
|
114
114
|
}, [
|
115
|
-
|
115
|
+
position,
|
116
116
|
window.scrollY,
|
117
117
|
tipContainer.current,
|
118
118
|
childEl,
|
@@ -132,7 +132,7 @@ export const Tooltip = ({ children, title, content, defaultArrowPosition = 'top'
|
|
132
132
|
return (React.createElement(Container, null,
|
133
133
|
React.createElement(UnderlinedText, { id: randomId, underline: underline, cursor: "pointer", onMouseEnter: () => setShowTip(true), onMouseLeave: () => setShowTip(false) }, children),
|
134
134
|
childEl &&
|
135
|
-
createPortal(React.createElement(Tip, { className: "tooltip", showTip: showTip, position:
|
135
|
+
createPortal(React.createElement(Tip, { className: "tooltip", showTip: showTip, position: position, arrowPosition: tooltipPosition, ref: tipContainer, maxWidth: maxWidth, fallbackStyle: fallbackStyle, style: {
|
136
136
|
position: 'absolute',
|
137
137
|
top: `${tooltipCoords.top}px`,
|
138
138
|
left: `${tooltipCoords.left}px`,
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../src/Tooltip/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAGZ,WAAW,EACX,SAAS,EACT,MAAM,EACN,QAAQ,GACT,MAAM,OAAO,CAAA;AACd,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;AACxC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAC/C,OAAO,EAAE,EAAE,IAAI,MAAM,EAAE,MAAM,MAAM,CAAA;AACnC,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAA;AAC3C,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAChC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAe5C,MAAM,CAAC,MAAM,OAAO,GAAqB,CAAC,EACxC,QAAQ,EACR,KAAK,EACL,OAAO,EACP,
|
1
|
+
{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../src/Tooltip/Tooltip.tsx"],"names":[],"mappings":"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"}
|