@chayns-components/core 5.0.0-beta.104 → 5.0.0-beta.1040

package/lib/cjs/components/progress-bar/ProgressBar.js

@@ -0,0 +1,74 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _uuid = require("../../hooks/uuid");
+var _ProgressBar = require("./ProgressBar.styles");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const ProgressBar = ({
+  percentage,
+  label,
+  shouldHideProgress = false
+}) => {
+  const [internalPercentage, setInternalPercentage] = (0, _react.useState)(0);
+  const uuid = (0, _uuid.useUuid)();
+  (0, _react.useEffect)(() => {
+    if (typeof percentage !== 'number') {
+      return;
+    }
+    if (percentage >= 0 && percentage <= 100) {
+      setInternalPercentage(percentage);
+    }
+  }, [percentage]);
+  const progressBar = (0, _react.useMemo)(() => {
+    if (shouldHideProgress) {
+      return null;
+    }
+    if (typeof percentage !== 'number') {
+      return /*#__PURE__*/_react.default.createElement(_ProgressBar.StyledProgressBarProgressWrapper, null, /*#__PURE__*/_react.default.createElement(_ProgressBar.StyledMotionProgressBarProgress, {
+        key: `progress-bar-loop__${uuid}`,
+        initial: {
+          width: '200px',
+          left: '-200px'
+        },
+        animate: {
+          width: '200px',
+          left: '100%'
+        },
+        exit: {
+          width: '200px',
+          left: '100%'
+        },
+        transition: {
+          type: 'tween',
+          repeat: Infinity,
+          repeatDelay: 0,
+          duration: 1
+        }
+      }), /*#__PURE__*/_react.default.createElement(_ProgressBar.StyledProgressBarBackground, null));
+    }
+    return /*#__PURE__*/_react.default.createElement(_ProgressBar.StyledProgressBarProgressWrapper, null, /*#__PURE__*/_react.default.createElement(_ProgressBar.StyledMotionProgressBarProgress, {
+      key: `progress-bar__${uuid}`,
+      initial: {
+        width: '0%'
+      },
+      animate: {
+        width: `${internalPercentage}%`
+      },
+      exit: {
+        width: '0%'
+      },
+      transition: {
+        type: 'tween'
+      }
+    }), /*#__PURE__*/_react.default.createElement(_ProgressBar.StyledProgressBarBackground, null));
+  }, [internalPercentage, percentage, shouldHideProgress, uuid]);
+  return (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement(_ProgressBar.StyledProgressBar, null, progressBar, label && /*#__PURE__*/_react.default.createElement(_ProgressBar.StyledProgressBarLabel, null, label)), [progressBar, label]);
+};
+ProgressBar.displayName = 'ProgressBar';
+var _default = exports.default = ProgressBar;
+//# sourceMappingURL=ProgressBar.js.map

package/lib/cjs/components/progress-bar/ProgressBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProgressBar.js","names":["_react","_interopRequireWildcard","require","_uuid","_ProgressBar","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ProgressBar","percentage","label","shouldHideProgress","internalPercentage","setInternalPercentage","useState","uuid","useUuid","useEffect","progressBar","useMemo","createElement","StyledProgressBarProgressWrapper","StyledMotionProgressBarProgress","key","initial","width","left","animate","exit","transition","type","repeat","Infinity","repeatDelay","duration","StyledProgressBarBackground","StyledProgressBar","StyledProgressBarLabel","displayName","_default","exports"],"sources":["../../../../src/components/progress-bar/ProgressBar.tsx"],"sourcesContent":["import React, { FC, useEffect, useMemo, useState } from 'react';\nimport { useUuid } from '../../hooks/uuid';\nimport {\n    StyledMotionProgressBarProgress,\n    StyledProgressBar,\n    StyledProgressBarBackground,\n    StyledProgressBarLabel,\n    StyledProgressBarProgressWrapper,\n} from './ProgressBar.styles';\n\nexport type ProgressBarProps = {\n    /**\n     * The label that should be displayed under the progressbar.\n     */\n    label?: string;\n    /**\n     * The percentage of the progress. Number between 0 and 100.\n     */\n    percentage?: number;\n    /**\n     * Whether the progress should be hide and just display the label.\n     */\n    shouldHideProgress?: boolean;\n};\n\nconst ProgressBar: FC<ProgressBarProps> = ({ percentage, label, shouldHideProgress = false }) => {\n    const [internalPercentage, setInternalPercentage] = useState(0);\n    const uuid = useUuid();\n\n    useEffect(() => {\n        if (typeof percentage !== 'number') {\n            return;\n        }\n\n        if (percentage >= 0 && percentage <= 100) {\n            setInternalPercentage(percentage);\n        }\n    }, [percentage]);\n\n    const progressBar = useMemo(() => {\n        if (shouldHideProgress) {\n            return null;\n        }\n\n        if (typeof percentage !== 'number') {\n            return (\n                <StyledProgressBarProgressWrapper>\n                    <StyledMotionProgressBarProgress\n                        key={`progress-bar-loop__${uuid}`}\n                        initial={{ width: '200px', left: '-200px' }}\n                        animate={{ width: '200px', left: '100%' }}\n                        exit={{ width: '200px', left: '100%' }}\n                        transition={{\n                            type: 'tween',\n                            repeat: Infinity,\n                            repeatDelay: 0,\n                            duration: 1,\n                        }}\n                    />\n                    <StyledProgressBarBackground />\n                </StyledProgressBarProgressWrapper>\n            );\n        }\n\n        return (\n            <StyledProgressBarProgressWrapper>\n                <StyledMotionProgressBarProgress\n                    key={`progress-bar__${uuid}`}\n                    initial={{ width: '0%' }}\n                    animate={{ width: `${internalPercentage}%` }}\n                    exit={{ width: '0%' }}\n                    transition={{ type: 'tween' }}\n                />\n                <StyledProgressBarBackground />\n            </StyledProgressBarProgressWrapper>\n        );\n    }, [internalPercentage, percentage, shouldHideProgress, uuid]);\n\n    return useMemo(\n        () => (\n            <StyledProgressBar>\n                {progressBar}\n                {label && <StyledProgressBarLabel>{label}</StyledProgressBarLabel>}\n            </StyledProgressBar>\n        ),\n        [progressBar, label],\n    );\n};\n\nProgressBar.displayName = 'ProgressBar';\n\nexport default ProgressBar;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/progress-bar/ProgressBar.styles.js

