@dtdot/lego 2.3.1 → 2.3.2
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/build/components/FloatingActionButton/FloatingActionButton.component.d.ts +5 -4
- package/build/components/FloatingActionButton/FloatingActionButton.component.js +2 -2
- package/build/components/FloatingActionButton/_FloatingActionButton.internal.d.ts +5 -4
- package/build/components/FloatingActionButton/_FloatingActionButton.internal.js +2 -2
- package/package.json +1 -1
|
@@ -2,12 +2,13 @@
|
|
|
2
2
|
import { IconDefinition } from '@fortawesome/fontawesome-svg-core';
|
|
3
3
|
import { ColourVariant } from '../../theme/theme.types';
|
|
4
4
|
interface FloatingActionButtonProps {
|
|
5
|
-
icon: IconDefinition;
|
|
6
|
-
onClick: () => void;
|
|
7
|
-
variant?: ColourVariant;
|
|
5
|
+
'icon': IconDefinition;
|
|
6
|
+
'onClick': () => void;
|
|
7
|
+
'variant'?: ColourVariant;
|
|
8
|
+
'data-testid'?: string;
|
|
8
9
|
}
|
|
9
10
|
declare const FloatingActionButton: {
|
|
10
|
-
({ icon, onClick, variant }: FloatingActionButtonProps): JSX.Element | null;
|
|
11
|
+
({ icon, onClick, variant, "data-testid": dataTestId, }: FloatingActionButtonProps): JSX.Element | null;
|
|
11
12
|
Provider: ({ children }: import("./_FloatingActionButton.provider").FloatingActionButtonProviderProps) => JSX.Element;
|
|
12
13
|
};
|
|
13
14
|
export default FloatingActionButton;
|
|
@@ -3,7 +3,7 @@ import FloatingActionButtonContext from './_FloatingActionButton.context';
|
|
|
3
3
|
import FloatingActionButtonProvider from './_FloatingActionButton.provider';
|
|
4
4
|
import { v4 } from 'uuid';
|
|
5
5
|
import FloatingActionButtonInternal from './_FloatingActionButton.internal';
|
|
6
|
-
const FloatingActionButton = ({ icon, onClick, variant = 'primary' }) => {
|
|
6
|
+
const FloatingActionButton = ({ icon, onClick, variant = 'primary', 'data-testid': dataTestId, }) => {
|
|
7
7
|
const { contextExists, setButton } = useContext(FloatingActionButtonContext);
|
|
8
8
|
const id = useMemo(() => v4(), []);
|
|
9
9
|
useEffect(() => {
|
|
@@ -13,7 +13,7 @@ const FloatingActionButton = ({ icon, onClick, variant = 'primary' }) => {
|
|
|
13
13
|
};
|
|
14
14
|
}, [icon, onClick, variant, setButton]);
|
|
15
15
|
if (!contextExists) {
|
|
16
|
-
return React.createElement(FloatingActionButtonInternal, { icon: icon, onClick: onClick, variant: variant });
|
|
16
|
+
return React.createElement(FloatingActionButtonInternal, { icon: icon, onClick: onClick, variant: variant, "data-testid": dataTestId });
|
|
17
17
|
}
|
|
18
18
|
return null;
|
|
19
19
|
};
|
|
@@ -2,9 +2,10 @@
|
|
|
2
2
|
import { IconDefinition } from '@fortawesome/fontawesome-svg-core';
|
|
3
3
|
import { ColourVariant } from '../../theme/theme.types';
|
|
4
4
|
interface FloatingActionButtonInternalProps {
|
|
5
|
-
icon: IconDefinition;
|
|
6
|
-
onClick: () => void;
|
|
7
|
-
variant?: ColourVariant;
|
|
5
|
+
'icon': IconDefinition;
|
|
6
|
+
'onClick': () => void;
|
|
7
|
+
'variant'?: ColourVariant;
|
|
8
|
+
'data-testid'?: string;
|
|
8
9
|
}
|
|
9
|
-
declare const FloatingActionButtonInternal: ({ icon, onClick, variant }: FloatingActionButtonInternalProps) => JSX.Element;
|
|
10
|
+
declare const FloatingActionButtonInternal: ({ icon, onClick, variant, "data-testid": dataTestId, }: FloatingActionButtonInternalProps) => JSX.Element;
|
|
10
11
|
export default FloatingActionButtonInternal;
|
|
@@ -29,7 +29,7 @@ const FloatingButton = styled(motion.button) `
|
|
|
29
29
|
background-color: ${(props) => getThemeVariantColours(props.variant, props.theme).darker};
|
|
30
30
|
}
|
|
31
31
|
`;
|
|
32
|
-
const FloatingActionButtonInternal = ({ icon, onClick, variant = 'primary' }) => {
|
|
32
|
+
const FloatingActionButtonInternal = ({ icon, onClick, variant = 'primary', 'data-testid': dataTestId, }) => {
|
|
33
33
|
const { menuExists, isMobile } = useContext(MinimalMenuContext);
|
|
34
34
|
const { contextExists } = useContext(FloatingActionButtonContext);
|
|
35
35
|
const variants = {
|
|
@@ -39,7 +39,7 @@ const FloatingActionButtonInternal = ({ icon, onClick, variant = 'primary' }) =>
|
|
|
39
39
|
hover: { scale: 1.1 },
|
|
40
40
|
tap: { scale: 0.95 },
|
|
41
41
|
};
|
|
42
|
-
return (React.createElement(FloatingButton, { key: 'floating-button', initial: contextExists ? 'hidden' : 'visible', animate: 'visible', exit: 'exit', whileHover: 'hover', whileTap: 'tap', offsetBottom: menuExists && isMobile, variants: variants, onClick: onClick, variant: variant },
|
|
42
|
+
return (React.createElement(FloatingButton, { key: 'floating-button', initial: contextExists ? 'hidden' : 'visible', animate: 'visible', exit: 'exit', whileHover: 'hover', whileTap: 'tap', offsetBottom: menuExists && isMobile, variants: variants, onClick: onClick, variant: variant, "data-testid": dataTestId },
|
|
43
43
|
React.createElement(FontAwesomeIcon, { icon: icon })));
|
|
44
44
|
};
|
|
45
45
|
export default FloatingActionButtonInternal;
|