@chayns-components/core 5.0.0-beta.617 → 5.0.0-beta.619
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/lib/cjs/components/button/Button.js +38 -2
- package/lib/cjs/components/button/Button.js.map +1 -1
- package/lib/cjs/components/button/Button.styles.js +1 -4
- package/lib/cjs/components/button/Button.styles.js.map +1 -1
- package/lib/cjs/components/button/wait-cursor/WaitCursor.js +4 -1
- package/lib/cjs/components/button/wait-cursor/WaitCursor.js.map +1 -1
- package/lib/cjs/components/button/wait-cursor/WaitCursor.styles.js +3 -1
- package/lib/cjs/components/button/wait-cursor/WaitCursor.styles.js.map +1 -1
- package/lib/esm/components/button/Button.js +38 -2
- package/lib/esm/components/button/Button.js.map +1 -1
- package/lib/esm/components/button/Button.styles.js +1 -4
- package/lib/esm/components/button/Button.styles.js.map +1 -1
- package/lib/esm/components/button/wait-cursor/WaitCursor.js +4 -1
- package/lib/esm/components/button/wait-cursor/WaitCursor.js.map +1 -1
- package/lib/esm/components/button/wait-cursor/WaitCursor.styles.js +6 -1
- package/lib/esm/components/button/wait-cursor/WaitCursor.styles.js.map +1 -1
- package/lib/types/components/button/wait-cursor/WaitCursor.d.ts +1 -3
- package/lib/types/components/button/wait-cursor/WaitCursor.styles.d.ts +4 -3
- package/package.json +2 -2
|
@@ -39,6 +39,38 @@ const Button = ({
|
|
|
39
39
|
}
|
|
40
40
|
return theme.buttonColor ?? 'white';
|
|
41
41
|
}, [isSecondary, theme.buttonColor, theme.text]);
|
|
42
|
+
const backgroundColor = (0, _react.useMemo)(() => {
|
|
43
|
+
let color;
|
|
44
|
+
if (isSecondary) {
|
|
45
|
+
color = theme['202'];
|
|
46
|
+
} else {
|
|
47
|
+
color = theme.buttonBackgroundColor ?? theme['408'];
|
|
48
|
+
}
|
|
49
|
+
if (theme.buttonDesign === '2') {
|
|
50
|
+
color = `rgba(${theme['102-rgb'] ?? ''}, 0)`;
|
|
51
|
+
}
|
|
52
|
+
return color;
|
|
53
|
+
}, [isSecondary, theme]);
|
|
54
|
+
const tapStyles = (0, _react.useMemo)(() => {
|
|
55
|
+
if (theme.buttonDesign === '2') {
|
|
56
|
+
return {
|
|
57
|
+
backgroundColor: isSecondary ? `rgba(${theme['202-rgb'] ?? ''}, 0.7)` : `${theme.buttonBackgroundColor ?? ''}40`
|
|
58
|
+
};
|
|
59
|
+
}
|
|
60
|
+
return {
|
|
61
|
+
opacity: 0.6
|
|
62
|
+
};
|
|
63
|
+
}, [isSecondary, theme]);
|
|
64
|
+
const hoverStyles = (0, _react.useMemo)(() => {
|
|
65
|
+
if (theme.buttonDesign === '2') {
|
|
66
|
+
return {
|
|
67
|
+
backgroundColor: `rgba(${theme['102-rgb'] ?? ''}, 0.5)`
|
|
68
|
+
};
|
|
69
|
+
}
|
|
70
|
+
return {
|
|
71
|
+
opacity: 1
|
|
72
|
+
};
|
|
73
|
+
}, [theme]);
|
|
42
74
|
return /*#__PURE__*/_react.default.createElement(_Button.StyledMotionButton, {
|
|
43
75
|
$ShouldShowTextAsRobotoMedium: ShouldShowTextAsRobotoMedium,
|
|
44
76
|
className: buttonClasses,
|
|
@@ -48,11 +80,14 @@ const Button = ({
|
|
|
48
80
|
$hasIcon: typeof icon === 'string' && icon !== '',
|
|
49
81
|
$isSecondary: isSecondary,
|
|
50
82
|
onClick: handleClick,
|
|
83
|
+
animate: {
|
|
84
|
+
backgroundColor
|
|
85
|
+
},
|
|
51
86
|
whileTap: isDisabled ? {} : {
|
|
52
|
-
|
|
87
|
+
...tapStyles
|
|
53
88
|
},
|
|
54
89
|
whileHover: isDisabled ? {} : {
|
|
55
|
-
|
|
90
|
+
...hoverStyles
|
|
56
91
|
}
|
|
57
92
|
}, /*#__PURE__*/_react.default.createElement(_framerMotion.AnimatePresence, {
|
|
58
93
|
initial: false
|
|
@@ -80,6 +115,7 @@ const Button = ({
|
|
|
80
115
|
duration: 0.2
|
|
81
116
|
}
|
|
82
117
|
}, /*#__PURE__*/_react.default.createElement(_WaitCursor.default, {
|
|
118
|
+
color: iconColor ?? 'white',
|
|
83
119
|
shouldHideBackground: true
|
|
84
120
|
})), !shouldShowWaitCursor && children && /*#__PURE__*/_react.default.createElement(_Button.StyledMotionChildrenWrapper, {
|
|
85
121
|
animate: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","names":["_clsx","_interopRequireDefault","require","_framerMotion","_react","_interopRequireWildcard","_styledComponents","_Icon","_Button","_WaitCursor","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","obj","Button","children","className","icon","isDisabled","isSecondary","onClick","shouldShowWaitCursor","shouldStopPropagation","ShouldShowTextAsRobotoMedium","handleClick","event","stopPropagation","buttonClasses","clsx","theme","useTheme","iconColor","useMemo","text","buttonColor","createElement","StyledMotionButton","$ShouldShowTextAsRobotoMedium","disabled","$isDisabled","$hasChildren","$hasIcon","$isSecondary","whileTap","backgroundColor","whileHover","AnimatePresence","initial","StyledIconWrapper","color","icons","StyledMotionWaitCursorWrapper","animate","opacity","width","exit","key","style","overflow","transition","duration","shouldHideBackground","StyledMotionChildrenWrapper","displayName","_default","exports"],"sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport { AnimatePresence } from 'framer-motion';\nimport React, { FC, MouseEventHandler, ReactNode, useMemo } from 'react';\nimport { useTheme } from 'styled-components';\nimport type { Theme } from '../color-scheme-provider/ColorSchemeProvider';\nimport Icon from '../icon/Icon';\nimport {\n StyledIconWrapper,\n StyledMotionButton,\n StyledMotionChildrenWrapper,\n StyledMotionWaitCursorWrapper,\n} from './Button.styles';\nimport WaitCursor from './wait-cursor/WaitCursor';\n\nexport type ButtonProps = {\n /**\n * The label of the button\n */\n children?: ReactNode;\n /**\n * Additional class names for the button element\n */\n className?: string;\n /**\n * An icon that is displayed on the left-hand side of the button text\n */\n icon?: string;\n /**\n * Disables the button so that it cannot be clicked anymore\n */\n isDisabled?: boolean;\n /**\n * Displays the button in the secondary style\n */\n isSecondary?: boolean;\n /**\n * Function to be executed when the button is clicked\n */\n onClick: MouseEventHandler<HTMLButtonElement>;\n /**\n * Whether the text should be 'Roboto Medium'\n */\n ShouldShowTextAsRobotoMedium?: boolean;\n /**\n * Shows a wait cursor instead of button text\n */\n shouldShowWaitCursor?: boolean;\n /**\n * Stops event propagation on click\n */\n shouldStopPropagation?: boolean;\n};\n\nconst Button: FC<ButtonProps> = ({\n children,\n className,\n icon,\n isDisabled,\n isSecondary,\n onClick,\n shouldShowWaitCursor,\n shouldStopPropagation,\n ShouldShowTextAsRobotoMedium = true,\n}) => {\n const handleClick: MouseEventHandler<HTMLButtonElement> = (event) => {\n if (shouldStopPropagation) {\n event.stopPropagation();\n }\n\n onClick(event);\n };\n\n const buttonClasses = clsx('beta-chayns-button ellipsis', className);\n\n const theme: Theme = useTheme();\n\n const iconColor = useMemo(() => {\n if (isSecondary) {\n return theme.text;\n }\n\n return theme.buttonColor ?? 'white';\n }, [isSecondary, theme.buttonColor, theme.text]);\n\n return (\n <StyledMotionButton\n $ShouldShowTextAsRobotoMedium={ShouldShowTextAsRobotoMedium}\n className={buttonClasses}\n disabled={isDisabled}\n $isDisabled={isDisabled}\n $hasChildren={!!children}\n $hasIcon={typeof icon === 'string' && icon !== ''}\n $isSecondary={isSecondary}\n onClick={handleClick}\n whileTap={\n isDisabled ? {} : { backgroundColor: isSecondary ? theme['201'] : theme['407'] }\n }\n whileHover={\n isDisabled ? {} : { backgroundColor: isSecondary ? theme['203'] : theme['409'] }\n }\n >\n <AnimatePresence initial={false}>\n {icon && (\n <StyledIconWrapper>\n <Icon color={iconColor} icons={[icon]} />\n </StyledIconWrapper>\n )}\n {shouldShowWaitCursor && (\n <StyledMotionWaitCursorWrapper\n animate={{ opacity: 1, width: 40 }}\n exit={{ opacity: 0, width: 0 }}\n initial={{ opacity: 0, width: 0 }}\n key=\"wait-cursor\"\n style={{ overflow: 'hidden' }}\n transition={{ duration: 0.2 }}\n >\n <WaitCursor shouldHideBackground />\n </StyledMotionWaitCursorWrapper>\n )}\n {!shouldShowWaitCursor && children && (\n <StyledMotionChildrenWrapper\n animate={{ opacity: 1, width: 'auto' }}\n exit={{ opacity: 0, width: 0 }}\n initial={{ opacity: 0, width: 0 }}\n key=\"children\"\n // style={{ overflow: 'hidden' }}\n transition={{ duration: 0.2 }}\n >\n {children}\n </StyledMotionChildrenWrapper>\n )}\n </AnimatePresence>\n </StyledMotionButton>\n );\n};\n\nButton.displayName = 'Button';\n\nexport default Button;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"Button.js","names":["_clsx","_interopRequireDefault","require","_framerMotion","_react","_interopRequireWildcard","_styledComponents","_Icon","_Button","_WaitCursor","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","obj","Button","children","className","icon","isDisabled","isSecondary","onClick","shouldShowWaitCursor","shouldStopPropagation","ShouldShowTextAsRobotoMedium","handleClick","event","stopPropagation","buttonClasses","clsx","theme","useTheme","iconColor","useMemo","text","buttonColor","backgroundColor","color","buttonBackgroundColor","buttonDesign","tapStyles","opacity","hoverStyles","createElement","StyledMotionButton","$ShouldShowTextAsRobotoMedium","disabled","$isDisabled","$hasChildren","$hasIcon","$isSecondary","animate","whileTap","whileHover","AnimatePresence","initial","StyledIconWrapper","icons","StyledMotionWaitCursorWrapper","width","exit","key","style","overflow","transition","duration","shouldHideBackground","StyledMotionChildrenWrapper","displayName","_default","exports"],"sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport { AnimatePresence } from 'framer-motion';\nimport React, { FC, MouseEventHandler, ReactNode, useMemo } from 'react';\nimport { useTheme } from 'styled-components';\nimport type { Theme } from '../color-scheme-provider/ColorSchemeProvider';\nimport Icon from '../icon/Icon';\nimport {\n StyledIconWrapper,\n StyledMotionButton,\n StyledMotionChildrenWrapper,\n StyledMotionWaitCursorWrapper,\n} from './Button.styles';\nimport WaitCursor from './wait-cursor/WaitCursor';\n\nexport type ButtonProps = {\n /**\n * The label of the button\n */\n children?: ReactNode;\n /**\n * Additional class names for the button element\n */\n className?: string;\n /**\n * An icon that is displayed on the left-hand side of the button text\n */\n icon?: string;\n /**\n * Disables the button so that it cannot be clicked anymore\n */\n isDisabled?: boolean;\n /**\n * Displays the button in the secondary style\n */\n isSecondary?: boolean;\n /**\n * Function to be executed when the button is clicked\n */\n onClick: MouseEventHandler<HTMLButtonElement>;\n /**\n * Whether the text should be 'Roboto Medium'\n */\n ShouldShowTextAsRobotoMedium?: boolean;\n /**\n * Shows a wait cursor instead of button text\n */\n shouldShowWaitCursor?: boolean;\n /**\n * Stops event propagation on click\n */\n shouldStopPropagation?: boolean;\n};\n\nconst Button: FC<ButtonProps> = ({\n children,\n className,\n icon,\n isDisabled,\n isSecondary,\n onClick,\n shouldShowWaitCursor,\n shouldStopPropagation,\n ShouldShowTextAsRobotoMedium = true,\n}) => {\n const handleClick: MouseEventHandler<HTMLButtonElement> = (event) => {\n if (shouldStopPropagation) {\n event.stopPropagation();\n }\n\n onClick(event);\n };\n\n const buttonClasses = clsx('beta-chayns-button ellipsis', className);\n\n const theme: Theme = useTheme();\n\n const iconColor = useMemo(() => {\n if (isSecondary) {\n return theme.text;\n }\n\n return theme.buttonColor ?? 'white';\n }, [isSecondary, theme.buttonColor, theme.text]);\n\n const backgroundColor = useMemo(() => {\n let color;\n\n if (isSecondary) {\n color = theme['202'];\n } else {\n color = theme.buttonBackgroundColor ?? theme['408'];\n }\n\n if (theme.buttonDesign === '2') {\n color = `rgba(${theme['102-rgb'] ?? ''}, 0)`;\n }\n\n return color;\n }, [isSecondary, theme]);\n\n const tapStyles = useMemo(() => {\n if (theme.buttonDesign === '2') {\n return {\n backgroundColor: isSecondary\n ? `rgba(${theme['202-rgb'] ?? ''}, 0.7)`\n : `${theme.buttonBackgroundColor ?? ''}40`,\n };\n }\n\n return {\n opacity: 0.6,\n };\n }, [isSecondary, theme]);\n\n const hoverStyles = useMemo(() => {\n if (theme.buttonDesign === '2') {\n return {\n backgroundColor: `rgba(${theme['102-rgb'] ?? ''}, 0.5)`,\n };\n }\n\n return {\n opacity: 1,\n };\n }, [theme]);\n\n return (\n <StyledMotionButton\n $ShouldShowTextAsRobotoMedium={ShouldShowTextAsRobotoMedium}\n className={buttonClasses}\n disabled={isDisabled}\n $isDisabled={isDisabled}\n $hasChildren={!!children}\n $hasIcon={typeof icon === 'string' && icon !== ''}\n $isSecondary={isSecondary}\n onClick={handleClick}\n animate={{ backgroundColor }}\n whileTap={isDisabled ? {} : { ...tapStyles }}\n whileHover={isDisabled ? {} : { ...hoverStyles }}\n >\n <AnimatePresence initial={false}>\n {icon && (\n <StyledIconWrapper>\n <Icon color={iconColor} icons={[icon]} />\n </StyledIconWrapper>\n )}\n {shouldShowWaitCursor && (\n <StyledMotionWaitCursorWrapper\n animate={{ opacity: 1, width: 40 }}\n exit={{ opacity: 0, width: 0 }}\n initial={{ opacity: 0, width: 0 }}\n key=\"wait-cursor\"\n style={{ overflow: 'hidden' }}\n transition={{ duration: 0.2 }}\n >\n <WaitCursor color={iconColor ?? 'white'} shouldHideBackground />\n </StyledMotionWaitCursorWrapper>\n )}\n {!shouldShowWaitCursor && children && (\n <StyledMotionChildrenWrapper\n animate={{ opacity: 1, width: 'auto' }}\n exit={{ opacity: 0, width: 0 }}\n initial={{ opacity: 0, width: 0 }}\n key=\"children\"\n // style={{ overflow: 'hidden' }}\n transition={{ duration: 0.2 }}\n >\n {children}\n </StyledMotionChildrenWrapper>\n )}\n </AnimatePresence>\n </StyledMotionButton>\n );\n};\n\nButton.displayName = 'Button';\n\nexport default Button;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -24,13 +24,11 @@ const StyledMotionButton = exports.StyledMotionButton = (0, _styledComponents.de
|
|
|
24
24
|
}) => {
|
|
25
25
|
if ($isSecondary) {
|
|
26
26
|
return (0, _styledComponents.css)`
|
|
27
|
-
background-color: ${theme['202']};
|
|
28
27
|
color: ${theme.text};
|
|
29
28
|
`;
|
|
30
29
|
}
|
|
31
30
|
return (0, _styledComponents.css)`
|
|
32
|
-
|
|
33
|
-
color: ${theme.buttonColor ?? 'white'};
|
|
31
|
+
color: ${theme.buttonColor ?? theme.buttonBackgroundColor ?? 'white'};
|
|
34
32
|
`;
|
|
35
33
|
}}
|
|
36
34
|
|
|
@@ -40,7 +38,6 @@ const StyledMotionButton = exports.StyledMotionButton = (0, _styledComponents.de
|
|
|
40
38
|
}) => {
|
|
41
39
|
if (theme.buttonDesign === '2') {
|
|
42
40
|
return (0, _styledComponents.css)`
|
|
43
|
-
background-color: transparent;
|
|
44
41
|
border: 1px solid ${$isSecondary ? theme['202'] : theme.buttonBackgroundColor};
|
|
45
42
|
box-shadow: none;
|
|
46
43
|
`;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.styles.js","names":["_framerMotion","require","_styledComponents","_interopRequireWildcard","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","StyledMotionButton","exports","styled","motion","button","$ShouldShowTextAsRobotoMedium","css","$isSecondary","theme","text","
|
|
1
|
+
{"version":3,"file":"Button.styles.js","names":["_framerMotion","require","_styledComponents","_interopRequireWildcard","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","StyledMotionButton","exports","styled","motion","button","$ShouldShowTextAsRobotoMedium","css","$isSecondary","theme","text","buttonColor","buttonBackgroundColor","buttonDesign","$isDisabled","$hasIcon","$hasChildren","StyledIconWrapper","span","StyledMotionChildrenWrapper","div","StyledMotionWaitCursorWrapper"],"sources":["../../../../src/components/button/Button.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type { FramerMotionBugFix, WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledButtonProps = WithTheme<{\n $hasIcon: boolean;\n $hasChildren: boolean;\n $isDisabled?: boolean;\n $isSecondary?: boolean;\n $ShouldShowTextAsRobotoMedium: boolean;\n}>;\n\nexport const StyledMotionButton = styled(motion.button)<StyledButtonProps>`\n ${({ $ShouldShowTextAsRobotoMedium }) =>\n $ShouldShowTextAsRobotoMedium &&\n css`\n font-size: 110%;\n font-family: 'Roboto Medium', serif;\n `}\n\n align-items: center;\n\n ${({ $isSecondary, theme }: StyledButtonProps) => {\n if ($isSecondary) {\n return css`\n color: ${theme.text};\n `;\n }\n\n return css`\n color: ${theme.buttonColor ?? theme.buttonBackgroundColor ?? 'white'};\n `;\n }}\n\n ${({ theme, $isSecondary }: StyledButtonProps) => {\n if (theme.buttonDesign === '2') {\n return css`\n border: 1px solid ${$isSecondary ? theme['202'] : theme.buttonBackgroundColor};\n box-shadow: none;\n `;\n }\n\n return css`\n border: none;\n box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.2);\n `;\n }}\n\n border-radius: 3px;\n cursor: ${({ $isDisabled }) => ($isDisabled ? 'default' : 'pointer')};\n display: inline-flex;\n line-height: 1.15;\n min-height: 32px;\n opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n position: relative;\n user-select: none;\n transition: opacity 0.3s ease;\n\n ${({ $hasIcon, $hasChildren }) => {\n if ($hasIcon) {\n if ($hasChildren) {\n return css`\n padding: 7px 12px 7px 42px;\n `;\n }\n return css`\n padding: 7px 12px 7px 18px;\n `;\n }\n return css`\n padding: 7px 12px 7px 12px;\n `;\n }}\n`;\n\nexport const StyledIconWrapper = styled.span`\n align-items: center;\n background-color: rgba(255, 255, 255, 0.2);\n bottom: 0;\n display: flex;\n justify-content: center;\n left: 0;\n position: absolute;\n top: 0;\n width: 30px;\n`;\n\nexport const StyledMotionChildrenWrapper = styled(motion.div)<FramerMotionBugFix>``;\n\nexport const StyledMotionWaitCursorWrapper = styled(motion.div)<FramerMotionBugFix>`\n align-items: center;\n display: flex;\n justify-content: center;\n`;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -8,11 +8,14 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
8
8
|
var _WaitCursor = require("./WaitCursor.styles");
|
|
9
9
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
10
10
|
const WaitCursor = ({
|
|
11
|
+
color,
|
|
11
12
|
shouldHideBackground = false,
|
|
12
13
|
shouldHideWaitCursor = false
|
|
13
14
|
}) => /*#__PURE__*/_react.default.createElement(_WaitCursor.StyledWaitCursor, {
|
|
14
15
|
$shouldShowWaitCursor: !shouldHideWaitCursor
|
|
15
|
-
}, /*#__PURE__*/_react.default.createElement(_WaitCursor.StyledWaitCursorWaitCursor,
|
|
16
|
+
}, /*#__PURE__*/_react.default.createElement(_WaitCursor.StyledWaitCursorWaitCursor, {
|
|
17
|
+
$color: color
|
|
18
|
+
}), !shouldHideBackground && /*#__PURE__*/_react.default.createElement(_WaitCursor.StyledWaitCursorBackground, null));
|
|
16
19
|
WaitCursor.displayName = 'WaitCursor';
|
|
17
20
|
var _default = exports.default = WaitCursor;
|
|
18
21
|
//# sourceMappingURL=WaitCursor.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"WaitCursor.js","names":["_react","_interopRequireDefault","require","_WaitCursor","obj","__esModule","default","WaitCursor","shouldHideBackground","shouldHideWaitCursor","createElement","StyledWaitCursor","$shouldShowWaitCursor","StyledWaitCursorWaitCursor","StyledWaitCursorBackground","displayName","_default","exports"],"sources":["../../../../../src/components/button/wait-cursor/WaitCursor.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport {\n StyledWaitCursor,\n StyledWaitCursorBackground,\n StyledWaitCursorWaitCursor,\n} from './WaitCursor.styles';\n\nexport type WaitCursorProps = {\n shouldHideBackground?: boolean;\n
|
|
1
|
+
{"version":3,"file":"WaitCursor.js","names":["_react","_interopRequireDefault","require","_WaitCursor","obj","__esModule","default","WaitCursor","color","shouldHideBackground","shouldHideWaitCursor","createElement","StyledWaitCursor","$shouldShowWaitCursor","StyledWaitCursorWaitCursor","$color","StyledWaitCursorBackground","displayName","_default","exports"],"sources":["../../../../../src/components/button/wait-cursor/WaitCursor.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport {\n StyledWaitCursor,\n StyledWaitCursorBackground,\n StyledWaitCursorWaitCursor,\n} from './WaitCursor.styles';\n\nexport type WaitCursorProps = {\n color: string;\n shouldHideBackground?: boolean;\n shouldHideWaitCursor?: boolean;\n};\n\nconst WaitCursor: FC<WaitCursorProps> = ({\n color,\n shouldHideBackground = false,\n shouldHideWaitCursor = false,\n}) => (\n <StyledWaitCursor $shouldShowWaitCursor={!shouldHideWaitCursor}>\n <StyledWaitCursorWaitCursor $color={color} />\n {!shouldHideBackground && <StyledWaitCursorBackground />}\n </StyledWaitCursor>\n);\n\nWaitCursor.displayName = 'WaitCursor';\n\nexport default WaitCursor;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,WAAA,GAAAD,OAAA;AAI6B,SAAAD,uBAAAG,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAQ7B,MAAMG,UAA+B,GAAGA,CAAC;EACrCC,KAAK;EACLC,oBAAoB,GAAG,KAAK;EAC5BC,oBAAoB,GAAG;AAC3B,CAAC,kBACGV,MAAA,CAAAM,OAAA,CAAAK,aAAA,CAACR,WAAA,CAAAS,gBAAgB;EAACC,qBAAqB,EAAE,CAACH;AAAqB,gBAC3DV,MAAA,CAAAM,OAAA,CAAAK,aAAA,CAACR,WAAA,CAAAW,0BAA0B;EAACC,MAAM,EAAEP;AAAM,CAAE,CAAC,EAC5C,CAACC,oBAAoB,iBAAIT,MAAA,CAAAM,OAAA,CAAAK,aAAA,CAACR,WAAA,CAAAa,0BAA0B,MAAE,CACzC,CACrB;AAEDT,UAAU,CAACU,WAAW,GAAG,YAAY;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAb,OAAA,GAEvBC,UAAU","ignoreList":[]}
|
|
@@ -41,7 +41,9 @@ const StyledWaitCursorWaitCursor = exports.StyledWaitCursorWaitCursor = _styledC
|
|
|
41
41
|
z-index: 2;
|
|
42
42
|
border-style: solid;
|
|
43
43
|
border-width: 3px;
|
|
44
|
-
border-color:
|
|
44
|
+
border-color: ${({
|
|
45
|
+
$color
|
|
46
|
+
}) => $color};
|
|
45
47
|
height: ${26 - 10}px;
|
|
46
48
|
width: ${26 - 10}px;
|
|
47
49
|
border-radius: 50%;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"WaitCursor.styles.js","names":["_styledComponents","_interopRequireWildcard","require","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","StyledWaitCursor","exports","styled","div","$shouldShowWaitCursor","StyledWaitCursorBackground","spin","keyframes","StyledWaitCursorWaitCursor"],"sources":["../../../../../src/components/button/wait-cursor/WaitCursor.styles.ts"],"sourcesContent":["import styled, { keyframes } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledWaitCursorProps = WithTheme<{\n $shouldShowWaitCursor: boolean;\n}>;\n\nexport const StyledWaitCursor = styled.div<StyledWaitCursorProps>`\n position: relative;\n height: 26px;\n width: 26px;\n opacity: ${({ $shouldShowWaitCursor }) => ($shouldShowWaitCursor ? 1 : 0)};\n`;\n\ntype StyledWaitCursorBackgroundProps = WithTheme<unknown>;\n\nexport const StyledWaitCursorBackground = styled.div<StyledWaitCursorBackgroundProps>`\n background-color: white;\n border-radius: 50%;\n height: 100%;\n width: 100%;\n position: relative;\n z-index: 1;\n box-shadow:\n 0 4px 12px 0 rgba(0, 0, 0, 0.2),\n 0 1px 1px rgba(0, 0, 0, 0.2);\n`;\n\ntype StyledWaitCursorWaitCursorProps = WithTheme<
|
|
1
|
+
{"version":3,"file":"WaitCursor.styles.js","names":["_styledComponents","_interopRequireWildcard","require","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","StyledWaitCursor","exports","styled","div","$shouldShowWaitCursor","StyledWaitCursorBackground","spin","keyframes","StyledWaitCursorWaitCursor","$color"],"sources":["../../../../../src/components/button/wait-cursor/WaitCursor.styles.ts"],"sourcesContent":["import styled, { keyframes } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledWaitCursorProps = WithTheme<{\n $shouldShowWaitCursor: boolean;\n}>;\n\nexport const StyledWaitCursor = styled.div<StyledWaitCursorProps>`\n position: relative;\n height: 26px;\n width: 26px;\n opacity: ${({ $shouldShowWaitCursor }) => ($shouldShowWaitCursor ? 1 : 0)};\n`;\n\ntype StyledWaitCursorBackgroundProps = WithTheme<unknown>;\n\nexport const StyledWaitCursorBackground = styled.div<StyledWaitCursorBackgroundProps>`\n background-color: white;\n border-radius: 50%;\n height: 100%;\n width: 100%;\n position: relative;\n z-index: 1;\n box-shadow:\n 0 4px 12px 0 rgba(0, 0, 0, 0.2),\n 0 1px 1px rgba(0, 0, 0, 0.2);\n`;\n\ntype StyledWaitCursorWaitCursorProps = WithTheme<{ $color: string }>;\n\nconst spin = keyframes`\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n`;\n\nexport const StyledWaitCursorWaitCursor = styled.div<StyledWaitCursorWaitCursorProps>`\n position: absolute;\n top: 5px;\n left: 5px;\n z-index: 2;\n border-style: solid;\n border-width: 3px;\n border-color: ${({ $color }) => $color};\n height: ${26 - 10}px;\n width: ${26 - 10}px;\n border-radius: 50%;\n display: inline-block;\n border-top: 3px solid transparent;\n\n animation: ${spin} 1s linear infinite;\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,uBAAA,CAAAC,OAAA;AAAsD,SAAAC,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAH,wBAAAG,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAO/C,MAAMW,gBAAgB,GAAAC,OAAA,CAAAD,gBAAA,GAAGE,yBAAM,CAACC,GAA2B;AAClE;AACA;AACA;AACA,eAAe,CAAC;EAAEC;AAAsB,CAAC,KAAMA,qBAAqB,GAAG,CAAC,GAAG,CAAG;AAC9E,CAAC;AAIM,MAAMC,0BAA0B,GAAAJ,OAAA,CAAAI,0BAAA,GAAGH,yBAAM,CAACC,GAAqC;AACtF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAID,MAAMG,IAAI,GAAG,IAAAC,2BAAS,CAAC;AACvB;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAEM,MAAMC,0BAA0B,GAAAP,OAAA,CAAAO,0BAAA,GAAGN,yBAAM,CAACC,GAAqC;AACtF;AACA;AACA;AACA;AACA;AACA;AACA,oBAAoB,CAAC;EAAEM;AAAO,CAAC,KAAKA,MAAO;AAC3C,cAAc,EAAE,GAAG,EAAG;AACtB,aAAa,EAAE,GAAG,EAAG;AACrB;AACA;AACA;AACA;AACA,iBAAiBH,IAAK;AACtB,CAAC","ignoreList":[]}
|
|
@@ -31,6 +31,38 @@ const Button = _ref => {
|
|
|
31
31
|
}
|
|
32
32
|
return theme.buttonColor ?? 'white';
|
|
33
33
|
}, [isSecondary, theme.buttonColor, theme.text]);
|
|
34
|
+
const backgroundColor = useMemo(() => {
|
|
35
|
+
let color;
|
|
36
|
+
if (isSecondary) {
|
|
37
|
+
color = theme['202'];
|
|
38
|
+
} else {
|
|
39
|
+
color = theme.buttonBackgroundColor ?? theme['408'];
|
|
40
|
+
}
|
|
41
|
+
if (theme.buttonDesign === '2') {
|
|
42
|
+
color = `rgba(${theme['102-rgb'] ?? ''}, 0)`;
|
|
43
|
+
}
|
|
44
|
+
return color;
|
|
45
|
+
}, [isSecondary, theme]);
|
|
46
|
+
const tapStyles = useMemo(() => {
|
|
47
|
+
if (theme.buttonDesign === '2') {
|
|
48
|
+
return {
|
|
49
|
+
backgroundColor: isSecondary ? `rgba(${theme['202-rgb'] ?? ''}, 0.7)` : `${theme.buttonBackgroundColor ?? ''}40`
|
|
50
|
+
};
|
|
51
|
+
}
|
|
52
|
+
return {
|
|
53
|
+
opacity: 0.6
|
|
54
|
+
};
|
|
55
|
+
}, [isSecondary, theme]);
|
|
56
|
+
const hoverStyles = useMemo(() => {
|
|
57
|
+
if (theme.buttonDesign === '2') {
|
|
58
|
+
return {
|
|
59
|
+
backgroundColor: `rgba(${theme['102-rgb'] ?? ''}, 0.5)`
|
|
60
|
+
};
|
|
61
|
+
}
|
|
62
|
+
return {
|
|
63
|
+
opacity: 1
|
|
64
|
+
};
|
|
65
|
+
}, [theme]);
|
|
34
66
|
return /*#__PURE__*/React.createElement(StyledMotionButton, {
|
|
35
67
|
$ShouldShowTextAsRobotoMedium: ShouldShowTextAsRobotoMedium,
|
|
36
68
|
className: buttonClasses,
|
|
@@ -40,11 +72,14 @@ const Button = _ref => {
|
|
|
40
72
|
$hasIcon: typeof icon === 'string' && icon !== '',
|
|
41
73
|
$isSecondary: isSecondary,
|
|
42
74
|
onClick: handleClick,
|
|
75
|
+
animate: {
|
|
76
|
+
backgroundColor
|
|
77
|
+
},
|
|
43
78
|
whileTap: isDisabled ? {} : {
|
|
44
|
-
|
|
79
|
+
...tapStyles
|
|
45
80
|
},
|
|
46
81
|
whileHover: isDisabled ? {} : {
|
|
47
|
-
|
|
82
|
+
...hoverStyles
|
|
48
83
|
}
|
|
49
84
|
}, /*#__PURE__*/React.createElement(AnimatePresence, {
|
|
50
85
|
initial: false
|
|
@@ -72,6 +107,7 @@ const Button = _ref => {
|
|
|
72
107
|
duration: 0.2
|
|
73
108
|
}
|
|
74
109
|
}, /*#__PURE__*/React.createElement(WaitCursor, {
|
|
110
|
+
color: iconColor ?? 'white',
|
|
75
111
|
shouldHideBackground: true
|
|
76
112
|
})), !shouldShowWaitCursor && children && /*#__PURE__*/React.createElement(StyledMotionChildrenWrapper, {
|
|
77
113
|
animate: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","names":["clsx","AnimatePresence","React","useMemo","useTheme","Icon","StyledIconWrapper","StyledMotionButton","StyledMotionChildrenWrapper","StyledMotionWaitCursorWrapper","WaitCursor","Button","_ref","children","className","icon","isDisabled","isSecondary","onClick","shouldShowWaitCursor","shouldStopPropagation","ShouldShowTextAsRobotoMedium","handleClick","event","stopPropagation","buttonClasses","theme","iconColor","text","buttonColor","createElement","$ShouldShowTextAsRobotoMedium","disabled","$isDisabled","$hasChildren","$hasIcon","$isSecondary","
|
|
1
|
+
{"version":3,"file":"Button.js","names":["clsx","AnimatePresence","React","useMemo","useTheme","Icon","StyledIconWrapper","StyledMotionButton","StyledMotionChildrenWrapper","StyledMotionWaitCursorWrapper","WaitCursor","Button","_ref","children","className","icon","isDisabled","isSecondary","onClick","shouldShowWaitCursor","shouldStopPropagation","ShouldShowTextAsRobotoMedium","handleClick","event","stopPropagation","buttonClasses","theme","iconColor","text","buttonColor","backgroundColor","color","buttonBackgroundColor","buttonDesign","tapStyles","opacity","hoverStyles","createElement","$ShouldShowTextAsRobotoMedium","disabled","$isDisabled","$hasChildren","$hasIcon","$isSecondary","animate","whileTap","whileHover","initial","icons","width","exit","key","style","overflow","transition","duration","shouldHideBackground","displayName"],"sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport { AnimatePresence } from 'framer-motion';\nimport React, { FC, MouseEventHandler, ReactNode, useMemo } from 'react';\nimport { useTheme } from 'styled-components';\nimport type { Theme } from '../color-scheme-provider/ColorSchemeProvider';\nimport Icon from '../icon/Icon';\nimport {\n StyledIconWrapper,\n StyledMotionButton,\n StyledMotionChildrenWrapper,\n StyledMotionWaitCursorWrapper,\n} from './Button.styles';\nimport WaitCursor from './wait-cursor/WaitCursor';\n\nexport type ButtonProps = {\n /**\n * The label of the button\n */\n children?: ReactNode;\n /**\n * Additional class names for the button element\n */\n className?: string;\n /**\n * An icon that is displayed on the left-hand side of the button text\n */\n icon?: string;\n /**\n * Disables the button so that it cannot be clicked anymore\n */\n isDisabled?: boolean;\n /**\n * Displays the button in the secondary style\n */\n isSecondary?: boolean;\n /**\n * Function to be executed when the button is clicked\n */\n onClick: MouseEventHandler<HTMLButtonElement>;\n /**\n * Whether the text should be 'Roboto Medium'\n */\n ShouldShowTextAsRobotoMedium?: boolean;\n /**\n * Shows a wait cursor instead of button text\n */\n shouldShowWaitCursor?: boolean;\n /**\n * Stops event propagation on click\n */\n shouldStopPropagation?: boolean;\n};\n\nconst Button: FC<ButtonProps> = ({\n children,\n className,\n icon,\n isDisabled,\n isSecondary,\n onClick,\n shouldShowWaitCursor,\n shouldStopPropagation,\n ShouldShowTextAsRobotoMedium = true,\n}) => {\n const handleClick: MouseEventHandler<HTMLButtonElement> = (event) => {\n if (shouldStopPropagation) {\n event.stopPropagation();\n }\n\n onClick(event);\n };\n\n const buttonClasses = clsx('beta-chayns-button ellipsis', className);\n\n const theme: Theme = useTheme();\n\n const iconColor = useMemo(() => {\n if (isSecondary) {\n return theme.text;\n }\n\n return theme.buttonColor ?? 'white';\n }, [isSecondary, theme.buttonColor, theme.text]);\n\n const backgroundColor = useMemo(() => {\n let color;\n\n if (isSecondary) {\n color = theme['202'];\n } else {\n color = theme.buttonBackgroundColor ?? theme['408'];\n }\n\n if (theme.buttonDesign === '2') {\n color = `rgba(${theme['102-rgb'] ?? ''}, 0)`;\n }\n\n return color;\n }, [isSecondary, theme]);\n\n const tapStyles = useMemo(() => {\n if (theme.buttonDesign === '2') {\n return {\n backgroundColor: isSecondary\n ? `rgba(${theme['202-rgb'] ?? ''}, 0.7)`\n : `${theme.buttonBackgroundColor ?? ''}40`,\n };\n }\n\n return {\n opacity: 0.6,\n };\n }, [isSecondary, theme]);\n\n const hoverStyles = useMemo(() => {\n if (theme.buttonDesign === '2') {\n return {\n backgroundColor: `rgba(${theme['102-rgb'] ?? ''}, 0.5)`,\n };\n }\n\n return {\n opacity: 1,\n };\n }, [theme]);\n\n return (\n <StyledMotionButton\n $ShouldShowTextAsRobotoMedium={ShouldShowTextAsRobotoMedium}\n className={buttonClasses}\n disabled={isDisabled}\n $isDisabled={isDisabled}\n $hasChildren={!!children}\n $hasIcon={typeof icon === 'string' && icon !== ''}\n $isSecondary={isSecondary}\n onClick={handleClick}\n animate={{ backgroundColor }}\n whileTap={isDisabled ? {} : { ...tapStyles }}\n whileHover={isDisabled ? {} : { ...hoverStyles }}\n >\n <AnimatePresence initial={false}>\n {icon && (\n <StyledIconWrapper>\n <Icon color={iconColor} icons={[icon]} />\n </StyledIconWrapper>\n )}\n {shouldShowWaitCursor && (\n <StyledMotionWaitCursorWrapper\n animate={{ opacity: 1, width: 40 }}\n exit={{ opacity: 0, width: 0 }}\n initial={{ opacity: 0, width: 0 }}\n key=\"wait-cursor\"\n style={{ overflow: 'hidden' }}\n transition={{ duration: 0.2 }}\n >\n <WaitCursor color={iconColor ?? 'white'} shouldHideBackground />\n </StyledMotionWaitCursorWrapper>\n )}\n {!shouldShowWaitCursor && children && (\n <StyledMotionChildrenWrapper\n animate={{ opacity: 1, width: 'auto' }}\n exit={{ opacity: 0, width: 0 }}\n initial={{ opacity: 0, width: 0 }}\n key=\"children\"\n // style={{ overflow: 'hidden' }}\n transition={{ duration: 0.2 }}\n >\n {children}\n </StyledMotionChildrenWrapper>\n )}\n </AnimatePresence>\n </StyledMotionButton>\n );\n};\n\nButton.displayName = 'Button';\n\nexport default Button;\n"],"mappings":"AAAA,OAAOA,IAAI,MAAM,MAAM;AACvB,SAASC,eAAe,QAAQ,eAAe;AAC/C,OAAOC,KAAK,IAAsCC,OAAO,QAAQ,OAAO;AACxE,SAASC,QAAQ,QAAQ,mBAAmB;AAE5C,OAAOC,IAAI,MAAM,cAAc;AAC/B,SACIC,iBAAiB,EACjBC,kBAAkB,EAClBC,2BAA2B,EAC3BC,6BAA6B,QAC1B,iBAAiB;AACxB,OAAOC,UAAU,MAAM,0BAA0B;AAyCjD,MAAMC,MAAuB,GAAGC,IAAA,IAU1B;EAAA,IAV2B;IAC7BC,QAAQ;IACRC,SAAS;IACTC,IAAI;IACJC,UAAU;IACVC,WAAW;IACXC,OAAO;IACPC,oBAAoB;IACpBC,qBAAqB;IACrBC,4BAA4B,GAAG;EACnC,CAAC,GAAAT,IAAA;EACG,MAAMU,WAAiD,GAAIC,KAAK,IAAK;IACjE,IAAIH,qBAAqB,EAAE;MACvBG,KAAK,CAACC,eAAe,CAAC,CAAC;IAC3B;IAEAN,OAAO,CAACK,KAAK,CAAC;EAClB,CAAC;EAED,MAAME,aAAa,GAAGzB,IAAI,CAAC,6BAA6B,EAAEc,SAAS,CAAC;EAEpE,MAAMY,KAAY,GAAGtB,QAAQ,CAAC,CAAC;EAE/B,MAAMuB,SAAS,GAAGxB,OAAO,CAAC,MAAM;IAC5B,IAAIc,WAAW,EAAE;MACb,OAAOS,KAAK,CAACE,IAAI;IACrB;IAEA,OAAOF,KAAK,CAACG,WAAW,IAAI,OAAO;EACvC,CAAC,EAAE,CAACZ,WAAW,EAAES,KAAK,CAACG,WAAW,EAAEH,KAAK,CAACE,IAAI,CAAC,CAAC;EAEhD,MAAME,eAAe,GAAG3B,OAAO,CAAC,MAAM;IAClC,IAAI4B,KAAK;IAET,IAAId,WAAW,EAAE;MACbc,KAAK,GAAGL,KAAK,CAAC,KAAK,CAAC;IACxB,CAAC,MAAM;MACHK,KAAK,GAAGL,KAAK,CAACM,qBAAqB,IAAIN,KAAK,CAAC,KAAK,CAAC;IACvD;IAEA,IAAIA,KAAK,CAACO,YAAY,KAAK,GAAG,EAAE;MAC5BF,KAAK,GAAI,QAAOL,KAAK,CAAC,SAAS,CAAC,IAAI,EAAG,MAAK;IAChD;IAEA,OAAOK,KAAK;EAChB,CAAC,EAAE,CAACd,WAAW,EAAES,KAAK,CAAC,CAAC;EAExB,MAAMQ,SAAS,GAAG/B,OAAO,CAAC,MAAM;IAC5B,IAAIuB,KAAK,CAACO,YAAY,KAAK,GAAG,EAAE;MAC5B,OAAO;QACHH,eAAe,EAAEb,WAAW,GACrB,QAAOS,KAAK,CAAC,SAAS,CAAC,IAAI,EAAG,QAAO,GACrC,GAAEA,KAAK,CAACM,qBAAqB,IAAI,EAAG;MAC/C,CAAC;IACL;IAEA,OAAO;MACHG,OAAO,EAAE;IACb,CAAC;EACL,CAAC,EAAE,CAAClB,WAAW,EAAES,KAAK,CAAC,CAAC;EAExB,MAAMU,WAAW,GAAGjC,OAAO,CAAC,MAAM;IAC9B,IAAIuB,KAAK,CAACO,YAAY,KAAK,GAAG,EAAE;MAC5B,OAAO;QACHH,eAAe,EAAG,QAAOJ,KAAK,CAAC,SAAS,CAAC,IAAI,EAAG;MACpD,CAAC;IACL;IAEA,OAAO;MACHS,OAAO,EAAE;IACb,CAAC;EACL,CAAC,EAAE,CAACT,KAAK,CAAC,CAAC;EAEX,oBACIxB,KAAA,CAAAmC,aAAA,CAAC9B,kBAAkB;IACf+B,6BAA6B,EAAEjB,4BAA6B;IAC5DP,SAAS,EAAEW,aAAc;IACzBc,QAAQ,EAAEvB,UAAW;IACrBwB,WAAW,EAAExB,UAAW;IACxByB,YAAY,EAAE,CAAC,CAAC5B,QAAS;IACzB6B,QAAQ,EAAE,OAAO3B,IAAI,KAAK,QAAQ,IAAIA,IAAI,KAAK,EAAG;IAClD4B,YAAY,EAAE1B,WAAY;IAC1BC,OAAO,EAAEI,WAAY;IACrBsB,OAAO,EAAE;MAAEd;IAAgB,CAAE;IAC7Be,QAAQ,EAAE7B,UAAU,GAAG,CAAC,CAAC,GAAG;MAAE,GAAGkB;IAAU,CAAE;IAC7CY,UAAU,EAAE9B,UAAU,GAAG,CAAC,CAAC,GAAG;MAAE,GAAGoB;IAAY;EAAE,gBAEjDlC,KAAA,CAAAmC,aAAA,CAACpC,eAAe;IAAC8C,OAAO,EAAE;EAAM,GAC3BhC,IAAI,iBACDb,KAAA,CAAAmC,aAAA,CAAC/B,iBAAiB,qBACdJ,KAAA,CAAAmC,aAAA,CAAChC,IAAI;IAAC0B,KAAK,EAAEJ,SAAU;IAACqB,KAAK,EAAE,CAACjC,IAAI;EAAE,CAAE,CACzB,CACtB,EACAI,oBAAoB,iBACjBjB,KAAA,CAAAmC,aAAA,CAAC5B,6BAA6B;IAC1BmC,OAAO,EAAE;MAAET,OAAO,EAAE,CAAC;MAAEc,KAAK,EAAE;IAAG,CAAE;IACnCC,IAAI,EAAE;MAAEf,OAAO,EAAE,CAAC;MAAEc,KAAK,EAAE;IAAE,CAAE;IAC/BF,OAAO,EAAE;MAAEZ,OAAO,EAAE,CAAC;MAAEc,KAAK,EAAE;IAAE,CAAE;IAClCE,GAAG,EAAC,aAAa;IACjBC,KAAK,EAAE;MAAEC,QAAQ,EAAE;IAAS,CAAE;IAC9BC,UAAU,EAAE;MAAEC,QAAQ,EAAE;IAAI;EAAE,gBAE9BrD,KAAA,CAAAmC,aAAA,CAAC3B,UAAU;IAACqB,KAAK,EAAEJ,SAAS,IAAI,OAAQ;IAAC6B,oBAAoB;EAAA,CAAE,CACpC,CAClC,EACA,CAACrC,oBAAoB,IAAIN,QAAQ,iBAC9BX,KAAA,CAAAmC,aAAA,CAAC7B,2BAA2B;IACxBoC,OAAO,EAAE;MAAET,OAAO,EAAE,CAAC;MAAEc,KAAK,EAAE;IAAO,CAAE;IACvCC,IAAI,EAAE;MAAEf,OAAO,EAAE,CAAC;MAAEc,KAAK,EAAE;IAAE,CAAE;IAC/BF,OAAO,EAAE;MAAEZ,OAAO,EAAE,CAAC;MAAEc,KAAK,EAAE;IAAE,CAAE;IAClCE,GAAG,EAAC;IACJ;IAAA;IACAG,UAAU,EAAE;MAAEC,QAAQ,EAAE;IAAI;EAAE,GAE7B1C,QACwB,CAEpB,CACD,CAAC;AAE7B,CAAC;AAEDF,MAAM,CAAC8C,WAAW,GAAG,QAAQ;AAE7B,eAAe9C,MAAM","ignoreList":[]}
|
|
@@ -20,13 +20,11 @@ export const StyledMotionButton = styled(motion.button)`
|
|
|
20
20
|
} = _ref2;
|
|
21
21
|
if ($isSecondary) {
|
|
22
22
|
return css`
|
|
23
|
-
background-color: ${theme['202']};
|
|
24
23
|
color: ${theme.text};
|
|
25
24
|
`;
|
|
26
25
|
}
|
|
27
26
|
return css`
|
|
28
|
-
|
|
29
|
-
color: ${theme.buttonColor ?? 'white'};
|
|
27
|
+
color: ${theme.buttonColor ?? theme.buttonBackgroundColor ?? 'white'};
|
|
30
28
|
`;
|
|
31
29
|
}}
|
|
32
30
|
|
|
@@ -37,7 +35,6 @@ export const StyledMotionButton = styled(motion.button)`
|
|
|
37
35
|
} = _ref3;
|
|
38
36
|
if (theme.buttonDesign === '2') {
|
|
39
37
|
return css`
|
|
40
|
-
background-color: transparent;
|
|
41
38
|
border: 1px solid ${$isSecondary ? theme['202'] : theme.buttonBackgroundColor};
|
|
42
39
|
box-shadow: none;
|
|
43
40
|
`;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.styles.js","names":["motion","styled","css","StyledMotionButton","button","_ref","$ShouldShowTextAsRobotoMedium","_ref2","$isSecondary","theme","text","
|
|
1
|
+
{"version":3,"file":"Button.styles.js","names":["motion","styled","css","StyledMotionButton","button","_ref","$ShouldShowTextAsRobotoMedium","_ref2","$isSecondary","theme","text","buttonColor","buttonBackgroundColor","_ref3","buttonDesign","_ref4","$isDisabled","_ref5","_ref6","$hasIcon","$hasChildren","StyledIconWrapper","span","StyledMotionChildrenWrapper","div","StyledMotionWaitCursorWrapper"],"sources":["../../../../src/components/button/Button.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type { FramerMotionBugFix, WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledButtonProps = WithTheme<{\n $hasIcon: boolean;\n $hasChildren: boolean;\n $isDisabled?: boolean;\n $isSecondary?: boolean;\n $ShouldShowTextAsRobotoMedium: boolean;\n}>;\n\nexport const StyledMotionButton = styled(motion.button)<StyledButtonProps>`\n ${({ $ShouldShowTextAsRobotoMedium }) =>\n $ShouldShowTextAsRobotoMedium &&\n css`\n font-size: 110%;\n font-family: 'Roboto Medium', serif;\n `}\n\n align-items: center;\n\n ${({ $isSecondary, theme }: StyledButtonProps) => {\n if ($isSecondary) {\n return css`\n color: ${theme.text};\n `;\n }\n\n return css`\n color: ${theme.buttonColor ?? theme.buttonBackgroundColor ?? 'white'};\n `;\n }}\n\n ${({ theme, $isSecondary }: StyledButtonProps) => {\n if (theme.buttonDesign === '2') {\n return css`\n border: 1px solid ${$isSecondary ? theme['202'] : theme.buttonBackgroundColor};\n box-shadow: none;\n `;\n }\n\n return css`\n border: none;\n box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.2);\n `;\n }}\n\n border-radius: 3px;\n cursor: ${({ $isDisabled }) => ($isDisabled ? 'default' : 'pointer')};\n display: inline-flex;\n line-height: 1.15;\n min-height: 32px;\n opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n position: relative;\n user-select: none;\n transition: opacity 0.3s ease;\n\n ${({ $hasIcon, $hasChildren }) => {\n if ($hasIcon) {\n if ($hasChildren) {\n return css`\n padding: 7px 12px 7px 42px;\n `;\n }\n return css`\n padding: 7px 12px 7px 18px;\n `;\n }\n return css`\n padding: 7px 12px 7px 12px;\n `;\n }}\n`;\n\nexport const StyledIconWrapper = styled.span`\n align-items: center;\n background-color: rgba(255, 255, 255, 0.2);\n bottom: 0;\n display: flex;\n justify-content: center;\n left: 0;\n position: absolute;\n top: 0;\n width: 30px;\n`;\n\nexport const StyledMotionChildrenWrapper = styled(motion.div)<FramerMotionBugFix>``;\n\nexport const StyledMotionWaitCursorWrapper = styled(motion.div)<FramerMotionBugFix>`\n align-items: center;\n display: flex;\n justify-content: center;\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,eAAe;AACtC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAW/C,OAAO,MAAMC,kBAAkB,GAAGF,MAAM,CAACD,MAAM,CAACI,MAAM,CAAqB;AAC3E,MAAMC,IAAA;EAAA,IAAC;IAAEC;EAA8B,CAAC,GAAAD,IAAA;EAAA,OAChCC,6BAA6B,IAC7BJ,GAAI;AACZ;AACA;AACA,SAAS;AAAA,CAAC;AACV;AACA;AACA;AACA,MAAMK,KAAA,IAAgD;EAAA,IAA/C;IAAEC,YAAY;IAAEC;EAAyB,CAAC,GAAAF,KAAA;EACzC,IAAIC,YAAY,EAAE;IACd,OAAON,GAAI;AACvB,yBAAyBO,KAAK,CAACC,IAAK;AACpC,aAAa;EACL;EAEA,OAAOR,GAAI;AACnB,qBAAqBO,KAAK,CAACE,WAAW,IAAIF,KAAK,CAACG,qBAAqB,IAAI,OAAQ;AACjF,SAAS;AACL,CAAE;AACN;AACA,MAAMC,KAAA,IAAgD;EAAA,IAA/C;IAAEJ,KAAK;IAAED;EAAgC,CAAC,GAAAK,KAAA;EACzC,IAAIJ,KAAK,CAACK,YAAY,KAAK,GAAG,EAAE;IAC5B,OAAOZ,GAAI;AACvB,oCAAoCM,YAAY,GAAGC,KAAK,CAAC,KAAK,CAAC,GAAGA,KAAK,CAACG,qBAAsB;AAC9F;AACA,aAAa;EACL;EAEA,OAAOV,GAAI;AACnB;AACA;AACA,SAAS;AACL,CAAE;AACN;AACA;AACA,cAAca,KAAA;EAAA,IAAC;IAAEC;EAAY,CAAC,GAAAD,KAAA;EAAA,OAAMC,WAAW,GAAG,SAAS,GAAG,SAAS;AAAA,CAAE;AACzE;AACA;AACA;AACA,eAAeC,KAAA;EAAA,IAAC;IAAED;EAAY,CAAC,GAAAC,KAAA;EAAA,OAAMD,WAAW,GAAG,GAAG,GAAG,CAAC;AAAA,CAAE;AAC5D;AACA;AACA;AACA;AACA,MAAME,KAAA,IAAgC;EAAA,IAA/B;IAAEC,QAAQ;IAAEC;EAAa,CAAC,GAAAF,KAAA;EACzB,IAAIC,QAAQ,EAAE;IACV,IAAIC,YAAY,EAAE;MACd,OAAOlB,GAAI;AAC3B;AACA,iBAAiB;IACL;IACA,OAAOA,GAAI;AACvB;AACA,aAAa;EACL;EACA,OAAOA,GAAI;AACnB;AACA,SAAS;AACL,CAAE;AACN,CAAC;AAED,OAAO,MAAMmB,iBAAiB,GAAGpB,MAAM,CAACqB,IAAK;AAC7C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMC,2BAA2B,GAAGtB,MAAM,CAACD,MAAM,CAACwB,GAAG,CAAsB,EAAC;AAEnF,OAAO,MAAMC,6BAA6B,GAAGxB,MAAM,CAACD,MAAM,CAACwB,GAAG,CAAsB;AACpF;AACA;AACA;AACA,CAAC","ignoreList":[]}
|
|
@@ -2,12 +2,15 @@ import React from 'react';
|
|
|
2
2
|
import { StyledWaitCursor, StyledWaitCursorBackground, StyledWaitCursorWaitCursor } from './WaitCursor.styles';
|
|
3
3
|
const WaitCursor = _ref => {
|
|
4
4
|
let {
|
|
5
|
+
color,
|
|
5
6
|
shouldHideBackground = false,
|
|
6
7
|
shouldHideWaitCursor = false
|
|
7
8
|
} = _ref;
|
|
8
9
|
return /*#__PURE__*/React.createElement(StyledWaitCursor, {
|
|
9
10
|
$shouldShowWaitCursor: !shouldHideWaitCursor
|
|
10
|
-
}, /*#__PURE__*/React.createElement(StyledWaitCursorWaitCursor,
|
|
11
|
+
}, /*#__PURE__*/React.createElement(StyledWaitCursorWaitCursor, {
|
|
12
|
+
$color: color
|
|
13
|
+
}), !shouldHideBackground && /*#__PURE__*/React.createElement(StyledWaitCursorBackground, null));
|
|
11
14
|
};
|
|
12
15
|
WaitCursor.displayName = 'WaitCursor';
|
|
13
16
|
export default WaitCursor;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"WaitCursor.js","names":["React","StyledWaitCursor","StyledWaitCursorBackground","StyledWaitCursorWaitCursor","WaitCursor","_ref","shouldHideBackground","shouldHideWaitCursor","createElement","$shouldShowWaitCursor","displayName"],"sources":["../../../../../src/components/button/wait-cursor/WaitCursor.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport {\n StyledWaitCursor,\n StyledWaitCursorBackground,\n StyledWaitCursorWaitCursor,\n} from './WaitCursor.styles';\n\nexport type WaitCursorProps = {\n shouldHideBackground?: boolean;\n
|
|
1
|
+
{"version":3,"file":"WaitCursor.js","names":["React","StyledWaitCursor","StyledWaitCursorBackground","StyledWaitCursorWaitCursor","WaitCursor","_ref","color","shouldHideBackground","shouldHideWaitCursor","createElement","$shouldShowWaitCursor","$color","displayName"],"sources":["../../../../../src/components/button/wait-cursor/WaitCursor.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport {\n StyledWaitCursor,\n StyledWaitCursorBackground,\n StyledWaitCursorWaitCursor,\n} from './WaitCursor.styles';\n\nexport type WaitCursorProps = {\n color: string;\n shouldHideBackground?: boolean;\n shouldHideWaitCursor?: boolean;\n};\n\nconst WaitCursor: FC<WaitCursorProps> = ({\n color,\n shouldHideBackground = false,\n shouldHideWaitCursor = false,\n}) => (\n <StyledWaitCursor $shouldShowWaitCursor={!shouldHideWaitCursor}>\n <StyledWaitCursorWaitCursor $color={color} />\n {!shouldHideBackground && <StyledWaitCursorBackground />}\n </StyledWaitCursor>\n);\n\nWaitCursor.displayName = 'WaitCursor';\n\nexport default WaitCursor;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAc,OAAO;AACjC,SACIC,gBAAgB,EAChBC,0BAA0B,EAC1BC,0BAA0B,QACvB,qBAAqB;AAQ5B,MAAMC,UAA+B,GAAGC,IAAA;EAAA,IAAC;IACrCC,KAAK;IACLC,oBAAoB,GAAG,KAAK;IAC5BC,oBAAoB,GAAG;EAC3B,CAAC,GAAAH,IAAA;EAAA,oBACGL,KAAA,CAAAS,aAAA,CAACR,gBAAgB;IAACS,qBAAqB,EAAE,CAACF;EAAqB,gBAC3DR,KAAA,CAAAS,aAAA,CAACN,0BAA0B;IAACQ,MAAM,EAAEL;EAAM,CAAE,CAAC,EAC5C,CAACC,oBAAoB,iBAAIP,KAAA,CAAAS,aAAA,CAACP,0BAA0B,MAAE,CACzC,CAAC;AAAA,CACtB;AAEDE,UAAU,CAACQ,WAAW,GAAG,YAAY;AAErC,eAAeR,UAAU","ignoreList":[]}
|
|
@@ -36,7 +36,12 @@ export const StyledWaitCursorWaitCursor = styled.div`
|
|
|
36
36
|
z-index: 2;
|
|
37
37
|
border-style: solid;
|
|
38
38
|
border-width: 3px;
|
|
39
|
-
border-color:
|
|
39
|
+
border-color: ${_ref2 => {
|
|
40
|
+
let {
|
|
41
|
+
$color
|
|
42
|
+
} = _ref2;
|
|
43
|
+
return $color;
|
|
44
|
+
}};
|
|
40
45
|
height: ${26 - 10}px;
|
|
41
46
|
width: ${26 - 10}px;
|
|
42
47
|
border-radius: 50%;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"WaitCursor.styles.js","names":["styled","keyframes","StyledWaitCursor","div","_ref","$shouldShowWaitCursor","StyledWaitCursorBackground","spin","StyledWaitCursorWaitCursor"],"sources":["../../../../../src/components/button/wait-cursor/WaitCursor.styles.ts"],"sourcesContent":["import styled, { keyframes } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledWaitCursorProps = WithTheme<{\n $shouldShowWaitCursor: boolean;\n}>;\n\nexport const StyledWaitCursor = styled.div<StyledWaitCursorProps>`\n position: relative;\n height: 26px;\n width: 26px;\n opacity: ${({ $shouldShowWaitCursor }) => ($shouldShowWaitCursor ? 1 : 0)};\n`;\n\ntype StyledWaitCursorBackgroundProps = WithTheme<unknown>;\n\nexport const StyledWaitCursorBackground = styled.div<StyledWaitCursorBackgroundProps>`\n background-color: white;\n border-radius: 50%;\n height: 100%;\n width: 100%;\n position: relative;\n z-index: 1;\n box-shadow:\n 0 4px 12px 0 rgba(0, 0, 0, 0.2),\n 0 1px 1px rgba(0, 0, 0, 0.2);\n`;\n\ntype StyledWaitCursorWaitCursorProps = WithTheme<
|
|
1
|
+
{"version":3,"file":"WaitCursor.styles.js","names":["styled","keyframes","StyledWaitCursor","div","_ref","$shouldShowWaitCursor","StyledWaitCursorBackground","spin","StyledWaitCursorWaitCursor","_ref2","$color"],"sources":["../../../../../src/components/button/wait-cursor/WaitCursor.styles.ts"],"sourcesContent":["import styled, { keyframes } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledWaitCursorProps = WithTheme<{\n $shouldShowWaitCursor: boolean;\n}>;\n\nexport const StyledWaitCursor = styled.div<StyledWaitCursorProps>`\n position: relative;\n height: 26px;\n width: 26px;\n opacity: ${({ $shouldShowWaitCursor }) => ($shouldShowWaitCursor ? 1 : 0)};\n`;\n\ntype StyledWaitCursorBackgroundProps = WithTheme<unknown>;\n\nexport const StyledWaitCursorBackground = styled.div<StyledWaitCursorBackgroundProps>`\n background-color: white;\n border-radius: 50%;\n height: 100%;\n width: 100%;\n position: relative;\n z-index: 1;\n box-shadow:\n 0 4px 12px 0 rgba(0, 0, 0, 0.2),\n 0 1px 1px rgba(0, 0, 0, 0.2);\n`;\n\ntype StyledWaitCursorWaitCursorProps = WithTheme<{ $color: string }>;\n\nconst spin = keyframes`\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n`;\n\nexport const StyledWaitCursorWaitCursor = styled.div<StyledWaitCursorWaitCursorProps>`\n position: absolute;\n top: 5px;\n left: 5px;\n z-index: 2;\n border-style: solid;\n border-width: 3px;\n border-color: ${({ $color }) => $color};\n height: ${26 - 10}px;\n width: ${26 - 10}px;\n border-radius: 50%;\n display: inline-block;\n border-top: 3px solid transparent;\n\n animation: ${spin} 1s linear infinite;\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,SAAS,QAAQ,mBAAmB;AAOrD,OAAO,MAAMC,gBAAgB,GAAGF,MAAM,CAACG,GAA2B;AAClE;AACA;AACA;AACA,eAAeC,IAAA;EAAA,IAAC;IAAEC;EAAsB,CAAC,GAAAD,IAAA;EAAA,OAAMC,qBAAqB,GAAG,CAAC,GAAG,CAAC;AAAA,CAAE;AAC9E,CAAC;AAID,OAAO,MAAMC,0BAA0B,GAAGN,MAAM,CAACG,GAAqC;AACtF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAID,MAAMI,IAAI,GAAGN,SAAU;AACvB;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMO,0BAA0B,GAAGR,MAAM,CAACG,GAAqC;AACtF;AACA;AACA;AACA;AACA;AACA;AACA,oBAAoBM,KAAA;EAAA,IAAC;IAAEC;EAAO,CAAC,GAAAD,KAAA;EAAA,OAAKC,MAAM;AAAA,CAAC;AAC3C,cAAc,EAAE,GAAG,EAAG;AACtB,aAAa,EAAE,GAAG,EAAG;AACrB;AACA;AACA;AACA;AACA,iBAAiBH,IAAK;AACtB,CAAC","ignoreList":[]}
|
|
@@ -1,9 +1,7 @@
|
|
|
1
1
|
import { FC } from 'react';
|
|
2
2
|
export type WaitCursorProps = {
|
|
3
|
+
color: string;
|
|
3
4
|
shouldHideBackground?: boolean;
|
|
4
|
-
/**
|
|
5
|
-
* Specifies whether the wait cursor should be displayed.
|
|
6
|
-
*/
|
|
7
5
|
shouldHideWaitCursor?: boolean;
|
|
8
6
|
};
|
|
9
7
|
declare const WaitCursor: FC<WaitCursorProps>;
|
|
@@ -7,7 +7,8 @@ export declare const StyledWaitCursor: import("styled-components/dist/types").IS
|
|
|
7
7
|
export declare const StyledWaitCursorBackground: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
8
8
|
theme: import("../../color-scheme-provider/ColorSchemeProvider").Theme;
|
|
9
9
|
}>> & string;
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
}
|
|
10
|
+
type StyledWaitCursorWaitCursorProps = WithTheme<{
|
|
11
|
+
$color: string;
|
|
12
|
+
}>;
|
|
13
|
+
export declare const StyledWaitCursorWaitCursor: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledWaitCursorWaitCursorProps>> & string;
|
|
13
14
|
export {};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@chayns-components/core",
|
|
3
|
-
"version": "5.0.0-beta.
|
|
3
|
+
"version": "5.0.0-beta.619",
|
|
4
4
|
"description": "A set of beautiful React components for developing your own applications with chayns.",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"browserslist": [
|
|
@@ -83,5 +83,5 @@
|
|
|
83
83
|
"publishConfig": {
|
|
84
84
|
"access": "public"
|
|
85
85
|
},
|
|
86
|
-
"gitHead": "
|
|
86
|
+
"gitHead": "9356ace2c52dc4ad879c940e12de343f63f7e65e"
|
|
87
87
|
}
|