@@ -0,0 +1,44 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StyledProgressBarProgressWrapper = exports.StyledProgressBarLabel = exports.StyledProgressBarBackground = exports.StyledProgressBar = exports.StyledMotionProgressBarProgress = void 0;
+var _react = require("motion/react");
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const StyledProgressBar = exports.StyledProgressBar = _styledComponents.default.div`
+    position: relative;
+`;
+const StyledProgressBarBackground = exports.StyledProgressBarBackground = _styledComponents.default.div`
+    height: 10px;
+    width: 100%;
+    border-radius: 2px;
+    background-color: ${({
+  theme
+}) => theme['104']};
+`;
+const StyledProgressBarProgressWrapper = exports.StyledProgressBarProgressWrapper = _styledComponents.default.div`
+    overflow: hidden;
+    position: relative;
+    width: 100%;
+    height: 10px;
+    border-radius: 2px;
+`;
+const StyledMotionProgressBarProgress = exports.StyledMotionProgressBarProgress = (0, _styledComponents.default)(_react.motion.div)`
+    height: 10px;
+    position: absolute;
+    top: 0;
+    left: 0;
+    z-index: 2;
+    background-color: ${({
+  theme
+}) => theme.headline};
+`;
+const StyledProgressBarLabel = exports.StyledProgressBarLabel = _styledComponents.default.div`
+    font-size: 85%;
+    color: ${({
+  theme
+}) => theme.headline};
+`;
+//# sourceMappingURL=ProgressBar.styles.js.map

