@chayns-components/core 5.0.50 → 5.0.52
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/accordion/Accordion.styles.js +6 -12
- package/lib/cjs/components/accordion/Accordion.styles.js.map +1 -1
- package/lib/cjs/components/button/Button.js +5 -2
- package/lib/cjs/components/button/Button.js.map +1 -1
- package/lib/cjs/components/button/Button.types.js.map +1 -1
- package/lib/cjs/components/slider-button/SliderButton.js +8 -1
- package/lib/cjs/components/slider-button/SliderButton.js.map +1 -1
- package/lib/esm/components/accordion/Accordion.styles.js +6 -12
- package/lib/esm/components/accordion/Accordion.styles.js.map +1 -1
- package/lib/esm/components/button/Button.js +5 -2
- package/lib/esm/components/button/Button.js.map +1 -1
- package/lib/esm/components/button/Button.types.js.map +1 -1
- package/lib/esm/components/slider-button/SliderButton.js +8 -1
- package/lib/esm/components/slider-button/SliderButton.js.map +1 -1
- package/lib/types/components/button/Button.types.d.ts +8 -0
- package/package.json +2 -2
|
@@ -50,20 +50,14 @@ const StyledMotionAccordion = exports.StyledMotionAccordion = (0, _styledCompone
|
|
|
50
50
|
$bottomBorderColor
|
|
51
51
|
}) => {
|
|
52
52
|
if ($shouldForceBackground || $shouldHideBottomLine) return undefined;
|
|
53
|
-
|
|
53
|
+
const shouldShowBottomBorder = theme.accordionLines && $shouldShowLines && ($isWrapped || !$isOpen);
|
|
54
|
+
if ($bottomBorderColor && shouldShowBottomBorder) return (0, _styledComponents.css)`
|
|
54
55
|
border-bottom-color: ${$bottomBorderColor};
|
|
55
56
|
`;
|
|
56
|
-
if (
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
`;
|
|
61
|
-
}
|
|
62
|
-
if (!$isOpen && $shouldShowLines) {
|
|
63
|
-
return (0, _styledComponents.css)`
|
|
64
|
-
border-bottom-color: rgba(${theme['headline-rgb']}, 1);
|
|
65
|
-
`;
|
|
66
|
-
}
|
|
57
|
+
if (shouldShowBottomBorder) {
|
|
58
|
+
return (0, _styledComponents.css)`
|
|
59
|
+
border-bottom-color: rgba(${theme['headline-rgb']}, 1);
|
|
60
|
+
`;
|
|
67
61
|
}
|
|
68
62
|
return undefined;
|
|
69
63
|
}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Accordion.styles.js","names":["_react","require","_styledComponents","_interopRequireWildcard","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","StyledMotionAccordion","exports","styled","motion","div","$isOpen","$isWrapped","$shouldForceBackground","$shouldHideBackground","theme","css","cardBackgroundOpacity","cardBorderRadius","cardShadow","accordionLines","$shouldShowLines","$shouldHideBottomLine","$bottomBorderColor","undefined","$isParentWrapped"],"sources":["../../../../src/components/accordion/Accordion.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledMotionAccordionProps = WithTheme<{\n $isOpen: boolean;\n $isParentWrapped?: boolean;\n $isWrapped?: boolean;\n $shouldForceBackground?: boolean;\n $shouldHideBackground?: boolean;\n $shouldShowLines?: boolean;\n $shouldHideBottomLine: boolean;\n $bottomBorderColor?: string;\n}>;\n\nexport const StyledMotionAccordion = styled(motion.div)<StyledMotionAccordionProps>`\n ${({\n $isOpen,\n $isWrapped,\n $shouldForceBackground,\n $shouldHideBackground,\n theme,\n }: StyledMotionAccordionProps) =>\n ($isOpen || $shouldForceBackground) &&\n !$isWrapped &&\n !$shouldHideBackground &&\n css`\n background-color: rgba(${theme['100-rgb']}, ${theme.cardBackgroundOpacity});\n border-radius: ${theme.cardBorderRadius}px;\n box-shadow: 0 2px 6px 0 rgba(0, 0, 0, ${theme.cardShadow});\n `}\n\n ${({ theme }: StyledMotionAccordionProps) =>\n theme.accordionLines &&\n css`\n border-bottom: 1px solid transparent;\n `}\n\n margin-bottom: ${({ $isOpen, $isWrapped }: StyledMotionAccordionProps) =>\n $isOpen && !$isWrapped ? '30px' : '0px'};\n transition:\n background-color 0.3s ease,\n border-bottom-color 0.3s ease,\n border-radius 0.3s ease,\n box-shadow 0.3s ease,\n margin-bottom 0.3s ease;\n will-change: unset !important;\n\n margin-top: 10px;\n\n ${({\n $isOpen,\n $isWrapped,\n $shouldForceBackground,\n $shouldShowLines,\n $shouldHideBottomLine,\n theme,\n $bottomBorderColor,\n }: StyledMotionAccordionProps) => {\n if ($shouldForceBackground || $shouldHideBottomLine) return undefined;\n
|
|
1
|
+
{"version":3,"file":"Accordion.styles.js","names":["_react","require","_styledComponents","_interopRequireWildcard","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","StyledMotionAccordion","exports","styled","motion","div","$isOpen","$isWrapped","$shouldForceBackground","$shouldHideBackground","theme","css","cardBackgroundOpacity","cardBorderRadius","cardShadow","accordionLines","$shouldShowLines","$shouldHideBottomLine","$bottomBorderColor","undefined","shouldShowBottomBorder","$isParentWrapped"],"sources":["../../../../src/components/accordion/Accordion.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledMotionAccordionProps = WithTheme<{\n $isOpen: boolean;\n $isParentWrapped?: boolean;\n $isWrapped?: boolean;\n $shouldForceBackground?: boolean;\n $shouldHideBackground?: boolean;\n $shouldShowLines?: boolean;\n $shouldHideBottomLine: boolean;\n $bottomBorderColor?: string;\n}>;\n\nexport const StyledMotionAccordion = styled(motion.div)<StyledMotionAccordionProps>`\n ${({\n $isOpen,\n $isWrapped,\n $shouldForceBackground,\n $shouldHideBackground,\n theme,\n }: StyledMotionAccordionProps) =>\n ($isOpen || $shouldForceBackground) &&\n !$isWrapped &&\n !$shouldHideBackground &&\n css`\n background-color: rgba(${theme['100-rgb']}, ${theme.cardBackgroundOpacity});\n border-radius: ${theme.cardBorderRadius}px;\n box-shadow: 0 2px 6px 0 rgba(0, 0, 0, ${theme.cardShadow});\n `}\n\n ${({ theme }: StyledMotionAccordionProps) =>\n theme.accordionLines &&\n css`\n border-bottom: 1px solid transparent;\n `}\n\n margin-bottom: ${({ $isOpen, $isWrapped }: StyledMotionAccordionProps) =>\n $isOpen && !$isWrapped ? '30px' : '0px'};\n transition:\n background-color 0.3s ease,\n border-bottom-color 0.3s ease,\n border-radius 0.3s ease,\n box-shadow 0.3s ease,\n margin-bottom 0.3s ease;\n will-change: unset !important;\n\n margin-top: 10px;\n\n ${({\n $isOpen,\n $isWrapped,\n $shouldForceBackground,\n $shouldShowLines,\n $shouldHideBottomLine,\n theme,\n $bottomBorderColor,\n }: StyledMotionAccordionProps) => {\n if ($shouldForceBackground || $shouldHideBottomLine) return undefined;\n const shouldShowBottomBorder =\n theme.accordionLines && $shouldShowLines && ($isWrapped || !$isOpen);\n\n if ($bottomBorderColor && shouldShowBottomBorder)\n return css`\n border-bottom-color: ${$bottomBorderColor};\n `;\n\n if (shouldShowBottomBorder) {\n return css`\n border-bottom-color: rgba(${theme['headline-rgb']}, 1);\n `;\n }\n\n return undefined;\n }}\n ${({ $isParentWrapped }: StyledMotionAccordionProps) =>\n $isParentWrapped &&\n css`\n padding-left: 17px;\n `}\n ${({ $isWrapped }: StyledMotionAccordionProps) =>\n !$isWrapped\n ? css`\n margin-top: 5px;\n `\n : css`\n margin: 0;\n `}\n ${({ $isWrapped, $shouldHideBackground, theme }: StyledMotionAccordionProps) =>\n !$isWrapped &&\n !$shouldHideBackground &&\n css`\n &:hover,\n &:focus-visible {\n background-color: rgba(${theme['100-rgb']}, ${theme.cardBackgroundOpacity});\n }\n `};\n`;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -24,7 +24,8 @@ const Button = ({
|
|
|
24
24
|
shouldStopPropagation,
|
|
25
25
|
shouldShowAsSelectButton = false,
|
|
26
26
|
shouldShowTextAsRobotoMedium = true,
|
|
27
|
-
buttonDesign
|
|
27
|
+
buttonDesign,
|
|
28
|
+
tapDuration = 0.5
|
|
28
29
|
}) => {
|
|
29
30
|
const handleClick = event => {
|
|
30
31
|
if (shouldStopPropagation) {
|
|
@@ -99,7 +100,9 @@ const Button = ({
|
|
|
99
100
|
visibility: {
|
|
100
101
|
duration: 0
|
|
101
102
|
},
|
|
102
|
-
duration:
|
|
103
|
+
duration: tapDuration,
|
|
104
|
+
ease: 'easeIn',
|
|
105
|
+
type: 'tween'
|
|
103
106
|
},
|
|
104
107
|
whileTap: isDisabled ? {} : {
|
|
105
108
|
...tapStyles,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","names":["_clsx","_interopRequireDefault","require","_react","_react2","_interopRequireWildcard","_styledComponents","_Icon","_Button","_WaitCursor","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","Button","children","className","icon","isDisabled","isSecondary","onClick","shouldShowWaitCursor","shouldStopPropagation","shouldShowAsSelectButton","shouldShowTextAsRobotoMedium","buttonDesign","handleClick","event","stopPropagation","buttonClasses","clsx","theme","useTheme","effectiveButtonDesign","iconColor","useMemo","text","buttonColor","buttonBackgroundColor","backgroundColor","color","tapStyles","opacity","hoverStyles","createElement","StyledMotionButton","$shouldShowTextAsRobotoMedium","$shouldShowAsSelectButton","$shouldShowWaitCursor","disabled","$isDisabled","$hasChildren","$hasIcon","$isSecondary","$effectiveButtonDesign","style","visibility","initial","animate","transition","duration","whileTap","whileHover","AnimatePresence","StyledIconWrapper","icons","StyledMotionWaitCursorWrapper","width","exit","key","overflow","shouldHideBackground","StyledMotionChildrenWrapper","displayName","_default","exports"],"sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport { AnimatePresence } from 'motion/react';\nimport React, { FC, MouseEventHandler, 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 type { ButtonProps } from './Button.types';\nimport WaitCursor from './wait-cursor/WaitCursor';\n\nconst Button: FC<ButtonProps> = ({\n children,\n className,\n icon,\n isDisabled,\n isSecondary,\n onClick,\n shouldShowWaitCursor,\n shouldStopPropagation,\n shouldShowAsSelectButton = false,\n shouldShowTextAsRobotoMedium = true,\n buttonDesign,\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 = useTheme() as Theme;\n\n const effectiveButtonDesign = (buttonDesign ?? theme.buttonDesign) as number;\n\n const iconColor = useMemo(() => {\n if (isSecondary) {\n return theme.text;\n }\n\n return effectiveButtonDesign === 2\n ? (theme.buttonColor ?? theme.buttonBackgroundColor ?? 'white')\n : (theme.buttonColor ?? 'white');\n }, [\n isSecondary,\n theme.buttonBackgroundColor,\n theme.buttonColor,\n effectiveButtonDesign,\n theme.text,\n ]);\n\n const backgroundColor = useMemo(() => {\n let color;\n\n if (isSecondary || shouldShowAsSelectButton) {\n color = theme['202'];\n } else {\n color = theme.buttonBackgroundColor ?? theme['408'];\n }\n\n if (effectiveButtonDesign === 2) {\n color = `rgba(${theme['102-rgb'] ?? ''}, 0)`;\n }\n\n return color;\n }, [isSecondary, shouldShowAsSelectButton, theme, effectiveButtonDesign]);\n\n const tapStyles = useMemo(() => {\n if (effectiveButtonDesign === 2) {\n return {\n backgroundColor:\n isSecondary || shouldShowAsSelectButton\n ? `rgba(${theme['202-rgb'] ?? ''}, 0.7)`\n : `${theme.buttonBackgroundColor ?? ''}40`,\n };\n }\n\n return { opacity: 0.6 };\n }, [isSecondary, shouldShowAsSelectButton, theme, effectiveButtonDesign]);\n\n const hoverStyles = useMemo(() => {\n if (effectiveButtonDesign === 2) {\n return { backgroundColor: `rgba(${theme['102-rgb'] ?? ''}, 0.5)` };\n }\n\n return { opacity: 1 };\n }, [theme, effectiveButtonDesign]);\n\n return (\n <StyledMotionButton\n $shouldShowTextAsRobotoMedium={shouldShowTextAsRobotoMedium}\n $shouldShowAsSelectButton={shouldShowAsSelectButton}\n $shouldShowWaitCursor={shouldShowWaitCursor}\n className={buttonClasses}\n disabled={isDisabled}\n $isDisabled={isDisabled}\n $hasChildren={!!children}\n $hasIcon={typeof icon === 'string' && icon !== ''}\n $isSecondary={isSecondary}\n $effectiveButtonDesign={effectiveButtonDesign}\n onClick={handleClick}\n style={{ visibility: !backgroundColor ? 'hidden' : 'visible', backgroundColor }}\n initial={{ opacity: 0.5 }}\n animate={{\n opacity: isDisabled ? 0.5 : 1,\n }}\n transition={{ visibility: { duration: 0 }, duration: 0.5 }}\n whileTap={isDisabled ? {} : { ...tapStyles, transition: { duration: 0 } }}\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":[]}
|
|
1
|
+
{"version":3,"file":"Button.js","names":["_clsx","_interopRequireDefault","require","_react","_react2","_interopRequireWildcard","_styledComponents","_Icon","_Button","_WaitCursor","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","Button","children","className","icon","isDisabled","isSecondary","onClick","shouldShowWaitCursor","shouldStopPropagation","shouldShowAsSelectButton","shouldShowTextAsRobotoMedium","buttonDesign","tapDuration","handleClick","event","stopPropagation","buttonClasses","clsx","theme","useTheme","effectiveButtonDesign","iconColor","useMemo","text","buttonColor","buttonBackgroundColor","backgroundColor","color","tapStyles","opacity","hoverStyles","createElement","StyledMotionButton","$shouldShowTextAsRobotoMedium","$shouldShowAsSelectButton","$shouldShowWaitCursor","disabled","$isDisabled","$hasChildren","$hasIcon","$isSecondary","$effectiveButtonDesign","style","visibility","initial","animate","transition","duration","ease","type","whileTap","whileHover","AnimatePresence","StyledIconWrapper","icons","StyledMotionWaitCursorWrapper","width","exit","key","overflow","shouldHideBackground","StyledMotionChildrenWrapper","displayName","_default","exports"],"sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport { AnimatePresence } from 'motion/react';\nimport React, { FC, MouseEventHandler, 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 type { ButtonProps } from './Button.types';\nimport WaitCursor from './wait-cursor/WaitCursor';\n\nconst Button: FC<ButtonProps> = ({\n children,\n className,\n icon,\n isDisabled,\n isSecondary,\n onClick,\n shouldShowWaitCursor,\n shouldStopPropagation,\n shouldShowAsSelectButton = false,\n shouldShowTextAsRobotoMedium = true,\n buttonDesign,\n tapDuration = 0.5,\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 = useTheme() as Theme;\n\n const effectiveButtonDesign = (buttonDesign ?? theme.buttonDesign) as number;\n\n const iconColor = useMemo(() => {\n if (isSecondary) {\n return theme.text;\n }\n\n return effectiveButtonDesign === 2\n ? (theme.buttonColor ?? theme.buttonBackgroundColor ?? 'white')\n : (theme.buttonColor ?? 'white');\n }, [\n isSecondary,\n theme.buttonBackgroundColor,\n theme.buttonColor,\n effectiveButtonDesign,\n theme.text,\n ]);\n\n const backgroundColor = useMemo(() => {\n let color;\n\n if (isSecondary || shouldShowAsSelectButton) {\n color = theme['202'];\n } else {\n color = theme.buttonBackgroundColor ?? theme['408'];\n }\n\n if (effectiveButtonDesign === 2) {\n color = `rgba(${theme['102-rgb'] ?? ''}, 0)`;\n }\n\n return color;\n }, [isSecondary, shouldShowAsSelectButton, theme, effectiveButtonDesign]);\n\n const tapStyles = useMemo(() => {\n if (effectiveButtonDesign === 2) {\n return {\n backgroundColor:\n isSecondary || shouldShowAsSelectButton\n ? `rgba(${theme['202-rgb'] ?? ''}, 0.7)`\n : `${theme.buttonBackgroundColor ?? ''}40`,\n };\n }\n\n return { opacity: 0.6 };\n }, [isSecondary, shouldShowAsSelectButton, theme, effectiveButtonDesign]);\n\n const hoverStyles = useMemo(() => {\n if (effectiveButtonDesign === 2) {\n return { backgroundColor: `rgba(${theme['102-rgb'] ?? ''}, 0.5)` };\n }\n\n return { opacity: 1 };\n }, [theme, effectiveButtonDesign]);\n\n return (\n <StyledMotionButton\n $shouldShowTextAsRobotoMedium={shouldShowTextAsRobotoMedium}\n $shouldShowAsSelectButton={shouldShowAsSelectButton}\n $shouldShowWaitCursor={shouldShowWaitCursor}\n className={buttonClasses}\n disabled={isDisabled}\n $isDisabled={isDisabled}\n $hasChildren={!!children}\n $hasIcon={typeof icon === 'string' && icon !== ''}\n $isSecondary={isSecondary}\n $effectiveButtonDesign={effectiveButtonDesign}\n onClick={handleClick}\n style={{ visibility: !backgroundColor ? 'hidden' : 'visible', backgroundColor }}\n initial={{ opacity: 0.5 }}\n animate={{\n opacity: isDisabled ? 0.5 : 1,\n }}\n transition={{\n visibility: { duration: 0 },\n duration: tapDuration,\n ease: 'easeIn',\n type: 'tween',\n }}\n whileTap={isDisabled ? {} : { ...tapStyles, transition: { duration: 0 } }}\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":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.types.js","names":[],"sources":["../../../../src/components/button/Button.types.ts"],"sourcesContent":["import type { MouseEventHandler, ReactNode } from 'react';\n\nexport type ButtonProps = {\n /**\n * The label of the button.\n * @description\n * The content to be displayed inside the button. This can be text, icons, or any React node.\n * It serves as the primary label for the button's action.\n * @optional\n */\n children?: ReactNode;\n /**\n * Additional class names for the button element.\n * @description\n * Allows adding custom CSS classes to the button for further styling or integration with CSS frameworks.\n * Multiple classes can be provided as a space-separated string.\n * @optional\n */\n className?: string;\n /**\n * An icon that is displayed on the left-hand side of the button text.\n * @description\n * Specifies an icon to be shown alongside the button text. The icon is positioned to the left of the text.\n * This enhances the visual representation of the button's function.\n * @optional\n */\n icon?: string;\n /**\n * Whether the button is disabled and cannot be clicked anymore.\n * @description\n * When set to true, the button becomes non-interactive, preventing user clicks and often changing its appearance to indicate the disabled state.\n * This is useful for scenarios where the action is temporarily unavailable.\n * @optional\n */\n isDisabled?: boolean;\n /**\n * Displays the button in the secondary style.\n * @description\n * Applies a secondary visual style to the button, typically with a different background color or border.\n * This is used to differentiate less prominent actions from primary ones.\n * @optional\n */\n isSecondary?: boolean;\n /**\n * Function to be executed when the button is clicked.\n * @description\n * A callback function that is triggered when the user clicks on the button. This can be used to handle interactions,\n * such as submitting forms, navigating to pages, or performing any custom action.\n */\n onClick: MouseEventHandler<HTMLButtonElement>;\n /**\n * Whether the button should be displayed as a selectButton.\n * @description\n * Modifies the button's appearance to resemble a select button, often used in dropdowns or selection interfaces.\n * This changes the styling to indicate a selection state.\n * @optional\n * @default false\n */\n shouldShowAsSelectButton?: boolean;\n /**\n * Whether the text should be 'Roboto Medium'.\n * @description\n * Controls the font weight of the button text. When true, applies 'Roboto Medium' font weight for emphasis.\n * This can improve readability or match design guidelines.\n * @optional\n * @default true\n */\n shouldShowTextAsRobotoMedium?: boolean;\n /**\n * Shows a wait cursor instead of button text.\n * @description\n * Replaces the button content with a wait cursor animation, indicating that an action is in progress.\n * This provides visual feedback during loading or processing states.\n * @optional\n */\n shouldShowWaitCursor?: boolean;\n /**\n * Stops event propagation on click.\n * @description\n * Prevents the click event from bubbling up to parent elements, isolating the button's interaction.\n * Useful in complex UI structures where event handling needs to be contained.\n * @optional\n */\n shouldStopPropagation?: boolean;\n /**\n * Optional button design override.\n * @description\n * Allows overriding the default button design with a specific numeric value, corresponding to different visual themes or styles.\n * This provides flexibility for custom theming.\n * @optional\n */\n buttonDesign?: number;\n};\n"],"mappings":"","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"Button.types.js","names":[],"sources":["../../../../src/components/button/Button.types.ts"],"sourcesContent":["import type { MouseEventHandler, ReactNode } from 'react';\n\nexport type ButtonProps = {\n /**\n * The label of the button.\n * @description\n * The content to be displayed inside the button. This can be text, icons, or any React node.\n * It serves as the primary label for the button's action.\n * @optional\n */\n children?: ReactNode;\n /**\n * Additional class names for the button element.\n * @description\n * Allows adding custom CSS classes to the button for further styling or integration with CSS frameworks.\n * Multiple classes can be provided as a space-separated string.\n * @optional\n */\n className?: string;\n /**\n * An icon that is displayed on the left-hand side of the button text.\n * @description\n * Specifies an icon to be shown alongside the button text. The icon is positioned to the left of the text.\n * This enhances the visual representation of the button's function.\n * @optional\n */\n icon?: string;\n /**\n * Whether the button is disabled and cannot be clicked anymore.\n * @description\n * When set to true, the button becomes non-interactive, preventing user clicks and often changing its appearance to indicate the disabled state.\n * This is useful for scenarios where the action is temporarily unavailable.\n * @optional\n */\n isDisabled?: boolean;\n /**\n * Displays the button in the secondary style.\n * @description\n * Applies a secondary visual style to the button, typically with a different background color or border.\n * This is used to differentiate less prominent actions from primary ones.\n * @optional\n */\n isSecondary?: boolean;\n /**\n * Function to be executed when the button is clicked.\n * @description\n * A callback function that is triggered when the user clicks on the button. This can be used to handle interactions,\n * such as submitting forms, navigating to pages, or performing any custom action.\n */\n onClick: MouseEventHandler<HTMLButtonElement>;\n /**\n * Whether the button should be displayed as a selectButton.\n * @description\n * Modifies the button's appearance to resemble a select button, often used in dropdowns or selection interfaces.\n * This changes the styling to indicate a selection state.\n * @optional\n * @default false\n */\n shouldShowAsSelectButton?: boolean;\n /**\n * Whether the text should be 'Roboto Medium'.\n * @description\n * Controls the font weight of the button text. When true, applies 'Roboto Medium' font weight for emphasis.\n * This can improve readability or match design guidelines.\n * @optional\n * @default true\n */\n shouldShowTextAsRobotoMedium?: boolean;\n /**\n * Shows a wait cursor instead of button text.\n * @description\n * Replaces the button content with a wait cursor animation, indicating that an action is in progress.\n * This provides visual feedback during loading or processing states.\n * @optional\n */\n shouldShowWaitCursor?: boolean;\n /**\n * Stops event propagation on click.\n * @description\n * Prevents the click event from bubbling up to parent elements, isolating the button's interaction.\n * Useful in complex UI structures where event handling needs to be contained.\n * @optional\n */\n shouldStopPropagation?: boolean;\n /**\n * Optional button design override.\n * @description\n * Allows overriding the default button design with a specific numeric value, corresponding to different visual themes or styles.\n * This provides flexibility for custom theming.\n * @optional\n */\n buttonDesign?: number;\n /**\n * Duration in seconds for the tap animation.\n * @description\n * Overrides how long the pressed state animation should take when the button is tapped.\n * Set this to `0` for an immediate press effect.\n * @optional\n */\n tapDuration?: number;\n};\n"],"mappings":"","ignoreList":[]}
|
|
@@ -117,6 +117,13 @@ const SliderButton = ({
|
|
|
117
117
|
if (isDisabled) {
|
|
118
118
|
return;
|
|
119
119
|
}
|
|
120
|
+
if (currentIndex === index && items.length === 2) {
|
|
121
|
+
const otherItem = items.find((_, findIndex) => index !== findIndex);
|
|
122
|
+
if (!otherItem) return;
|
|
123
|
+
setPopupId(otherItem.id);
|
|
124
|
+
setItemPosition(items.indexOf(otherItem));
|
|
125
|
+
return;
|
|
126
|
+
}
|
|
120
127
|
setPopupId(id);
|
|
121
128
|
if (typeof onChange === 'function' && id !== 'more') {
|
|
122
129
|
onChange(id);
|
|
@@ -129,7 +136,7 @@ const SliderButton = ({
|
|
|
129
136
|
}
|
|
130
137
|
}
|
|
131
138
|
setItemPosition(index);
|
|
132
|
-
}, [isDisabled, onChange, setItemPosition, setPopupId]);
|
|
139
|
+
}, [currentIndex, isDisabled, items, onChange, setItemPosition, setPopupId]);
|
|
133
140
|
const backgroundColor = (0, _react2.useMemo)(() => {
|
|
134
141
|
let color;
|
|
135
142
|
if (isSecondary) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SliderButton.js","names":["_chaynsApi","require","_react","_react2","_interopRequireWildcard","_element","_calculate","_sliderButton","_Icon","_interopRequireDefault","_Popup","_SliderButton","_styledComponents","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","SliderButton","isDisabled","isSecondary","items","onChange","selectedButtonId","isRounded","dragRange","setDragRange","useState","left","right","shownItemsCount","setShownItemsCount","length","sliderSize","setSliderSize","width","currentId","setCurrentId","currentPopupId","setCurrentPopupId","currentIndex","setCurrentIndex","sliderButtonRef","useRef","sliderButtonWrapperRef","popupRef","scope","animate","useAnimate","theme","useTheme","initialItemWidth","useMemo","calculateBiggestWidth","elementSize","useElementSize","useEffect","setPopupId","useCallback","selectedId","ids","slice","map","id","newId","find","isSliderBigger","Math","floor","maxShownItemsCount","totalWidth","count","visibleItems","currentMaxWidth","itemWidth","sliderWidth","itemCount","animation","x","current","type","duration","setItemPosition","index","findIndex","handleClick","show","hide","backgroundColor","color","buttonBackgroundColor","buttonDesign","thumbBackgroundColor","buttons","newItems","otherItems","elements","text","createElement","StyledSliderButtonItem","$isSecondary","$width","key","onClick","popupContent","StyledSliderButtonPopupContentItem","$isSelected","push","ref","content","StyledSliderButtonPopupContent","icons","pseudoButtons","snapPoints","points","handleDragStart","setRefreshScrollEnabled","handleDragEnd","position","getThumbPosition","middle","scrollLeft","getNearestPoint","nearestPoint","nearestIndex","_items$nearestIndex","StyledSliderButton","$isDisabled","StyledSliderButtonButtonsWrapper","$isInvisible","StyledMotionSliderButtonThumb","$isRounded","drag","dragElastic","dragConstraints","onDragEnd","onDragStart","style","StyledSliderButtonWrapper","AnimatePresence","displayName","_default","exports"],"sources":["../../../../src/components/slider-button/SliderButton.tsx"],"sourcesContent":["import { setRefreshScrollEnabled } from 'chayns-api';\nimport { AnimatePresence, useAnimate } from 'motion/react';\nimport React, { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { useElementSize } from '../../hooks/element';\nimport { PopupRef } from '../../types/popup';\nimport type { SliderButtonItem } from '../../types/slider-button';\nimport { calculateBiggestWidth } from '../../utils/calculate';\nimport { getNearestPoint, getThumbPosition } from '../../utils/sliderButton';\nimport Icon from '../icon/Icon';\nimport Popup from '../popup/Popup';\nimport {\n StyledMotionSliderButtonThumb,\n StyledSliderButton,\n StyledSliderButtonButtonsWrapper,\n StyledSliderButtonItem,\n StyledSliderButtonPopupContent,\n StyledSliderButtonPopupContentItem,\n StyledSliderButtonWrapper,\n} from './SliderButton.styles';\nimport { useTheme } from 'styled-components';\nimport type { Theme } from '../color-scheme-provider/ColorSchemeProvider';\n\nexport type SliderButtonProps = {\n /**\n * Whether the button is disabled and cannot be clicked anymore.\n */\n isDisabled?: boolean;\n /**\n * Displays the button in the secondary style.\n */\n isSecondary?: boolean;\n /**\n * The items that should be displayed in the slider button.\n */\n items: SliderButtonItem[];\n /**\n * Function to be executed when a button is selected. The id of the selected button is passed as an argument.\n * @param id\n */\n onChange?: (id: string) => void;\n /**\n * The id of the button that should be selected.\n */\n selectedButtonId?: string;\n /**\n *\n */\n isRounded?: boolean;\n};\n\nconst SliderButton: FC<SliderButtonProps> = ({\n isDisabled,\n isSecondary,\n items,\n onChange,\n selectedButtonId,\n isRounded = false,\n}) => {\n const [dragRange, setDragRange] = useState({ left: 0, right: 0 });\n const [shownItemsCount, setShownItemsCount] = useState(items.length);\n const [sliderSize, setSliderSize] = useState({ width: 0 });\n const [currentId, setCurrentId] = useState('');\n const [currentPopupId, setCurrentPopupId] = useState('');\n const [currentIndex, setCurrentIndex] = useState(0);\n\n const sliderButtonRef = useRef<HTMLDivElement>(null);\n const sliderButtonWrapperRef = useRef<HTMLDivElement>(null);\n const popupRef = useRef<PopupRef>(null);\n\n const [scope, animate] = useAnimate();\n\n const theme = useTheme() as Theme;\n\n const initialItemWidth = useMemo(() => calculateBiggestWidth(items), [items]);\n const elementSize = useElementSize(sliderButtonRef);\n\n useEffect(() => {\n if (elementSize) setSliderSize(elementSize);\n }, [elementSize]);\n\n const setPopupId = useCallback(\n (selectedId: string) => {\n const ids = items.slice(shownItemsCount - 1).map(({ id }) => id);\n\n const newId = ids.find((id) => id === selectedId);\n\n if (newId) {\n setCurrentId('more');\n setCurrentPopupId(newId);\n\n return;\n }\n\n setCurrentId(selectedId);\n },\n [items, shownItemsCount],\n );\n\n const isSliderBigger = useMemo(\n () => sliderSize && Math.floor(sliderSize.width / initialItemWidth) < items.length - 1,\n [initialItemWidth, items.length, sliderSize],\n );\n\n const maxShownItemsCount = useMemo(() => {\n let totalWidth = 0;\n let count = 0;\n\n while (count < items.length) {\n const visibleItems = items.slice(0, count + 1);\n const currentMaxWidth = calculateBiggestWidth(visibleItems) + 8;\n\n if (totalWidth + currentMaxWidth > sliderSize.width) break;\n\n totalWidth += currentMaxWidth;\n count++;\n }\n\n return count;\n }, [items, sliderSize.width]);\n\n const itemWidth = useMemo(() => {\n const sliderWidth = sliderSize?.width || 0;\n const itemCount = items.length || 1;\n\n setShownItemsCount(isSliderBigger ? maxShownItemsCount : itemCount);\n\n return sliderWidth / (isSliderBigger ? maxShownItemsCount : itemCount);\n }, [isSliderBigger, items.length, maxShownItemsCount, sliderSize?.width]);\n\n useEffect(() => {\n if (sliderSize) {\n const sliderWidth = itemWidth * (items.length - 1);\n\n const count = Math.floor(sliderSize.width / itemWidth);\n\n setDragRange({ left: 0, right: isSliderBigger ? itemWidth * count : sliderWidth });\n }\n }, [isSliderBigger, itemWidth, items.length, sliderSize]);\n\n const animation = useCallback(\n async (x: number) => {\n await animate(\n scope.current,\n { x },\n {\n type: 'tween',\n duration: 0.2,\n },\n );\n },\n [animate, scope],\n );\n\n const setItemPosition = useCallback(\n (index: number) => {\n setCurrentIndex(index);\n\n void animation(itemWidth * index);\n },\n [animation, itemWidth],\n );\n\n useEffect(() => {\n if (typeof selectedButtonId === 'string') {\n let index = items.findIndex(({ id }) => id === selectedButtonId);\n\n setCurrentId(selectedButtonId);\n\n setPopupId(selectedButtonId);\n\n if (items.length > shownItemsCount && index > shownItemsCount - 1) {\n index = shownItemsCount - 1;\n }\n\n if (index >= 0) {\n setItemPosition(index);\n }\n }\n }, [\n animation,\n dragRange.right,\n isSliderBigger,\n itemWidth,\n items,\n selectedButtonId,\n setItemPosition,\n setPopupId,\n shownItemsCount,\n ]);\n\n const handleClick = useCallback(\n (id: string, index: number) => {\n if (isDisabled) {\n return;\n }\n\n setPopupId(id);\n\n if (typeof onChange === 'function' && id !== 'more') {\n onChange(id);\n }\n\n if (popupRef.current) {\n if (id === 'more') {\n popupRef.current.show();\n } else {\n popupRef.current.hide();\n }\n }\n\n setItemPosition(index);\n },\n [isDisabled, onChange, setItemPosition, setPopupId],\n );\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 thumbBackgroundColor = useMemo(() => {\n let color;\n\n if (isSecondary) {\n color = theme['207'];\n } else {\n color = `rgba(${theme['405-rgb'] ?? ''}, 0.75)`;\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 buttons = useMemo(() => {\n if (items.length > shownItemsCount) {\n const newItems = items.slice(0, shownItemsCount - 1);\n const otherItems = items.slice(shownItemsCount - 1);\n\n const elements = newItems.map(({ id, text }, index) => (\n <StyledSliderButtonItem\n $isSecondary={isSecondary}\n $width={itemWidth}\n key={`slider-button-${id}`}\n onClick={() => handleClick(id, index)}\n >\n {text}\n </StyledSliderButtonItem>\n ));\n\n const popupContent = otherItems.map(({ id, text }) => (\n <StyledSliderButtonPopupContentItem\n key={`slider-button-${id}`}\n onClick={() => handleClick(id, newItems.length)}\n $isSelected={id === currentPopupId}\n >\n {text}\n </StyledSliderButtonPopupContentItem>\n ));\n\n const id = 'more';\n\n elements.push(\n <StyledSliderButtonItem\n $isSecondary={isSecondary}\n $width={itemWidth}\n key={`slider-button-${id}`}\n >\n <Popup\n ref={popupRef}\n content={\n <StyledSliderButtonPopupContent>\n {popupContent}\n </StyledSliderButtonPopupContent>\n }\n >\n <Icon icons={['fa fa-ellipsis']} color=\"white\" />\n </Popup>\n </StyledSliderButtonItem>,\n );\n\n return elements;\n }\n return items.map(({ id, text }) => (\n <StyledSliderButtonItem\n $isSecondary={isSecondary}\n $width={itemWidth}\n key={`slider-button-${id}`}\n >\n {text}\n </StyledSliderButtonItem>\n ));\n }, [currentPopupId, handleClick, isSecondary, itemWidth, items, shownItemsCount]);\n\n const pseudoButtons = useMemo(() => {\n if (items.length > shownItemsCount) {\n const newItems = items.slice(0, shownItemsCount - 1);\n\n const elements = newItems.map(({ id, text }, index) => (\n <StyledSliderButtonItem\n $isSecondary={isSecondary}\n $width={itemWidth}\n key={`pseudo-slider-button-${id}`}\n onClick={() => handleClick(id, index)}\n >\n {text}\n </StyledSliderButtonItem>\n ));\n\n const id = 'more';\n\n elements.push(\n <StyledSliderButtonItem\n $isSecondary={isSecondary}\n $width={itemWidth}\n key={`pseudo-slider-button-${id}`}\n onClick={() => handleClick(id, newItems.length)}\n >\n <Icon icons={['fa fa-ellipsis']} />\n </StyledSliderButtonItem>,\n );\n\n return elements;\n }\n return items.map(({ id, text }, index) => (\n <StyledSliderButtonItem\n $isSecondary={isSecondary}\n $width={itemWidth}\n key={`pseudo-slider-button-${id}`}\n onClick={() => handleClick(id, index)}\n >\n {text}\n </StyledSliderButtonItem>\n ));\n }, [handleClick, isSecondary, itemWidth, items, shownItemsCount]);\n\n /**\n * Creates an array with the snap points relative to the width of the items\n */\n const snapPoints = useMemo(() => {\n const points = [0];\n\n for (let i = 1; i < items.length; i++) {\n points.push(itemWidth * i);\n }\n\n return points;\n }, [itemWidth, items.length]);\n\n const handleDragStart = useCallback(() => {\n void setRefreshScrollEnabled(false);\n }, []);\n\n const handleDragEnd = useCallback(() => {\n void setRefreshScrollEnabled(true);\n\n const position = getThumbPosition({ scope, itemWidth });\n\n if (!position) {\n return;\n }\n\n const { middle, left } = position;\n\n let scrollLeft = 0;\n\n if (sliderButtonWrapperRef.current) {\n scrollLeft = sliderButtonWrapperRef.current.scrollLeft;\n\n sliderButtonWrapperRef.current.scrollLeft = getNearestPoint({\n snapPoints,\n position: middle,\n scrollLeft: scrollLeft - left,\n }).nearestPoint;\n }\n\n const { nearestIndex } = getNearestPoint({\n snapPoints,\n position: middle,\n scrollLeft,\n });\n\n const { nearestPoint } = getNearestPoint({\n snapPoints,\n position: middle,\n scrollLeft: 0,\n });\n\n if (nearestPoint >= 0 && nearestIndex >= 0) {\n void animation(nearestPoint);\n\n let id;\n\n if (nearestIndex === shownItemsCount - 1) {\n id = 'more';\n } else {\n id = items[nearestIndex]?.id;\n }\n\n if (popupRef.current) {\n if (id === 'more') {\n popupRef.current.show();\n } else {\n popupRef.current.hide();\n }\n }\n\n if (typeof onChange === 'function' && id && id !== 'more') {\n onChange(id);\n }\n }\n }, [animation, itemWidth, items, onChange, scope, shownItemsCount, snapPoints]);\n\n return useMemo(\n () => (\n <StyledSliderButton $isDisabled={isDisabled} ref={sliderButtonRef}>\n <StyledSliderButtonButtonsWrapper $isInvisible>\n {pseudoButtons}\n </StyledSliderButtonButtonsWrapper>\n <StyledMotionSliderButtonThumb\n $isRounded={isRounded}\n ref={scope}\n drag={isDisabled ? false : 'x'}\n dragElastic={0}\n dragConstraints={\n isSliderBigger\n ? { ...dragRange, right: dragRange.right - itemWidth }\n : { ...dragRange }\n }\n $width={itemWidth}\n onDragEnd={handleDragEnd}\n onDragStart={handleDragStart}\n onClick={() => handleClick(currentId, currentIndex)}\n style={{ backgroundColor: thumbBackgroundColor }}\n />\n <StyledSliderButtonWrapper\n $isRounded={isRounded}\n $isDisabled={isDisabled}\n $width={!isSliderBigger ? dragRange.right + itemWidth : dragRange.right}\n ref={sliderButtonWrapperRef}\n style={{ backgroundColor }}\n >\n <AnimatePresence>\n <StyledSliderButtonButtonsWrapper>\n {buttons}\n </StyledSliderButtonButtonsWrapper>\n </AnimatePresence>\n </StyledSliderButtonWrapper>\n </StyledSliderButton>\n ),\n [\n backgroundColor,\n buttons,\n currentId,\n currentIndex,\n dragRange,\n handleClick,\n handleDragEnd,\n handleDragStart,\n isDisabled,\n isRounded,\n isSliderBigger,\n itemWidth,\n pseudoButtons,\n scope,\n thumbBackgroundColor,\n ],\n );\n};\n\nSliderButton.displayName = 'SliderButton';\n\nexport default SliderButton;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"SliderButton.js","names":["_chaynsApi","require","_react","_react2","_interopRequireWildcard","_element","_calculate","_sliderButton","_Icon","_interopRequireDefault","_Popup","_SliderButton","_styledComponents","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","SliderButton","isDisabled","isSecondary","items","onChange","selectedButtonId","isRounded","dragRange","setDragRange","useState","left","right","shownItemsCount","setShownItemsCount","length","sliderSize","setSliderSize","width","currentId","setCurrentId","currentPopupId","setCurrentPopupId","currentIndex","setCurrentIndex","sliderButtonRef","useRef","sliderButtonWrapperRef","popupRef","scope","animate","useAnimate","theme","useTheme","initialItemWidth","useMemo","calculateBiggestWidth","elementSize","useElementSize","useEffect","setPopupId","useCallback","selectedId","ids","slice","map","id","newId","find","isSliderBigger","Math","floor","maxShownItemsCount","totalWidth","count","visibleItems","currentMaxWidth","itemWidth","sliderWidth","itemCount","animation","x","current","type","duration","setItemPosition","index","findIndex","handleClick","otherItem","_","indexOf","show","hide","backgroundColor","color","buttonBackgroundColor","buttonDesign","thumbBackgroundColor","buttons","newItems","otherItems","elements","text","createElement","StyledSliderButtonItem","$isSecondary","$width","key","onClick","popupContent","StyledSliderButtonPopupContentItem","$isSelected","push","ref","content","StyledSliderButtonPopupContent","icons","pseudoButtons","snapPoints","points","handleDragStart","setRefreshScrollEnabled","handleDragEnd","position","getThumbPosition","middle","scrollLeft","getNearestPoint","nearestPoint","nearestIndex","_items$nearestIndex","StyledSliderButton","$isDisabled","StyledSliderButtonButtonsWrapper","$isInvisible","StyledMotionSliderButtonThumb","$isRounded","drag","dragElastic","dragConstraints","onDragEnd","onDragStart","style","StyledSliderButtonWrapper","AnimatePresence","displayName","_default","exports"],"sources":["../../../../src/components/slider-button/SliderButton.tsx"],"sourcesContent":["import { setRefreshScrollEnabled } from 'chayns-api';\nimport { AnimatePresence, useAnimate } from 'motion/react';\nimport React, { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { useElementSize } from '../../hooks/element';\nimport { PopupRef } from '../../types/popup';\nimport type { SliderButtonItem } from '../../types/slider-button';\nimport { calculateBiggestWidth } from '../../utils/calculate';\nimport { getNearestPoint, getThumbPosition } from '../../utils/sliderButton';\nimport Icon from '../icon/Icon';\nimport Popup from '../popup/Popup';\nimport {\n StyledMotionSliderButtonThumb,\n StyledSliderButton,\n StyledSliderButtonButtonsWrapper,\n StyledSliderButtonItem,\n StyledSliderButtonPopupContent,\n StyledSliderButtonPopupContentItem,\n StyledSliderButtonWrapper,\n} from './SliderButton.styles';\nimport { useTheme } from 'styled-components';\nimport type { Theme } from '../color-scheme-provider/ColorSchemeProvider';\n\nexport type SliderButtonProps = {\n /**\n * Whether the button is disabled and cannot be clicked anymore.\n */\n isDisabled?: boolean;\n /**\n * Displays the button in the secondary style.\n */\n isSecondary?: boolean;\n /**\n * The items that should be displayed in the slider button.\n */\n items: SliderButtonItem[];\n /**\n * Function to be executed when a button is selected. The id of the selected button is passed as an argument.\n * @param id\n */\n onChange?: (id: string) => void;\n /**\n * The id of the button that should be selected.\n */\n selectedButtonId?: string;\n /**\n *\n */\n isRounded?: boolean;\n};\n\nconst SliderButton: FC<SliderButtonProps> = ({\n isDisabled,\n isSecondary,\n items,\n onChange,\n selectedButtonId,\n isRounded = false,\n}) => {\n const [dragRange, setDragRange] = useState({ left: 0, right: 0 });\n const [shownItemsCount, setShownItemsCount] = useState(items.length);\n const [sliderSize, setSliderSize] = useState({ width: 0 });\n const [currentId, setCurrentId] = useState('');\n const [currentPopupId, setCurrentPopupId] = useState('');\n const [currentIndex, setCurrentIndex] = useState(0);\n\n const sliderButtonRef = useRef<HTMLDivElement>(null);\n const sliderButtonWrapperRef = useRef<HTMLDivElement>(null);\n const popupRef = useRef<PopupRef>(null);\n\n const [scope, animate] = useAnimate();\n\n const theme = useTheme() as Theme;\n\n const initialItemWidth = useMemo(() => calculateBiggestWidth(items), [items]);\n const elementSize = useElementSize(sliderButtonRef);\n\n useEffect(() => {\n if (elementSize) setSliderSize(elementSize);\n }, [elementSize]);\n\n const setPopupId = useCallback(\n (selectedId: string) => {\n const ids = items.slice(shownItemsCount - 1).map(({ id }) => id);\n\n const newId = ids.find((id) => id === selectedId);\n\n if (newId) {\n setCurrentId('more');\n setCurrentPopupId(newId);\n\n return;\n }\n\n setCurrentId(selectedId);\n },\n [items, shownItemsCount],\n );\n\n const isSliderBigger = useMemo(\n () => sliderSize && Math.floor(sliderSize.width / initialItemWidth) < items.length - 1,\n [initialItemWidth, items.length, sliderSize],\n );\n\n const maxShownItemsCount = useMemo(() => {\n let totalWidth = 0;\n let count = 0;\n\n while (count < items.length) {\n const visibleItems = items.slice(0, count + 1);\n const currentMaxWidth = calculateBiggestWidth(visibleItems) + 8;\n\n if (totalWidth + currentMaxWidth > sliderSize.width) break;\n\n totalWidth += currentMaxWidth;\n count++;\n }\n\n return count;\n }, [items, sliderSize.width]);\n\n const itemWidth = useMemo(() => {\n const sliderWidth = sliderSize?.width || 0;\n const itemCount = items.length || 1;\n\n setShownItemsCount(isSliderBigger ? maxShownItemsCount : itemCount);\n\n return sliderWidth / (isSliderBigger ? maxShownItemsCount : itemCount);\n }, [isSliderBigger, items.length, maxShownItemsCount, sliderSize?.width]);\n\n useEffect(() => {\n if (sliderSize) {\n const sliderWidth = itemWidth * (items.length - 1);\n\n const count = Math.floor(sliderSize.width / itemWidth);\n\n setDragRange({ left: 0, right: isSliderBigger ? itemWidth * count : sliderWidth });\n }\n }, [isSliderBigger, itemWidth, items.length, sliderSize]);\n\n const animation = useCallback(\n async (x: number) => {\n await animate(\n scope.current,\n { x },\n {\n type: 'tween',\n duration: 0.2,\n },\n );\n },\n [animate, scope],\n );\n\n const setItemPosition = useCallback(\n (index: number) => {\n setCurrentIndex(index);\n\n void animation(itemWidth * index);\n },\n [animation, itemWidth],\n );\n\n useEffect(() => {\n if (typeof selectedButtonId === 'string') {\n let index = items.findIndex(({ id }) => id === selectedButtonId);\n\n setCurrentId(selectedButtonId);\n\n setPopupId(selectedButtonId);\n\n if (items.length > shownItemsCount && index > shownItemsCount - 1) {\n index = shownItemsCount - 1;\n }\n\n if (index >= 0) {\n setItemPosition(index);\n }\n }\n }, [\n animation,\n dragRange.right,\n isSliderBigger,\n itemWidth,\n items,\n selectedButtonId,\n setItemPosition,\n setPopupId,\n shownItemsCount,\n ]);\n\n const handleClick = useCallback(\n (id: string, index: number) => {\n if (isDisabled) {\n return;\n }\n\n if (currentIndex === index && items.length === 2) {\n const otherItem = items.find((_, findIndex) => index !== findIndex);\n if (!otherItem) return;\n\n setPopupId(otherItem.id);\n setItemPosition(items.indexOf(otherItem));\n return;\n }\n\n setPopupId(id);\n\n if (typeof onChange === 'function' && id !== 'more') {\n onChange(id);\n }\n\n if (popupRef.current) {\n if (id === 'more') {\n popupRef.current.show();\n } else {\n popupRef.current.hide();\n }\n }\n\n setItemPosition(index);\n },\n [currentIndex, isDisabled, items, onChange, setItemPosition, setPopupId],\n );\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 thumbBackgroundColor = useMemo(() => {\n let color;\n\n if (isSecondary) {\n color = theme['207'];\n } else {\n color = `rgba(${theme['405-rgb'] ?? ''}, 0.75)`;\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 buttons = useMemo(() => {\n if (items.length > shownItemsCount) {\n const newItems = items.slice(0, shownItemsCount - 1);\n const otherItems = items.slice(shownItemsCount - 1);\n\n const elements = newItems.map(({ id, text }, index) => (\n <StyledSliderButtonItem\n $isSecondary={isSecondary}\n $width={itemWidth}\n key={`slider-button-${id}`}\n onClick={() => handleClick(id, index)}\n >\n {text}\n </StyledSliderButtonItem>\n ));\n\n const popupContent = otherItems.map(({ id, text }) => (\n <StyledSliderButtonPopupContentItem\n key={`slider-button-${id}`}\n onClick={() => handleClick(id, newItems.length)}\n $isSelected={id === currentPopupId}\n >\n {text}\n </StyledSliderButtonPopupContentItem>\n ));\n\n const id = 'more';\n\n elements.push(\n <StyledSliderButtonItem\n $isSecondary={isSecondary}\n $width={itemWidth}\n key={`slider-button-${id}`}\n >\n <Popup\n ref={popupRef}\n content={\n <StyledSliderButtonPopupContent>\n {popupContent}\n </StyledSliderButtonPopupContent>\n }\n >\n <Icon icons={['fa fa-ellipsis']} color=\"white\" />\n </Popup>\n </StyledSliderButtonItem>,\n );\n\n return elements;\n }\n return items.map(({ id, text }) => (\n <StyledSliderButtonItem\n $isSecondary={isSecondary}\n $width={itemWidth}\n key={`slider-button-${id}`}\n >\n {text}\n </StyledSliderButtonItem>\n ));\n }, [currentPopupId, handleClick, isSecondary, itemWidth, items, shownItemsCount]);\n\n const pseudoButtons = useMemo(() => {\n if (items.length > shownItemsCount) {\n const newItems = items.slice(0, shownItemsCount - 1);\n\n const elements = newItems.map(({ id, text }, index) => (\n <StyledSliderButtonItem\n $isSecondary={isSecondary}\n $width={itemWidth}\n key={`pseudo-slider-button-${id}`}\n onClick={() => handleClick(id, index)}\n >\n {text}\n </StyledSliderButtonItem>\n ));\n\n const id = 'more';\n\n elements.push(\n <StyledSliderButtonItem\n $isSecondary={isSecondary}\n $width={itemWidth}\n key={`pseudo-slider-button-${id}`}\n onClick={() => handleClick(id, newItems.length)}\n >\n <Icon icons={['fa fa-ellipsis']} />\n </StyledSliderButtonItem>,\n );\n\n return elements;\n }\n return items.map(({ id, text }, index) => (\n <StyledSliderButtonItem\n $isSecondary={isSecondary}\n $width={itemWidth}\n key={`pseudo-slider-button-${id}`}\n onClick={() => handleClick(id, index)}\n >\n {text}\n </StyledSliderButtonItem>\n ));\n }, [handleClick, isSecondary, itemWidth, items, shownItemsCount]);\n\n /**\n * Creates an array with the snap points relative to the width of the items\n */\n const snapPoints = useMemo(() => {\n const points = [0];\n\n for (let i = 1; i < items.length; i++) {\n points.push(itemWidth * i);\n }\n\n return points;\n }, [itemWidth, items.length]);\n\n const handleDragStart = useCallback(() => {\n void setRefreshScrollEnabled(false);\n }, []);\n\n const handleDragEnd = useCallback(() => {\n void setRefreshScrollEnabled(true);\n\n const position = getThumbPosition({ scope, itemWidth });\n\n if (!position) {\n return;\n }\n\n const { middle, left } = position;\n\n let scrollLeft = 0;\n\n if (sliderButtonWrapperRef.current) {\n scrollLeft = sliderButtonWrapperRef.current.scrollLeft;\n\n sliderButtonWrapperRef.current.scrollLeft = getNearestPoint({\n snapPoints,\n position: middle,\n scrollLeft: scrollLeft - left,\n }).nearestPoint;\n }\n\n const { nearestIndex } = getNearestPoint({\n snapPoints,\n position: middle,\n scrollLeft,\n });\n\n const { nearestPoint } = getNearestPoint({\n snapPoints,\n position: middle,\n scrollLeft: 0,\n });\n\n if (nearestPoint >= 0 && nearestIndex >= 0) {\n void animation(nearestPoint);\n\n let id;\n\n if (nearestIndex === shownItemsCount - 1) {\n id = 'more';\n } else {\n id = items[nearestIndex]?.id;\n }\n\n if (popupRef.current) {\n if (id === 'more') {\n popupRef.current.show();\n } else {\n popupRef.current.hide();\n }\n }\n\n if (typeof onChange === 'function' && id && id !== 'more') {\n onChange(id);\n }\n }\n }, [animation, itemWidth, items, onChange, scope, shownItemsCount, snapPoints]);\n\n return useMemo(\n () => (\n <StyledSliderButton $isDisabled={isDisabled} ref={sliderButtonRef}>\n <StyledSliderButtonButtonsWrapper $isInvisible>\n {pseudoButtons}\n </StyledSliderButtonButtonsWrapper>\n <StyledMotionSliderButtonThumb\n $isRounded={isRounded}\n ref={scope}\n drag={isDisabled ? false : 'x'}\n dragElastic={0}\n dragConstraints={\n isSliderBigger\n ? { ...dragRange, right: dragRange.right - itemWidth }\n : { ...dragRange }\n }\n $width={itemWidth}\n onDragEnd={handleDragEnd}\n onDragStart={handleDragStart}\n onClick={() => handleClick(currentId, currentIndex)}\n style={{ backgroundColor: thumbBackgroundColor }}\n />\n <StyledSliderButtonWrapper\n $isRounded={isRounded}\n $isDisabled={isDisabled}\n $width={!isSliderBigger ? dragRange.right + itemWidth : dragRange.right}\n ref={sliderButtonWrapperRef}\n style={{ backgroundColor }}\n >\n <AnimatePresence>\n <StyledSliderButtonButtonsWrapper>\n {buttons}\n </StyledSliderButtonButtonsWrapper>\n </AnimatePresence>\n </StyledSliderButtonWrapper>\n </StyledSliderButton>\n ),\n [\n backgroundColor,\n buttons,\n currentId,\n currentIndex,\n dragRange,\n handleClick,\n handleDragEnd,\n handleDragStart,\n isDisabled,\n isRounded,\n isSliderBigger,\n itemWidth,\n pseudoButtons,\n scope,\n thumbBackgroundColor,\n ],\n );\n};\n\nSliderButton.displayName = 'SliderButton';\n\nexport default SliderButton;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -43,20 +43,14 @@ export const StyledMotionAccordion = styled(motion.div)`
|
|
|
43
43
|
$bottomBorderColor
|
|
44
44
|
}) => {
|
|
45
45
|
if ($shouldForceBackground || $shouldHideBottomLine) return undefined;
|
|
46
|
-
|
|
46
|
+
const shouldShowBottomBorder = theme.accordionLines && $shouldShowLines && ($isWrapped || !$isOpen);
|
|
47
|
+
if ($bottomBorderColor && shouldShowBottomBorder) return css`
|
|
47
48
|
border-bottom-color: ${$bottomBorderColor};
|
|
48
49
|
`;
|
|
49
|
-
if (
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
`;
|
|
54
|
-
}
|
|
55
|
-
if (!$isOpen && $shouldShowLines) {
|
|
56
|
-
return css`
|
|
57
|
-
border-bottom-color: rgba(${theme['headline-rgb']}, 1);
|
|
58
|
-
`;
|
|
59
|
-
}
|
|
50
|
+
if (shouldShowBottomBorder) {
|
|
51
|
+
return css`
|
|
52
|
+
border-bottom-color: rgba(${theme['headline-rgb']}, 1);
|
|
53
|
+
`;
|
|
60
54
|
}
|
|
61
55
|
return undefined;
|
|
62
56
|
}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Accordion.styles.js","names":["motion","styled","css","StyledMotionAccordion","div","$isOpen","$isWrapped","$shouldForceBackground","$shouldHideBackground","theme","cardBackgroundOpacity","cardBorderRadius","cardShadow","accordionLines","$shouldShowLines","$shouldHideBottomLine","$bottomBorderColor","undefined","$isParentWrapped"],"sources":["../../../../src/components/accordion/Accordion.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledMotionAccordionProps = WithTheme<{\n $isOpen: boolean;\n $isParentWrapped?: boolean;\n $isWrapped?: boolean;\n $shouldForceBackground?: boolean;\n $shouldHideBackground?: boolean;\n $shouldShowLines?: boolean;\n $shouldHideBottomLine: boolean;\n $bottomBorderColor?: string;\n}>;\n\nexport const StyledMotionAccordion = styled(motion.div)<StyledMotionAccordionProps>`\n ${({\n $isOpen,\n $isWrapped,\n $shouldForceBackground,\n $shouldHideBackground,\n theme,\n }: StyledMotionAccordionProps) =>\n ($isOpen || $shouldForceBackground) &&\n !$isWrapped &&\n !$shouldHideBackground &&\n css`\n background-color: rgba(${theme['100-rgb']}, ${theme.cardBackgroundOpacity});\n border-radius: ${theme.cardBorderRadius}px;\n box-shadow: 0 2px 6px 0 rgba(0, 0, 0, ${theme.cardShadow});\n `}\n\n ${({ theme }: StyledMotionAccordionProps) =>\n theme.accordionLines &&\n css`\n border-bottom: 1px solid transparent;\n `}\n\n margin-bottom: ${({ $isOpen, $isWrapped }: StyledMotionAccordionProps) =>\n $isOpen && !$isWrapped ? '30px' : '0px'};\n transition:\n background-color 0.3s ease,\n border-bottom-color 0.3s ease,\n border-radius 0.3s ease,\n box-shadow 0.3s ease,\n margin-bottom 0.3s ease;\n will-change: unset !important;\n\n margin-top: 10px;\n\n ${({\n $isOpen,\n $isWrapped,\n $shouldForceBackground,\n $shouldShowLines,\n $shouldHideBottomLine,\n theme,\n $bottomBorderColor,\n }: StyledMotionAccordionProps) => {\n if ($shouldForceBackground || $shouldHideBottomLine) return undefined;\n
|
|
1
|
+
{"version":3,"file":"Accordion.styles.js","names":["motion","styled","css","StyledMotionAccordion","div","$isOpen","$isWrapped","$shouldForceBackground","$shouldHideBackground","theme","cardBackgroundOpacity","cardBorderRadius","cardShadow","accordionLines","$shouldShowLines","$shouldHideBottomLine","$bottomBorderColor","undefined","shouldShowBottomBorder","$isParentWrapped"],"sources":["../../../../src/components/accordion/Accordion.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledMotionAccordionProps = WithTheme<{\n $isOpen: boolean;\n $isParentWrapped?: boolean;\n $isWrapped?: boolean;\n $shouldForceBackground?: boolean;\n $shouldHideBackground?: boolean;\n $shouldShowLines?: boolean;\n $shouldHideBottomLine: boolean;\n $bottomBorderColor?: string;\n}>;\n\nexport const StyledMotionAccordion = styled(motion.div)<StyledMotionAccordionProps>`\n ${({\n $isOpen,\n $isWrapped,\n $shouldForceBackground,\n $shouldHideBackground,\n theme,\n }: StyledMotionAccordionProps) =>\n ($isOpen || $shouldForceBackground) &&\n !$isWrapped &&\n !$shouldHideBackground &&\n css`\n background-color: rgba(${theme['100-rgb']}, ${theme.cardBackgroundOpacity});\n border-radius: ${theme.cardBorderRadius}px;\n box-shadow: 0 2px 6px 0 rgba(0, 0, 0, ${theme.cardShadow});\n `}\n\n ${({ theme }: StyledMotionAccordionProps) =>\n theme.accordionLines &&\n css`\n border-bottom: 1px solid transparent;\n `}\n\n margin-bottom: ${({ $isOpen, $isWrapped }: StyledMotionAccordionProps) =>\n $isOpen && !$isWrapped ? '30px' : '0px'};\n transition:\n background-color 0.3s ease,\n border-bottom-color 0.3s ease,\n border-radius 0.3s ease,\n box-shadow 0.3s ease,\n margin-bottom 0.3s ease;\n will-change: unset !important;\n\n margin-top: 10px;\n\n ${({\n $isOpen,\n $isWrapped,\n $shouldForceBackground,\n $shouldShowLines,\n $shouldHideBottomLine,\n theme,\n $bottomBorderColor,\n }: StyledMotionAccordionProps) => {\n if ($shouldForceBackground || $shouldHideBottomLine) return undefined;\n const shouldShowBottomBorder =\n theme.accordionLines && $shouldShowLines && ($isWrapped || !$isOpen);\n\n if ($bottomBorderColor && shouldShowBottomBorder)\n return css`\n border-bottom-color: ${$bottomBorderColor};\n `;\n\n if (shouldShowBottomBorder) {\n return css`\n border-bottom-color: rgba(${theme['headline-rgb']}, 1);\n `;\n }\n\n return undefined;\n }}\n ${({ $isParentWrapped }: StyledMotionAccordionProps) =>\n $isParentWrapped &&\n css`\n padding-left: 17px;\n `}\n ${({ $isWrapped }: StyledMotionAccordionProps) =>\n !$isWrapped\n ? css`\n margin-top: 5px;\n `\n : css`\n margin: 0;\n `}\n ${({ $isWrapped, $shouldHideBackground, theme }: StyledMotionAccordionProps) =>\n !$isWrapped &&\n !$shouldHideBackground &&\n css`\n &:hover,\n &:focus-visible {\n background-color: rgba(${theme['100-rgb']}, ${theme.cardBackgroundOpacity});\n }\n `};\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,cAAc;AACrC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAc/C,OAAO,MAAMC,qBAAqB,GAAGF,MAAM,CAACD,MAAM,CAACI,GAAG,CAA6B;AACnF,MAAM,CAAC;EACCC,OAAO;EACPC,UAAU;EACVC,sBAAsB;EACtBC,qBAAqB;EACrBC;AACwB,CAAC,KACzB,CAACJ,OAAO,IAAIE,sBAAsB,KAClC,CAACD,UAAU,IACX,CAACE,qBAAqB,IACtBN,GAAG;AACX,qCAAqCO,KAAK,CAAC,SAAS,CAAC,KAAKA,KAAK,CAACC,qBAAqB;AACrF,6BAA6BD,KAAK,CAACE,gBAAgB;AACnD,oDAAoDF,KAAK,CAACG,UAAU;AACpE,SAAS;AACT;AACA,MAAM,CAAC;EAAEH;AAAkC,CAAC,KACpCA,KAAK,CAACI,cAAc,IACpBX,GAAG;AACX;AACA,SAAS;AACT;AACA,qBAAqB,CAAC;EAAEG,OAAO;EAAEC;AAAuC,CAAC,KACjED,OAAO,IAAI,CAACC,UAAU,GAAG,MAAM,GAAG,KAAK;AAC/C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAM,CAAC;EACCD,OAAO;EACPC,UAAU;EACVC,sBAAsB;EACtBO,gBAAgB;EAChBC,qBAAqB;EACrBN,KAAK;EACLO;AACwB,CAAC,KAAK;EAC9B,IAAIT,sBAAsB,IAAIQ,qBAAqB,EAAE,OAAOE,SAAS;EACrE,MAAMC,sBAAsB,GACxBT,KAAK,CAACI,cAAc,IAAIC,gBAAgB,KAAKR,UAAU,IAAI,CAACD,OAAO,CAAC;EAExE,IAAIW,kBAAkB,IAAIE,sBAAsB,EAC5C,OAAOhB,GAAG;AACtB,uCAAuCc,kBAAkB;AACzD,aAAa;EAEL,IAAIE,sBAAsB,EAAE;IACxB,OAAOhB,GAAG;AACtB,4CAA4CO,KAAK,CAAC,cAAc,CAAC;AACjE,aAAa;EACL;EAEA,OAAOQ,SAAS;AACpB,CAAC;AACL,MAAM,CAAC;EAAEE;AAA6C,CAAC,KAC/CA,gBAAgB,IAChBjB,GAAG;AACX;AACA,SAAS;AACT,MAAM,CAAC;EAAEI;AAAuC,CAAC,KACzC,CAACA,UAAU,GACLJ,GAAG;AACjB;AACA,eAAe,GACDA,GAAG;AACjB;AACA,eAAe;AACf,MAAM,CAAC;EAAEI,UAAU;EAAEE,qBAAqB;EAAEC;AAAkC,CAAC,KACvE,CAACH,UAAU,IACX,CAACE,qBAAqB,IACtBN,GAAG;AACX;AACA;AACA,yCAAyCO,KAAK,CAAC,SAAS,CAAC,KAAKA,KAAK,CAACC,qBAAqB;AACzF;AACA,SAAS;AACT,CAAC","ignoreList":[]}
|
|
@@ -16,7 +16,8 @@ const Button = ({
|
|
|
16
16
|
shouldStopPropagation,
|
|
17
17
|
shouldShowAsSelectButton = false,
|
|
18
18
|
shouldShowTextAsRobotoMedium = true,
|
|
19
|
-
buttonDesign
|
|
19
|
+
buttonDesign,
|
|
20
|
+
tapDuration = 0.5
|
|
20
21
|
}) => {
|
|
21
22
|
const handleClick = event => {
|
|
22
23
|
if (shouldStopPropagation) {
|
|
@@ -91,7 +92,9 @@ const Button = ({
|
|
|
91
92
|
visibility: {
|
|
92
93
|
duration: 0
|
|
93
94
|
},
|
|
94
|
-
duration:
|
|
95
|
+
duration: tapDuration,
|
|
96
|
+
ease: 'easeIn',
|
|
97
|
+
type: 'tween'
|
|
95
98
|
},
|
|
96
99
|
whileTap: isDisabled ? {} : {
|
|
97
100
|
...tapStyles,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","names":["clsx","AnimatePresence","React","useMemo","useTheme","Icon","StyledIconWrapper","StyledMotionButton","StyledMotionChildrenWrapper","StyledMotionWaitCursorWrapper","WaitCursor","Button","children","className","icon","isDisabled","isSecondary","onClick","shouldShowWaitCursor","shouldStopPropagation","shouldShowAsSelectButton","shouldShowTextAsRobotoMedium","buttonDesign","handleClick","event","stopPropagation","buttonClasses","theme","effectiveButtonDesign","iconColor","text","buttonColor","buttonBackgroundColor","backgroundColor","color","tapStyles","opacity","hoverStyles","createElement","$shouldShowTextAsRobotoMedium","$shouldShowAsSelectButton","$shouldShowWaitCursor","disabled","$isDisabled","$hasChildren","$hasIcon","$isSecondary","$effectiveButtonDesign","style","visibility","initial","animate","transition","duration","whileTap","whileHover","icons","width","exit","key","overflow","shouldHideBackground","displayName"],"sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport { AnimatePresence } from 'motion/react';\nimport React, { FC, MouseEventHandler, 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 type { ButtonProps } from './Button.types';\nimport WaitCursor from './wait-cursor/WaitCursor';\n\nconst Button: FC<ButtonProps> = ({\n children,\n className,\n icon,\n isDisabled,\n isSecondary,\n onClick,\n shouldShowWaitCursor,\n shouldStopPropagation,\n shouldShowAsSelectButton = false,\n shouldShowTextAsRobotoMedium = true,\n buttonDesign,\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 = useTheme() as Theme;\n\n const effectiveButtonDesign = (buttonDesign ?? theme.buttonDesign) as number;\n\n const iconColor = useMemo(() => {\n if (isSecondary) {\n return theme.text;\n }\n\n return effectiveButtonDesign === 2\n ? (theme.buttonColor ?? theme.buttonBackgroundColor ?? 'white')\n : (theme.buttonColor ?? 'white');\n }, [\n isSecondary,\n theme.buttonBackgroundColor,\n theme.buttonColor,\n effectiveButtonDesign,\n theme.text,\n ]);\n\n const backgroundColor = useMemo(() => {\n let color;\n\n if (isSecondary || shouldShowAsSelectButton) {\n color = theme['202'];\n } else {\n color = theme.buttonBackgroundColor ?? theme['408'];\n }\n\n if (effectiveButtonDesign === 2) {\n color = `rgba(${theme['102-rgb'] ?? ''}, 0)`;\n }\n\n return color;\n }, [isSecondary, shouldShowAsSelectButton, theme, effectiveButtonDesign]);\n\n const tapStyles = useMemo(() => {\n if (effectiveButtonDesign === 2) {\n return {\n backgroundColor:\n isSecondary || shouldShowAsSelectButton\n ? `rgba(${theme['202-rgb'] ?? ''}, 0.7)`\n : `${theme.buttonBackgroundColor ?? ''}40`,\n };\n }\n\n return { opacity: 0.6 };\n }, [isSecondary, shouldShowAsSelectButton, theme, effectiveButtonDesign]);\n\n const hoverStyles = useMemo(() => {\n if (effectiveButtonDesign === 2) {\n return { backgroundColor: `rgba(${theme['102-rgb'] ?? ''}, 0.5)` };\n }\n\n return { opacity: 1 };\n }, [theme, effectiveButtonDesign]);\n\n return (\n <StyledMotionButton\n $shouldShowTextAsRobotoMedium={shouldShowTextAsRobotoMedium}\n $shouldShowAsSelectButton={shouldShowAsSelectButton}\n $shouldShowWaitCursor={shouldShowWaitCursor}\n className={buttonClasses}\n disabled={isDisabled}\n $isDisabled={isDisabled}\n $hasChildren={!!children}\n $hasIcon={typeof icon === 'string' && icon !== ''}\n $isSecondary={isSecondary}\n $effectiveButtonDesign={effectiveButtonDesign}\n onClick={handleClick}\n style={{ visibility: !backgroundColor ? 'hidden' : 'visible', backgroundColor }}\n initial={{ opacity: 0.5 }}\n animate={{\n opacity: isDisabled ? 0.5 : 1,\n }}\n transition={{ visibility: { duration: 0 }, duration: 0.5 }}\n whileTap={isDisabled ? {} : { ...tapStyles, transition: { duration: 0 } }}\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":[]}
|
|
1
|
+
{"version":3,"file":"Button.js","names":["clsx","AnimatePresence","React","useMemo","useTheme","Icon","StyledIconWrapper","StyledMotionButton","StyledMotionChildrenWrapper","StyledMotionWaitCursorWrapper","WaitCursor","Button","children","className","icon","isDisabled","isSecondary","onClick","shouldShowWaitCursor","shouldStopPropagation","shouldShowAsSelectButton","shouldShowTextAsRobotoMedium","buttonDesign","tapDuration","handleClick","event","stopPropagation","buttonClasses","theme","effectiveButtonDesign","iconColor","text","buttonColor","buttonBackgroundColor","backgroundColor","color","tapStyles","opacity","hoverStyles","createElement","$shouldShowTextAsRobotoMedium","$shouldShowAsSelectButton","$shouldShowWaitCursor","disabled","$isDisabled","$hasChildren","$hasIcon","$isSecondary","$effectiveButtonDesign","style","visibility","initial","animate","transition","duration","ease","type","whileTap","whileHover","icons","width","exit","key","overflow","shouldHideBackground","displayName"],"sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport { AnimatePresence } from 'motion/react';\nimport React, { FC, MouseEventHandler, 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 type { ButtonProps } from './Button.types';\nimport WaitCursor from './wait-cursor/WaitCursor';\n\nconst Button: FC<ButtonProps> = ({\n children,\n className,\n icon,\n isDisabled,\n isSecondary,\n onClick,\n shouldShowWaitCursor,\n shouldStopPropagation,\n shouldShowAsSelectButton = false,\n shouldShowTextAsRobotoMedium = true,\n buttonDesign,\n tapDuration = 0.5,\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 = useTheme() as Theme;\n\n const effectiveButtonDesign = (buttonDesign ?? theme.buttonDesign) as number;\n\n const iconColor = useMemo(() => {\n if (isSecondary) {\n return theme.text;\n }\n\n return effectiveButtonDesign === 2\n ? (theme.buttonColor ?? theme.buttonBackgroundColor ?? 'white')\n : (theme.buttonColor ?? 'white');\n }, [\n isSecondary,\n theme.buttonBackgroundColor,\n theme.buttonColor,\n effectiveButtonDesign,\n theme.text,\n ]);\n\n const backgroundColor = useMemo(() => {\n let color;\n\n if (isSecondary || shouldShowAsSelectButton) {\n color = theme['202'];\n } else {\n color = theme.buttonBackgroundColor ?? theme['408'];\n }\n\n if (effectiveButtonDesign === 2) {\n color = `rgba(${theme['102-rgb'] ?? ''}, 0)`;\n }\n\n return color;\n }, [isSecondary, shouldShowAsSelectButton, theme, effectiveButtonDesign]);\n\n const tapStyles = useMemo(() => {\n if (effectiveButtonDesign === 2) {\n return {\n backgroundColor:\n isSecondary || shouldShowAsSelectButton\n ? `rgba(${theme['202-rgb'] ?? ''}, 0.7)`\n : `${theme.buttonBackgroundColor ?? ''}40`,\n };\n }\n\n return { opacity: 0.6 };\n }, [isSecondary, shouldShowAsSelectButton, theme, effectiveButtonDesign]);\n\n const hoverStyles = useMemo(() => {\n if (effectiveButtonDesign === 2) {\n return { backgroundColor: `rgba(${theme['102-rgb'] ?? ''}, 0.5)` };\n }\n\n return { opacity: 1 };\n }, [theme, effectiveButtonDesign]);\n\n return (\n <StyledMotionButton\n $shouldShowTextAsRobotoMedium={shouldShowTextAsRobotoMedium}\n $shouldShowAsSelectButton={shouldShowAsSelectButton}\n $shouldShowWaitCursor={shouldShowWaitCursor}\n className={buttonClasses}\n disabled={isDisabled}\n $isDisabled={isDisabled}\n $hasChildren={!!children}\n $hasIcon={typeof icon === 'string' && icon !== ''}\n $isSecondary={isSecondary}\n $effectiveButtonDesign={effectiveButtonDesign}\n onClick={handleClick}\n style={{ visibility: !backgroundColor ? 'hidden' : 'visible', backgroundColor }}\n initial={{ opacity: 0.5 }}\n animate={{\n opacity: isDisabled ? 0.5 : 1,\n }}\n transition={{\n visibility: { duration: 0 },\n duration: tapDuration,\n ease: 'easeIn',\n type: 'tween',\n }}\n whileTap={isDisabled ? {} : { ...tapStyles, transition: { duration: 0 } }}\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":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.types.js","names":[],"sources":["../../../../src/components/button/Button.types.ts"],"sourcesContent":["import type { MouseEventHandler, ReactNode } from 'react';\n\nexport type ButtonProps = {\n /**\n * The label of the button.\n * @description\n * The content to be displayed inside the button. This can be text, icons, or any React node.\n * It serves as the primary label for the button's action.\n * @optional\n */\n children?: ReactNode;\n /**\n * Additional class names for the button element.\n * @description\n * Allows adding custom CSS classes to the button for further styling or integration with CSS frameworks.\n * Multiple classes can be provided as a space-separated string.\n * @optional\n */\n className?: string;\n /**\n * An icon that is displayed on the left-hand side of the button text.\n * @description\n * Specifies an icon to be shown alongside the button text. The icon is positioned to the left of the text.\n * This enhances the visual representation of the button's function.\n * @optional\n */\n icon?: string;\n /**\n * Whether the button is disabled and cannot be clicked anymore.\n * @description\n * When set to true, the button becomes non-interactive, preventing user clicks and often changing its appearance to indicate the disabled state.\n * This is useful for scenarios where the action is temporarily unavailable.\n * @optional\n */\n isDisabled?: boolean;\n /**\n * Displays the button in the secondary style.\n * @description\n * Applies a secondary visual style to the button, typically with a different background color or border.\n * This is used to differentiate less prominent actions from primary ones.\n * @optional\n */\n isSecondary?: boolean;\n /**\n * Function to be executed when the button is clicked.\n * @description\n * A callback function that is triggered when the user clicks on the button. This can be used to handle interactions,\n * such as submitting forms, navigating to pages, or performing any custom action.\n */\n onClick: MouseEventHandler<HTMLButtonElement>;\n /**\n * Whether the button should be displayed as a selectButton.\n * @description\n * Modifies the button's appearance to resemble a select button, often used in dropdowns or selection interfaces.\n * This changes the styling to indicate a selection state.\n * @optional\n * @default false\n */\n shouldShowAsSelectButton?: boolean;\n /**\n * Whether the text should be 'Roboto Medium'.\n * @description\n * Controls the font weight of the button text. When true, applies 'Roboto Medium' font weight for emphasis.\n * This can improve readability or match design guidelines.\n * @optional\n * @default true\n */\n shouldShowTextAsRobotoMedium?: boolean;\n /**\n * Shows a wait cursor instead of button text.\n * @description\n * Replaces the button content with a wait cursor animation, indicating that an action is in progress.\n * This provides visual feedback during loading or processing states.\n * @optional\n */\n shouldShowWaitCursor?: boolean;\n /**\n * Stops event propagation on click.\n * @description\n * Prevents the click event from bubbling up to parent elements, isolating the button's interaction.\n * Useful in complex UI structures where event handling needs to be contained.\n * @optional\n */\n shouldStopPropagation?: boolean;\n /**\n * Optional button design override.\n * @description\n * Allows overriding the default button design with a specific numeric value, corresponding to different visual themes or styles.\n * This provides flexibility for custom theming.\n * @optional\n */\n buttonDesign?: number;\n};\n"],"mappings":"","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"Button.types.js","names":[],"sources":["../../../../src/components/button/Button.types.ts"],"sourcesContent":["import type { MouseEventHandler, ReactNode } from 'react';\n\nexport type ButtonProps = {\n /**\n * The label of the button.\n * @description\n * The content to be displayed inside the button. This can be text, icons, or any React node.\n * It serves as the primary label for the button's action.\n * @optional\n */\n children?: ReactNode;\n /**\n * Additional class names for the button element.\n * @description\n * Allows adding custom CSS classes to the button for further styling or integration with CSS frameworks.\n * Multiple classes can be provided as a space-separated string.\n * @optional\n */\n className?: string;\n /**\n * An icon that is displayed on the left-hand side of the button text.\n * @description\n * Specifies an icon to be shown alongside the button text. The icon is positioned to the left of the text.\n * This enhances the visual representation of the button's function.\n * @optional\n */\n icon?: string;\n /**\n * Whether the button is disabled and cannot be clicked anymore.\n * @description\n * When set to true, the button becomes non-interactive, preventing user clicks and often changing its appearance to indicate the disabled state.\n * This is useful for scenarios where the action is temporarily unavailable.\n * @optional\n */\n isDisabled?: boolean;\n /**\n * Displays the button in the secondary style.\n * @description\n * Applies a secondary visual style to the button, typically with a different background color or border.\n * This is used to differentiate less prominent actions from primary ones.\n * @optional\n */\n isSecondary?: boolean;\n /**\n * Function to be executed when the button is clicked.\n * @description\n * A callback function that is triggered when the user clicks on the button. This can be used to handle interactions,\n * such as submitting forms, navigating to pages, or performing any custom action.\n */\n onClick: MouseEventHandler<HTMLButtonElement>;\n /**\n * Whether the button should be displayed as a selectButton.\n * @description\n * Modifies the button's appearance to resemble a select button, often used in dropdowns or selection interfaces.\n * This changes the styling to indicate a selection state.\n * @optional\n * @default false\n */\n shouldShowAsSelectButton?: boolean;\n /**\n * Whether the text should be 'Roboto Medium'.\n * @description\n * Controls the font weight of the button text. When true, applies 'Roboto Medium' font weight for emphasis.\n * This can improve readability or match design guidelines.\n * @optional\n * @default true\n */\n shouldShowTextAsRobotoMedium?: boolean;\n /**\n * Shows a wait cursor instead of button text.\n * @description\n * Replaces the button content with a wait cursor animation, indicating that an action is in progress.\n * This provides visual feedback during loading or processing states.\n * @optional\n */\n shouldShowWaitCursor?: boolean;\n /**\n * Stops event propagation on click.\n * @description\n * Prevents the click event from bubbling up to parent elements, isolating the button's interaction.\n * Useful in complex UI structures where event handling needs to be contained.\n * @optional\n */\n shouldStopPropagation?: boolean;\n /**\n * Optional button design override.\n * @description\n * Allows overriding the default button design with a specific numeric value, corresponding to different visual themes or styles.\n * This provides flexibility for custom theming.\n * @optional\n */\n buttonDesign?: number;\n /**\n * Duration in seconds for the tap animation.\n * @description\n * Overrides how long the pressed state animation should take when the button is tapped.\n * Set this to `0` for an immediate press effect.\n * @optional\n */\n tapDuration?: number;\n};\n"],"mappings":"","ignoreList":[]}
|
|
@@ -109,6 +109,13 @@ const SliderButton = ({
|
|
|
109
109
|
if (isDisabled) {
|
|
110
110
|
return;
|
|
111
111
|
}
|
|
112
|
+
if (currentIndex === index && items.length === 2) {
|
|
113
|
+
const otherItem = items.find((_, findIndex) => index !== findIndex);
|
|
114
|
+
if (!otherItem) return;
|
|
115
|
+
setPopupId(otherItem.id);
|
|
116
|
+
setItemPosition(items.indexOf(otherItem));
|
|
117
|
+
return;
|
|
118
|
+
}
|
|
112
119
|
setPopupId(id);
|
|
113
120
|
if (typeof onChange === 'function' && id !== 'more') {
|
|
114
121
|
onChange(id);
|
|
@@ -121,7 +128,7 @@ const SliderButton = ({
|
|
|
121
128
|
}
|
|
122
129
|
}
|
|
123
130
|
setItemPosition(index);
|
|
124
|
-
}, [isDisabled, onChange, setItemPosition, setPopupId]);
|
|
131
|
+
}, [currentIndex, isDisabled, items, onChange, setItemPosition, setPopupId]);
|
|
125
132
|
const backgroundColor = useMemo(() => {
|
|
126
133
|
let color;
|
|
127
134
|
if (isSecondary) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SliderButton.js","names":["setRefreshScrollEnabled","AnimatePresence","useAnimate","React","useCallback","useEffect","useMemo","useRef","useState","useElementSize","calculateBiggestWidth","getNearestPoint","getThumbPosition","Icon","Popup","StyledMotionSliderButtonThumb","StyledSliderButton","StyledSliderButtonButtonsWrapper","StyledSliderButtonItem","StyledSliderButtonPopupContent","StyledSliderButtonPopupContentItem","StyledSliderButtonWrapper","useTheme","SliderButton","isDisabled","isSecondary","items","onChange","selectedButtonId","isRounded","dragRange","setDragRange","left","right","shownItemsCount","setShownItemsCount","length","sliderSize","setSliderSize","width","currentId","setCurrentId","currentPopupId","setCurrentPopupId","currentIndex","setCurrentIndex","sliderButtonRef","sliderButtonWrapperRef","popupRef","scope","animate","theme","initialItemWidth","elementSize","setPopupId","selectedId","ids","slice","map","id","newId","find","isSliderBigger","Math","floor","maxShownItemsCount","totalWidth","count","visibleItems","currentMaxWidth","itemWidth","sliderWidth","itemCount","animation","x","current","type","duration","setItemPosition","index","findIndex","handleClick","show","hide","backgroundColor","color","buttonBackgroundColor","buttonDesign","thumbBackgroundColor","buttons","newItems","otherItems","elements","text","createElement","$isSecondary","$width","key","onClick","popupContent","$isSelected","push","ref","content","icons","pseudoButtons","snapPoints","points","i","handleDragStart","handleDragEnd","position","middle","scrollLeft","nearestPoint","nearestIndex","$isDisabled","$isInvisible","$isRounded","drag","dragElastic","dragConstraints","onDragEnd","onDragStart","style","displayName"],"sources":["../../../../src/components/slider-button/SliderButton.tsx"],"sourcesContent":["import { setRefreshScrollEnabled } from 'chayns-api';\nimport { AnimatePresence, useAnimate } from 'motion/react';\nimport React, { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { useElementSize } from '../../hooks/element';\nimport { PopupRef } from '../../types/popup';\nimport type { SliderButtonItem } from '../../types/slider-button';\nimport { calculateBiggestWidth } from '../../utils/calculate';\nimport { getNearestPoint, getThumbPosition } from '../../utils/sliderButton';\nimport Icon from '../icon/Icon';\nimport Popup from '../popup/Popup';\nimport {\n StyledMotionSliderButtonThumb,\n StyledSliderButton,\n StyledSliderButtonButtonsWrapper,\n StyledSliderButtonItem,\n StyledSliderButtonPopupContent,\n StyledSliderButtonPopupContentItem,\n StyledSliderButtonWrapper,\n} from './SliderButton.styles';\nimport { useTheme } from 'styled-components';\nimport type { Theme } from '../color-scheme-provider/ColorSchemeProvider';\n\nexport type SliderButtonProps = {\n /**\n * Whether the button is disabled and cannot be clicked anymore.\n */\n isDisabled?: boolean;\n /**\n * Displays the button in the secondary style.\n */\n isSecondary?: boolean;\n /**\n * The items that should be displayed in the slider button.\n */\n items: SliderButtonItem[];\n /**\n * Function to be executed when a button is selected. The id of the selected button is passed as an argument.\n * @param id\n */\n onChange?: (id: string) => void;\n /**\n * The id of the button that should be selected.\n */\n selectedButtonId?: string;\n /**\n *\n */\n isRounded?: boolean;\n};\n\nconst SliderButton: FC<SliderButtonProps> = ({\n isDisabled,\n isSecondary,\n items,\n onChange,\n selectedButtonId,\n isRounded = false,\n}) => {\n const [dragRange, setDragRange] = useState({ left: 0, right: 0 });\n const [shownItemsCount, setShownItemsCount] = useState(items.length);\n const [sliderSize, setSliderSize] = useState({ width: 0 });\n const [currentId, setCurrentId] = useState('');\n const [currentPopupId, setCurrentPopupId] = useState('');\n const [currentIndex, setCurrentIndex] = useState(0);\n\n const sliderButtonRef = useRef<HTMLDivElement>(null);\n const sliderButtonWrapperRef = useRef<HTMLDivElement>(null);\n const popupRef = useRef<PopupRef>(null);\n\n const [scope, animate] = useAnimate();\n\n const theme = useTheme() as Theme;\n\n const initialItemWidth = useMemo(() => calculateBiggestWidth(items), [items]);\n const elementSize = useElementSize(sliderButtonRef);\n\n useEffect(() => {\n if (elementSize) setSliderSize(elementSize);\n }, [elementSize]);\n\n const setPopupId = useCallback(\n (selectedId: string) => {\n const ids = items.slice(shownItemsCount - 1).map(({ id }) => id);\n\n const newId = ids.find((id) => id === selectedId);\n\n if (newId) {\n setCurrentId('more');\n setCurrentPopupId(newId);\n\n return;\n }\n\n setCurrentId(selectedId);\n },\n [items, shownItemsCount],\n );\n\n const isSliderBigger = useMemo(\n () => sliderSize && Math.floor(sliderSize.width / initialItemWidth) < items.length - 1,\n [initialItemWidth, items.length, sliderSize],\n );\n\n const maxShownItemsCount = useMemo(() => {\n let totalWidth = 0;\n let count = 0;\n\n while (count < items.length) {\n const visibleItems = items.slice(0, count + 1);\n const currentMaxWidth = calculateBiggestWidth(visibleItems) + 8;\n\n if (totalWidth + currentMaxWidth > sliderSize.width) break;\n\n totalWidth += currentMaxWidth;\n count++;\n }\n\n return count;\n }, [items, sliderSize.width]);\n\n const itemWidth = useMemo(() => {\n const sliderWidth = sliderSize?.width || 0;\n const itemCount = items.length || 1;\n\n setShownItemsCount(isSliderBigger ? maxShownItemsCount : itemCount);\n\n return sliderWidth / (isSliderBigger ? maxShownItemsCount : itemCount);\n }, [isSliderBigger, items.length, maxShownItemsCount, sliderSize?.width]);\n\n useEffect(() => {\n if (sliderSize) {\n const sliderWidth = itemWidth * (items.length - 1);\n\n const count = Math.floor(sliderSize.width / itemWidth);\n\n setDragRange({ left: 0, right: isSliderBigger ? itemWidth * count : sliderWidth });\n }\n }, [isSliderBigger, itemWidth, items.length, sliderSize]);\n\n const animation = useCallback(\n async (x: number) => {\n await animate(\n scope.current,\n { x },\n {\n type: 'tween',\n duration: 0.2,\n },\n );\n },\n [animate, scope],\n );\n\n const setItemPosition = useCallback(\n (index: number) => {\n setCurrentIndex(index);\n\n void animation(itemWidth * index);\n },\n [animation, itemWidth],\n );\n\n useEffect(() => {\n if (typeof selectedButtonId === 'string') {\n let index = items.findIndex(({ id }) => id === selectedButtonId);\n\n setCurrentId(selectedButtonId);\n\n setPopupId(selectedButtonId);\n\n if (items.length > shownItemsCount && index > shownItemsCount - 1) {\n index = shownItemsCount - 1;\n }\n\n if (index >= 0) {\n setItemPosition(index);\n }\n }\n }, [\n animation,\n dragRange.right,\n isSliderBigger,\n itemWidth,\n items,\n selectedButtonId,\n setItemPosition,\n setPopupId,\n shownItemsCount,\n ]);\n\n const handleClick = useCallback(\n (id: string, index: number) => {\n if (isDisabled) {\n return;\n }\n\n setPopupId(id);\n\n if (typeof onChange === 'function' && id !== 'more') {\n onChange(id);\n }\n\n if (popupRef.current) {\n if (id === 'more') {\n popupRef.current.show();\n } else {\n popupRef.current.hide();\n }\n }\n\n setItemPosition(index);\n },\n [isDisabled, onChange, setItemPosition, setPopupId],\n );\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 thumbBackgroundColor = useMemo(() => {\n let color;\n\n if (isSecondary) {\n color = theme['207'];\n } else {\n color = `rgba(${theme['405-rgb'] ?? ''}, 0.75)`;\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 buttons = useMemo(() => {\n if (items.length > shownItemsCount) {\n const newItems = items.slice(0, shownItemsCount - 1);\n const otherItems = items.slice(shownItemsCount - 1);\n\n const elements = newItems.map(({ id, text }, index) => (\n <StyledSliderButtonItem\n $isSecondary={isSecondary}\n $width={itemWidth}\n key={`slider-button-${id}`}\n onClick={() => handleClick(id, index)}\n >\n {text}\n </StyledSliderButtonItem>\n ));\n\n const popupContent = otherItems.map(({ id, text }) => (\n <StyledSliderButtonPopupContentItem\n key={`slider-button-${id}`}\n onClick={() => handleClick(id, newItems.length)}\n $isSelected={id === currentPopupId}\n >\n {text}\n </StyledSliderButtonPopupContentItem>\n ));\n\n const id = 'more';\n\n elements.push(\n <StyledSliderButtonItem\n $isSecondary={isSecondary}\n $width={itemWidth}\n key={`slider-button-${id}`}\n >\n <Popup\n ref={popupRef}\n content={\n <StyledSliderButtonPopupContent>\n {popupContent}\n </StyledSliderButtonPopupContent>\n }\n >\n <Icon icons={['fa fa-ellipsis']} color=\"white\" />\n </Popup>\n </StyledSliderButtonItem>,\n );\n\n return elements;\n }\n return items.map(({ id, text }) => (\n <StyledSliderButtonItem\n $isSecondary={isSecondary}\n $width={itemWidth}\n key={`slider-button-${id}`}\n >\n {text}\n </StyledSliderButtonItem>\n ));\n }, [currentPopupId, handleClick, isSecondary, itemWidth, items, shownItemsCount]);\n\n const pseudoButtons = useMemo(() => {\n if (items.length > shownItemsCount) {\n const newItems = items.slice(0, shownItemsCount - 1);\n\n const elements = newItems.map(({ id, text }, index) => (\n <StyledSliderButtonItem\n $isSecondary={isSecondary}\n $width={itemWidth}\n key={`pseudo-slider-button-${id}`}\n onClick={() => handleClick(id, index)}\n >\n {text}\n </StyledSliderButtonItem>\n ));\n\n const id = 'more';\n\n elements.push(\n <StyledSliderButtonItem\n $isSecondary={isSecondary}\n $width={itemWidth}\n key={`pseudo-slider-button-${id}`}\n onClick={() => handleClick(id, newItems.length)}\n >\n <Icon icons={['fa fa-ellipsis']} />\n </StyledSliderButtonItem>,\n );\n\n return elements;\n }\n return items.map(({ id, text }, index) => (\n <StyledSliderButtonItem\n $isSecondary={isSecondary}\n $width={itemWidth}\n key={`pseudo-slider-button-${id}`}\n onClick={() => handleClick(id, index)}\n >\n {text}\n </StyledSliderButtonItem>\n ));\n }, [handleClick, isSecondary, itemWidth, items, shownItemsCount]);\n\n /**\n * Creates an array with the snap points relative to the width of the items\n */\n const snapPoints = useMemo(() => {\n const points = [0];\n\n for (let i = 1; i < items.length; i++) {\n points.push(itemWidth * i);\n }\n\n return points;\n }, [itemWidth, items.length]);\n\n const handleDragStart = useCallback(() => {\n void setRefreshScrollEnabled(false);\n }, []);\n\n const handleDragEnd = useCallback(() => {\n void setRefreshScrollEnabled(true);\n\n const position = getThumbPosition({ scope, itemWidth });\n\n if (!position) {\n return;\n }\n\n const { middle, left } = position;\n\n let scrollLeft = 0;\n\n if (sliderButtonWrapperRef.current) {\n scrollLeft = sliderButtonWrapperRef.current.scrollLeft;\n\n sliderButtonWrapperRef.current.scrollLeft = getNearestPoint({\n snapPoints,\n position: middle,\n scrollLeft: scrollLeft - left,\n }).nearestPoint;\n }\n\n const { nearestIndex } = getNearestPoint({\n snapPoints,\n position: middle,\n scrollLeft,\n });\n\n const { nearestPoint } = getNearestPoint({\n snapPoints,\n position: middle,\n scrollLeft: 0,\n });\n\n if (nearestPoint >= 0 && nearestIndex >= 0) {\n void animation(nearestPoint);\n\n let id;\n\n if (nearestIndex === shownItemsCount - 1) {\n id = 'more';\n } else {\n id = items[nearestIndex]?.id;\n }\n\n if (popupRef.current) {\n if (id === 'more') {\n popupRef.current.show();\n } else {\n popupRef.current.hide();\n }\n }\n\n if (typeof onChange === 'function' && id && id !== 'more') {\n onChange(id);\n }\n }\n }, [animation, itemWidth, items, onChange, scope, shownItemsCount, snapPoints]);\n\n return useMemo(\n () => (\n <StyledSliderButton $isDisabled={isDisabled} ref={sliderButtonRef}>\n <StyledSliderButtonButtonsWrapper $isInvisible>\n {pseudoButtons}\n </StyledSliderButtonButtonsWrapper>\n <StyledMotionSliderButtonThumb\n $isRounded={isRounded}\n ref={scope}\n drag={isDisabled ? false : 'x'}\n dragElastic={0}\n dragConstraints={\n isSliderBigger\n ? { ...dragRange, right: dragRange.right - itemWidth }\n : { ...dragRange }\n }\n $width={itemWidth}\n onDragEnd={handleDragEnd}\n onDragStart={handleDragStart}\n onClick={() => handleClick(currentId, currentIndex)}\n style={{ backgroundColor: thumbBackgroundColor }}\n />\n <StyledSliderButtonWrapper\n $isRounded={isRounded}\n $isDisabled={isDisabled}\n $width={!isSliderBigger ? dragRange.right + itemWidth : dragRange.right}\n ref={sliderButtonWrapperRef}\n style={{ backgroundColor }}\n >\n <AnimatePresence>\n <StyledSliderButtonButtonsWrapper>\n {buttons}\n </StyledSliderButtonButtonsWrapper>\n </AnimatePresence>\n </StyledSliderButtonWrapper>\n </StyledSliderButton>\n ),\n [\n backgroundColor,\n buttons,\n currentId,\n currentIndex,\n dragRange,\n handleClick,\n handleDragEnd,\n handleDragStart,\n isDisabled,\n isRounded,\n isSliderBigger,\n itemWidth,\n pseudoButtons,\n scope,\n thumbBackgroundColor,\n ],\n );\n};\n\nSliderButton.displayName = 'SliderButton';\n\nexport default SliderButton;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"SliderButton.js","names":["setRefreshScrollEnabled","AnimatePresence","useAnimate","React","useCallback","useEffect","useMemo","useRef","useState","useElementSize","calculateBiggestWidth","getNearestPoint","getThumbPosition","Icon","Popup","StyledMotionSliderButtonThumb","StyledSliderButton","StyledSliderButtonButtonsWrapper","StyledSliderButtonItem","StyledSliderButtonPopupContent","StyledSliderButtonPopupContentItem","StyledSliderButtonWrapper","useTheme","SliderButton","isDisabled","isSecondary","items","onChange","selectedButtonId","isRounded","dragRange","setDragRange","left","right","shownItemsCount","setShownItemsCount","length","sliderSize","setSliderSize","width","currentId","setCurrentId","currentPopupId","setCurrentPopupId","currentIndex","setCurrentIndex","sliderButtonRef","sliderButtonWrapperRef","popupRef","scope","animate","theme","initialItemWidth","elementSize","setPopupId","selectedId","ids","slice","map","id","newId","find","isSliderBigger","Math","floor","maxShownItemsCount","totalWidth","count","visibleItems","currentMaxWidth","itemWidth","sliderWidth","itemCount","animation","x","current","type","duration","setItemPosition","index","findIndex","handleClick","otherItem","_","indexOf","show","hide","backgroundColor","color","buttonBackgroundColor","buttonDesign","thumbBackgroundColor","buttons","newItems","otherItems","elements","text","createElement","$isSecondary","$width","key","onClick","popupContent","$isSelected","push","ref","content","icons","pseudoButtons","snapPoints","points","i","handleDragStart","handleDragEnd","position","middle","scrollLeft","nearestPoint","nearestIndex","$isDisabled","$isInvisible","$isRounded","drag","dragElastic","dragConstraints","onDragEnd","onDragStart","style","displayName"],"sources":["../../../../src/components/slider-button/SliderButton.tsx"],"sourcesContent":["import { setRefreshScrollEnabled } from 'chayns-api';\nimport { AnimatePresence, useAnimate } from 'motion/react';\nimport React, { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { useElementSize } from '../../hooks/element';\nimport { PopupRef } from '../../types/popup';\nimport type { SliderButtonItem } from '../../types/slider-button';\nimport { calculateBiggestWidth } from '../../utils/calculate';\nimport { getNearestPoint, getThumbPosition } from '../../utils/sliderButton';\nimport Icon from '../icon/Icon';\nimport Popup from '../popup/Popup';\nimport {\n StyledMotionSliderButtonThumb,\n StyledSliderButton,\n StyledSliderButtonButtonsWrapper,\n StyledSliderButtonItem,\n StyledSliderButtonPopupContent,\n StyledSliderButtonPopupContentItem,\n StyledSliderButtonWrapper,\n} from './SliderButton.styles';\nimport { useTheme } from 'styled-components';\nimport type { Theme } from '../color-scheme-provider/ColorSchemeProvider';\n\nexport type SliderButtonProps = {\n /**\n * Whether the button is disabled and cannot be clicked anymore.\n */\n isDisabled?: boolean;\n /**\n * Displays the button in the secondary style.\n */\n isSecondary?: boolean;\n /**\n * The items that should be displayed in the slider button.\n */\n items: SliderButtonItem[];\n /**\n * Function to be executed when a button is selected. The id of the selected button is passed as an argument.\n * @param id\n */\n onChange?: (id: string) => void;\n /**\n * The id of the button that should be selected.\n */\n selectedButtonId?: string;\n /**\n *\n */\n isRounded?: boolean;\n};\n\nconst SliderButton: FC<SliderButtonProps> = ({\n isDisabled,\n isSecondary,\n items,\n onChange,\n selectedButtonId,\n isRounded = false,\n}) => {\n const [dragRange, setDragRange] = useState({ left: 0, right: 0 });\n const [shownItemsCount, setShownItemsCount] = useState(items.length);\n const [sliderSize, setSliderSize] = useState({ width: 0 });\n const [currentId, setCurrentId] = useState('');\n const [currentPopupId, setCurrentPopupId] = useState('');\n const [currentIndex, setCurrentIndex] = useState(0);\n\n const sliderButtonRef = useRef<HTMLDivElement>(null);\n const sliderButtonWrapperRef = useRef<HTMLDivElement>(null);\n const popupRef = useRef<PopupRef>(null);\n\n const [scope, animate] = useAnimate();\n\n const theme = useTheme() as Theme;\n\n const initialItemWidth = useMemo(() => calculateBiggestWidth(items), [items]);\n const elementSize = useElementSize(sliderButtonRef);\n\n useEffect(() => {\n if (elementSize) setSliderSize(elementSize);\n }, [elementSize]);\n\n const setPopupId = useCallback(\n (selectedId: string) => {\n const ids = items.slice(shownItemsCount - 1).map(({ id }) => id);\n\n const newId = ids.find((id) => id === selectedId);\n\n if (newId) {\n setCurrentId('more');\n setCurrentPopupId(newId);\n\n return;\n }\n\n setCurrentId(selectedId);\n },\n [items, shownItemsCount],\n );\n\n const isSliderBigger = useMemo(\n () => sliderSize && Math.floor(sliderSize.width / initialItemWidth) < items.length - 1,\n [initialItemWidth, items.length, sliderSize],\n );\n\n const maxShownItemsCount = useMemo(() => {\n let totalWidth = 0;\n let count = 0;\n\n while (count < items.length) {\n const visibleItems = items.slice(0, count + 1);\n const currentMaxWidth = calculateBiggestWidth(visibleItems) + 8;\n\n if (totalWidth + currentMaxWidth > sliderSize.width) break;\n\n totalWidth += currentMaxWidth;\n count++;\n }\n\n return count;\n }, [items, sliderSize.width]);\n\n const itemWidth = useMemo(() => {\n const sliderWidth = sliderSize?.width || 0;\n const itemCount = items.length || 1;\n\n setShownItemsCount(isSliderBigger ? maxShownItemsCount : itemCount);\n\n return sliderWidth / (isSliderBigger ? maxShownItemsCount : itemCount);\n }, [isSliderBigger, items.length, maxShownItemsCount, sliderSize?.width]);\n\n useEffect(() => {\n if (sliderSize) {\n const sliderWidth = itemWidth * (items.length - 1);\n\n const count = Math.floor(sliderSize.width / itemWidth);\n\n setDragRange({ left: 0, right: isSliderBigger ? itemWidth * count : sliderWidth });\n }\n }, [isSliderBigger, itemWidth, items.length, sliderSize]);\n\n const animation = useCallback(\n async (x: number) => {\n await animate(\n scope.current,\n { x },\n {\n type: 'tween',\n duration: 0.2,\n },\n );\n },\n [animate, scope],\n );\n\n const setItemPosition = useCallback(\n (index: number) => {\n setCurrentIndex(index);\n\n void animation(itemWidth * index);\n },\n [animation, itemWidth],\n );\n\n useEffect(() => {\n if (typeof selectedButtonId === 'string') {\n let index = items.findIndex(({ id }) => id === selectedButtonId);\n\n setCurrentId(selectedButtonId);\n\n setPopupId(selectedButtonId);\n\n if (items.length > shownItemsCount && index > shownItemsCount - 1) {\n index = shownItemsCount - 1;\n }\n\n if (index >= 0) {\n setItemPosition(index);\n }\n }\n }, [\n animation,\n dragRange.right,\n isSliderBigger,\n itemWidth,\n items,\n selectedButtonId,\n setItemPosition,\n setPopupId,\n shownItemsCount,\n ]);\n\n const handleClick = useCallback(\n (id: string, index: number) => {\n if (isDisabled) {\n return;\n }\n\n if (currentIndex === index && items.length === 2) {\n const otherItem = items.find((_, findIndex) => index !== findIndex);\n if (!otherItem) return;\n\n setPopupId(otherItem.id);\n setItemPosition(items.indexOf(otherItem));\n return;\n }\n\n setPopupId(id);\n\n if (typeof onChange === 'function' && id !== 'more') {\n onChange(id);\n }\n\n if (popupRef.current) {\n if (id === 'more') {\n popupRef.current.show();\n } else {\n popupRef.current.hide();\n }\n }\n\n setItemPosition(index);\n },\n [currentIndex, isDisabled, items, onChange, setItemPosition, setPopupId],\n );\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 thumbBackgroundColor = useMemo(() => {\n let color;\n\n if (isSecondary) {\n color = theme['207'];\n } else {\n color = `rgba(${theme['405-rgb'] ?? ''}, 0.75)`;\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 buttons = useMemo(() => {\n if (items.length > shownItemsCount) {\n const newItems = items.slice(0, shownItemsCount - 1);\n const otherItems = items.slice(shownItemsCount - 1);\n\n const elements = newItems.map(({ id, text }, index) => (\n <StyledSliderButtonItem\n $isSecondary={isSecondary}\n $width={itemWidth}\n key={`slider-button-${id}`}\n onClick={() => handleClick(id, index)}\n >\n {text}\n </StyledSliderButtonItem>\n ));\n\n const popupContent = otherItems.map(({ id, text }) => (\n <StyledSliderButtonPopupContentItem\n key={`slider-button-${id}`}\n onClick={() => handleClick(id, newItems.length)}\n $isSelected={id === currentPopupId}\n >\n {text}\n </StyledSliderButtonPopupContentItem>\n ));\n\n const id = 'more';\n\n elements.push(\n <StyledSliderButtonItem\n $isSecondary={isSecondary}\n $width={itemWidth}\n key={`slider-button-${id}`}\n >\n <Popup\n ref={popupRef}\n content={\n <StyledSliderButtonPopupContent>\n {popupContent}\n </StyledSliderButtonPopupContent>\n }\n >\n <Icon icons={['fa fa-ellipsis']} color=\"white\" />\n </Popup>\n </StyledSliderButtonItem>,\n );\n\n return elements;\n }\n return items.map(({ id, text }) => (\n <StyledSliderButtonItem\n $isSecondary={isSecondary}\n $width={itemWidth}\n key={`slider-button-${id}`}\n >\n {text}\n </StyledSliderButtonItem>\n ));\n }, [currentPopupId, handleClick, isSecondary, itemWidth, items, shownItemsCount]);\n\n const pseudoButtons = useMemo(() => {\n if (items.length > shownItemsCount) {\n const newItems = items.slice(0, shownItemsCount - 1);\n\n const elements = newItems.map(({ id, text }, index) => (\n <StyledSliderButtonItem\n $isSecondary={isSecondary}\n $width={itemWidth}\n key={`pseudo-slider-button-${id}`}\n onClick={() => handleClick(id, index)}\n >\n {text}\n </StyledSliderButtonItem>\n ));\n\n const id = 'more';\n\n elements.push(\n <StyledSliderButtonItem\n $isSecondary={isSecondary}\n $width={itemWidth}\n key={`pseudo-slider-button-${id}`}\n onClick={() => handleClick(id, newItems.length)}\n >\n <Icon icons={['fa fa-ellipsis']} />\n </StyledSliderButtonItem>,\n );\n\n return elements;\n }\n return items.map(({ id, text }, index) => (\n <StyledSliderButtonItem\n $isSecondary={isSecondary}\n $width={itemWidth}\n key={`pseudo-slider-button-${id}`}\n onClick={() => handleClick(id, index)}\n >\n {text}\n </StyledSliderButtonItem>\n ));\n }, [handleClick, isSecondary, itemWidth, items, shownItemsCount]);\n\n /**\n * Creates an array with the snap points relative to the width of the items\n */\n const snapPoints = useMemo(() => {\n const points = [0];\n\n for (let i = 1; i < items.length; i++) {\n points.push(itemWidth * i);\n }\n\n return points;\n }, [itemWidth, items.length]);\n\n const handleDragStart = useCallback(() => {\n void setRefreshScrollEnabled(false);\n }, []);\n\n const handleDragEnd = useCallback(() => {\n void setRefreshScrollEnabled(true);\n\n const position = getThumbPosition({ scope, itemWidth });\n\n if (!position) {\n return;\n }\n\n const { middle, left } = position;\n\n let scrollLeft = 0;\n\n if (sliderButtonWrapperRef.current) {\n scrollLeft = sliderButtonWrapperRef.current.scrollLeft;\n\n sliderButtonWrapperRef.current.scrollLeft = getNearestPoint({\n snapPoints,\n position: middle,\n scrollLeft: scrollLeft - left,\n }).nearestPoint;\n }\n\n const { nearestIndex } = getNearestPoint({\n snapPoints,\n position: middle,\n scrollLeft,\n });\n\n const { nearestPoint } = getNearestPoint({\n snapPoints,\n position: middle,\n scrollLeft: 0,\n });\n\n if (nearestPoint >= 0 && nearestIndex >= 0) {\n void animation(nearestPoint);\n\n let id;\n\n if (nearestIndex === shownItemsCount - 1) {\n id = 'more';\n } else {\n id = items[nearestIndex]?.id;\n }\n\n if (popupRef.current) {\n if (id === 'more') {\n popupRef.current.show();\n } else {\n popupRef.current.hide();\n }\n }\n\n if (typeof onChange === 'function' && id && id !== 'more') {\n onChange(id);\n }\n }\n }, [animation, itemWidth, items, onChange, scope, shownItemsCount, snapPoints]);\n\n return useMemo(\n () => (\n <StyledSliderButton $isDisabled={isDisabled} ref={sliderButtonRef}>\n <StyledSliderButtonButtonsWrapper $isInvisible>\n {pseudoButtons}\n </StyledSliderButtonButtonsWrapper>\n <StyledMotionSliderButtonThumb\n $isRounded={isRounded}\n ref={scope}\n drag={isDisabled ? false : 'x'}\n dragElastic={0}\n dragConstraints={\n isSliderBigger\n ? { ...dragRange, right: dragRange.right - itemWidth }\n : { ...dragRange }\n }\n $width={itemWidth}\n onDragEnd={handleDragEnd}\n onDragStart={handleDragStart}\n onClick={() => handleClick(currentId, currentIndex)}\n style={{ backgroundColor: thumbBackgroundColor }}\n />\n <StyledSliderButtonWrapper\n $isRounded={isRounded}\n $isDisabled={isDisabled}\n $width={!isSliderBigger ? dragRange.right + itemWidth : dragRange.right}\n ref={sliderButtonWrapperRef}\n style={{ backgroundColor }}\n >\n <AnimatePresence>\n <StyledSliderButtonButtonsWrapper>\n {buttons}\n </StyledSliderButtonButtonsWrapper>\n </AnimatePresence>\n </StyledSliderButtonWrapper>\n </StyledSliderButton>\n ),\n [\n backgroundColor,\n buttons,\n currentId,\n currentIndex,\n dragRange,\n handleClick,\n handleDragEnd,\n handleDragStart,\n isDisabled,\n isRounded,\n isSliderBigger,\n itemWidth,\n pseudoButtons,\n scope,\n thumbBackgroundColor,\n ],\n );\n};\n\nSliderButton.displayName = 'SliderButton';\n\nexport default SliderButton;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -89,4 +89,12 @@ export type ButtonProps = {
|
|
|
89
89
|
* @optional
|
|
90
90
|
*/
|
|
91
91
|
buttonDesign?: number;
|
|
92
|
+
/**
|
|
93
|
+
* Duration in seconds for the tap animation.
|
|
94
|
+
* @description
|
|
95
|
+
* Overrides how long the pressed state animation should take when the button is tapped.
|
|
96
|
+
* Set this to `0` for an immediate press effect.
|
|
97
|
+
* @optional
|
|
98
|
+
*/
|
|
99
|
+
tapDuration?: number;
|
|
92
100
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@chayns-components/core",
|
|
3
|
-
"version": "5.0.
|
|
3
|
+
"version": "5.0.52",
|
|
4
4
|
"description": "A set of beautiful React components for developing your own applications with chayns.",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"browserslist": [
|
|
@@ -87,5 +87,5 @@
|
|
|
87
87
|
"publishConfig": {
|
|
88
88
|
"access": "public"
|
|
89
89
|
},
|
|
90
|
-
"gitHead": "
|
|
90
|
+
"gitHead": "3a3e55778a44dd7ecac7aa4d8acb6ab4eebea1c0"
|
|
91
91
|
}
|