npm - @chayns-components/core - Versions diffs - 5.0.0-beta.848 → 5.0.0-beta.849 - Mend

@chayns-components/core 5.0.0-beta.848 → 5.0.0-beta.849

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.

Files changed (10) hide show

package/lib/cjs/components/amount-control/AmountControl.js CHANGED Viewed

@@ -15,6 +15,7 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
 const AmountControl = ({
   amount,
   icon,
+  shouldShowAddIconOnMinAmount = false,
   shouldShowIcon = true,
   label,
   iconColor,
@@ -44,10 +45,13 @@ const AmountControl = ({
       case amountValue > minAmount:
         setDisplayState('normal');
         return;
+      case amountValue === minAmount && amountValue >= 0 && shouldShowAddIconOnMinAmount:
+        setDisplayState('minAmount');
+        return;
       default:
         setDisplayState('default');
     }
-  }, [amountValue, maxAmount, minAmount]);
+  }, [amountValue, maxAmount, minAmount, shouldShowAddIconOnMinAmount]);
   const hasFocus = (0, _react.useMemo)(() => displayState !== 'default', [displayState]);
   /**
@@ -190,11 +194,14 @@ const AmountControl = ({
     return item;
   }, [displayState, icon, iconColor]);
   const shouldShowLeftIcon = (0, _react.useMemo)(() => {
+    if (shouldShowAddIconOnMinAmount && displayState === 'minAmount') {
+      return false;
+    }
     if (shouldShowIcon) {
       return true;
     }
-    return !(displayState === 'default' && !shouldShowIcon);
-  }, [displayState, shouldShowIcon]);
+    return !((displayState === 'default' || displayState === 'minAmount') && !shouldShowIcon);
+  }, [displayState, shouldShowAddIconOnMinAmount, shouldShowIcon]);
   return (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement(_AmountControl.StyledAmountControl, {
     onClick: handleFirstAmount
   }, /*#__PURE__*/_react.default.createElement(_framerMotion.AnimatePresence, {
@@ -239,7 +246,7 @@ const AmountControl = ({
     value: displayState === 'default' && label ? label : inputValue
   }), /*#__PURE__*/_react.default.createElement(_framerMotion.AnimatePresence, {
     initial: false
-  }, displayState === 'normal' && /*#__PURE__*/_react.default.createElement(_AmountControl.StyledMotionAmountControlButton, {
+  }, (displayState === 'normal' || displayState === 'minAmount') && /*#__PURE__*/_react.default.createElement(_AmountControl.StyledMotionAmountControlButton, {
     key: "right_button",
     initial: {
       width: 0,
@@ -261,7 +268,7 @@ const AmountControl = ({
       type: 'tween'
     },
     onClick: handleAmountAdd,
-    $isWide: displayState === 'normal' || displayState === 'maxAmount',
+    $isWide: true,
     disabled: maxAmount ? amountValue >= maxAmount : false,
     $isDisabled: maxAmount ? amountValue >= maxAmount : false
   }, /*#__PURE__*/_react.default.createElement(_Icon.default, {

package/lib/cjs/components/amount-control/AmountControl.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AmountControl.js","names":["_framerMotion","require","_react","_interopRequireWildcard","_amountControl","_Icon","_interopRequireDefault","_AmountControl","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","AmountControl","amount","icon","shouldShowIcon","label","iconColor","maxAmount","minAmount","onChange","shouldShowWideInput","step","stepProp","amountValue","setAmountValue","useState","inputValue","setInputValue","toString","displayState","setDisplayState","useMemo","Number","isSafeInteger","inputRef","useRef","useEffect","hasFocus","checkForValidAmount","handleAmountAdd","useCallback","prevState","newAmount","handleAmountRemove","handleFirstAmount","handleDeleteIconClick","window","setTimeout","_inputRef$current","current","focus","handleInputBlur","checkedValue","Math","round","handleInputChange","event","value","target","valueBefore","replace","leftIcon","item","createElement","icons","size","color","shouldShowLeftIcon","StyledAmountControl","onClick","AnimatePresence","initial","StyledMotionAmountControlButton","key","width","opacity","padding","animate","exit","$isWide","transition","duration","type","$color","undefined","disabled","$isDisabled","StyledAmountControlPseudoInput","$shouldShowWideInput","StyledAmountControlInput","ref","$displayState","$shouldShowIcon","$hasFocus","onBlur","displayName","_default","exports"],"sources":["../../../../src/components/amount-control/AmountControl.tsx"],"sourcesContent":["import { AnimatePresence } from 'framer-motion';\nimport React, {\n ChangeEvent,\n FC,\n ReactElement,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { checkForValidAmount } from '../../utils/amountControl';\nimport Icon from '../icon/Icon';\nimport {\n StyledAmountControl,\n StyledAmountControlInput,\n StyledAmountControlPseudoInput,\n StyledMotionAmountControlButton,\n} from './AmountControl.styles';\n\nexport type DisplayState = 'default' \| 'delete' \| 'normal' \| 'maxAmount';\n\nexport type AmountControlProps = {\n /*\n The amount that should be displayed.\n /\n amount?: number;\n /\n The icon that should be displayed if no amount is selected.\n /\n icon?: string;\n /\n The color of the icon.\n /\n iconColor?: string;\n /\n A Text that should be displayed, if no amount is selected;\n /\n label?: string;\n /\n The maximum allowed amount. If the maxAmount is set to one, a delete button is displayed on the left side.\n /\n maxAmount?: number;\n /\n The minimum allowed amount.\n /\n minAmount?: number;\n /\n A Function that is executed when the amount is changed\n /\n onChange?: (amount: number) => void;\n /\n Whether the icon should be displayed if no amount is selected\n /\n shouldShowIcon?: boolean;\n /\n Whether the input should be wider\n /\n shouldShowWideInput?: boolean;\n /\n Defines the amount that will change when adjusted\n /\n step?: number;\n};\n\nconst AmountControl: FC<AmountControlProps> = ({\n amount,\n icon,\n shouldShowIcon = true,\n label,\n iconColor,\n maxAmount,\n minAmount = 0,\n onChange,\n shouldShowWideInput = false,\n step: stepProp = 1,\n}) => {\n const [amountValue, setAmountValue] = useState(minAmount);\n const [inputValue, setInputValue] = useState(minAmount.toString());\n const [displayState, setDisplayState] = useState<DisplayState>('default');\n\n const step = useMemo(\n () => (Number.isSafeInteger(stepProp) && stepProp >= 1 ? stepProp : 1),\n [stepProp],\n );\n\n const inputRef = useRef<HTMLInputElement>(null);\n\n /\n This function controls the displayState\n /\n useEffect(() => {\n switch (true) {\n case maxAmount === 1 && amountValue === 1:\n setDisplayState('delete');\n return;\n case maxAmount && amountValue >= maxAmount:\n setDisplayState('maxAmount');\n return;\n case amountValue > minAmount:\n setDisplayState('normal');\n return;\n default:\n setDisplayState('default');\n }\n }, [amountValue, maxAmount, minAmount]);\n\n const hasFocus = useMemo(() => displayState !== 'default', [displayState]);\n\n /\n Function that sets the amountValue to the amount\n /\n useEffect(() => {\n if (!amount) {\n return;\n }\n\n setAmountValue(checkForValidAmount({ amount, maxAmount, minAmount }));\n setInputValue(checkForValidAmount({ amount, maxAmount, minAmount }).toString());\n }, [amount, maxAmount, minAmount]);\n\n const handleAmountAdd = useCallback(() => {\n setAmountValue((prevState) => {\n const newAmount = checkForValidAmount({\n amount: prevState + step,\n minAmount,\n maxAmount,\n });\n\n if (typeof onChange === 'function') {\n onChange(newAmount);\n }\n\n return typeof amount === 'number' ? prevState : newAmount;\n });\n setInputValue((prevState) =>\n checkForValidAmount({\n amount: Number(prevState) + step,\n minAmount,\n maxAmount,\n }).toString(),\n );\n }, [amount, maxAmount, minAmount, onChange, step]);\n\n const handleAmountRemove = useCallback(() => {\n if (displayState === 'default') {\n return;\n }\n\n setAmountValue((prevState) => {\n const newAmount = checkForValidAmount({\n amount: prevState - step,\n minAmount,\n maxAmount,\n });\n\n if (typeof onChange === 'function') {\n onChange(newAmount);\n }\n\n return newAmount;\n });\n setInputValue((prevState) =>\n checkForValidAmount({\n amount: Number(prevState) - step,\n minAmount,\n maxAmount,\n }).toString(),\n );\n }, [displayState, maxAmount, minAmount, onChange, step]);\n\n const handleFirstAmount = useCallback(() => {\n if (amountValue !== minAmount) {\n return;\n }\n\n if (typeof onChange === 'function') {\n onChange(minAmount + step);\n }\n\n setAmountValue(minAmount + step);\n setInputValue((minAmount + step).toString());\n }, [amountValue, minAmount, onChange, step]);\n\n const handleDeleteIconClick = useCallback(() => {\n if (inputValue === '0') {\n window.setTimeout(() => {\n inputRef.current?.focus();\n }, 500);\n } else {\n handleAmountRemove();\n }\n }, [handleAmountRemove, inputValue]);\n\n const handleInputBlur = useCallback(() => {\n const checkedValue = checkForValidAmount({\n minAmount,\n maxAmount,\n amount: Math.round(Number(inputValue) / step) step,\n });\n\n setAmountValue(checkedValue);\n setInputValue(checkedValue.toString());\n\n if (typeof onChange === 'function') {\n onChange(checkedValue);\n }\n\n if (inputValue === '') {\n setInputValue(minAmount.toString());\n }\n }, [inputValue, maxAmount, minAmount, onChange, step]);\n\n const handleInputChange = useCallback(\n (event: ChangeEvent<HTMLInputElement>) => {\n const { value } = event.target;\n\n const valueBefore = Number(value.replace(/\\D/g, ''));\n\n if (valueBefore < minAmount && minAmount === 0) {\n setInputValue('0');\n\n return;\n }\n\n setInputValue(valueBefore === 0 ? '' : valueBefore.toString());\n },\n [minAmount],\n );\n\n const leftIcon = useMemo(() => {\n let item: ReactElement \| null = null;\n\n switch (displayState) {\n case 'default':\n item = <Icon icons={[icon ?? 'fa fa-cart-shopping']} size={15} color={iconColor} />;\n break;\n case 'delete':\n item = <Icon icons={['fa ts-check']} size={20} color=\"white\" />;\n break;\n case 'normal':\n item = <Icon icons={['fa fa-minus']} size={15} color=\"red\" />;\n break;\n case 'maxAmount':\n item = <Icon icons={['fa fa-minus']} size={15} color=\"red\" />;\n break;\n default:\n break;\n }\n\n return item;\n }, [displayState, icon, iconColor]);\n\n const shouldShowLeftIcon = useMemo(() => {\n if (shouldShowIcon) {\n return true;\n }\n\n return !(displayState === 'default' && !shouldShowIcon);\n }, [displayState, shouldShowIcon]);\n\n return useMemo(\n () => (\n <StyledAmountControl onClick={handleFirstAmount}>\n <AnimatePresence initial={false}>\n {shouldShowLeftIcon && (\n <StyledMotionAmountControlButton\n key=\"right_button\"\n initial={{ width: 0, opacity: 0, padding: 0 }}\n animate={{\n width:\n displayState === 'normal' \|\| displayState === 'maxAmount'\n ? 40\n : 28,\n opacity: 1,\n padding: 0,\n }}\n exit={{ width: 0, opacity: 0, padding: 0 }}\n $isWide={displayState === 'normal' \|\| displayState === 'maxAmount'}\n transition={{ duration: 0.2, type: 'tween' }}\n onClick={handleAmountRemove}\n $color={displayState === 'delete' ? 'rgb(32, 198, 90)' : undefined}\n disabled={amountValue !== 0 && amountValue <= minAmount}\n $isDisabled={amountValue !== 0 && amountValue <= minAmount}\n >\n {leftIcon}\n </StyledMotionAmountControlButton>\n )}\n </AnimatePresence>\n {displayState === 'delete' \|\| inputValue === '0' ? (\n <StyledAmountControlPseudoInput\n onClick={handleDeleteIconClick}\n $shouldShowWideInput={shouldShowWideInput}\n >\n {displayState === 'default' && label ? label : inputValue}\n </StyledAmountControlPseudoInput>\n ) : (\n <StyledAmountControlInput\n ref={inputRef}\n $displayState={displayState}\n $shouldShowIcon={shouldShowIcon}\n $shouldShowWideInput={shouldShowWideInput}\n $hasFocus={hasFocus}\n onBlur={handleInputBlur}\n onChange={handleInputChange}\n value={displayState === 'default' && label ? label : inputValue}\n />\n )}\n <AnimatePresence initial={false}>\n {displayState === 'normal' && (\n <StyledMotionAmountControlButton\n key=\"right_button\"\n initial={{ width: 0, opacity: 0, padding: 0 }}\n animate={{\n width: 40,\n opacity: 1,\n padding: 0,\n }}\n exit={{ width: 0, opacity: 0, padding: 0 }}\n transition={{ duration: 0.2, type: 'tween' }}\n onClick={handleAmountAdd}\n $isWide={displayState === 'normal' \|\| displayState === 'maxAmount'}\n disabled={maxAmount ? amountValue >= maxAmount : false}\n $isDisabled={maxAmount ? amountValue >= maxAmount : false}\n >\n <Icon icons={['fa fa-plus']} size={15} color=\"green\" />\n </StyledMotionAmountControlButton>\n )}\n </AnimatePresence>\n </StyledAmountControl>\n ),\n [\n amountValue,\n displayState,\n handleAmountAdd,\n handleAmountRemove,\n handleDeleteIconClick,\n handleFirstAmount,\n handleInputBlur,\n handleInputChange,\n hasFocus,\n inputValue,\n label,\n leftIcon,\n maxAmount,\n minAmount,\n shouldShowIcon,\n shouldShowLeftIcon,\n shouldShowWideInput,\n ],\n );\n};\n\nAmountControl.displayName = 'AmountControl';\n\nexport default AmountControl;\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"AmountControl.js","names":["_framerMotion","require","_react","_interopRequireWildcard","_amountControl","_Icon","_interopRequireDefault","_AmountControl","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","AmountControl","amount","icon","shouldShowAddIconOnMinAmount","shouldShowIcon","label","iconColor","maxAmount","minAmount","onChange","shouldShowWideInput","step","stepProp","amountValue","setAmountValue","useState","inputValue","setInputValue","toString","displayState","setDisplayState","useMemo","Number","isSafeInteger","inputRef","useRef","useEffect","hasFocus","checkForValidAmount","handleAmountAdd","useCallback","prevState","newAmount","handleAmountRemove","handleFirstAmount","handleDeleteIconClick","window","setTimeout","_inputRef$current","current","focus","handleInputBlur","checkedValue","Math","round","handleInputChange","event","value","target","valueBefore","replace","leftIcon","item","createElement","icons","size","color","shouldShowLeftIcon","StyledAmountControl","onClick","AnimatePresence","initial","StyledMotionAmountControlButton","key","width","opacity","padding","animate","exit","$isWide","transition","duration","type","$color","undefined","disabled","$isDisabled","StyledAmountControlPseudoInput","$shouldShowWideInput","StyledAmountControlInput","ref","$displayState","$shouldShowIcon","$hasFocus","onBlur","displayName","_default","exports"],"sources":["../../../../src/components/amount-control/AmountControl.tsx"],"sourcesContent":["import { AnimatePresence } from 'framer-motion';\nimport React, {\n ChangeEvent,\n FC,\n ReactElement,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { checkForValidAmount } from '../../utils/amountControl';\nimport Icon from '../icon/Icon';\nimport {\n StyledAmountControl,\n StyledAmountControlInput,\n StyledAmountControlPseudoInput,\n StyledMotionAmountControlButton,\n} from './AmountControl.styles';\n\nexport type DisplayState = 'default' \| 'delete' \| 'normal' \| 'maxAmount' \| 'minAmount';\n\nexport type AmountControlProps = {\n /*\n The amount that should be displayed.\n /\n amount?: number;\n /\n The icon that should be displayed if no amount is selected.\n /\n icon?: string;\n /\n The color of the icon.\n /\n iconColor?: string;\n /\n A Text that should be displayed, if no amount is selected;\n /\n label?: string;\n /\n The maximum allowed amount. If the maxAmount is set to one, a delete button is displayed on the left side.\n /\n maxAmount?: number;\n /\n The minimum allowed amount.\n /\n minAmount?: number;\n /\n A Function that is executed when the amount is changed\n /\n onChange?: (amount: number) => void;\n /\n Whether the add icon should be displayed if the minAmount is reached.\n /\n shouldShowAddIconOnMinAmount?: boolean;\n /\n Whether the icon should be displayed if no amount is selected\n /\n shouldShowIcon?: boolean;\n /\n Whether the input should be wider\n /\n shouldShowWideInput?: boolean;\n /\n Defines the amount that will change when adjusted\n /\n step?: number;\n};\n\nconst AmountControl: FC<AmountControlProps> = ({\n amount,\n icon,\n shouldShowAddIconOnMinAmount = false,\n shouldShowIcon = true,\n label,\n iconColor,\n maxAmount,\n minAmount = 0,\n onChange,\n shouldShowWideInput = false,\n step: stepProp = 1,\n}) => {\n const [amountValue, setAmountValue] = useState(minAmount);\n const [inputValue, setInputValue] = useState(minAmount.toString());\n const [displayState, setDisplayState] = useState<DisplayState>('default');\n\n const step = useMemo(\n () => (Number.isSafeInteger(stepProp) && stepProp >= 1 ? stepProp : 1),\n [stepProp],\n );\n\n const inputRef = useRef<HTMLInputElement>(null);\n\n /\n This function controls the displayState\n /\n useEffect(() => {\n switch (true) {\n case maxAmount === 1 && amountValue === 1:\n setDisplayState('delete');\n return;\n case maxAmount && amountValue >= maxAmount:\n setDisplayState('maxAmount');\n return;\n case amountValue > minAmount:\n setDisplayState('normal');\n return;\n case amountValue === minAmount && amountValue >= 0 && shouldShowAddIconOnMinAmount:\n setDisplayState('minAmount');\n return;\n default:\n setDisplayState('default');\n }\n }, [amountValue, maxAmount, minAmount, shouldShowAddIconOnMinAmount]);\n\n const hasFocus = useMemo(() => displayState !== 'default', [displayState]);\n\n /\n Function that sets the amountValue to the amount\n /\n useEffect(() => {\n if (!amount) {\n return;\n }\n\n setAmountValue(checkForValidAmount({ amount, maxAmount, minAmount }));\n setInputValue(checkForValidAmount({ amount, maxAmount, minAmount }).toString());\n }, [amount, maxAmount, minAmount]);\n\n const handleAmountAdd = useCallback(() => {\n setAmountValue((prevState) => {\n const newAmount = checkForValidAmount({\n amount: prevState + step,\n minAmount,\n maxAmount,\n });\n\n if (typeof onChange === 'function') {\n onChange(newAmount);\n }\n\n return typeof amount === 'number' ? prevState : newAmount;\n });\n setInputValue((prevState) =>\n checkForValidAmount({\n amount: Number(prevState) + step,\n minAmount,\n maxAmount,\n }).toString(),\n );\n }, [amount, maxAmount, minAmount, onChange, step]);\n\n const handleAmountRemove = useCallback(() => {\n if (displayState === 'default') {\n return;\n }\n\n setAmountValue((prevState) => {\n const newAmount = checkForValidAmount({\n amount: prevState - step,\n minAmount,\n maxAmount,\n });\n\n if (typeof onChange === 'function') {\n onChange(newAmount);\n }\n\n return newAmount;\n });\n setInputValue((prevState) =>\n checkForValidAmount({\n amount: Number(prevState) - step,\n minAmount,\n maxAmount,\n }).toString(),\n );\n }, [displayState, maxAmount, minAmount, onChange, step]);\n\n const handleFirstAmount = useCallback(() => {\n if (amountValue !== minAmount) {\n return;\n }\n\n if (typeof onChange === 'function') {\n onChange(minAmount + step);\n }\n\n setAmountValue(minAmount + step);\n setInputValue((minAmount + step).toString());\n }, [amountValue, minAmount, onChange, step]);\n\n const handleDeleteIconClick = useCallback(() => {\n if (inputValue === '0') {\n window.setTimeout(() => {\n inputRef.current?.focus();\n }, 500);\n } else {\n handleAmountRemove();\n }\n }, [handleAmountRemove, inputValue]);\n\n const handleInputBlur = useCallback(() => {\n const checkedValue = checkForValidAmount({\n minAmount,\n maxAmount,\n amount: Math.round(Number(inputValue) / step) step,\n });\n\n setAmountValue(checkedValue);\n setInputValue(checkedValue.toString());\n\n if (typeof onChange === 'function') {\n onChange(checkedValue);\n }\n\n if (inputValue === '') {\n setInputValue(minAmount.toString());\n }\n }, [inputValue, maxAmount, minAmount, onChange, step]);\n\n const handleInputChange = useCallback(\n (event: ChangeEvent<HTMLInputElement>) => {\n const { value } = event.target;\n\n const valueBefore = Number(value.replace(/\\D/g, ''));\n\n if (valueBefore < minAmount && minAmount === 0) {\n setInputValue('0');\n\n return;\n }\n\n setInputValue(valueBefore === 0 ? '' : valueBefore.toString());\n },\n [minAmount],\n );\n\n const leftIcon = useMemo(() => {\n let item: ReactElement \| null = null;\n\n switch (displayState) {\n case 'default':\n item = <Icon icons={[icon ?? 'fa fa-cart-shopping']} size={15} color={iconColor} />;\n break;\n case 'delete':\n item = <Icon icons={['fa ts-check']} size={20} color=\"white\" />;\n break;\n case 'normal':\n item = <Icon icons={['fa fa-minus']} size={15} color=\"red\" />;\n break;\n case 'maxAmount':\n item = <Icon icons={['fa fa-minus']} size={15} color=\"red\" />;\n break;\n default:\n break;\n }\n\n return item;\n }, [displayState, icon, iconColor]);\n\n const shouldShowLeftIcon = useMemo(() => {\n if (shouldShowAddIconOnMinAmount && displayState === 'minAmount') {\n return false;\n }\n\n if (shouldShowIcon) {\n return true;\n }\n\n return !((displayState === 'default' \|\| displayState === 'minAmount') && !shouldShowIcon);\n }, [displayState, shouldShowAddIconOnMinAmount, shouldShowIcon]);\n\n return useMemo(\n () => (\n <StyledAmountControl onClick={handleFirstAmount}>\n <AnimatePresence initial={false}>\n {shouldShowLeftIcon && (\n <StyledMotionAmountControlButton\n key=\"right_button\"\n initial={{ width: 0, opacity: 0, padding: 0 }}\n animate={{\n width:\n displayState === 'normal' \|\| displayState === 'maxAmount'\n ? 40\n : 28,\n opacity: 1,\n padding: 0,\n }}\n exit={{ width: 0, opacity: 0, padding: 0 }}\n $isWide={displayState === 'normal' \|\| displayState === 'maxAmount'}\n transition={{ duration: 0.2, type: 'tween' }}\n onClick={handleAmountRemove}\n $color={displayState === 'delete' ? 'rgb(32, 198, 90)' : undefined}\n disabled={amountValue !== 0 && amountValue <= minAmount}\n $isDisabled={amountValue !== 0 && amountValue <= minAmount}\n >\n {leftIcon}\n </StyledMotionAmountControlButton>\n )}\n </AnimatePresence>\n {displayState === 'delete' \|\| inputValue === '0' ? (\n <StyledAmountControlPseudoInput\n onClick={handleDeleteIconClick}\n $shouldShowWideInput={shouldShowWideInput}\n >\n {displayState === 'default' && label ? label : inputValue}\n </StyledAmountControlPseudoInput>\n ) : (\n <StyledAmountControlInput\n ref={inputRef}\n $displayState={displayState}\n $shouldShowIcon={shouldShowIcon}\n $shouldShowWideInput={shouldShowWideInput}\n $hasFocus={hasFocus}\n onBlur={handleInputBlur}\n onChange={handleInputChange}\n value={displayState === 'default' && label ? label : inputValue}\n />\n )}\n <AnimatePresence initial={false}>\n {(displayState === 'normal' \|\| displayState === 'minAmount') && (\n <StyledMotionAmountControlButton\n key=\"right_button\"\n initial={{ width: 0, opacity: 0, padding: 0 }}\n animate={{\n width: 40,\n opacity: 1,\n padding: 0,\n }}\n exit={{ width: 0, opacity: 0, padding: 0 }}\n transition={{ duration: 0.2, type: 'tween' }}\n onClick={handleAmountAdd}\n $isWide\n disabled={maxAmount ? amountValue >= maxAmount : false}\n $isDisabled={maxAmount ? amountValue >= maxAmount : false}\n >\n <Icon icons={['fa fa-plus']} size={15} color=\"green\" />\n </StyledMotionAmountControlButton>\n )}\n </AnimatePresence>\n </StyledAmountControl>\n ),\n [\n amountValue,\n displayState,\n handleAmountAdd,\n handleAmountRemove,\n handleDeleteIconClick,\n handleFirstAmount,\n handleInputBlur,\n handleInputChange,\n hasFocus,\n inputValue,\n label,\n leftIcon,\n maxAmount,\n minAmount,\n shouldShowIcon,\n shouldShowLeftIcon,\n shouldShowWideInput,\n ],\n );\n};\n\nAmountControl.displayName = 'AmountControl';\n\nexport default AmountControl;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/slider-button/SliderButton.js CHANGED Viewed

@@ -41,8 +41,8 @@ const SliderButton = ({
       const itemCount = items.length || 1;
       return sliderWidth / itemCount;
     }
-    return (0, _calculate.calculateBiggestWidth)(items);
-  }, [isSliderBigger, items, shouldUseFullWidth, sliderSize === null || sliderSize === void 0 ? void 0 : sliderSize.width]);
+    return initialItemWidth;
+  }, [initialItemWidth, isSliderBigger, items.length, shouldUseFullWidth, sliderSize === null || sliderSize === void 0 ? void 0 : sliderSize.width]);
   (0, _react.useEffect)(() => {
     if (sliderSize) {
       const sliderWidth = itemWidth * (items.length - 1);
@@ -281,7 +281,7 @@ const SliderButton = ({
     $width: !isSliderBigger ? dragRange.right + itemWidth : dragRange.right,
     ref: sliderButtonWrapperRef,
     onScroll: handleScroll
-  }, /*#__PURE__*/_react.default.createElement(_framerMotion.AnimatePresence, null, /*#__PURE__*/_react.default.createElement(_SliderButton.StyledSliderButtonButtonsWrapper, null, buttons)))), [buttons, dragRange, handleDragEnd, handleScroll, handleWhileDrag, isDisabled, isSliderBigger, itemWidth, scope, thumbText]);
+  }, /*#__PURE__*/_react.default.createElement(_framerMotion.AnimatePresence, null, /*#__PURE__*/_react.default.createElement(_SliderButton.StyledSliderButtonButtonsWrapper, null, buttons)))), [buttons, dragRange, handleDragEnd, handleScroll, handleWhileDrag, isDisabled, isSliderBigger, itemWidth, scope, theme, thumbText]);
 };
 SliderButton.displayName = 'SliderButton';
 var _default = exports.default = SliderButton;

package/lib/cjs/components/slider-button/SliderButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SliderButton.js","names":["_chaynsApi","require","_framerMotion","_react","_interopRequireWildcard","_styledComponents","_useElementSize","_calculate","_sliderButton","_SliderButton","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","SliderButton","selectedButtonId","isDisabled","items","onChange","shouldUseFullWidth","selectedButton","setSelectedButton","useState","undefined","dragRange","setDragRange","left","right","sliderButtonRef","useRef","sliderButtonWrapperRef","timeout","preventHandleScroll","scope","animate","useAnimate","initialItemWidth","useMemo","calculateBiggestWidth","sliderSize","useElementSize","theme","useTheme","isSliderBigger","Math","floor","width","length","itemWidth","sliderWidth","itemCount","useEffect","count","animation","useCallback","x","current","type","duration","setItemPosition","index","scrollLeft","findIndex","id","_items$","handleClick","buttons","map","text","createElement","StyledSliderButtonItem","$width","key","onClick","$isSelected","thumbText","_items$2","selectedItem","find","snapPoints","points","push","handleDragEnd","setRefreshScrollEnabled","position","getThumbPosition","middle","getNearestPoint","nearestPoint","nearestIndex","_items$nearestIndex","handleWhileDrag","scrollSpeed","_items$nearestIndex2","handleScroll","event","target","_items$nearestIndex3","clearTimeout","window","setTimeout","StyledSliderButton","$isDisabled","ref","StyledMotionSliderButtonThumb","drag","dragElastic","dragConstraints","onDrag","onDragEnd","whileTap","backgroundColor","whileHover","StyledSliderButtonWrapper","onScroll","AnimatePresence","StyledSliderButtonButtonsWrapper","displayName","_default","exports"],"sources":["../../../../src/components/slider-button/SliderButton.tsx"],"sourcesContent":["import { setRefreshScrollEnabled } from 'chayns-api';\nimport { AnimatePresence, useAnimate } from 'framer-motion';\nimport React, { FC, UIEvent, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { useTheme } from 'styled-components';\nimport { useElementSize } from '../../hooks/useElementSize';\nimport type { SliderButtonItem } from '../../types/slider-button';\nimport { calculateBiggestWidth } from '../../utils/calculate';\nimport { getNearestPoint, getThumbPosition } from '../../utils/sliderButton';\nimport type { Theme } from '../color-scheme-provider/ColorSchemeProvider';\nimport {\n StyledMotionSliderButtonThumb,\n StyledSliderButton,\n StyledSliderButtonButtonsWrapper,\n StyledSliderButtonItem,\n StyledSliderButtonWrapper,\n} from './SliderButton.styles';\n\nexport type SliderButtonProps = {\n /*\n Whether the button is disabled.\n /\n isDisabled?: boolean;\n /\n Function to be executed when a button is selected.\n * @param id\n /\n onChange?: (id: string) => void;\n /\n The buttons that are slidable.\n /\n items: SliderButtonItem[];\n /\n The id of a button that should be selected.\n /\n selectedButtonId?: string;\n /\n Whether the full width should be used if the slider is smaller.\n /\n shouldUseFullWidth?: boolean;\n};\n\nconst SliderButton: FC<SliderButtonProps> = ({\n selectedButtonId,\n isDisabled,\n items,\n onChange,\n shouldUseFullWidth = false,\n}) => {\n const [selectedButton, setSelectedButton] = useState<string \| undefined>(undefined);\n const [dragRange, setDragRange] = useState({ left: 0, right: 0 });\n\n const sliderButtonRef = useRef<HTMLDivElement>(null);\n const sliderButtonWrapperRef = useRef<HTMLDivElement>(null);\n const timeout = useRef<number>();\n const preventHandleScroll = useRef(false);\n\n const [scope, animate] = useAnimate();\n\n const initialItemWidth = useMemo(() => calculateBiggestWidth(items), [items]);\n const sliderSize = useElementSize(sliderButtonRef);\n\n const theme: Theme = useTheme();\n\n const isSliderBigger = useMemo(\n () => sliderSize && Math.floor(sliderSize.width / initialItemWidth) < items.length,\n [initialItemWidth, items.length, sliderSize],\n );\n\n const itemWidth = useMemo(() => {\n if (!isSliderBigger && shouldUseFullWidth) {\n const sliderWidth = sliderSize?.width \|\| 0;\n const itemCount = items.length \|\| 1;\n\n return sliderWidth / itemCount;\n }\n\n return calculateBiggestWidth(items);\n }, [isSliderBigger, items, shouldUseFullWidth, 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 if (!isSliderBigger) {\n void animation(itemWidth * index);\n\n return;\n }\n\n const count = dragRange.right / itemWidth;\n\n if (items.length - count >= index) {\n void animation(0);\n } else {\n void animation(itemWidth * (count - (items.length - index)));\n }\n\n if (sliderButtonWrapperRef.current) {\n sliderButtonWrapperRef.current.scrollLeft = itemWidth * index;\n }\n },\n [animation, dragRange.right, isSliderBigger, itemWidth, items.length],\n );\n\n useEffect(() => {\n if (selectedButtonId) {\n setSelectedButton(selectedButtonId);\n\n const index = items.findIndex(({ id }) => id === selectedButtonId);\n\n if (index >= 0) {\n setItemPosition(index);\n }\n } else {\n setSelectedButton(items[0]?.id);\n }\n }, [\n animation,\n dragRange.right,\n isSliderBigger,\n itemWidth,\n items,\n selectedButtonId,\n setItemPosition,\n ]);\n\n const handleClick = useCallback(\n (id: string, index: number) => {\n if (isDisabled) {\n return;\n }\n\n setSelectedButton(id);\n\n if (typeof onChange === 'function') {\n onChange(id);\n }\n\n setItemPosition(index);\n },\n [isDisabled, onChange, setItemPosition],\n );\n\n const buttons = useMemo(\n () =>\n items.map(({ id, text }, index) => (\n <StyledSliderButtonItem\n $width={itemWidth}\n key={`slider-button-${id}`}\n onClick={() => handleClick(id, index)}\n $isSelected={id === selectedButton}\n >\n {text}\n </StyledSliderButtonItem>\n )),\n [handleClick, itemWidth, items, selectedButton],\n );\n\n const thumbText = useMemo(() => {\n const selectedItem = items.find(({ id }) => id === selectedButton);\n\n return selectedItem ? selectedItem.text : items[0]?.text;\n }, [items, selectedButton]);\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 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 const id = items[nearestIndex]?.id;\n\n setSelectedButton(id);\n\n if (typeof onChange === 'function' && id) {\n onChange(id);\n }\n }\n\n preventHandleScroll.current = false;\n }, [animation, itemWidth, items, onChange, scope, snapPoints]);\n\n const handleWhileDrag = useCallback(() => {\n preventHandleScroll.current = true;\n void setRefreshScrollEnabled(false);\n\n const position = getThumbPosition({ scope, itemWidth });\n\n if (!position) {\n return;\n }\n\n const { right, left, middle } = position;\n\n let scrollLeft = 0;\n\n const scrollSpeed = 3;\n\n if (sliderButtonWrapperRef.current) {\n if (right >= dragRange.right) {\n sliderButtonWrapperRef.current.scrollLeft += scrollSpeed;\n }\n\n if (left <= dragRange.left) {\n sliderButtonWrapperRef.current.scrollLeft -= scrollSpeed;\n }\n\n scrollLeft = sliderButtonWrapperRef.current.scrollLeft;\n }\n\n const { nearestIndex } = getNearestPoint({ snapPoints, position: middle, scrollLeft });\n\n if (nearestIndex >= 0) {\n setSelectedButton(items[nearestIndex]?.id);\n }\n }, [dragRange, itemWidth, items, scope, snapPoints]);\n\n // With this, the handleScroll works before the thumb is moved the first time.\n useEffect(() => {\n void animation(1);\n void animation(0);\n }, [animation]);\n\n const handleScroll = useCallback(\n (event: UIEvent<HTMLElement>) => {\n if (preventHandleScroll.current) {\n return;\n }\n\n void setRefreshScrollEnabled(false);\n\n const position = getThumbPosition({ scope, itemWidth });\n\n if (!position) {\n return;\n }\n\n const { middle } = position;\n\n const { scrollLeft } = event.target as HTMLDivElement;\n\n const { nearestIndex } = getNearestPoint({ snapPoints, position: middle, scrollLeft });\n\n if (nearestIndex >= 0) {\n setSelectedButton(items[nearestIndex]?.id);\n }\n\n if (timeout.current) {\n clearTimeout(timeout.current);\n }\n\n timeout.current = window.setTimeout(() => {\n handleDragEnd();\n }, 200);\n },\n [handleDragEnd, itemWidth, items, scope, snapPoints],\n );\n\n return useMemo(\n () => (\n <StyledSliderButton $isDisabled={isDisabled} ref={sliderButtonRef}>\n <StyledMotionSliderButtonThumb\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 onDrag={handleWhileDrag}\n onDragEnd={handleDragEnd}\n whileTap={isDisabled ? {} : { backgroundColor: theme['407'] }}\n whileHover={isDisabled ? {} : { backgroundColor: theme['409'] }}\n >\n {thumbText}\n </StyledMotionSliderButtonThumb>\n <StyledSliderButtonWrapper\n $isDisabled={isDisabled}\n $width={!isSliderBigger ? dragRange.right + itemWidth : dragRange.right}\n ref={sliderButtonWrapperRef}\n onScroll={handleScroll}\n >\n <AnimatePresence>\n <StyledSliderButtonButtonsWrapper>\n {buttons}\n </StyledSliderButtonButtonsWrapper>\n </AnimatePresence>\n </StyledSliderButtonWrapper>\n </StyledSliderButton>\n ),\n [\n buttons,\n dragRange,\n handleDragEnd,\n handleScroll,\n handleWhileDrag,\n isDisabled,\n isSliderBigger,\n itemWidth,\n scope,\n thumbText,\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","_framerMotion","_react","_interopRequireWildcard","_styledComponents","_useElementSize","_calculate","_sliderButton","_SliderButton","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","SliderButton","selectedButtonId","isDisabled","items","onChange","shouldUseFullWidth","selectedButton","setSelectedButton","useState","undefined","dragRange","setDragRange","left","right","sliderButtonRef","useRef","sliderButtonWrapperRef","timeout","preventHandleScroll","scope","animate","useAnimate","initialItemWidth","useMemo","calculateBiggestWidth","sliderSize","useElementSize","theme","useTheme","isSliderBigger","Math","floor","width","length","itemWidth","sliderWidth","itemCount","useEffect","count","animation","useCallback","x","current","type","duration","setItemPosition","index","scrollLeft","findIndex","id","_items$","handleClick","buttons","map","text","createElement","StyledSliderButtonItem","$width","key","onClick","$isSelected","thumbText","_items$2","selectedItem","find","snapPoints","points","push","handleDragEnd","setRefreshScrollEnabled","position","getThumbPosition","middle","getNearestPoint","nearestPoint","nearestIndex","_items$nearestIndex","handleWhileDrag","scrollSpeed","_items$nearestIndex2","handleScroll","event","target","_items$nearestIndex3","clearTimeout","window","setTimeout","StyledSliderButton","$isDisabled","ref","StyledMotionSliderButtonThumb","drag","dragElastic","dragConstraints","onDrag","onDragEnd","whileTap","backgroundColor","whileHover","StyledSliderButtonWrapper","onScroll","AnimatePresence","StyledSliderButtonButtonsWrapper","displayName","_default","exports"],"sources":["../../../../src/components/slider-button/SliderButton.tsx"],"sourcesContent":["import { setRefreshScrollEnabled } from 'chayns-api';\nimport { AnimatePresence, useAnimate } from 'framer-motion';\nimport React, { FC, UIEvent, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { useTheme } from 'styled-components';\nimport { useElementSize } from '../../hooks/useElementSize';\nimport type { SliderButtonItem } from '../../types/slider-button';\nimport { calculateBiggestWidth } from '../../utils/calculate';\nimport { getNearestPoint, getThumbPosition } from '../../utils/sliderButton';\nimport type { Theme } from '../color-scheme-provider/ColorSchemeProvider';\nimport {\n StyledMotionSliderButtonThumb,\n StyledSliderButton,\n StyledSliderButtonButtonsWrapper,\n StyledSliderButtonItem,\n StyledSliderButtonWrapper,\n} from './SliderButton.styles';\n\nexport type SliderButtonProps = {\n /*\n Whether the button is disabled.\n /\n isDisabled?: boolean;\n /\n Function to be executed when a button is selected.\n * @param id\n /\n onChange?: (id: string) => void;\n /\n The buttons that are slidable.\n /\n items: SliderButtonItem[];\n /\n The id of a button that should be selected.\n /\n selectedButtonId?: string;\n /\n Whether the full width should be used if the slider is smaller.\n /\n shouldUseFullWidth?: boolean;\n};\n\nconst SliderButton: FC<SliderButtonProps> = ({\n selectedButtonId,\n isDisabled,\n items,\n onChange,\n shouldUseFullWidth = false,\n}) => {\n const [selectedButton, setSelectedButton] = useState<string \| undefined>(undefined);\n const [dragRange, setDragRange] = useState({ left: 0, right: 0 });\n\n const sliderButtonRef = useRef<HTMLDivElement>(null);\n const sliderButtonWrapperRef = useRef<HTMLDivElement>(null);\n const timeout = useRef<number>();\n const preventHandleScroll = useRef(false);\n\n const [scope, animate] = useAnimate();\n\n const initialItemWidth = useMemo(() => calculateBiggestWidth(items), [items]);\n const sliderSize = useElementSize(sliderButtonRef);\n\n const theme: Theme = useTheme();\n\n const isSliderBigger = useMemo(\n () => sliderSize && Math.floor(sliderSize.width / initialItemWidth) < items.length,\n [initialItemWidth, items.length, sliderSize],\n );\n\n const itemWidth = useMemo(() => {\n if (!isSliderBigger && shouldUseFullWidth) {\n const sliderWidth = sliderSize?.width \|\| 0;\n const itemCount = items.length \|\| 1;\n\n return sliderWidth / itemCount;\n }\n\n return initialItemWidth;\n }, [initialItemWidth, isSliderBigger, items.length, shouldUseFullWidth, 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 if (!isSliderBigger) {\n void animation(itemWidth * index);\n\n return;\n }\n\n const count = dragRange.right / itemWidth;\n\n if (items.length - count >= index) {\n void animation(0);\n } else {\n void animation(itemWidth * (count - (items.length - index)));\n }\n\n if (sliderButtonWrapperRef.current) {\n sliderButtonWrapperRef.current.scrollLeft = itemWidth * index;\n }\n },\n [animation, dragRange.right, isSliderBigger, itemWidth, items.length],\n );\n\n useEffect(() => {\n if (selectedButtonId) {\n setSelectedButton(selectedButtonId);\n\n const index = items.findIndex(({ id }) => id === selectedButtonId);\n\n if (index >= 0) {\n setItemPosition(index);\n }\n } else {\n setSelectedButton(items[0]?.id);\n }\n }, [\n animation,\n dragRange.right,\n isSliderBigger,\n itemWidth,\n items,\n selectedButtonId,\n setItemPosition,\n ]);\n\n const handleClick = useCallback(\n (id: string, index: number) => {\n if (isDisabled) {\n return;\n }\n\n setSelectedButton(id);\n\n if (typeof onChange === 'function') {\n onChange(id);\n }\n\n setItemPosition(index);\n },\n [isDisabled, onChange, setItemPosition],\n );\n\n const buttons = useMemo(\n () =>\n items.map(({ id, text }, index) => (\n <StyledSliderButtonItem\n $width={itemWidth}\n key={`slider-button-${id}`}\n onClick={() => handleClick(id, index)}\n $isSelected={id === selectedButton}\n >\n {text}\n </StyledSliderButtonItem>\n )),\n [handleClick, itemWidth, items, selectedButton],\n );\n\n const thumbText = useMemo(() => {\n const selectedItem = items.find(({ id }) => id === selectedButton);\n\n return selectedItem ? selectedItem.text : items[0]?.text;\n }, [items, selectedButton]);\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 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 const id = items[nearestIndex]?.id;\n\n setSelectedButton(id);\n\n if (typeof onChange === 'function' && id) {\n onChange(id);\n }\n }\n\n preventHandleScroll.current = false;\n }, [animation, itemWidth, items, onChange, scope, snapPoints]);\n\n const handleWhileDrag = useCallback(() => {\n preventHandleScroll.current = true;\n void setRefreshScrollEnabled(false);\n\n const position = getThumbPosition({ scope, itemWidth });\n\n if (!position) {\n return;\n }\n\n const { right, left, middle } = position;\n\n let scrollLeft = 0;\n\n const scrollSpeed = 3;\n\n if (sliderButtonWrapperRef.current) {\n if (right >= dragRange.right) {\n sliderButtonWrapperRef.current.scrollLeft += scrollSpeed;\n }\n\n if (left <= dragRange.left) {\n sliderButtonWrapperRef.current.scrollLeft -= scrollSpeed;\n }\n\n scrollLeft = sliderButtonWrapperRef.current.scrollLeft;\n }\n\n const { nearestIndex } = getNearestPoint({ snapPoints, position: middle, scrollLeft });\n\n if (nearestIndex >= 0) {\n setSelectedButton(items[nearestIndex]?.id);\n }\n }, [dragRange, itemWidth, items, scope, snapPoints]);\n\n // With this, the handleScroll works before the thumb is moved the first time.\n useEffect(() => {\n void animation(1);\n void animation(0);\n }, [animation]);\n\n const handleScroll = useCallback(\n (event: UIEvent<HTMLElement>) => {\n if (preventHandleScroll.current) {\n return;\n }\n\n void setRefreshScrollEnabled(false);\n\n const position = getThumbPosition({ scope, itemWidth });\n\n if (!position) {\n return;\n }\n\n const { middle } = position;\n\n const { scrollLeft } = event.target as HTMLDivElement;\n\n const { nearestIndex } = getNearestPoint({ snapPoints, position: middle, scrollLeft });\n\n if (nearestIndex >= 0) {\n setSelectedButton(items[nearestIndex]?.id);\n }\n\n if (timeout.current) {\n clearTimeout(timeout.current);\n }\n\n timeout.current = window.setTimeout(() => {\n handleDragEnd();\n }, 200);\n },\n [handleDragEnd, itemWidth, items, scope, snapPoints],\n );\n\n return useMemo(\n () => (\n <StyledSliderButton $isDisabled={isDisabled} ref={sliderButtonRef}>\n <StyledMotionSliderButtonThumb\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 onDrag={handleWhileDrag}\n onDragEnd={handleDragEnd}\n whileTap={isDisabled ? {} : { backgroundColor: theme['407'] }}\n whileHover={isDisabled ? {} : { backgroundColor: theme['409'] }}\n >\n {thumbText}\n </StyledMotionSliderButtonThumb>\n <StyledSliderButtonWrapper\n $isDisabled={isDisabled}\n $width={!isSliderBigger ? dragRange.right + itemWidth : dragRange.right}\n ref={sliderButtonWrapperRef}\n onScroll={handleScroll}\n >\n <AnimatePresence>\n <StyledSliderButtonButtonsWrapper>\n {buttons}\n </StyledSliderButtonButtonsWrapper>\n </AnimatePresence>\n </StyledSliderButtonWrapper>\n </StyledSliderButton>\n ),\n [\n buttons,\n dragRange,\n handleDragEnd,\n handleScroll,\n handleWhileDrag,\n isDisabled,\n isSliderBigger,\n itemWidth,\n scope,\n theme,\n thumbText,\n ],\n );\n};\n\nSliderButton.displayName = 'SliderButton';\n\nexport default SliderButton;\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/amount-control/AmountControl.js CHANGED Viewed

@@ -7,6 +7,7 @@ const AmountControl = _ref => {
   let {
     amount,
     icon,
+    shouldShowAddIconOnMinAmount = false,
     shouldShowIcon = true,
     label,
     iconColor,
@@ -36,10 +37,13 @@ const AmountControl = _ref => {
       case amountValue > minAmount:
         setDisplayState('normal');
         return;
+      case amountValue === minAmount && amountValue >= 0 && shouldShowAddIconOnMinAmount:
+        setDisplayState('minAmount');
+        return;
       default:
         setDisplayState('default');
     }
-  }, [amountValue, maxAmount, minAmount]);
+  }, [amountValue, maxAmount, minAmount, shouldShowAddIconOnMinAmount]);
   const hasFocus = useMemo(() => displayState !== 'default', [displayState]);
   /**
@@ -181,11 +185,14 @@ const AmountControl = _ref => {
     return item;
   }, [displayState, icon, iconColor]);
   const shouldShowLeftIcon = useMemo(() => {
+    if (shouldShowAddIconOnMinAmount && displayState === 'minAmount') {
+      return false;
+    }
     if (shouldShowIcon) {
       return true;
     }
-    return !(displayState === 'default' && !shouldShowIcon);
-  }, [displayState, shouldShowIcon]);
+    return !((displayState === 'default' || displayState === 'minAmount') && !shouldShowIcon);
+  }, [displayState, shouldShowAddIconOnMinAmount, shouldShowIcon]);
   return useMemo(() => /*#__PURE__*/React.createElement(StyledAmountControl, {
     onClick: handleFirstAmount
   }, /*#__PURE__*/React.createElement(AnimatePresence, {
@@ -230,7 +237,7 @@ const AmountControl = _ref => {
     value: displayState === 'default' && label ? label : inputValue
   }), /*#__PURE__*/React.createElement(AnimatePresence, {
     initial: false
-  }, displayState === 'normal' && /*#__PURE__*/React.createElement(StyledMotionAmountControlButton, {
+  }, (displayState === 'normal' || displayState === 'minAmount') && /*#__PURE__*/React.createElement(StyledMotionAmountControlButton, {
     key: "right_button",
     initial: {
       width: 0,
@@ -252,7 +259,7 @@ const AmountControl = _ref => {
       type: 'tween'
     },
     onClick: handleAmountAdd,
-    $isWide: displayState === 'normal' || displayState === 'maxAmount',
+    $isWide: true,
     disabled: maxAmount ? amountValue >= maxAmount : false,
     $isDisabled: maxAmount ? amountValue >= maxAmount : false
   }, /*#__PURE__*/React.createElement(Icon, {

package/lib/esm/components/amount-control/AmountControl.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AmountControl.js","names":["AnimatePresence","React","useCallback","useEffect","useMemo","useRef","useState","checkForValidAmount","Icon","StyledAmountControl","StyledAmountControlInput","StyledAmountControlPseudoInput","StyledMotionAmountControlButton","AmountControl","_ref","amount","icon","shouldShowIcon","label","iconColor","maxAmount","minAmount","onChange","shouldShowWideInput","step","stepProp","amountValue","setAmountValue","inputValue","setInputValue","toString","displayState","setDisplayState","Number","isSafeInteger","inputRef","hasFocus","handleAmountAdd","prevState","newAmount","handleAmountRemove","handleFirstAmount","handleDeleteIconClick","window","setTimeout","current","focus","handleInputBlur","checkedValue","Math","round","handleInputChange","event","value","target","valueBefore","replace","leftIcon","item","createElement","icons","size","color","shouldShowLeftIcon","onClick","initial","key","width","opacity","padding","animate","exit","$isWide","transition","duration","type","$color","undefined","disabled","$isDisabled","$shouldShowWideInput","ref","$displayState","$shouldShowIcon","$hasFocus","onBlur","displayName"],"sources":["../../../../src/components/amount-control/AmountControl.tsx"],"sourcesContent":["import { AnimatePresence } from 'framer-motion';\nimport React, {\n ChangeEvent,\n FC,\n ReactElement,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { checkForValidAmount } from '../../utils/amountControl';\nimport Icon from '../icon/Icon';\nimport {\n StyledAmountControl,\n StyledAmountControlInput,\n StyledAmountControlPseudoInput,\n StyledMotionAmountControlButton,\n} from './AmountControl.styles';\n\nexport type DisplayState = 'default' \| 'delete' \| 'normal' \| 'maxAmount';\n\nexport type AmountControlProps = {\n /*\n The amount that should be displayed.\n /\n amount?: number;\n /\n The icon that should be displayed if no amount is selected.\n /\n icon?: string;\n /\n The color of the icon.\n /\n iconColor?: string;\n /\n A Text that should be displayed, if no amount is selected;\n /\n label?: string;\n /\n The maximum allowed amount. If the maxAmount is set to one, a delete button is displayed on the left side.\n /\n maxAmount?: number;\n /\n The minimum allowed amount.\n /\n minAmount?: number;\n /\n A Function that is executed when the amount is changed\n /\n onChange?: (amount: number) => void;\n /\n Whether the icon should be displayed if no amount is selected\n /\n shouldShowIcon?: boolean;\n /\n Whether the input should be wider\n /\n shouldShowWideInput?: boolean;\n /\n Defines the amount that will change when adjusted\n /\n step?: number;\n};\n\nconst AmountControl: FC<AmountControlProps> = ({\n amount,\n icon,\n shouldShowIcon = true,\n label,\n iconColor,\n maxAmount,\n minAmount = 0,\n onChange,\n shouldShowWideInput = false,\n step: stepProp = 1,\n}) => {\n const [amountValue, setAmountValue] = useState(minAmount);\n const [inputValue, setInputValue] = useState(minAmount.toString());\n const [displayState, setDisplayState] = useState<DisplayState>('default');\n\n const step = useMemo(\n () => (Number.isSafeInteger(stepProp) && stepProp >= 1 ? stepProp : 1),\n [stepProp],\n );\n\n const inputRef = useRef<HTMLInputElement>(null);\n\n /\n This function controls the displayState\n /\n useEffect(() => {\n switch (true) {\n case maxAmount === 1 && amountValue === 1:\n setDisplayState('delete');\n return;\n case maxAmount && amountValue >= maxAmount:\n setDisplayState('maxAmount');\n return;\n case amountValue > minAmount:\n setDisplayState('normal');\n return;\n default:\n setDisplayState('default');\n }\n }, [amountValue, maxAmount, minAmount]);\n\n const hasFocus = useMemo(() => displayState !== 'default', [displayState]);\n\n /\n Function that sets the amountValue to the amount\n /\n useEffect(() => {\n if (!amount) {\n return;\n }\n\n setAmountValue(checkForValidAmount({ amount, maxAmount, minAmount }));\n setInputValue(checkForValidAmount({ amount, maxAmount, minAmount }).toString());\n }, [amount, maxAmount, minAmount]);\n\n const handleAmountAdd = useCallback(() => {\n setAmountValue((prevState) => {\n const newAmount = checkForValidAmount({\n amount: prevState + step,\n minAmount,\n maxAmount,\n });\n\n if (typeof onChange === 'function') {\n onChange(newAmount);\n }\n\n return typeof amount === 'number' ? prevState : newAmount;\n });\n setInputValue((prevState) =>\n checkForValidAmount({\n amount: Number(prevState) + step,\n minAmount,\n maxAmount,\n }).toString(),\n );\n }, [amount, maxAmount, minAmount, onChange, step]);\n\n const handleAmountRemove = useCallback(() => {\n if (displayState === 'default') {\n return;\n }\n\n setAmountValue((prevState) => {\n const newAmount = checkForValidAmount({\n amount: prevState - step,\n minAmount,\n maxAmount,\n });\n\n if (typeof onChange === 'function') {\n onChange(newAmount);\n }\n\n return newAmount;\n });\n setInputValue((prevState) =>\n checkForValidAmount({\n amount: Number(prevState) - step,\n minAmount,\n maxAmount,\n }).toString(),\n );\n }, [displayState, maxAmount, minAmount, onChange, step]);\n\n const handleFirstAmount = useCallback(() => {\n if (amountValue !== minAmount) {\n return;\n }\n\n if (typeof onChange === 'function') {\n onChange(minAmount + step);\n }\n\n setAmountValue(minAmount + step);\n setInputValue((minAmount + step).toString());\n }, [amountValue, minAmount, onChange, step]);\n\n const handleDeleteIconClick = useCallback(() => {\n if (inputValue === '0') {\n window.setTimeout(() => {\n inputRef.current?.focus();\n }, 500);\n } else {\n handleAmountRemove();\n }\n }, [handleAmountRemove, inputValue]);\n\n const handleInputBlur = useCallback(() => {\n const checkedValue = checkForValidAmount({\n minAmount,\n maxAmount,\n amount: Math.round(Number(inputValue) / step) step,\n });\n\n setAmountValue(checkedValue);\n setInputValue(checkedValue.toString());\n\n if (typeof onChange === 'function') {\n onChange(checkedValue);\n }\n\n if (inputValue === '') {\n setInputValue(minAmount.toString());\n }\n }, [inputValue, maxAmount, minAmount, onChange, step]);\n\n const handleInputChange = useCallback(\n (event: ChangeEvent<HTMLInputElement>) => {\n const { value } = event.target;\n\n const valueBefore = Number(value.replace(/\\D/g, ''));\n\n if (valueBefore < minAmount && minAmount === 0) {\n setInputValue('0');\n\n return;\n }\n\n setInputValue(valueBefore === 0 ? '' : valueBefore.toString());\n },\n [minAmount],\n );\n\n const leftIcon = useMemo(() => {\n let item: ReactElement \| null = null;\n\n switch (displayState) {\n case 'default':\n item = <Icon icons={[icon ?? 'fa fa-cart-shopping']} size={15} color={iconColor} />;\n break;\n case 'delete':\n item = <Icon icons={['fa ts-check']} size={20} color=\"white\" />;\n break;\n case 'normal':\n item = <Icon icons={['fa fa-minus']} size={15} color=\"red\" />;\n break;\n case 'maxAmount':\n item = <Icon icons={['fa fa-minus']} size={15} color=\"red\" />;\n break;\n default:\n break;\n }\n\n return item;\n }, [displayState, icon, iconColor]);\n\n const shouldShowLeftIcon = useMemo(() => {\n if (shouldShowIcon) {\n return true;\n }\n\n return !(displayState === 'default' && !shouldShowIcon);\n }, [displayState, shouldShowIcon]);\n\n return useMemo(\n () => (\n <StyledAmountControl onClick={handleFirstAmount}>\n <AnimatePresence initial={false}>\n {shouldShowLeftIcon && (\n <StyledMotionAmountControlButton\n key=\"right_button\"\n initial={{ width: 0, opacity: 0, padding: 0 }}\n animate={{\n width:\n displayState === 'normal' \|\| displayState === 'maxAmount'\n ? 40\n : 28,\n opacity: 1,\n padding: 0,\n }}\n exit={{ width: 0, opacity: 0, padding: 0 }}\n $isWide={displayState === 'normal' \|\| displayState === 'maxAmount'}\n transition={{ duration: 0.2, type: 'tween' }}\n onClick={handleAmountRemove}\n $color={displayState === 'delete' ? 'rgb(32, 198, 90)' : undefined}\n disabled={amountValue !== 0 && amountValue <= minAmount}\n $isDisabled={amountValue !== 0 && amountValue <= minAmount}\n >\n {leftIcon}\n </StyledMotionAmountControlButton>\n )}\n </AnimatePresence>\n {displayState === 'delete' \|\| inputValue === '0' ? (\n <StyledAmountControlPseudoInput\n onClick={handleDeleteIconClick}\n $shouldShowWideInput={shouldShowWideInput}\n >\n {displayState === 'default' && label ? label : inputValue}\n </StyledAmountControlPseudoInput>\n ) : (\n <StyledAmountControlInput\n ref={inputRef}\n $displayState={displayState}\n $shouldShowIcon={shouldShowIcon}\n $shouldShowWideInput={shouldShowWideInput}\n $hasFocus={hasFocus}\n onBlur={handleInputBlur}\n onChange={handleInputChange}\n value={displayState === 'default' && label ? label : inputValue}\n />\n )}\n <AnimatePresence initial={false}>\n {displayState === 'normal' && (\n <StyledMotionAmountControlButton\n key=\"right_button\"\n initial={{ width: 0, opacity: 0, padding: 0 }}\n animate={{\n width: 40,\n opacity: 1,\n padding: 0,\n }}\n exit={{ width: 0, opacity: 0, padding: 0 }}\n transition={{ duration: 0.2, type: 'tween' }}\n onClick={handleAmountAdd}\n $isWide={displayState === 'normal' \|\| displayState === 'maxAmount'}\n disabled={maxAmount ? amountValue >= maxAmount : false}\n $isDisabled={maxAmount ? amountValue >= maxAmount : false}\n >\n <Icon icons={['fa fa-plus']} size={15} color=\"green\" />\n </StyledMotionAmountControlButton>\n )}\n </AnimatePresence>\n </StyledAmountControl>\n ),\n [\n amountValue,\n displayState,\n handleAmountAdd,\n handleAmountRemove,\n handleDeleteIconClick,\n handleFirstAmount,\n handleInputBlur,\n handleInputChange,\n hasFocus,\n inputValue,\n label,\n leftIcon,\n maxAmount,\n minAmount,\n shouldShowIcon,\n shouldShowLeftIcon,\n shouldShowWideInput,\n ],\n );\n};\n\nAmountControl.displayName = 'AmountControl';\n\nexport default AmountControl;\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"AmountControl.js","names":["AnimatePresence","React","useCallback","useEffect","useMemo","useRef","useState","checkForValidAmount","Icon","StyledAmountControl","StyledAmountControlInput","StyledAmountControlPseudoInput","StyledMotionAmountControlButton","AmountControl","_ref","amount","icon","shouldShowAddIconOnMinAmount","shouldShowIcon","label","iconColor","maxAmount","minAmount","onChange","shouldShowWideInput","step","stepProp","amountValue","setAmountValue","inputValue","setInputValue","toString","displayState","setDisplayState","Number","isSafeInteger","inputRef","hasFocus","handleAmountAdd","prevState","newAmount","handleAmountRemove","handleFirstAmount","handleDeleteIconClick","window","setTimeout","current","focus","handleInputBlur","checkedValue","Math","round","handleInputChange","event","value","target","valueBefore","replace","leftIcon","item","createElement","icons","size","color","shouldShowLeftIcon","onClick","initial","key","width","opacity","padding","animate","exit","$isWide","transition","duration","type","$color","undefined","disabled","$isDisabled","$shouldShowWideInput","ref","$displayState","$shouldShowIcon","$hasFocus","onBlur","displayName"],"sources":["../../../../src/components/amount-control/AmountControl.tsx"],"sourcesContent":["import { AnimatePresence } from 'framer-motion';\nimport React, {\n ChangeEvent,\n FC,\n ReactElement,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { checkForValidAmount } from '../../utils/amountControl';\nimport Icon from '../icon/Icon';\nimport {\n StyledAmountControl,\n StyledAmountControlInput,\n StyledAmountControlPseudoInput,\n StyledMotionAmountControlButton,\n} from './AmountControl.styles';\n\nexport type DisplayState = 'default' \| 'delete' \| 'normal' \| 'maxAmount' \| 'minAmount';\n\nexport type AmountControlProps = {\n /*\n The amount that should be displayed.\n /\n amount?: number;\n /\n The icon that should be displayed if no amount is selected.\n /\n icon?: string;\n /\n The color of the icon.\n /\n iconColor?: string;\n /\n A Text that should be displayed, if no amount is selected;\n /\n label?: string;\n /\n The maximum allowed amount. If the maxAmount is set to one, a delete button is displayed on the left side.\n /\n maxAmount?: number;\n /\n The minimum allowed amount.\n /\n minAmount?: number;\n /\n A Function that is executed when the amount is changed\n /\n onChange?: (amount: number) => void;\n /\n Whether the add icon should be displayed if the minAmount is reached.\n /\n shouldShowAddIconOnMinAmount?: boolean;\n /\n Whether the icon should be displayed if no amount is selected\n /\n shouldShowIcon?: boolean;\n /\n Whether the input should be wider\n /\n shouldShowWideInput?: boolean;\n /\n Defines the amount that will change when adjusted\n /\n step?: number;\n};\n\nconst AmountControl: FC<AmountControlProps> = ({\n amount,\n icon,\n shouldShowAddIconOnMinAmount = false,\n shouldShowIcon = true,\n label,\n iconColor,\n maxAmount,\n minAmount = 0,\n onChange,\n shouldShowWideInput = false,\n step: stepProp = 1,\n}) => {\n const [amountValue, setAmountValue] = useState(minAmount);\n const [inputValue, setInputValue] = useState(minAmount.toString());\n const [displayState, setDisplayState] = useState<DisplayState>('default');\n\n const step = useMemo(\n () => (Number.isSafeInteger(stepProp) && stepProp >= 1 ? stepProp : 1),\n [stepProp],\n );\n\n const inputRef = useRef<HTMLInputElement>(null);\n\n /\n This function controls the displayState\n /\n useEffect(() => {\n switch (true) {\n case maxAmount === 1 && amountValue === 1:\n setDisplayState('delete');\n return;\n case maxAmount && amountValue >= maxAmount:\n setDisplayState('maxAmount');\n return;\n case amountValue > minAmount:\n setDisplayState('normal');\n return;\n case amountValue === minAmount && amountValue >= 0 && shouldShowAddIconOnMinAmount:\n setDisplayState('minAmount');\n return;\n default:\n setDisplayState('default');\n }\n }, [amountValue, maxAmount, minAmount, shouldShowAddIconOnMinAmount]);\n\n const hasFocus = useMemo(() => displayState !== 'default', [displayState]);\n\n /\n Function that sets the amountValue to the amount\n /\n useEffect(() => {\n if (!amount) {\n return;\n }\n\n setAmountValue(checkForValidAmount({ amount, maxAmount, minAmount }));\n setInputValue(checkForValidAmount({ amount, maxAmount, minAmount }).toString());\n }, [amount, maxAmount, minAmount]);\n\n const handleAmountAdd = useCallback(() => {\n setAmountValue((prevState) => {\n const newAmount = checkForValidAmount({\n amount: prevState + step,\n minAmount,\n maxAmount,\n });\n\n if (typeof onChange === 'function') {\n onChange(newAmount);\n }\n\n return typeof amount === 'number' ? prevState : newAmount;\n });\n setInputValue((prevState) =>\n checkForValidAmount({\n amount: Number(prevState) + step,\n minAmount,\n maxAmount,\n }).toString(),\n );\n }, [amount, maxAmount, minAmount, onChange, step]);\n\n const handleAmountRemove = useCallback(() => {\n if (displayState === 'default') {\n return;\n }\n\n setAmountValue((prevState) => {\n const newAmount = checkForValidAmount({\n amount: prevState - step,\n minAmount,\n maxAmount,\n });\n\n if (typeof onChange === 'function') {\n onChange(newAmount);\n }\n\n return newAmount;\n });\n setInputValue((prevState) =>\n checkForValidAmount({\n amount: Number(prevState) - step,\n minAmount,\n maxAmount,\n }).toString(),\n );\n }, [displayState, maxAmount, minAmount, onChange, step]);\n\n const handleFirstAmount = useCallback(() => {\n if (amountValue !== minAmount) {\n return;\n }\n\n if (typeof onChange === 'function') {\n onChange(minAmount + step);\n }\n\n setAmountValue(minAmount + step);\n setInputValue((minAmount + step).toString());\n }, [amountValue, minAmount, onChange, step]);\n\n const handleDeleteIconClick = useCallback(() => {\n if (inputValue === '0') {\n window.setTimeout(() => {\n inputRef.current?.focus();\n }, 500);\n } else {\n handleAmountRemove();\n }\n }, [handleAmountRemove, inputValue]);\n\n const handleInputBlur = useCallback(() => {\n const checkedValue = checkForValidAmount({\n minAmount,\n maxAmount,\n amount: Math.round(Number(inputValue) / step) step,\n });\n\n setAmountValue(checkedValue);\n setInputValue(checkedValue.toString());\n\n if (typeof onChange === 'function') {\n onChange(checkedValue);\n }\n\n if (inputValue === '') {\n setInputValue(minAmount.toString());\n }\n }, [inputValue, maxAmount, minAmount, onChange, step]);\n\n const handleInputChange = useCallback(\n (event: ChangeEvent<HTMLInputElement>) => {\n const { value } = event.target;\n\n const valueBefore = Number(value.replace(/\\D/g, ''));\n\n if (valueBefore < minAmount && minAmount === 0) {\n setInputValue('0');\n\n return;\n }\n\n setInputValue(valueBefore === 0 ? '' : valueBefore.toString());\n },\n [minAmount],\n );\n\n const leftIcon = useMemo(() => {\n let item: ReactElement \| null = null;\n\n switch (displayState) {\n case 'default':\n item = <Icon icons={[icon ?? 'fa fa-cart-shopping']} size={15} color={iconColor} />;\n break;\n case 'delete':\n item = <Icon icons={['fa ts-check']} size={20} color=\"white\" />;\n break;\n case 'normal':\n item = <Icon icons={['fa fa-minus']} size={15} color=\"red\" />;\n break;\n case 'maxAmount':\n item = <Icon icons={['fa fa-minus']} size={15} color=\"red\" />;\n break;\n default:\n break;\n }\n\n return item;\n }, [displayState, icon, iconColor]);\n\n const shouldShowLeftIcon = useMemo(() => {\n if (shouldShowAddIconOnMinAmount && displayState === 'minAmount') {\n return false;\n }\n\n if (shouldShowIcon) {\n return true;\n }\n\n return !((displayState === 'default' \|\| displayState === 'minAmount') && !shouldShowIcon);\n }, [displayState, shouldShowAddIconOnMinAmount, shouldShowIcon]);\n\n return useMemo(\n () => (\n <StyledAmountControl onClick={handleFirstAmount}>\n <AnimatePresence initial={false}>\n {shouldShowLeftIcon && (\n <StyledMotionAmountControlButton\n key=\"right_button\"\n initial={{ width: 0, opacity: 0, padding: 0 }}\n animate={{\n width:\n displayState === 'normal' \|\| displayState === 'maxAmount'\n ? 40\n : 28,\n opacity: 1,\n padding: 0,\n }}\n exit={{ width: 0, opacity: 0, padding: 0 }}\n $isWide={displayState === 'normal' \|\| displayState === 'maxAmount'}\n transition={{ duration: 0.2, type: 'tween' }}\n onClick={handleAmountRemove}\n $color={displayState === 'delete' ? 'rgb(32, 198, 90)' : undefined}\n disabled={amountValue !== 0 && amountValue <= minAmount}\n $isDisabled={amountValue !== 0 && amountValue <= minAmount}\n >\n {leftIcon}\n </StyledMotionAmountControlButton>\n )}\n </AnimatePresence>\n {displayState === 'delete' \|\| inputValue === '0' ? (\n <StyledAmountControlPseudoInput\n onClick={handleDeleteIconClick}\n $shouldShowWideInput={shouldShowWideInput}\n >\n {displayState === 'default' && label ? label : inputValue}\n </StyledAmountControlPseudoInput>\n ) : (\n <StyledAmountControlInput\n ref={inputRef}\n $displayState={displayState}\n $shouldShowIcon={shouldShowIcon}\n $shouldShowWideInput={shouldShowWideInput}\n $hasFocus={hasFocus}\n onBlur={handleInputBlur}\n onChange={handleInputChange}\n value={displayState === 'default' && label ? label : inputValue}\n />\n )}\n <AnimatePresence initial={false}>\n {(displayState === 'normal' \|\| displayState === 'minAmount') && (\n <StyledMotionAmountControlButton\n key=\"right_button\"\n initial={{ width: 0, opacity: 0, padding: 0 }}\n animate={{\n width: 40,\n opacity: 1,\n padding: 0,\n }}\n exit={{ width: 0, opacity: 0, padding: 0 }}\n transition={{ duration: 0.2, type: 'tween' }}\n onClick={handleAmountAdd}\n $isWide\n disabled={maxAmount ? amountValue >= maxAmount : false}\n $isDisabled={maxAmount ? amountValue >= maxAmount : false}\n >\n <Icon icons={['fa fa-plus']} size={15} color=\"green\" />\n </StyledMotionAmountControlButton>\n )}\n </AnimatePresence>\n </StyledAmountControl>\n ),\n [\n amountValue,\n displayState,\n handleAmountAdd,\n handleAmountRemove,\n handleDeleteIconClick,\n handleFirstAmount,\n handleInputBlur,\n handleInputChange,\n hasFocus,\n inputValue,\n label,\n leftIcon,\n maxAmount,\n minAmount,\n shouldShowIcon,\n shouldShowLeftIcon,\n shouldShowWideInput,\n ],\n );\n};\n\nAmountControl.displayName = 'AmountControl';\n\nexport default AmountControl;\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/slider-button/SliderButton.js CHANGED Viewed

@@ -34,8 +34,8 @@ const SliderButton = _ref => {
       const itemCount = items.length || 1;
       return sliderWidth / itemCount;
     }
-    return calculateBiggestWidth(items);
-  }, [isSliderBigger, items, shouldUseFullWidth, sliderSize?.width]);
+    return initialItemWidth;
+  }, [initialItemWidth, isSliderBigger, items.length, shouldUseFullWidth, sliderSize?.width]);
   useEffect(() => {
     if (sliderSize) {
       const sliderWidth = itemWidth * (items.length - 1);
@@ -278,7 +278,7 @@ const SliderButton = _ref => {
     $width: !isSliderBigger ? dragRange.right + itemWidth : dragRange.right,
     ref: sliderButtonWrapperRef,
     onScroll: handleScroll
-  }, /*#__PURE__*/React.createElement(AnimatePresence, null, /*#__PURE__*/React.createElement(StyledSliderButtonButtonsWrapper, null, buttons)))), [buttons, dragRange, handleDragEnd, handleScroll, handleWhileDrag, isDisabled, isSliderBigger, itemWidth, scope, thumbText]);
+  }, /*#__PURE__*/React.createElement(AnimatePresence, null, /*#__PURE__*/React.createElement(StyledSliderButtonButtonsWrapper, null, buttons)))), [buttons, dragRange, handleDragEnd, handleScroll, handleWhileDrag, isDisabled, isSliderBigger, itemWidth, scope, theme, thumbText]);
 };
 SliderButton.displayName = 'SliderButton';
 export default SliderButton;

package/lib/esm/components/slider-button/SliderButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SliderButton.js","names":["setRefreshScrollEnabled","AnimatePresence","useAnimate","React","useCallback","useEffect","useMemo","useRef","useState","useTheme","useElementSize","calculateBiggestWidth","getNearestPoint","getThumbPosition","StyledMotionSliderButtonThumb","StyledSliderButton","StyledSliderButtonButtonsWrapper","StyledSliderButtonItem","StyledSliderButtonWrapper","SliderButton","_ref","selectedButtonId","isDisabled","items","onChange","shouldUseFullWidth","selectedButton","setSelectedButton","undefined","dragRange","setDragRange","left","right","sliderButtonRef","sliderButtonWrapperRef","timeout","preventHandleScroll","scope","animate","initialItemWidth","sliderSize","theme","isSliderBigger","Math","floor","width","length","itemWidth","sliderWidth","itemCount","count","animation","x","current","type","duration","setItemPosition","index","scrollLeft","findIndex","_ref2","id","handleClick","buttons","map","_ref3","text","createElement","$width","key","onClick","$isSelected","thumbText","selectedItem","find","_ref4","snapPoints","points","i","push","handleDragEnd","position","middle","nearestPoint","nearestIndex","handleWhileDrag","scrollSpeed","handleScroll","event","target","clearTimeout","window","setTimeout","$isDisabled","ref","drag","dragElastic","dragConstraints","onDrag","onDragEnd","whileTap","backgroundColor","whileHover","onScroll","displayName"],"sources":["../../../../src/components/slider-button/SliderButton.tsx"],"sourcesContent":["import { setRefreshScrollEnabled } from 'chayns-api';\nimport { AnimatePresence, useAnimate } from 'framer-motion';\nimport React, { FC, UIEvent, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { useTheme } from 'styled-components';\nimport { useElementSize } from '../../hooks/useElementSize';\nimport type { SliderButtonItem } from '../../types/slider-button';\nimport { calculateBiggestWidth } from '../../utils/calculate';\nimport { getNearestPoint, getThumbPosition } from '../../utils/sliderButton';\nimport type { Theme } from '../color-scheme-provider/ColorSchemeProvider';\nimport {\n StyledMotionSliderButtonThumb,\n StyledSliderButton,\n StyledSliderButtonButtonsWrapper,\n StyledSliderButtonItem,\n StyledSliderButtonWrapper,\n} from './SliderButton.styles';\n\nexport type SliderButtonProps = {\n /*\n Whether the button is disabled.\n /\n isDisabled?: boolean;\n /\n Function to be executed when a button is selected.\n * @param id\n /\n onChange?: (id: string) => void;\n /\n The buttons that are slidable.\n /\n items: SliderButtonItem[];\n /\n The id of a button that should be selected.\n /\n selectedButtonId?: string;\n /\n Whether the full width should be used if the slider is smaller.\n /\n shouldUseFullWidth?: boolean;\n};\n\nconst SliderButton: FC<SliderButtonProps> = ({\n selectedButtonId,\n isDisabled,\n items,\n onChange,\n shouldUseFullWidth = false,\n}) => {\n const [selectedButton, setSelectedButton] = useState<string \| undefined>(undefined);\n const [dragRange, setDragRange] = useState({ left: 0, right: 0 });\n\n const sliderButtonRef = useRef<HTMLDivElement>(null);\n const sliderButtonWrapperRef = useRef<HTMLDivElement>(null);\n const timeout = useRef<number>();\n const preventHandleScroll = useRef(false);\n\n const [scope, animate] = useAnimate();\n\n const initialItemWidth = useMemo(() => calculateBiggestWidth(items), [items]);\n const sliderSize = useElementSize(sliderButtonRef);\n\n const theme: Theme = useTheme();\n\n const isSliderBigger = useMemo(\n () => sliderSize && Math.floor(sliderSize.width / initialItemWidth) < items.length,\n [initialItemWidth, items.length, sliderSize],\n );\n\n const itemWidth = useMemo(() => {\n if (!isSliderBigger && shouldUseFullWidth) {\n const sliderWidth = sliderSize?.width \|\| 0;\n const itemCount = items.length \|\| 1;\n\n return sliderWidth / itemCount;\n }\n\n return calculateBiggestWidth(items);\n }, [isSliderBigger, items, shouldUseFullWidth, 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 if (!isSliderBigger) {\n void animation(itemWidth * index);\n\n return;\n }\n\n const count = dragRange.right / itemWidth;\n\n if (items.length - count >= index) {\n void animation(0);\n } else {\n void animation(itemWidth * (count - (items.length - index)));\n }\n\n if (sliderButtonWrapperRef.current) {\n sliderButtonWrapperRef.current.scrollLeft = itemWidth * index;\n }\n },\n [animation, dragRange.right, isSliderBigger, itemWidth, items.length],\n );\n\n useEffect(() => {\n if (selectedButtonId) {\n setSelectedButton(selectedButtonId);\n\n const index = items.findIndex(({ id }) => id === selectedButtonId);\n\n if (index >= 0) {\n setItemPosition(index);\n }\n } else {\n setSelectedButton(items[0]?.id);\n }\n }, [\n animation,\n dragRange.right,\n isSliderBigger,\n itemWidth,\n items,\n selectedButtonId,\n setItemPosition,\n ]);\n\n const handleClick = useCallback(\n (id: string, index: number) => {\n if (isDisabled) {\n return;\n }\n\n setSelectedButton(id);\n\n if (typeof onChange === 'function') {\n onChange(id);\n }\n\n setItemPosition(index);\n },\n [isDisabled, onChange, setItemPosition],\n );\n\n const buttons = useMemo(\n () =>\n items.map(({ id, text }, index) => (\n <StyledSliderButtonItem\n $width={itemWidth}\n key={`slider-button-${id}`}\n onClick={() => handleClick(id, index)}\n $isSelected={id === selectedButton}\n >\n {text}\n </StyledSliderButtonItem>\n )),\n [handleClick, itemWidth, items, selectedButton],\n );\n\n const thumbText = useMemo(() => {\n const selectedItem = items.find(({ id }) => id === selectedButton);\n\n return selectedItem ? selectedItem.text : items[0]?.text;\n }, [items, selectedButton]);\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 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 const id = items[nearestIndex]?.id;\n\n setSelectedButton(id);\n\n if (typeof onChange === 'function' && id) {\n onChange(id);\n }\n }\n\n preventHandleScroll.current = false;\n }, [animation, itemWidth, items, onChange, scope, snapPoints]);\n\n const handleWhileDrag = useCallback(() => {\n preventHandleScroll.current = true;\n void setRefreshScrollEnabled(false);\n\n const position = getThumbPosition({ scope, itemWidth });\n\n if (!position) {\n return;\n }\n\n const { right, left, middle } = position;\n\n let scrollLeft = 0;\n\n const scrollSpeed = 3;\n\n if (sliderButtonWrapperRef.current) {\n if (right >= dragRange.right) {\n sliderButtonWrapperRef.current.scrollLeft += scrollSpeed;\n }\n\n if (left <= dragRange.left) {\n sliderButtonWrapperRef.current.scrollLeft -= scrollSpeed;\n }\n\n scrollLeft = sliderButtonWrapperRef.current.scrollLeft;\n }\n\n const { nearestIndex } = getNearestPoint({ snapPoints, position: middle, scrollLeft });\n\n if (nearestIndex >= 0) {\n setSelectedButton(items[nearestIndex]?.id);\n }\n }, [dragRange, itemWidth, items, scope, snapPoints]);\n\n // With this, the handleScroll works before the thumb is moved the first time.\n useEffect(() => {\n void animation(1);\n void animation(0);\n }, [animation]);\n\n const handleScroll = useCallback(\n (event: UIEvent<HTMLElement>) => {\n if (preventHandleScroll.current) {\n return;\n }\n\n void setRefreshScrollEnabled(false);\n\n const position = getThumbPosition({ scope, itemWidth });\n\n if (!position) {\n return;\n }\n\n const { middle } = position;\n\n const { scrollLeft } = event.target as HTMLDivElement;\n\n const { nearestIndex } = getNearestPoint({ snapPoints, position: middle, scrollLeft });\n\n if (nearestIndex >= 0) {\n setSelectedButton(items[nearestIndex]?.id);\n }\n\n if (timeout.current) {\n clearTimeout(timeout.current);\n }\n\n timeout.current = window.setTimeout(() => {\n handleDragEnd();\n }, 200);\n },\n [handleDragEnd, itemWidth, items, scope, snapPoints],\n );\n\n return useMemo(\n () => (\n <StyledSliderButton $isDisabled={isDisabled} ref={sliderButtonRef}>\n <StyledMotionSliderButtonThumb\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 onDrag={handleWhileDrag}\n onDragEnd={handleDragEnd}\n whileTap={isDisabled ? {} : { backgroundColor: theme['407'] }}\n whileHover={isDisabled ? {} : { backgroundColor: theme['409'] }}\n >\n {thumbText}\n </StyledMotionSliderButtonThumb>\n <StyledSliderButtonWrapper\n $isDisabled={isDisabled}\n $width={!isSliderBigger ? dragRange.right + itemWidth : dragRange.right}\n ref={sliderButtonWrapperRef}\n onScroll={handleScroll}\n >\n <AnimatePresence>\n <StyledSliderButtonButtonsWrapper>\n {buttons}\n </StyledSliderButtonButtonsWrapper>\n </AnimatePresence>\n </StyledSliderButtonWrapper>\n </StyledSliderButton>\n ),\n [\n buttons,\n dragRange,\n handleDragEnd,\n handleScroll,\n handleWhileDrag,\n isDisabled,\n isSliderBigger,\n itemWidth,\n scope,\n thumbText,\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","useTheme","useElementSize","calculateBiggestWidth","getNearestPoint","getThumbPosition","StyledMotionSliderButtonThumb","StyledSliderButton","StyledSliderButtonButtonsWrapper","StyledSliderButtonItem","StyledSliderButtonWrapper","SliderButton","_ref","selectedButtonId","isDisabled","items","onChange","shouldUseFullWidth","selectedButton","setSelectedButton","undefined","dragRange","setDragRange","left","right","sliderButtonRef","sliderButtonWrapperRef","timeout","preventHandleScroll","scope","animate","initialItemWidth","sliderSize","theme","isSliderBigger","Math","floor","width","length","itemWidth","sliderWidth","itemCount","count","animation","x","current","type","duration","setItemPosition","index","scrollLeft","findIndex","_ref2","id","handleClick","buttons","map","_ref3","text","createElement","$width","key","onClick","$isSelected","thumbText","selectedItem","find","_ref4","snapPoints","points","i","push","handleDragEnd","position","middle","nearestPoint","nearestIndex","handleWhileDrag","scrollSpeed","handleScroll","event","target","clearTimeout","window","setTimeout","$isDisabled","ref","drag","dragElastic","dragConstraints","onDrag","onDragEnd","whileTap","backgroundColor","whileHover","onScroll","displayName"],"sources":["../../../../src/components/slider-button/SliderButton.tsx"],"sourcesContent":["import { setRefreshScrollEnabled } from 'chayns-api';\nimport { AnimatePresence, useAnimate } from 'framer-motion';\nimport React, { FC, UIEvent, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { useTheme } from 'styled-components';\nimport { useElementSize } from '../../hooks/useElementSize';\nimport type { SliderButtonItem } from '../../types/slider-button';\nimport { calculateBiggestWidth } from '../../utils/calculate';\nimport { getNearestPoint, getThumbPosition } from '../../utils/sliderButton';\nimport type { Theme } from '../color-scheme-provider/ColorSchemeProvider';\nimport {\n StyledMotionSliderButtonThumb,\n StyledSliderButton,\n StyledSliderButtonButtonsWrapper,\n StyledSliderButtonItem,\n StyledSliderButtonWrapper,\n} from './SliderButton.styles';\n\nexport type SliderButtonProps = {\n /*\n Whether the button is disabled.\n /\n isDisabled?: boolean;\n /\n Function to be executed when a button is selected.\n * @param id\n /\n onChange?: (id: string) => void;\n /\n The buttons that are slidable.\n /\n items: SliderButtonItem[];\n /\n The id of a button that should be selected.\n /\n selectedButtonId?: string;\n /\n Whether the full width should be used if the slider is smaller.\n /\n shouldUseFullWidth?: boolean;\n};\n\nconst SliderButton: FC<SliderButtonProps> = ({\n selectedButtonId,\n isDisabled,\n items,\n onChange,\n shouldUseFullWidth = false,\n}) => {\n const [selectedButton, setSelectedButton] = useState<string \| undefined>(undefined);\n const [dragRange, setDragRange] = useState({ left: 0, right: 0 });\n\n const sliderButtonRef = useRef<HTMLDivElement>(null);\n const sliderButtonWrapperRef = useRef<HTMLDivElement>(null);\n const timeout = useRef<number>();\n const preventHandleScroll = useRef(false);\n\n const [scope, animate] = useAnimate();\n\n const initialItemWidth = useMemo(() => calculateBiggestWidth(items), [items]);\n const sliderSize = useElementSize(sliderButtonRef);\n\n const theme: Theme = useTheme();\n\n const isSliderBigger = useMemo(\n () => sliderSize && Math.floor(sliderSize.width / initialItemWidth) < items.length,\n [initialItemWidth, items.length, sliderSize],\n );\n\n const itemWidth = useMemo(() => {\n if (!isSliderBigger && shouldUseFullWidth) {\n const sliderWidth = sliderSize?.width \|\| 0;\n const itemCount = items.length \|\| 1;\n\n return sliderWidth / itemCount;\n }\n\n return initialItemWidth;\n }, [initialItemWidth, isSliderBigger, items.length, shouldUseFullWidth, 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 if (!isSliderBigger) {\n void animation(itemWidth * index);\n\n return;\n }\n\n const count = dragRange.right / itemWidth;\n\n if (items.length - count >= index) {\n void animation(0);\n } else {\n void animation(itemWidth * (count - (items.length - index)));\n }\n\n if (sliderButtonWrapperRef.current) {\n sliderButtonWrapperRef.current.scrollLeft = itemWidth * index;\n }\n },\n [animation, dragRange.right, isSliderBigger, itemWidth, items.length],\n );\n\n useEffect(() => {\n if (selectedButtonId) {\n setSelectedButton(selectedButtonId);\n\n const index = items.findIndex(({ id }) => id === selectedButtonId);\n\n if (index >= 0) {\n setItemPosition(index);\n }\n } else {\n setSelectedButton(items[0]?.id);\n }\n }, [\n animation,\n dragRange.right,\n isSliderBigger,\n itemWidth,\n items,\n selectedButtonId,\n setItemPosition,\n ]);\n\n const handleClick = useCallback(\n (id: string, index: number) => {\n if (isDisabled) {\n return;\n }\n\n setSelectedButton(id);\n\n if (typeof onChange === 'function') {\n onChange(id);\n }\n\n setItemPosition(index);\n },\n [isDisabled, onChange, setItemPosition],\n );\n\n const buttons = useMemo(\n () =>\n items.map(({ id, text }, index) => (\n <StyledSliderButtonItem\n $width={itemWidth}\n key={`slider-button-${id}`}\n onClick={() => handleClick(id, index)}\n $isSelected={id === selectedButton}\n >\n {text}\n </StyledSliderButtonItem>\n )),\n [handleClick, itemWidth, items, selectedButton],\n );\n\n const thumbText = useMemo(() => {\n const selectedItem = items.find(({ id }) => id === selectedButton);\n\n return selectedItem ? selectedItem.text : items[0]?.text;\n }, [items, selectedButton]);\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 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 const id = items[nearestIndex]?.id;\n\n setSelectedButton(id);\n\n if (typeof onChange === 'function' && id) {\n onChange(id);\n }\n }\n\n preventHandleScroll.current = false;\n }, [animation, itemWidth, items, onChange, scope, snapPoints]);\n\n const handleWhileDrag = useCallback(() => {\n preventHandleScroll.current = true;\n void setRefreshScrollEnabled(false);\n\n const position = getThumbPosition({ scope, itemWidth });\n\n if (!position) {\n return;\n }\n\n const { right, left, middle } = position;\n\n let scrollLeft = 0;\n\n const scrollSpeed = 3;\n\n if (sliderButtonWrapperRef.current) {\n if (right >= dragRange.right) {\n sliderButtonWrapperRef.current.scrollLeft += scrollSpeed;\n }\n\n if (left <= dragRange.left) {\n sliderButtonWrapperRef.current.scrollLeft -= scrollSpeed;\n }\n\n scrollLeft = sliderButtonWrapperRef.current.scrollLeft;\n }\n\n const { nearestIndex } = getNearestPoint({ snapPoints, position: middle, scrollLeft });\n\n if (nearestIndex >= 0) {\n setSelectedButton(items[nearestIndex]?.id);\n }\n }, [dragRange, itemWidth, items, scope, snapPoints]);\n\n // With this, the handleScroll works before the thumb is moved the first time.\n useEffect(() => {\n void animation(1);\n void animation(0);\n }, [animation]);\n\n const handleScroll = useCallback(\n (event: UIEvent<HTMLElement>) => {\n if (preventHandleScroll.current) {\n return;\n }\n\n void setRefreshScrollEnabled(false);\n\n const position = getThumbPosition({ scope, itemWidth });\n\n if (!position) {\n return;\n }\n\n const { middle } = position;\n\n const { scrollLeft } = event.target as HTMLDivElement;\n\n const { nearestIndex } = getNearestPoint({ snapPoints, position: middle, scrollLeft });\n\n if (nearestIndex >= 0) {\n setSelectedButton(items[nearestIndex]?.id);\n }\n\n if (timeout.current) {\n clearTimeout(timeout.current);\n }\n\n timeout.current = window.setTimeout(() => {\n handleDragEnd();\n }, 200);\n },\n [handleDragEnd, itemWidth, items, scope, snapPoints],\n );\n\n return useMemo(\n () => (\n <StyledSliderButton $isDisabled={isDisabled} ref={sliderButtonRef}>\n <StyledMotionSliderButtonThumb\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 onDrag={handleWhileDrag}\n onDragEnd={handleDragEnd}\n whileTap={isDisabled ? {} : { backgroundColor: theme['407'] }}\n whileHover={isDisabled ? {} : { backgroundColor: theme['409'] }}\n >\n {thumbText}\n </StyledMotionSliderButtonThumb>\n <StyledSliderButtonWrapper\n $isDisabled={isDisabled}\n $width={!isSliderBigger ? dragRange.right + itemWidth : dragRange.right}\n ref={sliderButtonWrapperRef}\n onScroll={handleScroll}\n >\n <AnimatePresence>\n <StyledSliderButtonButtonsWrapper>\n {buttons}\n </StyledSliderButtonButtonsWrapper>\n </AnimatePresence>\n </StyledSliderButtonWrapper>\n </StyledSliderButton>\n ),\n [\n buttons,\n dragRange,\n handleDragEnd,\n handleScroll,\n handleWhileDrag,\n isDisabled,\n isSliderBigger,\n itemWidth,\n scope,\n theme,\n thumbText,\n ],\n );\n};\n\nSliderButton.displayName = 'SliderButton';\n\nexport default SliderButton;\n"],"mappings":"AAAA,SAASA,uBAAuB,QAAQ,YAAY;AACpD,SAASC,eAAe,EAAEC,UAAU,QAAQ,eAAe;AAC3D,OAAOC,KAAK,IAAiBC,WAAW,EAAEC,SAAS,EAAEC,OAAO,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,OAAO;AAC7F,SAASC,QAAQ,QAAQ,mBAAmB;AAC5C,SAASC,cAAc,QAAQ,4BAA4B;AAE3D,SAASC,qBAAqB,QAAQ,uBAAuB;AAC7D,SAASC,eAAe,EAAEC,gBAAgB,QAAQ,0BAA0B;AAE5E,SACIC,6BAA6B,EAC7BC,kBAAkB,EAClBC,gCAAgC,EAChCC,sBAAsB,EACtBC,yBAAyB,QACtB,uBAAuB;AA0B9B,MAAMC,YAAmC,GAAGC,IAAA,IAMtC;EAAA,IANuC;IACzCC,gBAAgB;IAChBC,UAAU;IACVC,KAAK;IACLC,QAAQ;IACRC,kBAAkB,GAAG;EACzB,CAAC,GAAAL,IAAA;EACG,MAAM,CAACM,cAAc,EAAEC,iBAAiB,CAAC,GAAGnB,QAAQ,CAAqBoB,SAAS,CAAC;EACnF,MAAM,CAACC,SAAS,EAAEC,YAAY,CAAC,GAAGtB,QAAQ,CAAC;IAAEuB,IAAI,EAAE,CAAC;IAAEC,KAAK,EAAE;EAAE,CAAC,CAAC;EAEjE,MAAMC,eAAe,GAAG1B,MAAM,CAAiB,IAAI,CAAC;EACpD,MAAM2B,sBAAsB,GAAG3B,MAAM,CAAiB,IAAI,CAAC;EAC3D,MAAM4B,OAAO,GAAG5B,MAAM,CAAS,CAAC;EAChC,MAAM6B,mBAAmB,GAAG7B,MAAM,CAAC,KAAK,CAAC;EAEzC,MAAM,CAAC8B,KAAK,EAAEC,OAAO,CAAC,GAAGpC,UAAU,CAAC,CAAC;EAErC,MAAMqC,gBAAgB,GAAGjC,OAAO,CAAC,MAAMK,qBAAqB,CAACY,KAAK,CAAC,EAAE,CAACA,KAAK,CAAC,CAAC;EAC7E,MAAMiB,UAAU,GAAG9B,cAAc,CAACuB,eAAe,CAAC;EAElD,MAAMQ,KAAY,GAAGhC,QAAQ,CAAC,CAAC;EAE/B,MAAMiC,cAAc,GAAGpC,OAAO,CAC1B,MAAMkC,UAAU,IAAIG,IAAI,CAACC,KAAK,CAACJ,UAAU,CAACK,KAAK,GAAGN,gBAAgB,CAAC,GAAGhB,KAAK,CAACuB,MAAM,EAClF,CAACP,gBAAgB,EAAEhB,KAAK,CAACuB,MAAM,EAAEN,UAAU,CAC/C,CAAC;EAED,MAAMO,SAAS,GAAGzC,OAAO,CAAC,MAAM;IAC5B,IAAI,CAACoC,cAAc,IAAIjB,kBAAkB,EAAE;MACvC,MAAMuB,WAAW,GAAGR,UAAU,EAAEK,KAAK,IAAI,CAAC;MAC1C,MAAMI,SAAS,GAAG1B,KAAK,CAACuB,MAAM,IAAI,CAAC;MAEnC,OAAOE,WAAW,GAAGC,SAAS;IAClC;IAEA,OAAOV,gBAAgB;EAC3B,CAAC,EAAE,CAACA,gBAAgB,EAAEG,cAAc,EAAEnB,KAAK,CAACuB,MAAM,EAAErB,kBAAkB,EAAEe,UAAU,EAAEK,KAAK,CAAC,CAAC;EAE3FxC,SAAS,CAAC,MAAM;IACZ,IAAImC,UAAU,EAAE;MACZ,MAAMQ,WAAW,GAAGD,SAAS,IAAIxB,KAAK,CAACuB,MAAM,GAAG,CAAC,CAAC;MAElD,MAAMI,KAAK,GAAGP,IAAI,CAACC,KAAK,CAACJ,UAAU,CAACK,KAAK,GAAGE,SAAS,CAAC;MAEtDjB,YAAY,CAAC;QAAEC,IAAI,EAAE,CAAC;QAAEC,KAAK,EAAEU,cAAc,GAAGK,SAAS,GAAGG,KAAK,GAAGF;MAAY,CAAC,CAAC;IACtF;EACJ,CAAC,EAAE,CAACN,cAAc,EAAEK,SAAS,EAAExB,KAAK,CAACuB,MAAM,EAAEN,UAAU,CAAC,CAAC;EAEzD,MAAMW,SAAS,GAAG/C,WAAW,CACzB,MAAOgD,CAAS,IAAK;IACjB,MAAMd,OAAO,CACTD,KAAK,CAACgB,OAAO,EACb;MAAED;IAAE,CAAC,EACL;MACIE,IAAI,EAAE,OAAO;MACbC,QAAQ,EAAE;IACd,CACJ,CAAC;EACL,CAAC,EACD,CAACjB,OAAO,EAAED,KAAK,CACnB,CAAC;EAED,MAAMmB,eAAe,GAAGpD,WAAW,CAC9BqD,KAAa,IAAK;IACf,IAAI,CAACf,cAAc,EAAE;MACjB,KAAKS,SAAS,CAACJ,SAAS,GAAGU,KAAK,CAAC;MAEjC;IACJ;IAEA,MAAMP,KAAK,GAAGrB,SAAS,CAACG,KAAK,GAAGe,SAAS;IAEzC,IAAIxB,KAAK,CAACuB,MAAM,GAAGI,KAAK,IAAIO,KAAK,EAAE;MAC/B,KAAKN,SAAS,CAAC,CAAC,CAAC;IACrB,CAAC,MAAM;MACH,KAAKA,SAAS,CAACJ,SAAS,IAAIG,KAAK,IAAI3B,KAAK,CAACuB,MAAM,GAAGW,KAAK,CAAC,CAAC,CAAC;IAChE;IAEA,IAAIvB,sBAAsB,CAACmB,OAAO,EAAE;MAChCnB,sBAAsB,CAACmB,OAAO,CAACK,UAAU,GAAGX,SAAS,GAAGU,KAAK;IACjE;EACJ,CAAC,EACD,CAACN,SAAS,EAAEtB,SAAS,CAACG,KAAK,EAAEU,cAAc,EAAEK,SAAS,EAAExB,KAAK,CAACuB,MAAM,CACxE,CAAC;EAEDzC,SAAS,CAAC,MAAM;IACZ,IAAIgB,gBAAgB,EAAE;MAClBM,iBAAiB,CAACN,gBAAgB,CAAC;MAEnC,MAAMoC,KAAK,GAAGlC,KAAK,CAACoC,SAAS,CAACC,KAAA;QAAA,IAAC;UAAEC;QAAG,CAAC,GAAAD,KAAA;QAAA,OAAKC,EAAE,KAAKxC,gBAAgB;MAAA,EAAC;MAElE,IAAIoC,KAAK,IAAI,CAAC,EAAE;QACZD,eAAe,CAACC,KAAK,CAAC;MAC1B;IACJ,CAAC,MAAM;MACH9B,iBAAiB,CAACJ,KAAK,CAAC,CAAC,CAAC,EAAEsC,EAAE,CAAC;IACnC;EACJ,CAAC,EAAE,CACCV,SAAS,EACTtB,SAAS,CAACG,KAAK,EACfU,cAAc,EACdK,SAAS,EACTxB,KAAK,EACLF,gBAAgB,EAChBmC,eAAe,CAClB,CAAC;EAEF,MAAMM,WAAW,GAAG1D,WAAW,CAC3B,CAACyD,EAAU,EAAEJ,KAAa,KAAK;IAC3B,IAAInC,UAAU,EAAE;MACZ;IACJ;IAEAK,iBAAiB,CAACkC,EAAE,CAAC;IAErB,IAAI,OAAOrC,QAAQ,KAAK,UAAU,EAAE;MAChCA,QAAQ,CAACqC,EAAE,CAAC;IAChB;IAEAL,eAAe,CAACC,KAAK,CAAC;EAC1B,CAAC,EACD,CAACnC,UAAU,EAAEE,QAAQ,EAAEgC,eAAe,CAC1C,CAAC;EAED,MAAMO,OAAO,GAAGzD,OAAO,CACnB,MACIiB,KAAK,CAACyC,GAAG,CAAC,CAAAC,KAAA,EAAeR,KAAK;IAAA,IAAnB;MAAEI,EAAE;MAAEK;IAAK,CAAC,GAAAD,KAAA;IAAA,oBACnB9D,KAAA,CAAAgE,aAAA,CAAClD,sBAAsB;MACnBmD,MAAM,EAAErB,SAAU;MAClBsB,GAAG,EAAE,iBAAiBR,EAAE,EAAG;MAC3BS,OAAO,EAAEA,CAAA,KAAMR,WAAW,CAACD,EAAE,EAAEJ,KAAK,CAAE;MACtCc,WAAW,EAAEV,EAAE,KAAKnC;IAAe,GAElCwC,IACmB,CAAC;EAAA,CAC5B,CAAC,EACN,CAACJ,WAAW,EAAEf,SAAS,EAAExB,KAAK,EAAEG,cAAc,CAClD,CAAC;EAED,MAAM8C,SAAS,GAAGlE,OAAO,CAAC,MAAM;IAC5B,MAAMmE,YAAY,GAAGlD,KAAK,CAACmD,IAAI,CAACC,KAAA;MAAA,IAAC;QAAEd;MAAG,CAAC,GAAAc,KAAA;MAAA,OAAKd,EAAE,KAAKnC,cAAc;IAAA,EAAC;IAElE,OAAO+C,YAAY,GAAGA,YAAY,CAACP,IAAI,GAAG3C,KAAK,CAAC,CAAC,CAAC,EAAE2C,IAAI;EAC5D,CAAC,EAAE,CAAC3C,KAAK,EAAEG,cAAc,CAAC,CAAC;;EAE3B;AACJ;AACA;EACI,MAAMkD,UAAU,GAAGtE,OAAO,CAAC,MAAM;IAC7B,MAAMuE,MAAM,GAAG,CAAC,CAAC,CAAC;IAElB,KAAK,IAAIC,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGvD,KAAK,CAACuB,MAAM,EAAEgC,CAAC,EAAE,EAAE;MACnCD,MAAM,CAACE,IAAI,CAAChC,SAAS,GAAG+B,CAAC,CAAC;IAC9B;IAEA,OAAOD,MAAM;EACjB,CAAC,EAAE,CAAC9B,SAAS,EAAExB,KAAK,CAACuB,MAAM,CAAC,CAAC;EAE7B,MAAMkC,aAAa,GAAG5E,WAAW,CAAC,MAAM;IACpC,KAAKJ,uBAAuB,CAAC,IAAI,CAAC;IAElC,MAAMiF,QAAQ,GAAGpE,gBAAgB,CAAC;MAAEwB,KAAK;MAAEU;IAAU,CAAC,CAAC;IAEvD,IAAI,CAACkC,QAAQ,EAAE;MACX;IACJ;IAEA,MAAM;MAAEC,MAAM;MAAEnD;IAAK,CAAC,GAAGkD,QAAQ;IAEjC,IAAIvB,UAAU,GAAG,CAAC;IAElB,IAAIxB,sBAAsB,CAACmB,OAAO,EAAE;MAChCK,UAAU,GAAGxB,sBAAsB,CAACmB,OAAO,CAACK,UAAU;MAEtDxB,sBAAsB,CAACmB,OAAO,CAACK,UAAU,GAAG9C,eAAe,CAAC;QACxDgE,UAAU;QACVK,QAAQ,EAAEC,MAAM;QAChBxB,UAAU,EAAEA,UAAU,GAAG3B;MAC7B,CAAC,CAAC,CAACoD,YAAY;IACnB;IAEA,MAAM;MAAEC;IAAa,CAAC,GAAGxE,eAAe,CAAC;MACrCgE,UAAU;MACVK,QAAQ,EAAEC,MAAM;MAChBxB;IACJ,CAAC,CAAC;IAEF,MAAM;MAAEyB;IAAa,CAAC,GAAGvE,eAAe,CAAC;MACrCgE,UAAU;MACVK,QAAQ,EAAEC,MAAM;MAChBxB,UAAU,EAAE;IAChB,CAAC,CAAC;IAEF,IAAIyB,YAAY,IAAI,CAAC,IAAIC,YAAY,IAAI,CAAC,EAAE;MACxC,KAAKjC,SAAS,CAACgC,YAAY,CAAC;MAE5B,MAAMtB,EAAE,GAAGtC,KAAK,CAAC6D,YAAY,CAAC,EAAEvB,EAAE;MAElClC,iBAAiB,CAACkC,EAAE,CAAC;MAErB,IAAI,OAAOrC,QAAQ,KAAK,UAAU,IAAIqC,EAAE,EAAE;QACtCrC,QAAQ,CAACqC,EAAE,CAAC;MAChB;IACJ;IAEAzB,mBAAmB,CAACiB,OAAO,GAAG,KAAK;EACvC,CAAC,EAAE,CAACF,SAAS,EAAEJ,SAAS,EAAExB,KAAK,EAAEC,QAAQ,EAAEa,KAAK,EAAEuC,UAAU,CAAC,CAAC;EAE9D,MAAMS,eAAe,GAAGjF,WAAW,CAAC,MAAM;IACtCgC,mBAAmB,CAACiB,OAAO,GAAG,IAAI;IAClC,KAAKrD,uBAAuB,CAAC,KAAK,CAAC;IAEnC,MAAMiF,QAAQ,GAAGpE,gBAAgB,CAAC;MAAEwB,KAAK;MAAEU;IAAU,CAAC,CAAC;IAEvD,IAAI,CAACkC,QAAQ,EAAE;MACX;IACJ;IAEA,MAAM;MAAEjD,KAAK;MAAED,IAAI;MAAEmD;IAAO,CAAC,GAAGD,QAAQ;IAExC,IAAIvB,UAAU,GAAG,CAAC;IAElB,MAAM4B,WAAW,GAAG,CAAC;IAErB,IAAIpD,sBAAsB,CAACmB,OAAO,EAAE;MAChC,IAAIrB,KAAK,IAAIH,SAAS,CAACG,KAAK,EAAE;QAC1BE,sBAAsB,CAACmB,OAAO,CAACK,UAAU,IAAI4B,WAAW;MAC5D;MAEA,IAAIvD,IAAI,IAAIF,SAAS,CAACE,IAAI,EAAE;QACxBG,sBAAsB,CAACmB,OAAO,CAACK,UAAU,IAAI4B,WAAW;MAC5D;MAEA5B,UAAU,GAAGxB,sBAAsB,CAACmB,OAAO,CAACK,UAAU;IAC1D;IAEA,MAAM;MAAE0B;IAAa,CAAC,GAAGxE,eAAe,CAAC;MAAEgE,UAAU;MAAEK,QAAQ,EAAEC,MAAM;MAAExB;IAAW,CAAC,CAAC;IAEtF,IAAI0B,YAAY,IAAI,CAAC,EAAE;MACnBzD,iBAAiB,CAACJ,KAAK,CAAC6D,YAAY,CAAC,EAAEvB,EAAE,CAAC;IAC9C;EACJ,CAAC,EAAE,CAAChC,SAAS,EAAEkB,SAAS,EAAExB,KAAK,EAAEc,KAAK,EAAEuC,UAAU,CAAC,CAAC;;EAEpD;EACAvE,SAAS,CAAC,MAAM;IACZ,KAAK8C,SAAS,CAAC,CAAC,CAAC;IACjB,KAAKA,SAAS,CAAC,CAAC,CAAC;EACrB,CAAC,EAAE,CAACA,SAAS,CAAC,CAAC;EAEf,MAAMoC,YAAY,GAAGnF,WAAW,CAC3BoF,KAA2B,IAAK;IAC7B,IAAIpD,mBAAmB,CAACiB,OAAO,EAAE;MAC7B;IACJ;IAEA,KAAKrD,uBAAuB,CAAC,KAAK,CAAC;IAEnC,MAAMiF,QAAQ,GAAGpE,gBAAgB,CAAC;MAAEwB,KAAK;MAAEU;IAAU,CAAC,CAAC;IAEvD,IAAI,CAACkC,QAAQ,EAAE;MACX;IACJ;IAEA,MAAM;MAAEC;IAAO,CAAC,GAAGD,QAAQ;IAE3B,MAAM;MAAEvB;IAAW,CAAC,GAAG8B,KAAK,CAACC,MAAwB;IAErD,MAAM;MAAEL;IAAa,CAAC,GAAGxE,eAAe,CAAC;MAAEgE,UAAU;MAAEK,QAAQ,EAAEC,MAAM;MAAExB;IAAW,CAAC,CAAC;IAEtF,IAAI0B,YAAY,IAAI,CAAC,EAAE;MACnBzD,iBAAiB,CAACJ,KAAK,CAAC6D,YAAY,CAAC,EAAEvB,EAAE,CAAC;IAC9C;IAEA,IAAI1B,OAAO,CAACkB,OAAO,EAAE;MACjBqC,YAAY,CAACvD,OAAO,CAACkB,OAAO,CAAC;IACjC;IAEAlB,OAAO,CAACkB,OAAO,GAAGsC,MAAM,CAACC,UAAU,CAAC,MAAM;MACtCZ,aAAa,CAAC,CAAC;IACnB,CAAC,EAAE,GAAG,CAAC;EACX,CAAC,EACD,CAACA,aAAa,EAAEjC,SAAS,EAAExB,KAAK,EAAEc,KAAK,EAAEuC,UAAU,CACvD,CAAC;EAED,OAAOtE,OAAO,CACV,mBACIH,KAAA,CAAAgE,aAAA,CAACpD,kBAAkB;IAAC8E,WAAW,EAAEvE,UAAW;IAACwE,GAAG,EAAE7D;EAAgB,gBAC9D9B,KAAA,CAAAgE,aAAA,CAACrD,6BAA6B;IAC1BgF,GAAG,EAAEzD,KAAM;IACX0D,IAAI,EAAEzE,UAAU,GAAG,KAAK,GAAG,GAAI;IAC/B0E,WAAW,EAAE,CAAE;IACfC,eAAe,EACXvD,cAAc,GACR;MAAE,GAAGb,SAAS;MAAEG,KAAK,EAAEH,SAAS,CAACG,KAAK,GAAGe;IAAU,CAAC,GACpD;MAAE,GAAGlB;IAAU,CACxB;IACDuC,MAAM,EAAErB,SAAU;IAClBmD,MAAM,EAAEb,eAAgB;IACxBc,SAAS,EAAEnB,aAAc;IACzBoB,QAAQ,EAAE9E,UAAU,GAAG,CAAC,CAAC,GAAG;MAAE+E,eAAe,EAAE5D,KAAK,CAAC,KAAK;IAAE,CAAE;IAC9D6D,UAAU,EAAEhF,UAAU,GAAG,CAAC,CAAC,GAAG;MAAE+E,eAAe,EAAE5D,KAAK,CAAC,KAAK;IAAE;EAAE,GAE/D+B,SAC0B,CAAC,eAChCrE,KAAA,CAAAgE,aAAA,CAACjD,yBAAyB;IACtB2E,WAAW,EAAEvE,UAAW;IACxB8C,MAAM,EAAE,CAAC1B,cAAc,GAAGb,SAAS,CAACG,KAAK,GAAGe,SAAS,GAAGlB,SAAS,CAACG,KAAM;IACxE8D,GAAG,EAAE5D,sBAAuB;IAC5BqE,QAAQ,EAAEhB;EAAa,gBAEvBpF,KAAA,CAAAgE,aAAA,CAAClE,eAAe,qBACZE,KAAA,CAAAgE,aAAA,CAACnD,gCAAgC,QAC5B+C,OAC6B,CACrB,CACM,CACX,CACvB,EACD,CACIA,OAAO,EACPlC,SAAS,EACTmD,aAAa,EACbO,YAAY,EACZF,eAAe,EACf/D,UAAU,EACVoB,cAAc,EACdK,SAAS,EACTV,KAAK,EACLI,KAAK,EACL+B,SAAS,CAEjB,CAAC;AACL,CAAC;AAEDrD,YAAY,CAACqF,WAAW,GAAG,cAAc;AAEzC,eAAerF,YAAY","ignoreList":[]}

package/lib/types/components/amount-control/AmountControl.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 import { FC } from 'react';
-export type DisplayState = 'default' | 'delete' | 'normal' | 'maxAmount';
+export type DisplayState = 'default' | 'delete' | 'normal' | 'maxAmount' | 'minAmount';
 export type AmountControlProps = {
     /**
      * The amount that should be displayed.
@@ -29,6 +29,10 @@ export type AmountControlProps = {
      * A Function that is executed when the amount is changed
      */
     onChange?: (amount: number) => void;
+    /**
+     * Whether the add icon should be displayed if the minAmount is reached.
+     */
+    shouldShowAddIconOnMinAmount?: boolean;
     /**
      * Whether the icon should be displayed if no amount is selected
      */

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
     "name": "@chayns-components/core",
-    "version": "5.0.0-beta.848",
+    "version": "5.0.0-beta.849",
     "description": "A set of beautiful React components for developing your own applications with chayns.",
     "sideEffects": false,
     "browserslist": [
@@ -85,5 +85,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "60b73c9646f075f2b9ce2a6a05ddf6c7a0649990"
+    "gitHead": "a6cc2ecee8449297a9247c274020e5278504bbbb"
 }