package/lib/cjs/components/progress-bar/ProgressBar.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProgressBar.styles.js","names":["_react","require","_styledComponents","_interopRequireDefault","e","__esModule","default","StyledProgressBar","exports","styled","div","StyledProgressBarBackground","theme","StyledProgressBarProgressWrapper","StyledMotionProgressBarProgress","motion","headline","StyledProgressBarLabel"],"sources":["../../../../src/components/progress-bar/ProgressBar.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\nexport const StyledProgressBar = styled.div`\n    position: relative;\n`;\n\ntype StyledProgressBarBackgroundProps = WithTheme<unknown>;\nexport const StyledProgressBarBackground = styled.div<StyledProgressBarBackgroundProps>`\n    height: 10px;\n    width: 100%;\n    border-radius: 2px;\n    background-color: ${({ theme }: StyledProgressBarBackgroundProps) => theme['104']};\n`;\n\nexport const StyledProgressBarProgressWrapper = styled.div`\n    overflow: hidden;\n    position: relative;\n    width: 100%;\n    height: 10px;\n    border-radius: 2px;\n`;\n\ntype StyledProgressBarProgressProps = WithTheme<unknown>;\nexport const StyledMotionProgressBarProgress = styled(motion.div)<StyledProgressBarProgressProps>`\n    height: 10px;\n    position: absolute;\n    top: 0;\n    left: 0;\n    z-index: 2;\n    background-color: ${({ theme }: StyledProgressBarProgressProps) => theme.headline};\n`;\n\ntype StyledProgressBarLabelProps = WithTheme<unknown>;\n\nexport const StyledProgressBarLabel = styled.div<StyledProgressBarLabelProps>`\n    font-size: 85%;\n    color: ${({ theme }: StyledProgressBarLabelProps) => theme.headline};\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,sBAAA,CAAAF,OAAA;AAAuC,SAAAE,uBAAAC,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAGhC,MAAMG,iBAAiB,GAAAC,OAAA,CAAAD,iBAAA,GAAGE,yBAAM,CAACC,GAAG;AAC3C;AACA,CAAC;AAGM,MAAMC,2BAA2B,GAAAH,OAAA,CAAAG,2BAAA,GAAGF,yBAAM,CAACC,GAAqC;AACvF;AACA;AACA;AACA,wBAAwB,CAAC;EAAEE;AAAwC,CAAC,KAAKA,KAAK,CAAC,KAAK,CAAC;AACrF,CAAC;AAEM,MAAMC,gCAAgC,GAAAL,OAAA,CAAAK,gCAAA,GAAGJ,yBAAM,CAACC,GAAG;AAC1D;AACA;AACA;AACA;AACA;AACA,CAAC;AAGM,MAAMI,+BAA+B,GAAAN,OAAA,CAAAM,+BAAA,GAAG,IAAAL,yBAAM,EAACM,aAAM,CAACL,GAAG,CAAiC;AACjG;AACA;AACA;AACA;AACA;AACA,wBAAwB,CAAC;EAAEE;AAAsC,CAAC,KAAKA,KAAK,CAACI,QAAQ;AACrF,CAAC;AAIM,MAAMC,sBAAsB,GAAAT,OAAA,CAAAS,sBAAA,GAAGR,yBAAM,CAACC,GAAgC;AAC7E;AACA,aAAa,CAAC;EAAEE;AAAmC,CAAC,KAAKA,KAAK,CAACI,QAAQ;AACvE,CAAC","ignoreList":[]}

package/lib/cjs/components/radio-button/RadioButton.js

@@ -0,0 +1,142 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = require("motion/react");
+var _react2 = _interopRequireWildcard(require("react"));
+var _RadioButtonGroup = require("./radio-button-group/RadioButtonGroup");
+var _RadioButton = require("./RadioButton.styles");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const RadioButton = ({
+  children,
+  shouldShowRightElementOnlyOnChecked = false,
+  label,
+  id,
+  rightElement,
+  isDisabled = false
+}) => {
+  const {
+    selectedRadioButtonId,
+    updateSelectedRadioButtonId,
+    radioButtonRightElements,
+    updateHasRightElement,
+    radioButtonsCanBeUnchecked
+  } = (0, _react2.useContext)(_RadioButtonGroup.RadioButtonGroupContext);
+  const [internalIsChecked, setInternalIsChecked] = (0, _react2.useState)(false);
+  const [isHovered, setIsHovered] = (0, _react2.useState)(false);
+  const isInGroup = typeof updateSelectedRadioButtonId === 'function';
+  const isMarked = isInGroup ? selectedRadioButtonId === id : internalIsChecked;
+  const uncheckable = radioButtonsCanBeUnchecked;
+  const handleClick = (0, _react2.useCallback)(() => {
+    if (isDisabled) {
+      return;
+    }
+    if (uncheckable) {
+      if (updateSelectedRadioButtonId) {
+        updateSelectedRadioButtonId(id === selectedRadioButtonId ? undefined : id);
+      }
+      setInternalIsChecked(prev => !prev);
+      return;
+    }
+    if (typeof updateSelectedRadioButtonId === 'function') {
+      updateSelectedRadioButtonId(id);
+    }
+    setInternalIsChecked(true);
+  }, [id, isDisabled, uncheckable, selectedRadioButtonId, updateSelectedRadioButtonId]);
+  const handleMouseEnter = (0, _react2.useCallback)(() => {
+    if (!isDisabled) {
+      setIsHovered(true);
+    }
+  }, [isDisabled]);
+  const handleMouseLeave = () => {
+    setIsHovered(false);
+  };
+  const radioButtonRightElementMargin = (0, _react2.useMemo)(() => {
+    if (!radioButtonRightElements) {
+      return 'NONE';
+    }
+    const index = radioButtonRightElements.findIndex(element => element.id === id);
+    if (index < 0) {
+      return 'NONE';
+    }
+    const prevButton = radioButtonRightElements[index - 1];
+    const currentButton = radioButtonRightElements[index];
+    const nextButton = radioButtonRightElements[index + 1];
+    if (!(currentButton !== null && currentButton !== void 0 && currentButton.hasRightElement)) {
+      return 'NONE';
+    }
+    switch (true) {
+      case (prevButton === null || prevButton === void 0 ? void 0 : prevButton.hasRightElement) && !(nextButton !== null && nextButton !== void 0 && nextButton.hasRightElement):
+        return 'TOP';
+      case !(prevButton !== null && prevButton !== void 0 && prevButton.hasRightElement) && (nextButton === null || nextButton === void 0 ? void 0 : nextButton.hasRightElement):
+        return 'BOTTOM';
+      case (currentButton === null || currentButton === void 0 ? void 0 : currentButton.hasRightElement) && !(nextButton !== null && nextButton !== void 0 && nextButton.hasRightElement) && !(prevButton !== null && prevButton !== void 0 && prevButton.hasRightElement):
+        return 'NONE';
+      default:
+        return 'BOTH';
+    }
+  }, [id, radioButtonRightElements]);
+  const shouldShowRightElement = (0, _react2.useMemo)(() => {
+    if (rightElement) {
+      if (shouldShowRightElementOnlyOnChecked) {
+        return isMarked;
+      }
+      return true;
+    }
+    return false;
+  }, [isMarked, rightElement, shouldShowRightElementOnlyOnChecked]);
+  (0, _react2.useEffect)(() => {
+    if (typeof updateHasRightElement === 'function') {
+      window.setTimeout(() => {
+        updateHasRightElement(id, shouldShowRightElement);
+      }, 10);
+    }
+  }, [id, shouldShowRightElement, updateHasRightElement]);
+  return (0, _react2.useMemo)(() => /*#__PURE__*/_react2.default.createElement(_RadioButton.StyledRadioButton, {
+    $isDisabled: isDisabled,
+    $radioButtonRightElementMargin: radioButtonRightElementMargin
+  }, /*#__PURE__*/_react2.default.createElement(_RadioButton.StyledRadioButtonWrapper, null, /*#__PURE__*/_react2.default.createElement(_RadioButton.StyledRadioButtonPseudoCheckBox, {
+    $isDisabled: isDisabled,
+    $isChecked: isMarked,
+    onClick: handleClick
+  }, /*#__PURE__*/_react2.default.createElement(_RadioButton.StyledRadioButtonCheckBoxMark, {
+    onMouseEnter: handleMouseEnter,
+    onMouseLeave: handleMouseLeave,
+    $isHovered: isHovered,
+    $isSelected: isMarked,
+    $isDisabled: isDisabled
+  })), /*#__PURE__*/_react2.default.createElement(_RadioButton.StyledRadioButtonCheckBox, {
+    onClick: handleClick,
+    onMouseEnter: handleMouseEnter,
+    onMouseLeave: handleMouseLeave,
+    disabled: isDisabled,
+    $isDisabled: isDisabled,
+    type: "radio",
+    checked: isMarked,
+    onChange: () => {}
+  }), /*#__PURE__*/_react2.default.createElement(_RadioButton.StyledLabelWrapper, null, label && /*#__PURE__*/_react2.default.createElement(_RadioButton.StyledRadioButtonLabel, {
+    $isDisabled: isDisabled,
+    onClick: handleClick,
+    onMouseEnter: handleMouseEnter,
+    onMouseLeave: handleMouseLeave
+  }, label), shouldShowRightElement && rightElement)), children && /*#__PURE__*/_react2.default.createElement(_react.AnimatePresence, {
+    initial: false
+  }, /*#__PURE__*/_react2.default.createElement(_RadioButton.StyledMotionRadioButtonChildren, {
+    animate: isMarked ? {
+      opacity: 1,
+      height: 'auto'
+    } : {
+      opacity: 0,
+      height: 0
+    },
+    transition: {
+      duration: 0.2
+    }
+  }, children))), [children, handleClick, handleMouseEnter, isDisabled, isHovered, isMarked, label, radioButtonRightElementMargin, rightElement, shouldShowRightElement]);
+};
+RadioButton.displayName = 'RadioButton';
+var _default = exports.default = RadioButton;
+//# sourceMappingURL=RadioButton.js.map

package/lib/cjs/components/radio-button/RadioButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButton.js","names":["_react","require","_react2","_interopRequireWildcard","_RadioButtonGroup","_RadioButton","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","RadioButton","children","shouldShowRightElementOnlyOnChecked","label","id","rightElement","isDisabled","selectedRadioButtonId","updateSelectedRadioButtonId","radioButtonRightElements","updateHasRightElement","radioButtonsCanBeUnchecked","useContext","RadioButtonGroupContext","internalIsChecked","setInternalIsChecked","useState","isHovered","setIsHovered","isInGroup","isMarked","uncheckable","handleClick","useCallback","undefined","prev","handleMouseEnter","handleMouseLeave","radioButtonRightElementMargin","useMemo","index","findIndex","element","prevButton","currentButton","nextButton","hasRightElement","shouldShowRightElement","useEffect","window","setTimeout","createElement","StyledRadioButton","$isDisabled","$radioButtonRightElementMargin","StyledRadioButtonWrapper","StyledRadioButtonPseudoCheckBox","$isChecked","onClick","StyledRadioButtonCheckBoxMark","onMouseEnter","onMouseLeave","$isHovered","$isSelected","StyledRadioButtonCheckBox","disabled","type","checked","onChange","StyledLabelWrapper","StyledRadioButtonLabel","AnimatePresence","initial","StyledMotionRadioButtonChildren","animate","opacity","height","transition","duration","displayName","_default","exports"],"sources":["../../../../src/components/radio-button/RadioButton.tsx"],"sourcesContent":["import { AnimatePresence } from 'motion/react';\nimport React, {\n    FC,\n    useCallback,\n    useContext,\n    useEffect,\n    useMemo,\n    useState,\n    type ReactNode,\n} from 'react';\nimport { RadioButtonRightElementMargin } from '../../types/radioButton';\nimport { RadioButtonGroupContext } from './radio-button-group/RadioButtonGroup';\nimport {\n    StyledLabelWrapper,\n    StyledMotionRadioButtonChildren,\n    StyledRadioButton,\n    StyledRadioButtonCheckBox,\n    StyledRadioButtonCheckBoxMark,\n    StyledRadioButtonLabel,\n    StyledRadioButtonPseudoCheckBox,\n    StyledRadioButtonWrapper,\n} from './RadioButton.styles';\n\nexport type RadioButtonProps = {\n    /**\n     * The children that should be displayed after the RadioButton is checked.\n     */\n    children?: ReactNode;\n    /**\n     * whether the RadioButton should be shown.\n     */\n    isDisabled?: boolean;\n    /**\n     * The id of the radio button.\n     */\n    id: string;\n    /**\n     * The label that should be displayed next to the radio button.\n     */\n    label?: ReactNode;\n    /**\n     * An element that should be displayed on the right side of the label.\n     */\n    rightElement?: ReactNode;\n    /**\n     * Whether the rightElement should only be displayed when the RadioButton is checked\n     */\n    shouldShowRightElementOnlyOnChecked?: boolean;\n};\n\nconst RadioButton: FC<RadioButtonProps> = ({\n    children,\n    shouldShowRightElementOnlyOnChecked = false,\n    label,\n    id,\n    rightElement,\n    isDisabled = false,\n}) => {\n    const {\n        selectedRadioButtonId,\n        updateSelectedRadioButtonId,\n        radioButtonRightElements,\n        updateHasRightElement,\n        radioButtonsCanBeUnchecked,\n    } = useContext(RadioButtonGroupContext);\n\n    const [internalIsChecked, setInternalIsChecked] = useState(false);\n    const [isHovered, setIsHovered] = useState(false);\n\n    const isInGroup = typeof updateSelectedRadioButtonId === 'function';\n\n    const isMarked = isInGroup ? selectedRadioButtonId === id : internalIsChecked;\n\n    const uncheckable = radioButtonsCanBeUnchecked;\n\n    const handleClick = useCallback(() => {\n        if (isDisabled) {\n            return;\n        }\n\n        if (uncheckable) {\n            if (updateSelectedRadioButtonId) {\n                updateSelectedRadioButtonId(id === selectedRadioButtonId ? undefined : id);\n            }\n            setInternalIsChecked((prev) => !prev);\n            return;\n        }\n        if (typeof updateSelectedRadioButtonId === 'function') {\n            updateSelectedRadioButtonId(id);\n        }\n        setInternalIsChecked(true);\n    }, [id, isDisabled, uncheckable, selectedRadioButtonId, updateSelectedRadioButtonId]);\n\n    const handleMouseEnter = useCallback(() => {\n        if (!isDisabled) {\n            setIsHovered(true);\n        }\n    }, [isDisabled]);\n\n    const handleMouseLeave = () => {\n        setIsHovered(false);\n    };\n\n    const radioButtonRightElementMargin: RadioButtonRightElementMargin = useMemo(() => {\n        if (!radioButtonRightElements) {\n            return 'NONE';\n        }\n\n        const index = radioButtonRightElements.findIndex((element) => element.id === id);\n\n        if (index < 0) {\n            return 'NONE';\n        }\n\n        const prevButton = radioButtonRightElements[index - 1];\n        const currentButton = radioButtonRightElements[index];\n        const nextButton = radioButtonRightElements[index + 1];\n\n        if (!currentButton?.hasRightElement) {\n            return 'NONE';\n        }\n\n        switch (true) {\n            case prevButton?.hasRightElement && !nextButton?.hasRightElement:\n                return 'TOP';\n            case !prevButton?.hasRightElement && nextButton?.hasRightElement:\n                return 'BOTTOM';\n            case currentButton?.hasRightElement &&\n                !nextButton?.hasRightElement &&\n                !prevButton?.hasRightElement:\n                return 'NONE';\n            default:\n                return 'BOTH';\n        }\n    }, [id, radioButtonRightElements]);\n\n    const shouldShowRightElement = useMemo(() => {\n        if (rightElement) {\n            if (shouldShowRightElementOnlyOnChecked) {\n                return isMarked;\n            }\n\n            return true;\n        }\n\n        return false;\n    }, [isMarked, rightElement, shouldShowRightElementOnlyOnChecked]);\n\n    useEffect(() => {\n        if (typeof updateHasRightElement === 'function') {\n            window.setTimeout(() => {\n                updateHasRightElement(id, shouldShowRightElement);\n            }, 10);\n        }\n    }, [id, shouldShowRightElement, updateHasRightElement]);\n\n    return useMemo(\n        () => (\n            <StyledRadioButton\n                $isDisabled={isDisabled}\n                $radioButtonRightElementMargin={radioButtonRightElementMargin}\n            >\n                <StyledRadioButtonWrapper>\n                    <StyledRadioButtonPseudoCheckBox\n                        $isDisabled={isDisabled}\n                        $isChecked={isMarked}\n                        onClick={handleClick}\n                    >\n                        <StyledRadioButtonCheckBoxMark\n                            onMouseEnter={handleMouseEnter}\n                            onMouseLeave={handleMouseLeave}\n                            $isHovered={isHovered}\n                            $isSelected={isMarked}\n                            $isDisabled={isDisabled}\n                        />\n                    </StyledRadioButtonPseudoCheckBox>\n                    <StyledRadioButtonCheckBox\n                        onClick={handleClick}\n                        onMouseEnter={handleMouseEnter}\n                        onMouseLeave={handleMouseLeave}\n                        disabled={isDisabled}\n                        $isDisabled={isDisabled}\n                        type=\"radio\"\n                        checked={isMarked}\n                        onChange={() => {}}\n                    />\n                    <StyledLabelWrapper>\n                        {label && (\n                            <StyledRadioButtonLabel\n                                $isDisabled={isDisabled}\n                                onClick={handleClick}\n                                onMouseEnter={handleMouseEnter}\n                                onMouseLeave={handleMouseLeave}\n                            >\n                                {label}\n                            </StyledRadioButtonLabel>\n                        )}\n                        {shouldShowRightElement && rightElement}\n                    </StyledLabelWrapper>\n                </StyledRadioButtonWrapper>\n                {children && (\n                    <AnimatePresence initial={false}>\n                        <StyledMotionRadioButtonChildren\n                            animate={\n                                isMarked\n                                    ? { opacity: 1, height: 'auto' }\n                                    : { opacity: 0, height: 0 }\n                            }\n                            transition={{ duration: 0.2 }}\n                        >\n                            {children}\n                        </StyledMotionRadioButtonChildren>\n                    </AnimatePresence>\n                )}\n            </StyledRadioButton>\n        ),\n        [\n            children,\n            handleClick,\n            handleMouseEnter,\n            isDisabled,\n            isHovered,\n            isMarked,\n            label,\n            radioButtonRightElementMargin,\n            rightElement,\n            shouldShowRightElement,\n        ],\n    );\n};\n\nRadioButton.displayName = 'RadioButton';\n\nexport default RadioButton;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/radio-button/RadioButton.styles.js

@@ -0,0 +1,141 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StyledRadioButtonWrapper = exports.StyledRadioButtonPseudoCheckBox = exports.StyledRadioButtonLabel = exports.StyledRadioButtonCheckBoxMark = exports.StyledRadioButtonCheckBox = exports.StyledRadioButton = exports.StyledMotionRadioButtonChildren = exports.StyledLabelWrapper = void 0;
+var _react = require("motion/react");
+var _styledComponents = _interopRequireWildcard(require("styled-components"));
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const StyledRadioButton = exports.StyledRadioButton = _styledComponents.default.span`
+    display: flex;
+    flex-direction: column;
+
+    position: relative;
+
+    opacity: ${({
+  $isDisabled
+}) => $isDisabled ? 0.5 : 1};
+
+    ${({
+  $radioButtonRightElementMargin
+}) => {
+  switch ($radioButtonRightElementMargin) {
+    case 'BOTH':
+      return (0, _styledComponents.css)`
+                    margin: 6px 0;
+                `;
+    case 'TOP':
+      return (0, _styledComponents.css)`
+                    margin-top: 6px;
+                `;
+    case 'BOTTOM':
+      return (0, _styledComponents.css)`
+                    margin-bottom: 6px;
+                `;
+    case 'NONE':
+    default:
+      return (0, _styledComponents.css)`
+                    margin: 0;
+                `;
+  }
+}}
+`;
+const StyledRadioButtonWrapper = exports.StyledRadioButtonWrapper = _styledComponents.default.div`
+    display: flex;
+    align-items: center;
+    position: relative;
+    gap: 5px;
+    user-select: none;
+`;
+const StyledRadioButtonCheckBox = exports.StyledRadioButtonCheckBox = _styledComponents.default.input`
+    opacity: 0;
+    height: 15px;
+    width: 15px;
+    cursor: ${({
+  $isDisabled
+}) => $isDisabled ? 'default !important' : 'pointer !important'};
+`;
+const StyledRadioButtonPseudoCheckBox = exports.StyledRadioButtonPseudoCheckBox = _styledComponents.default.div`
+    background-color: ${({
+  theme,
+  $isChecked
+}) => $isChecked ? theme['secondary-408'] : theme['secondary-403']};
+    opacity: 1;
+    border: 1px solid
+        rgba(${({
+  theme
+}) => theme['409-rgb']}, 0.5);
+    width: 15px;
+    height: 15px;
+    position: absolute;
+    border-radius: 100%;
+    top: 50%;
+    transform: translateY(-50%);
+    cursor: ${({
+  $isDisabled
+}) => $isDisabled ? 'default !important' : 'pointer !important'};
+`;
+const StyledRadioButtonCheckBoxMark = exports.StyledRadioButtonCheckBoxMark = _styledComponents.default.span`
+    background-color: transparent;
+    position: absolute;
+    top: 1px;
+    left: 3.925px;
+    display: inline-block;
+    transform: rotate(35deg);
+    height: 9px;
+    width: 5px;
+    border-bottom: 2px solid white;
+    border-right: 2px solid white;
+    border-top: transparent;
+    border-left: transparent;
+    z-index: 2;
+    cursor: ${({
+  $isDisabled
+}) => $isDisabled ? 'default !important' : 'pointer !important'};
+
+    ${({
+  $isHovered,
+  $isSelected
+}) => {
+  if ($isSelected) {
+    return (0, _styledComponents.css)`
+                opacity: 1;
+            `;
+  }
+  if ($isHovered) {
+    return (0, _styledComponents.css)`
+                opacity: 0.5;
+            `;
+  }
+  return (0, _styledComponents.css)`
+            opacity: 0;
+        `;
+}}
+`;
+const StyledRadioButtonLabel = exports.StyledRadioButtonLabel = _styledComponents.default.p`
+    color: ${({
+  theme
+}) => theme.text};
+    margin: 0;
+    cursor: ${({
+  $isDisabled
+}) => $isDisabled ? 'default !important' : 'pointer !important'};
+`;
+const StyledLabelWrapper = exports.StyledLabelWrapper = _styledComponents.default.div`
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    width: 100%;
+    gap: 12px;
+`;
+const StyledMotionRadioButtonChildren = exports.StyledMotionRadioButtonChildren = (0, _styledComponents.default)(_react.motion.div)`
+    margin-left: 20px;
+    cursor: text;
+    overflow: hidden;
+    color: ${({
+  theme
+}) => theme.text};
+`;
+//# sourceMappingURL=RadioButton.styles.js.map

package/lib/cjs/components/radio-button/RadioButton.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButton.styles.js","names":["_react","require","_styledComponents","_interopRequireWildcard","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","StyledRadioButton","exports","styled","span","$isDisabled","$radioButtonRightElementMargin","css","StyledRadioButtonWrapper","div","StyledRadioButtonCheckBox","input","StyledRadioButtonPseudoCheckBox","theme","$isChecked","StyledRadioButtonCheckBoxMark","$isHovered","$isSelected","StyledRadioButtonLabel","p","text","StyledLabelWrapper","StyledMotionRadioButtonChildren","motion"],"sources":["../../../../src/components/radio-button/RadioButton.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport { RadioButtonRightElementMargin } from '../../types/radioButton';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledRadioButtonProps = WithTheme<{\n    $isDisabled: boolean;\n    $radioButtonRightElementMargin: RadioButtonRightElementMargin;\n}>;\n\nexport const StyledRadioButton = styled.span<StyledRadioButtonProps>`\n    display: flex;\n    flex-direction: column;\n\n    position: relative;\n\n    opacity: ${({ $isDisabled }: StyledRadioButtonProps) => ($isDisabled ? 0.5 : 1)};\n\n    ${({ $radioButtonRightElementMargin }: StyledRadioButtonProps) => {\n        switch ($radioButtonRightElementMargin) {\n            case 'BOTH':\n                return css`\n                    margin: 6px 0;\n                `;\n            case 'TOP':\n                return css`\n                    margin-top: 6px;\n                `;\n            case 'BOTTOM':\n                return css`\n                    margin-bottom: 6px;\n                `;\n            case 'NONE':\n            default:\n                return css`\n                    margin: 0;\n                `;\n        }\n    }}\n`;\n\nexport const StyledRadioButtonWrapper = styled.div`\n    display: flex;\n    align-items: center;\n    position: relative;\n    gap: 5px;\n    user-select: none;\n`;\n\ntype StyledRadioButtonCheckBoxProps = WithTheme<{ $isDisabled: boolean }>;\n\nexport const StyledRadioButtonCheckBox = styled.input<StyledRadioButtonCheckBoxProps>`\n    opacity: 0;\n    height: 15px;\n    width: 15px;\n    cursor: ${({ $isDisabled }: StyledRadioButtonCheckBoxProps) =>\n        $isDisabled ? 'default !important' : 'pointer !important'};\n`;\n\ntype StyledRadioButtonPseudoCheckBoxProps = WithTheme<{\n    $isChecked: boolean;\n    $isDisabled: boolean;\n}>;\n\nexport const StyledRadioButtonPseudoCheckBox = styled.div<StyledRadioButtonPseudoCheckBoxProps>`\n    background-color: ${({ theme, $isChecked }: StyledRadioButtonPseudoCheckBoxProps) =>\n        $isChecked ? theme['secondary-408'] : theme['secondary-403']};\n    opacity: 1;\n    border: 1px solid\n        rgba(${({ theme }: StyledRadioButtonPseudoCheckBoxProps) => theme['409-rgb']}, 0.5);\n    width: 15px;\n    height: 15px;\n    position: absolute;\n    border-radius: 100%;\n    top: 50%;\n    transform: translateY(-50%);\n    cursor: ${({ $isDisabled }: StyledRadioButtonPseudoCheckBoxProps) =>\n        $isDisabled ? 'default !important' : 'pointer !important'};\n`;\n\ntype StyledRadioButtonCheckBoxMarkProps = WithTheme<{\n    $isHovered: boolean;\n    $isSelected: boolean;\n    $isDisabled: boolean;\n}>;\n\nexport const StyledRadioButtonCheckBoxMark = styled.span<StyledRadioButtonCheckBoxMarkProps>`\n    background-color: transparent;\n    position: absolute;\n    top: 1px;\n    left: 3.925px;\n    display: inline-block;\n    transform: rotate(35deg);\n    height: 9px;\n    width: 5px;\n    border-bottom: 2px solid white;\n    border-right: 2px solid white;\n    border-top: transparent;\n    border-left: transparent;\n    z-index: 2;\n    cursor: ${({ $isDisabled }: StyledRadioButtonCheckBoxMarkProps) =>\n        $isDisabled ? 'default !important' : 'pointer !important'};\n\n    ${({ $isHovered, $isSelected }) => {\n        if ($isSelected) {\n            return css`\n                opacity: 1;\n            `;\n        }\n\n        if ($isHovered) {\n            return css`\n                opacity: 0.5;\n            `;\n        }\n\n        return css`\n            opacity: 0;\n        `;\n    }}\n`;\n\ntype StyledRadioButtonLabelProps = WithTheme<{ $isDisabled: boolean }>;\n\nexport const StyledRadioButtonLabel = styled.p<StyledRadioButtonLabelProps>`\n    color: ${({ theme }: StyledRadioButtonLabelProps) => theme.text};\n    margin: 0;\n    cursor: ${({ $isDisabled }: StyledRadioButtonLabelProps) =>\n        $isDisabled ? 'default !important' : 'pointer !important'};\n`;\n\nexport const StyledLabelWrapper = styled.div`\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    width: 100%;\n    gap: 12px;\n`;\n\ntype StyledMotionRadioButtonChildrenProps = WithTheme<unknown>;\n\nexport const StyledMotionRadioButtonChildren = styled(\n    motion.div,\n)<StyledMotionRadioButtonChildrenProps>`\n    margin-left: 20px;\n    cursor: text;\n    overflow: hidden;\n    color: ${({ theme }: StyledMotionRadioButtonChildrenProps) => theme.text};\n`;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/radio-button/radio-button-group/RadioButtonGroup.js

@@ -0,0 +1,69 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.RadioButtonGroupContext = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _radioButton = require("../../../utils/radioButton");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const RadioButtonGroupContext = exports.RadioButtonGroupContext = /*#__PURE__*/_react.default.createContext({
+  selectedRadioButtonId: undefined,
+  updateSelectedRadioButtonId: undefined,
+  radioButtonsCanBeUnchecked: false,
+  radioButtonRightElements: [],
+  updateHasRightElement: undefined
+});
+RadioButtonGroupContext.displayName = 'RadioButtonGroupContext';
+const RadioButtonGroup = /*#__PURE__*/(0, _react.forwardRef)(({
+  children,
+  canUncheckRadioButtons,
+  selectedId,
+  onSelect
+}, ref) => {
+  const [selectedRadioButtonId, setSelectedRadioButtonId] = (0, _react.useState)(undefined);
+  const [radioButtonRightElements, setRadioButtonRightElements] = (0, _react.useState)([]);
+  const isControlled = typeof selectedId === 'string';
+  (0, _react.useEffect)(() => {
+    setSelectedRadioButtonId(selectedId);
+  }, [selectedId]);
+  const updateSelectedRadioButtonId = (0, _react.useCallback)(id => {
+    if (typeof onSelect === 'function') {
+      onSelect(id);
+    }
+    if (!isControlled) {
+      setSelectedRadioButtonId(id);
+    }
+  }, [isControlled, onSelect]);
+  const updateHasRightElement = (0, _react.useCallback)((id, hasRightElement) => {
+    setRadioButtonRightElements(prevState => prevState.map(prev => id === prev.id ? {
+      id,
+      hasRightElement
+    } : prev));
+  }, []);
+  (0, _react.useEffect)(() => {
+    const ids = (0, _radioButton.getRadioButtonOrder)(children);
+    const rightElements = ids.map(id => ({
+      id,
+      hasRightElement: false
+    }));
+    setRadioButtonRightElements(rightElements);
+  }, [children]);
+  (0, _react.useImperativeHandle)(ref, () => ({
+    updateSelectedRadioButtonId
+  }), [updateSelectedRadioButtonId]);
+  const providerValue = (0, _react.useMemo)(() => ({
+    selectedRadioButtonId,
+    updateSelectedRadioButtonId,
+    radioButtonsCanBeUnchecked: canUncheckRadioButtons,
+    updateHasRightElement,
+    radioButtonRightElements
+  }), [canUncheckRadioButtons, radioButtonRightElements, selectedRadioButtonId, updateHasRightElement, updateSelectedRadioButtonId]);
+  return /*#__PURE__*/_react.default.createElement(RadioButtonGroupContext.Provider, {
+    value: providerValue
+  }, children);
+});
+RadioButtonGroup.displayName = 'RadioButtonGroup';
+var _default = exports.default = RadioButtonGroup;
+//# sourceMappingURL=RadioButtonGroup.js.map

package/lib/cjs/components/radio-button/radio-button-group/RadioButtonGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButtonGroup.js","names":["_react","_interopRequireWildcard","require","_radioButton","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","RadioButtonGroupContext","exports","React","createContext","selectedRadioButtonId","undefined","updateSelectedRadioButtonId","radioButtonsCanBeUnchecked","radioButtonRightElements","updateHasRightElement","displayName","RadioButtonGroup","forwardRef","children","canUncheckRadioButtons","selectedId","onSelect","ref","setSelectedRadioButtonId","useState","setRadioButtonRightElements","isControlled","useEffect","useCallback","id","hasRightElement","prevState","map","prev","ids","getRadioButtonOrder","rightElements","useImperativeHandle","providerValue","useMemo","createElement","Provider","value","_default"],"sources":["../../../../../src/components/radio-button/radio-button-group/RadioButtonGroup.tsx"],"sourcesContent":["import React, {\n    forwardRef,\n    ReactNode,\n    useCallback,\n    useEffect,\n    useImperativeHandle,\n    useMemo,\n    useState,\n} from 'react';\nimport { getRadioButtonOrder } from '../../../utils/radioButton';\n\ntype IUpdateSelectedRadioButtonId = (id: string | undefined) => void;\n\ntype IUpdateHasRightElement = (id: string, hasRightElement: boolean) => void;\n\ntype IRadioButtonRightElements = { id: string; hasRightElement: boolean }[];\n\ninterface IRadioButtonGroupContext {\n    selectedRadioButtonId: string | undefined;\n    updateSelectedRadioButtonId?: IUpdateSelectedRadioButtonId;\n    radioButtonRightElements: IRadioButtonRightElements;\n    updateHasRightElement?: IUpdateHasRightElement;\n    radioButtonsCanBeUnchecked?: boolean;\n}\n\nexport const RadioButtonGroupContext = React.createContext<IRadioButtonGroupContext>({\n    selectedRadioButtonId: undefined,\n    updateSelectedRadioButtonId: undefined,\n    radioButtonsCanBeUnchecked: false,\n    radioButtonRightElements: [],\n    updateHasRightElement: undefined,\n});\n\nRadioButtonGroupContext.displayName = 'RadioButtonGroupContext';\n\nexport type RadioButtonGroupRef = {\n    updateSelectedRadioButtonId: IUpdateSelectedRadioButtonId;\n};\n\nexport type RadioButtonGroupProps = {\n    /**\n     * Whether the RadioButtons can be unchecked.\n     */\n    canUncheckRadioButtons?: boolean;\n    /**\n     * The RadioButtons that should be grouped. Radio buttons with the same group are\n     * automatically unchecked when an `RadioButton` of the group is checked.\n     */\n    children: ReactNode;\n    /**\n     * Function to be executed when an id is selected.\n     */\n    onSelect?: (id?: string) => void;\n    /**\n     * The id of the current selected RadioButton.\n     */\n    selectedId?: string;\n};\n\nconst RadioButtonGroup = forwardRef<RadioButtonGroupRef, RadioButtonGroupProps>(\n    ({ children, canUncheckRadioButtons, selectedId, onSelect }, ref) => {\n        const [selectedRadioButtonId, setSelectedRadioButtonId] =\n            useState<IRadioButtonGroupContext['selectedRadioButtonId']>(undefined);\n        const [radioButtonRightElements, setRadioButtonRightElements] =\n            useState<IRadioButtonRightElements>([]);\n\n        const isControlled = typeof selectedId === 'string';\n\n        useEffect(() => {\n            setSelectedRadioButtonId(selectedId);\n        }, [selectedId]);\n\n        const updateSelectedRadioButtonId = useCallback<IUpdateSelectedRadioButtonId>(\n            (id) => {\n                if (typeof onSelect === 'function') {\n                    onSelect(id);\n                }\n\n                if (!isControlled) {\n                    setSelectedRadioButtonId(id);\n                }\n            },\n            [isControlled, onSelect],\n        );\n\n        const updateHasRightElement = useCallback<IUpdateHasRightElement>((id, hasRightElement) => {\n            setRadioButtonRightElements((prevState) =>\n                prevState.map((prev) => (id === prev.id ? { id, hasRightElement } : prev)),\n            );\n        }, []);\n\n        useEffect(() => {\n            const ids = getRadioButtonOrder(children);\n\n            const rightElements = ids.map((id) => ({ id, hasRightElement: false }));\n\n            setRadioButtonRightElements(rightElements);\n        }, [children]);\n\n        useImperativeHandle(\n            ref,\n            () => ({\n                updateSelectedRadioButtonId,\n            }),\n            [updateSelectedRadioButtonId],\n        );\n\n        const providerValue = useMemo<IRadioButtonGroupContext>(\n            () => ({\n                selectedRadioButtonId,\n                updateSelectedRadioButtonId,\n                radioButtonsCanBeUnchecked: canUncheckRadioButtons,\n                updateHasRightElement,\n                radioButtonRightElements,\n            }),\n            [\n                canUncheckRadioButtons,\n                radioButtonRightElements,\n                selectedRadioButtonId,\n                updateHasRightElement,\n                updateSelectedRadioButtonId,\n            ],\n        );\n\n        return (\n            <RadioButtonGroupContext.Provider value={providerValue}>\n                {children}\n            </RadioButtonGroupContext.Provider>\n        );\n    },\n);\n\nRadioButtonGroup.displayName = 'RadioButtonGroup';\n\nexport default RadioButtonGroup;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/scroll-view/ScrollView.js

@@ -0,0 +1,37 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _chaynsApi = require("chayns-api");
+var _react = _interopRequireWildcard(require("react"));
+var _ScrollView = require("./ScrollView.styles");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const ScrollView = /*#__PURE__*/(0, _react.forwardRef)(({
+  maxHeight = 300,
+  height,
+  maxWidth,
+  width,
+  children,
+  overflowX = 'auto',
+  overflowY = 'auto'
+}, ref) => {
+  const {
+    browser
+  } = (0, _chaynsApi.getDevice)();
+  return (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement(_ScrollView.StyledScrollView, {
+    $browser: browser === null || browser === void 0 ? void 0 : browser.name,
+    $maxHeight: maxHeight,
+    $height: height,
+    $maxWidth: maxWidth,
+    $width: width,
+    $overflowX: overflowX,
+    $overflowY: overflowY,
+    ref: ref
+  }, children), [browser === null || browser === void 0 ? void 0 : browser.name, children, height, maxHeight, maxWidth, overflowX, overflowY, ref, width]);
+});
+ScrollView.displayName = 'ScrollView';
+var _default = exports.default = ScrollView;
+//# sourceMappingURL=ScrollView.js.map

package/lib/cjs/components/scroll-view/ScrollView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScrollView.js","names":["_chaynsApi","require","_react","_interopRequireWildcard","_ScrollView","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ScrollView","forwardRef","maxHeight","height","maxWidth","width","children","overflowX","overflowY","ref","browser","getDevice","useMemo","createElement","StyledScrollView","$browser","name","$maxHeight","$height","$maxWidth","$width","$overflowX","$overflowY","displayName","_default","exports"],"sources":["../../../../src/components/scroll-view/ScrollView.tsx"],"sourcesContent":["import { getDevice } from 'chayns-api';\nimport React, { CSSProperties, forwardRef, ReactNode, useMemo } from 'react';\nimport { BrowserName } from '../../types/chayns';\nimport { StyledScrollView } from './ScrollView.styles';\n\nexport type ScrollViewProps = {\n    /**\n     * The elements that should be shown inside the scrollview\n     */\n    children: ReactNode;\n    /**\n     * The maximum height of the scroll view.\n     */\n    maxHeight?: CSSProperties['height'] | null;\n    /**\n     * The height of the scroll view.\n     */\n    height?: CSSProperties['height'];\n    /**\n     * The maximum width of the scroll view.\n     */\n    maxWidth?: CSSProperties['width'];\n    /**\n     * The width of the scroll view.\n     */\n    width?: CSSProperties['width'];\n    /**\n     * The overflow-x style of the scroll view.\n     */\n    overflowX?: 'scroll' | 'auto';\n    /**\n     * The overflow-y style of the scroll view.\n     */\n    overflowY?: 'scroll' | 'auto';\n};\n\nconst ScrollView = forwardRef<HTMLDivElement, ScrollViewProps>(\n    (\n        {\n            maxHeight = 300,\n            height,\n            maxWidth,\n            width,\n            children,\n            overflowX = 'auto',\n            overflowY = 'auto',\n        },\n        ref,\n    ) => {\n        const { browser } = getDevice();\n\n        return useMemo(\n            () => (\n                <StyledScrollView\n                    $browser={browser?.name as BrowserName}\n                    $maxHeight={maxHeight}\n                    $height={height}\n                    $maxWidth={maxWidth}\n                    $width={width}\n                    $overflowX={overflowX}\n                    $overflowY={overflowY}\n                    ref={ref}\n                >\n                    {children}\n                </StyledScrollView>\n            ),\n            [\n                browser?.name,\n                children,\n                height,\n                maxHeight,\n                maxWidth,\n                overflowX,\n                overflowY,\n                ref,\n                width,\n            ],\n        );\n    },\n);\n\nScrollView.displayName = 'ScrollView';\n\nexport default ScrollView;\n"],"mappings":";;;;;;AAAA,IAAAA,UAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,uBAAA,CAAAF,OAAA;AAEA,IAAAG,WAAA,GAAAH,OAAA;AAAuD,SAAAI,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAH,wBAAAG,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAiCvD,MAAMW,UAAU,gBAAG,IAAAC,iBAAU,EACzB,CACI;EACIC,SAAS,GAAG,GAAG;EACfC,MAAM;EACNC,QAAQ;EACRC,KAAK;EACLC,QAAQ;EACRC,SAAS,GAAG,MAAM;EAClBC,SAAS,GAAG;AAChB,CAAC,EACDC,GAAG,KACF;EACD,MAAM;IAAEC;EAAQ,CAAC,GAAG,IAAAC,oBAAS,EAAC,CAAC;EAE/B,OAAO,IAAAC,cAAO,EACV,mBACInC,MAAA,CAAAS,OAAA,CAAA2B,aAAA,CAAClC,WAAA,CAAAmC,gBAAgB;IACbC,QAAQ,EAAEL,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEM,IAAoB;IACvCC,UAAU,EAAEf,SAAU;IACtBgB,OAAO,EAAEf,MAAO;IAChBgB,SAAS,EAAEf,QAAS;IACpBgB,MAAM,EAAEf,KAAM;IACdgB,UAAU,EAAEd,SAAU;IACtBe,UAAU,EAAEd,SAAU;IACtBC,GAAG,EAAEA;EAAI,GAERH,QACa,CACrB,EACD,CACII,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEM,IAAI,EACbV,QAAQ,EACRH,MAAM,EACND,SAAS,EACTE,QAAQ,EACRG,SAAS,EACTC,SAAS,EACTC,GAAG,EACHJ,KAAK,CAEb,CAAC;AACL,CACJ,CAAC;AAEDL,UAAU,CAACuB,WAAW,GAAG,YAAY;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAvC,OAAA,GAEvBc,UAAU","ignoreList":[]}