@chayns-components/core 5.0.0-beta.621 → 5.0.0-beta.623

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.
@@ -88,8 +88,16 @@ const AccordionHead = ({
88
88
  initial: {
89
89
  scale: isOpen && !isWrapped ? 1 / 1.3 : 1.3
90
90
  },
91
+ exit: {
92
+ opacity: 0
93
+ },
91
94
  $isOpen: isOpen,
92
95
  $isWrapped: isWrapped,
96
+ transition: {
97
+ opacity: {
98
+ duration: 0
99
+ }
100
+ },
93
101
  key: isOpen && !isWrapped ? 'accordionHeadTitleBig' : 'accordionHeadTitle'
94
102
  }, title))), titleElement && /*#__PURE__*/_react.default.createElement(_AccordionHead.StyledMotionTitleElementWrapper, {
95
103
  layout: true
@@ -1 +1 @@
1
- {"version":3,"file":"AccordionHead.js","names":["_framerMotion","require","_react","_interopRequireWildcard","_styledComponents","_accordion","_Icon","_interopRequireDefault","_AccordionHead","obj","__esModule","default","_getRequireWildcardCache","e","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","AccordionHead","icon","isOpen","isFixed","isTitleGreyed","isWrapped","onClick","onSearchChange","rightElement","searchIcon","searchPlaceholder","searchValue","shouldRotateIcon","title","titleElement","headHeight","setHeadHeight","useState","closed","open","theme","useTheme","titleWrapperRef","useRef","hasSearchIcon","Array","isArray","useEffect","_titleWrapperRef$curr","getAccordionHeadHeight","width","current","clientWidth","iconElement","useMemo","createElement","icons","internalIcon","accordionIcon","toString","internalIconStyle","iconStyle","StyledAccordionIcon","className","$icon","StyledMotionAccordionHead","animate","height","initial","StyledMotionIconWrapper","rotate","undefined","StyledMotionContentWrapper","opacity","ref","LayoutGroup","StyledMotionTitleWrapper","AnimatePresence","StyledMotionTitle","scale","$isOpen","$isWrapped","key","StyledMotionTitleElementWrapper","layout","StyledRightWrapper","Fragment","StyledMotionRightInput","autoComplete","exit","$hasIcon","onChange","placeholder","type","value","StyledMotionRightInputIconWrapper","StyledMotionRightElementWrapper","displayName","_default","exports"],"sources":["../../../../../src/components/accordion/accordion-head/AccordionHead.tsx"],"sourcesContent":["import { AnimatePresence, LayoutGroup } from 'framer-motion';\nimport React, {\n ChangeEventHandler,\n FC,\n MouseEventHandler,\n ReactNode,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { useTheme } from 'styled-components';\nimport { getAccordionHeadHeight } from '../../../utils/accordion';\nimport Icon from '../../icon/Icon';\nimport {\n StyledAccordionIcon,\n StyledMotionAccordionHead,\n StyledMotionContentWrapper,\n StyledMotionIconWrapper,\n StyledMotionRightElementWrapper,\n StyledMotionRightInput,\n StyledMotionRightInputIconWrapper,\n StyledMotionTitle,\n StyledMotionTitleElementWrapper,\n StyledMotionTitleWrapper,\n StyledRightWrapper,\n} from './AccordionHead.styles';\n\ntype AccordionHeadProps = {\n icon?: string;\n isOpen: boolean;\n isFixed: boolean;\n isTitleGreyed: boolean;\n isWrapped: boolean;\n onClick: MouseEventHandler<HTMLDivElement>;\n onSearchChange?: ChangeEventHandler<HTMLInputElement>;\n rightElement?: ReactNode;\n searchIcon?: string[];\n searchPlaceholder?: string;\n searchValue?: string;\n shouldRotateIcon?: boolean;\n title: string;\n titleElement?: ReactNode;\n};\n\ninterface HeadHeight {\n closed: number;\n open: number;\n}\n\nconst AccordionHead: FC<AccordionHeadProps> = ({\n icon,\n isOpen,\n isFixed,\n isTitleGreyed,\n isWrapped,\n onClick,\n onSearchChange,\n rightElement,\n searchIcon,\n searchPlaceholder,\n searchValue,\n shouldRotateIcon,\n title,\n titleElement,\n}) => {\n const [headHeight, setHeadHeight] = useState<HeadHeight>({\n closed: isWrapped ? 40 : 33,\n open: isWrapped ? 40 : 33,\n });\n\n const theme = useTheme();\n\n const titleWrapperRef = useRef<HTMLDivElement>(null);\n\n const hasSearchIcon = Array.isArray(searchIcon);\n\n useEffect(() => {\n setHeadHeight(\n getAccordionHeadHeight({\n isWrapped,\n title,\n width: (titleWrapperRef.current?.clientWidth ?? 0) - 10,\n }),\n );\n }, [isWrapped, title]);\n\n const iconElement = useMemo(() => {\n if (icon || isFixed) {\n return (\n <Icon icons={[isFixed ? 'fa fa-horizontal-rule' : icon ?? 'fa fa-chevron-right']} />\n );\n }\n\n let internalIcon = 'f105';\n\n if (\n theme?.accordionIcon &&\n theme.accordionIcon !== 110 &&\n theme.accordionIcon !== 1110100\n ) {\n internalIcon = (theme.accordionIcon as number).toString(16);\n }\n\n const internalIconStyle = theme?.iconStyle ? (theme.iconStyle as string) : 'fa-regular';\n\n return <StyledAccordionIcon className={internalIconStyle} $icon={internalIcon} />;\n }, [icon, theme, isFixed]);\n\n return (\n <StyledMotionAccordionHead\n animate={{ height: isOpen ? headHeight.open : headHeight.closed }}\n className=\"beta-chayns-accordion-head\"\n initial={false}\n >\n <StyledMotionIconWrapper\n animate={{ rotate: (isOpen || isFixed) && shouldRotateIcon ? 90 : 0 }}\n initial={false}\n onClick={!isFixed ? onClick : undefined}\n >\n {iconElement}\n </StyledMotionIconWrapper>\n <StyledMotionContentWrapper\n animate={{ opacity: isTitleGreyed ? 0.5 : 1 }}\n initial={false}\n onClick={!isFixed ? onClick : undefined}\n ref={titleWrapperRef}\n >\n <LayoutGroup>\n <StyledMotionTitleWrapper>\n <AnimatePresence initial={false}>\n <StyledMotionTitle\n animate={{ scale: 1 }}\n initial={{ scale: isOpen && !isWrapped ? 1 / 1.3 : 1.3 }}\n $isOpen={isOpen}\n $isWrapped={isWrapped}\n key={\n isOpen && !isWrapped\n ? 'accordionHeadTitleBig'\n : 'accordionHeadTitle'\n }\n >\n {title}\n </StyledMotionTitle>\n </AnimatePresence>\n </StyledMotionTitleWrapper>\n {titleElement && (\n <StyledMotionTitleElementWrapper layout>\n {titleElement}\n </StyledMotionTitleElementWrapper>\n )}\n </LayoutGroup>\n </StyledMotionContentWrapper>\n {(typeof onSearchChange === 'function' || rightElement) && (\n <StyledRightWrapper>\n <AnimatePresence initial={false}>\n {typeof onSearchChange === 'function' && isOpen ? (\n <>\n <StyledMotionRightInput\n animate={{ opacity: 1, width: '165px' }}\n autoComplete=\"off\"\n exit={{ opacity: 0, width: 0 }}\n $hasIcon={hasSearchIcon}\n initial={{ opacity: 0, width: 0 }}\n key=\"rightInput\"\n onChange={onSearchChange}\n placeholder={searchPlaceholder}\n type=\"text\"\n value={searchValue}\n />\n {hasSearchIcon && (\n <StyledMotionRightInputIconWrapper\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n key=\"rightInputIcon\"\n >\n <Icon icons={searchIcon} />\n </StyledMotionRightInputIconWrapper>\n )}\n </>\n ) : (\n <StyledMotionRightElementWrapper\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n key=\"rightElementWrapper\"\n >\n {rightElement}\n </StyledMotionRightElementWrapper>\n )}\n </AnimatePresence>\n </StyledRightWrapper>\n )}\n </StyledMotionAccordionHead>\n );\n};\n\nAccordionHead.displayName = 'AccordionHead';\n\nexport default AccordionHead;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"AccordionHead.js","names":["_framerMotion","require","_react","_interopRequireWildcard","_styledComponents","_accordion","_Icon","_interopRequireDefault","_AccordionHead","obj","__esModule","default","_getRequireWildcardCache","e","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","AccordionHead","icon","isOpen","isFixed","isTitleGreyed","isWrapped","onClick","onSearchChange","rightElement","searchIcon","searchPlaceholder","searchValue","shouldRotateIcon","title","titleElement","headHeight","setHeadHeight","useState","closed","open","theme","useTheme","titleWrapperRef","useRef","hasSearchIcon","Array","isArray","useEffect","_titleWrapperRef$curr","getAccordionHeadHeight","width","current","clientWidth","iconElement","useMemo","createElement","icons","internalIcon","accordionIcon","toString","internalIconStyle","iconStyle","StyledAccordionIcon","className","$icon","StyledMotionAccordionHead","animate","height","initial","StyledMotionIconWrapper","rotate","undefined","StyledMotionContentWrapper","opacity","ref","LayoutGroup","StyledMotionTitleWrapper","AnimatePresence","StyledMotionTitle","scale","exit","$isOpen","$isWrapped","transition","duration","key","StyledMotionTitleElementWrapper","layout","StyledRightWrapper","Fragment","StyledMotionRightInput","autoComplete","$hasIcon","onChange","placeholder","type","value","StyledMotionRightInputIconWrapper","StyledMotionRightElementWrapper","displayName","_default","exports"],"sources":["../../../../../src/components/accordion/accordion-head/AccordionHead.tsx"],"sourcesContent":["import { AnimatePresence, LayoutGroup } from 'framer-motion';\nimport React, {\n ChangeEventHandler,\n FC,\n MouseEventHandler,\n ReactNode,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { useTheme } from 'styled-components';\nimport { getAccordionHeadHeight } from '../../../utils/accordion';\nimport Icon from '../../icon/Icon';\nimport {\n StyledAccordionIcon,\n StyledMotionAccordionHead,\n StyledMotionContentWrapper,\n StyledMotionIconWrapper,\n StyledMotionRightElementWrapper,\n StyledMotionRightInput,\n StyledMotionRightInputIconWrapper,\n StyledMotionTitle,\n StyledMotionTitleElementWrapper,\n StyledMotionTitleWrapper,\n StyledRightWrapper,\n} from './AccordionHead.styles';\n\ntype AccordionHeadProps = {\n icon?: string;\n isOpen: boolean;\n isFixed: boolean;\n isTitleGreyed: boolean;\n isWrapped: boolean;\n onClick: MouseEventHandler<HTMLDivElement>;\n onSearchChange?: ChangeEventHandler<HTMLInputElement>;\n rightElement?: ReactNode;\n searchIcon?: string[];\n searchPlaceholder?: string;\n searchValue?: string;\n shouldRotateIcon?: boolean;\n title: string;\n titleElement?: ReactNode;\n};\n\ninterface HeadHeight {\n closed: number;\n open: number;\n}\n\nconst AccordionHead: FC<AccordionHeadProps> = ({\n icon,\n isOpen,\n isFixed,\n isTitleGreyed,\n isWrapped,\n onClick,\n onSearchChange,\n rightElement,\n searchIcon,\n searchPlaceholder,\n searchValue,\n shouldRotateIcon,\n title,\n titleElement,\n}) => {\n const [headHeight, setHeadHeight] = useState<HeadHeight>({\n closed: isWrapped ? 40 : 33,\n open: isWrapped ? 40 : 33,\n });\n\n const theme = useTheme();\n\n const titleWrapperRef = useRef<HTMLDivElement>(null);\n\n const hasSearchIcon = Array.isArray(searchIcon);\n\n useEffect(() => {\n setHeadHeight(\n getAccordionHeadHeight({\n isWrapped,\n title,\n width: (titleWrapperRef.current?.clientWidth ?? 0) - 10,\n }),\n );\n }, [isWrapped, title]);\n\n const iconElement = useMemo(() => {\n if (icon || isFixed) {\n return (\n <Icon icons={[isFixed ? 'fa fa-horizontal-rule' : icon ?? 'fa fa-chevron-right']} />\n );\n }\n\n let internalIcon = 'f105';\n\n if (\n theme?.accordionIcon &&\n theme.accordionIcon !== 110 &&\n theme.accordionIcon !== 1110100\n ) {\n internalIcon = (theme.accordionIcon as number).toString(16);\n }\n\n const internalIconStyle = theme?.iconStyle ? (theme.iconStyle as string) : 'fa-regular';\n\n return <StyledAccordionIcon className={internalIconStyle} $icon={internalIcon} />;\n }, [icon, theme, isFixed]);\n\n return (\n <StyledMotionAccordionHead\n animate={{ height: isOpen ? headHeight.open : headHeight.closed }}\n className=\"beta-chayns-accordion-head\"\n initial={false}\n >\n <StyledMotionIconWrapper\n animate={{ rotate: (isOpen || isFixed) && shouldRotateIcon ? 90 : 0 }}\n initial={false}\n onClick={!isFixed ? onClick : undefined}\n >\n {iconElement}\n </StyledMotionIconWrapper>\n <StyledMotionContentWrapper\n animate={{ opacity: isTitleGreyed ? 0.5 : 1 }}\n initial={false}\n onClick={!isFixed ? onClick : undefined}\n ref={titleWrapperRef}\n >\n <LayoutGroup>\n <StyledMotionTitleWrapper>\n <AnimatePresence initial={false}>\n <StyledMotionTitle\n animate={{ scale: 1 }}\n initial={{ scale: isOpen && !isWrapped ? 1 / 1.3 : 1.3 }}\n exit={{ opacity: 0 }}\n $isOpen={isOpen}\n $isWrapped={isWrapped}\n transition={{\n opacity: {\n duration: 0,\n },\n }}\n key={\n isOpen && !isWrapped\n ? 'accordionHeadTitleBig'\n : 'accordionHeadTitle'\n }\n >\n {title}\n </StyledMotionTitle>\n </AnimatePresence>\n </StyledMotionTitleWrapper>\n {titleElement && (\n <StyledMotionTitleElementWrapper layout>\n {titleElement}\n </StyledMotionTitleElementWrapper>\n )}\n </LayoutGroup>\n </StyledMotionContentWrapper>\n {(typeof onSearchChange === 'function' || rightElement) && (\n <StyledRightWrapper>\n <AnimatePresence initial={false}>\n {typeof onSearchChange === 'function' && isOpen ? (\n <>\n <StyledMotionRightInput\n animate={{ opacity: 1, width: '165px' }}\n autoComplete=\"off\"\n exit={{ opacity: 0, width: 0 }}\n $hasIcon={hasSearchIcon}\n initial={{ opacity: 0, width: 0 }}\n key=\"rightInput\"\n onChange={onSearchChange}\n placeholder={searchPlaceholder}\n type=\"text\"\n value={searchValue}\n />\n {hasSearchIcon && (\n <StyledMotionRightInputIconWrapper\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n key=\"rightInputIcon\"\n >\n <Icon icons={searchIcon} />\n </StyledMotionRightInputIconWrapper>\n )}\n </>\n ) : (\n <StyledMotionRightElementWrapper\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n key=\"rightElementWrapper\"\n >\n {rightElement}\n </StyledMotionRightElementWrapper>\n )}\n </AnimatePresence>\n </StyledRightWrapper>\n )}\n </StyledMotionAccordionHead>\n );\n};\n\nAccordionHead.displayName = 'AccordionHead';\n\nexport default AccordionHead;\n"],"mappings":"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","ignoreList":[]}
@@ -84,8 +84,7 @@ const StyledMotionTitle = exports.StyledMotionTitle = (0, _styledComponents.defa
84
84
  ${({
85
85
  $isWrapped
86
86
  }) => $isWrapped && (0, _styledComponents.css)`
87
- align-items: center;
88
- display: flex;
87
+ align-content: center;
89
88
  `}
90
89
  `;
91
90
  const StyledMotionTitleElementWrapper = exports.StyledMotionTitleElementWrapper = (0, _styledComponents.default)(_framerMotion.motion.div)`
@@ -1 +1 @@
1
- {"version":3,"file":"AccordionHead.styles.js","names":["_framerMotion","require","_styledComponents","_interopRequireWildcard","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","StyledMotionAccordionHead","exports","styled","motion","div","theme","text","StyledMotionIconWrapper","onClick","StyledAccordionIcon","headline","$icon","StyledMotionContentWrapper","StyledMotionTitleWrapper","StyledMotionTitle","$isOpen","$isWrapped","undefined","css","StyledMotionTitleElementWrapper","StyledRightWrapper","StyledMotionRightElementWrapper","StyledMotionRightInput","input","$hasIcon","StyledMotionRightInputIconWrapper"],"sources":["../../../../../src/components/accordion/accordion-head/AccordionHead.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type {\n FramerMotionBugFix,\n WithTheme,\n} from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledMotionAccordionHeadProps = WithTheme<unknown>;\n\nexport const StyledMotionAccordionHead = styled(motion.div)<StyledMotionAccordionHeadProps>`\n align-items: center;\n color: ${({ theme }: StyledMotionAccordionHeadProps) => theme.text};\n display: flex;\n overflow: hidden;\n padding: 4px 0;\n`;\n\nexport const StyledMotionIconWrapper = styled(motion.div)<FramerMotionBugFix>`\n align-items: center;\n cursor: ${({ onClick }) => (typeof onClick === 'function' ? 'pointer' : 'default')};\n display: flex;\n flex: 0 0 auto;\n height: 25px;\n justify-content: center;\n width: 25px;\n`;\n\ntype StyledAccordionIconProps = WithTheme<{ $icon: string }>;\n\nexport const StyledAccordionIcon = styled.i<StyledAccordionIconProps>`\n align-items: center;\n justify-content: center;\n display: flex;\n color: ${({ theme }: StyledAccordionIconProps) => theme.headline};\n\n &:before {\n content: ${({ $icon }) => `\"\\\\${$icon}\"`};\n font-family: 'Font Awesome 6 Pro', Fontawesome !important;\n }\n`;\n\nexport const StyledMotionContentWrapper = styled(motion.div)<FramerMotionBugFix>`\n align-self: flex-start;\n cursor: ${({ onClick }) => (typeof onClick === 'function' ? 'pointer' : 'default')};\n display: flex;\n flex: 1 1 auto;\n height: 100%;\n overflow: hidden;\n margin-right: 10px;\n`;\n\nexport const StyledMotionTitleWrapper = styled(motion.div)<FramerMotionBugFix>`\n display: grid;\n flex: 0 1 auto;\n grid-template-areas: 'header';\n`;\n\ninterface StyledMotionTitleProps {\n $isOpen: boolean;\n $isWrapped: boolean;\n}\n\nexport const StyledMotionTitle = styled(motion.div)<StyledMotionTitleProps>`\n font-size: ${({ $isOpen, $isWrapped }) => ($isOpen && !$isWrapped ? '1.3rem' : undefined)};\n font-weight: ${({ $isOpen, $isWrapped }) => ($isOpen && $isWrapped ? 700 : 'normal')};\n grid-area: header;\n height: ${({ $isWrapped }) => ($isWrapped ? '100%' : undefined)};\n overflow: hidden;\n text-overflow: ellipsis;\n transform-origin: top left;\n user-select: none;\n white-space: ${({ $isOpen, $isWrapped }) => ($isOpen && !$isWrapped ? 'normal' : 'nowrap')};\n\n ${({ $isWrapped }) =>\n $isWrapped &&\n css`\n align-items: center;\n display: flex;\n `}\n`;\n\nexport const StyledMotionTitleElementWrapper = styled(motion.div)<FramerMotionBugFix>`\n align-items: center;\n display: flex;\n margin-left: 8px;\n`;\n\nexport const StyledRightWrapper = styled.div`\n display: grid;\n flex: 0 0 auto;\n grid-template-areas: 'right';\n margin-right: 5px;\n overflow: hidden;\n position: relative;\n`;\n\nexport const StyledMotionRightElementWrapper = styled(motion.div)<FramerMotionBugFix>`\n align-items: center;\n display: flex;\n grid-area: header;\n justify-content: flex-end;\n`;\n\ntype StyledMotionRightInputProps = WithTheme<{\n $hasIcon: boolean;\n}>;\n\nexport const StyledMotionRightInput = styled(motion.input)<StyledMotionRightInputProps>`\n background-color: transparent;\n border: 1px solid transparent;\n border-bottom-color: rgba(\n ${({ theme }: StyledMotionRightInputProps) => theme['headline-rgb']},\n 0.45\n );\n color: ${({ theme }: StyledMotionRightInputProps) => theme.text};\n grid-area: header;\n padding: ${({ $hasIcon }) => ($hasIcon ? '5px 23px 5px 1px' : '5px 1px')};\n`;\n\nexport const StyledMotionRightInputIconWrapper = styled(motion.div)<FramerMotionBugFix>`\n align-items: center;\n display: flex;\n height: 100%;\n justify-content: center;\n position: absolute;\n right: 4px;\n top: 0;\n`;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"AccordionHead.styles.js","names":["_framerMotion","require","_styledComponents","_interopRequireWildcard","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","StyledMotionAccordionHead","exports","styled","motion","div","theme","text","StyledMotionIconWrapper","onClick","StyledAccordionIcon","headline","$icon","StyledMotionContentWrapper","StyledMotionTitleWrapper","StyledMotionTitle","$isOpen","$isWrapped","undefined","css","StyledMotionTitleElementWrapper","StyledRightWrapper","StyledMotionRightElementWrapper","StyledMotionRightInput","input","$hasIcon","StyledMotionRightInputIconWrapper"],"sources":["../../../../../src/components/accordion/accordion-head/AccordionHead.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type {\n FramerMotionBugFix,\n WithTheme,\n} from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledMotionAccordionHeadProps = WithTheme<unknown>;\n\nexport const StyledMotionAccordionHead = styled(motion.div)<StyledMotionAccordionHeadProps>`\n align-items: center;\n color: ${({ theme }: StyledMotionAccordionHeadProps) => theme.text};\n display: flex;\n overflow: hidden;\n padding: 4px 0;\n`;\n\nexport const StyledMotionIconWrapper = styled(motion.div)<FramerMotionBugFix>`\n align-items: center;\n cursor: ${({ onClick }) => (typeof onClick === 'function' ? 'pointer' : 'default')};\n display: flex;\n flex: 0 0 auto;\n height: 25px;\n justify-content: center;\n width: 25px;\n`;\n\ntype StyledAccordionIconProps = WithTheme<{ $icon: string }>;\n\nexport const StyledAccordionIcon = styled.i<StyledAccordionIconProps>`\n align-items: center;\n justify-content: center;\n display: flex;\n color: ${({ theme }: StyledAccordionIconProps) => theme.headline};\n\n &:before {\n content: ${({ $icon }) => `\"\\\\${$icon}\"`};\n font-family: 'Font Awesome 6 Pro', Fontawesome !important;\n }\n`;\n\nexport const StyledMotionContentWrapper = styled(motion.div)<FramerMotionBugFix>`\n align-self: flex-start;\n cursor: ${({ onClick }) => (typeof onClick === 'function' ? 'pointer' : 'default')};\n display: flex;\n flex: 1 1 auto;\n height: 100%;\n overflow: hidden;\n margin-right: 10px;\n`;\n\nexport const StyledMotionTitleWrapper = styled(motion.div)<FramerMotionBugFix>`\n display: grid;\n flex: 0 1 auto;\n grid-template-areas: 'header';\n`;\n\ninterface StyledMotionTitleProps {\n $isOpen: boolean;\n $isWrapped: boolean;\n}\n\nexport const StyledMotionTitle = styled(motion.div)<StyledMotionTitleProps>`\n font-size: ${({ $isOpen, $isWrapped }) => ($isOpen && !$isWrapped ? '1.3rem' : undefined)};\n font-weight: ${({ $isOpen, $isWrapped }) => ($isOpen && $isWrapped ? 700 : 'normal')};\n grid-area: header;\n height: ${({ $isWrapped }) => ($isWrapped ? '100%' : undefined)};\n overflow: hidden;\n text-overflow: ellipsis;\n transform-origin: top left;\n user-select: none;\n white-space: ${({ $isOpen, $isWrapped }) => ($isOpen && !$isWrapped ? 'normal' : 'nowrap')};\n\n ${({ $isWrapped }) =>\n $isWrapped &&\n css`\n align-content: center;\n `}\n`;\n\nexport const StyledMotionTitleElementWrapper = styled(motion.div)<FramerMotionBugFix>`\n align-items: center;\n display: flex;\n margin-left: 8px;\n`;\n\nexport const StyledRightWrapper = styled.div`\n display: grid;\n flex: 0 0 auto;\n grid-template-areas: 'right';\n margin-right: 5px;\n overflow: hidden;\n position: relative;\n`;\n\nexport const StyledMotionRightElementWrapper = styled(motion.div)<FramerMotionBugFix>`\n align-items: center;\n display: flex;\n grid-area: header;\n justify-content: flex-end;\n`;\n\ntype StyledMotionRightInputProps = WithTheme<{\n $hasIcon: boolean;\n}>;\n\nexport const StyledMotionRightInput = styled(motion.input)<StyledMotionRightInputProps>`\n background-color: transparent;\n border: 1px solid transparent;\n border-bottom-color: rgba(\n ${({ theme }: StyledMotionRightInputProps) => theme['headline-rgb']},\n 0.45\n );\n color: ${({ theme }: StyledMotionRightInputProps) => theme.text};\n grid-area: header;\n padding: ${({ $hasIcon }) => ($hasIcon ? '5px 23px 5px 1px' : '5px 1px')};\n`;\n\nexport const StyledMotionRightInputIconWrapper = styled(motion.div)<FramerMotionBugFix>`\n align-items: center;\n display: flex;\n height: 100%;\n justify-content: center;\n position: absolute;\n right: 4px;\n top: 0;\n`;\n"],"mappings":"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","ignoreList":[]}
@@ -20,10 +20,11 @@ const getAccordionHeadHeight = ({
20
20
  const closedHeight = Math.max(element.clientHeight + 8, isWrapped ? 40 : 33);
21
21
  if (isWrapped) {
22
22
  element.style.fontWeight = 'bold';
23
+ element.style.whiteSpace = 'nowrap';
23
24
  } else {
24
25
  element.style.fontSize = '1.3rem';
26
+ element.style.whiteSpace = 'normal';
25
27
  }
26
- element.style.whiteSpace = 'normal';
27
28
  const openHeight = Math.max(element.clientHeight + 8, isWrapped ? 40 : 33);
28
29
  document.body.removeChild(element);
29
30
  return {
@@ -1 +1 @@
1
- {"version":3,"file":"accordion.js","names":["getAccordionHeadHeight","isWrapped","title","width","element","document","createElement","style","fontSize","opacity","pointerEvents","whiteSpace","innerText","body","appendChild","closedHeight","Math","max","clientHeight","fontWeight","openHeight","removeChild","closed","open","exports"],"sources":["../../../src/utils/accordion.ts"],"sourcesContent":["interface GetAccordionHeadHeightOptions {\n isWrapped?: boolean;\n title: string;\n width: number;\n}\n\ninterface GetAccordionHeadHeightResult {\n closed: number;\n open: number;\n}\n\nexport const getAccordionHeadHeight = ({\n isWrapped,\n title,\n width,\n}: GetAccordionHeadHeightOptions): GetAccordionHeadHeightResult => {\n const element = document.createElement('div');\n\n element.style.fontSize = '1rem';\n element.style.opacity = '0';\n element.style.pointerEvents = 'none';\n element.style.whiteSpace = 'nowrap';\n element.style.width = `${width}px`;\n\n element.innerText = title;\n\n document.body.appendChild(element);\n\n const closedHeight = Math.max(element.clientHeight + 8, isWrapped ? 40 : 33);\n\n if (isWrapped) {\n element.style.fontWeight = 'bold';\n } else {\n element.style.fontSize = '1.3rem';\n }\n\n element.style.whiteSpace = 'normal';\n\n const openHeight = Math.max(element.clientHeight + 8, isWrapped ? 40 : 33);\n\n document.body.removeChild(element);\n\n return { closed: closedHeight, open: openHeight };\n};\n"],"mappings":";;;;;;AAWO,MAAMA,sBAAsB,GAAGA,CAAC;EACnCC,SAAS;EACTC,KAAK;EACLC;AAC2B,CAAC,KAAmC;EAC/D,MAAMC,OAAO,GAAGC,QAAQ,CAACC,aAAa,CAAC,KAAK,CAAC;EAE7CF,OAAO,CAACG,KAAK,CAACC,QAAQ,GAAG,MAAM;EAC/BJ,OAAO,CAACG,KAAK,CAACE,OAAO,GAAG,GAAG;EAC3BL,OAAO,CAACG,KAAK,CAACG,aAAa,GAAG,MAAM;EACpCN,OAAO,CAACG,KAAK,CAACI,UAAU,GAAG,QAAQ;EACnCP,OAAO,CAACG,KAAK,CAACJ,KAAK,GAAI,GAAEA,KAAM,IAAG;EAElCC,OAAO,CAACQ,SAAS,GAAGV,KAAK;EAEzBG,QAAQ,CAACQ,IAAI,CAACC,WAAW,CAACV,OAAO,CAAC;EAElC,MAAMW,YAAY,GAAGC,IAAI,CAACC,GAAG,CAACb,OAAO,CAACc,YAAY,GAAG,CAAC,EAAEjB,SAAS,GAAG,EAAE,GAAG,EAAE,CAAC;EAE5E,IAAIA,SAAS,EAAE;IACXG,OAAO,CAACG,KAAK,CAACY,UAAU,GAAG,MAAM;EACrC,CAAC,MAAM;IACHf,OAAO,CAACG,KAAK,CAACC,QAAQ,GAAG,QAAQ;EACrC;EAEAJ,OAAO,CAACG,KAAK,CAACI,UAAU,GAAG,QAAQ;EAEnC,MAAMS,UAAU,GAAGJ,IAAI,CAACC,GAAG,CAACb,OAAO,CAACc,YAAY,GAAG,CAAC,EAAEjB,SAAS,GAAG,EAAE,GAAG,EAAE,CAAC;EAE1EI,QAAQ,CAACQ,IAAI,CAACQ,WAAW,CAACjB,OAAO,CAAC;EAElC,OAAO;IAAEkB,MAAM,EAAEP,YAAY;IAAEQ,IAAI,EAAEH;EAAW,CAAC;AACrD,CAAC;AAACI,OAAA,CAAAxB,sBAAA,GAAAA,sBAAA","ignoreList":[]}
1
+ {"version":3,"file":"accordion.js","names":["getAccordionHeadHeight","isWrapped","title","width","element","document","createElement","style","fontSize","opacity","pointerEvents","whiteSpace","innerText","body","appendChild","closedHeight","Math","max","clientHeight","fontWeight","openHeight","removeChild","closed","open","exports"],"sources":["../../../src/utils/accordion.ts"],"sourcesContent":["interface GetAccordionHeadHeightOptions {\n isWrapped?: boolean;\n title: string;\n width: number;\n}\n\ninterface GetAccordionHeadHeightResult {\n closed: number;\n open: number;\n}\n\nexport const getAccordionHeadHeight = ({\n isWrapped,\n title,\n width,\n}: GetAccordionHeadHeightOptions): GetAccordionHeadHeightResult => {\n const element = document.createElement('div');\n\n element.style.fontSize = '1rem';\n element.style.opacity = '0';\n element.style.pointerEvents = 'none';\n element.style.whiteSpace = 'nowrap';\n element.style.width = `${width}px`;\n\n element.innerText = title;\n\n document.body.appendChild(element);\n\n const closedHeight = Math.max(element.clientHeight + 8, isWrapped ? 40 : 33);\n\n if (isWrapped) {\n element.style.fontWeight = 'bold';\n element.style.whiteSpace = 'nowrap';\n } else {\n element.style.fontSize = '1.3rem';\n element.style.whiteSpace = 'normal';\n }\n\n const openHeight = Math.max(element.clientHeight + 8, isWrapped ? 40 : 33);\n\n document.body.removeChild(element);\n\n return { closed: closedHeight, open: openHeight };\n};\n"],"mappings":";;;;;;AAWO,MAAMA,sBAAsB,GAAGA,CAAC;EACnCC,SAAS;EACTC,KAAK;EACLC;AAC2B,CAAC,KAAmC;EAC/D,MAAMC,OAAO,GAAGC,QAAQ,CAACC,aAAa,CAAC,KAAK,CAAC;EAE7CF,OAAO,CAACG,KAAK,CAACC,QAAQ,GAAG,MAAM;EAC/BJ,OAAO,CAACG,KAAK,CAACE,OAAO,GAAG,GAAG;EAC3BL,OAAO,CAACG,KAAK,CAACG,aAAa,GAAG,MAAM;EACpCN,OAAO,CAACG,KAAK,CAACI,UAAU,GAAG,QAAQ;EACnCP,OAAO,CAACG,KAAK,CAACJ,KAAK,GAAI,GAAEA,KAAM,IAAG;EAElCC,OAAO,CAACQ,SAAS,GAAGV,KAAK;EAEzBG,QAAQ,CAACQ,IAAI,CAACC,WAAW,CAACV,OAAO,CAAC;EAElC,MAAMW,YAAY,GAAGC,IAAI,CAACC,GAAG,CAACb,OAAO,CAACc,YAAY,GAAG,CAAC,EAAEjB,SAAS,GAAG,EAAE,GAAG,EAAE,CAAC;EAE5E,IAAIA,SAAS,EAAE;IACXG,OAAO,CAACG,KAAK,CAACY,UAAU,GAAG,MAAM;IACjCf,OAAO,CAACG,KAAK,CAACI,UAAU,GAAG,QAAQ;EACvC,CAAC,MAAM;IACHP,OAAO,CAACG,KAAK,CAACC,QAAQ,GAAG,QAAQ;IACjCJ,OAAO,CAACG,KAAK,CAACI,UAAU,GAAG,QAAQ;EACvC;EAEA,MAAMS,UAAU,GAAGJ,IAAI,CAACC,GAAG,CAACb,OAAO,CAACc,YAAY,GAAG,CAAC,EAAEjB,SAAS,GAAG,EAAE,GAAG,EAAE,CAAC;EAE1EI,QAAQ,CAACQ,IAAI,CAACQ,WAAW,CAACjB,OAAO,CAAC;EAElC,OAAO;IAAEkB,MAAM,EAAEP,YAAY;IAAEQ,IAAI,EAAEH;EAAW,CAAC;AACrD,CAAC;AAACI,OAAA,CAAAxB,sBAAA,GAAAA,sBAAA","ignoreList":[]}
@@ -79,8 +79,16 @@ const AccordionHead = _ref => {
79
79
  initial: {
80
80
  scale: isOpen && !isWrapped ? 1 / 1.3 : 1.3
81
81
  },
82
+ exit: {
83
+ opacity: 0
84
+ },
82
85
  $isOpen: isOpen,
83
86
  $isWrapped: isWrapped,
87
+ transition: {
88
+ opacity: {
89
+ duration: 0
90
+ }
91
+ },
84
92
  key: isOpen && !isWrapped ? 'accordionHeadTitleBig' : 'accordionHeadTitle'
85
93
  }, title))), titleElement && /*#__PURE__*/React.createElement(StyledMotionTitleElementWrapper, {
86
94
  layout: true
@@ -1 +1 @@
1
- {"version":3,"file":"AccordionHead.js","names":["AnimatePresence","LayoutGroup","React","useEffect","useMemo","useRef","useState","useTheme","getAccordionHeadHeight","Icon","StyledAccordionIcon","StyledMotionAccordionHead","StyledMotionContentWrapper","StyledMotionIconWrapper","StyledMotionRightElementWrapper","StyledMotionRightInput","StyledMotionRightInputIconWrapper","StyledMotionTitle","StyledMotionTitleElementWrapper","StyledMotionTitleWrapper","StyledRightWrapper","AccordionHead","_ref","icon","isOpen","isFixed","isTitleGreyed","isWrapped","onClick","onSearchChange","rightElement","searchIcon","searchPlaceholder","searchValue","shouldRotateIcon","title","titleElement","headHeight","setHeadHeight","closed","open","theme","titleWrapperRef","hasSearchIcon","Array","isArray","width","current","clientWidth","iconElement","createElement","icons","internalIcon","accordionIcon","toString","internalIconStyle","iconStyle","className","$icon","animate","height","initial","rotate","undefined","opacity","ref","scale","$isOpen","$isWrapped","key","layout","Fragment","autoComplete","exit","$hasIcon","onChange","placeholder","type","value","displayName"],"sources":["../../../../../src/components/accordion/accordion-head/AccordionHead.tsx"],"sourcesContent":["import { AnimatePresence, LayoutGroup } from 'framer-motion';\nimport React, {\n ChangeEventHandler,\n FC,\n MouseEventHandler,\n ReactNode,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { useTheme } from 'styled-components';\nimport { getAccordionHeadHeight } from '../../../utils/accordion';\nimport Icon from '../../icon/Icon';\nimport {\n StyledAccordionIcon,\n StyledMotionAccordionHead,\n StyledMotionContentWrapper,\n StyledMotionIconWrapper,\n StyledMotionRightElementWrapper,\n StyledMotionRightInput,\n StyledMotionRightInputIconWrapper,\n StyledMotionTitle,\n StyledMotionTitleElementWrapper,\n StyledMotionTitleWrapper,\n StyledRightWrapper,\n} from './AccordionHead.styles';\n\ntype AccordionHeadProps = {\n icon?: string;\n isOpen: boolean;\n isFixed: boolean;\n isTitleGreyed: boolean;\n isWrapped: boolean;\n onClick: MouseEventHandler<HTMLDivElement>;\n onSearchChange?: ChangeEventHandler<HTMLInputElement>;\n rightElement?: ReactNode;\n searchIcon?: string[];\n searchPlaceholder?: string;\n searchValue?: string;\n shouldRotateIcon?: boolean;\n title: string;\n titleElement?: ReactNode;\n};\n\ninterface HeadHeight {\n closed: number;\n open: number;\n}\n\nconst AccordionHead: FC<AccordionHeadProps> = ({\n icon,\n isOpen,\n isFixed,\n isTitleGreyed,\n isWrapped,\n onClick,\n onSearchChange,\n rightElement,\n searchIcon,\n searchPlaceholder,\n searchValue,\n shouldRotateIcon,\n title,\n titleElement,\n}) => {\n const [headHeight, setHeadHeight] = useState<HeadHeight>({\n closed: isWrapped ? 40 : 33,\n open: isWrapped ? 40 : 33,\n });\n\n const theme = useTheme();\n\n const titleWrapperRef = useRef<HTMLDivElement>(null);\n\n const hasSearchIcon = Array.isArray(searchIcon);\n\n useEffect(() => {\n setHeadHeight(\n getAccordionHeadHeight({\n isWrapped,\n title,\n width: (titleWrapperRef.current?.clientWidth ?? 0) - 10,\n }),\n );\n }, [isWrapped, title]);\n\n const iconElement = useMemo(() => {\n if (icon || isFixed) {\n return (\n <Icon icons={[isFixed ? 'fa fa-horizontal-rule' : icon ?? 'fa fa-chevron-right']} />\n );\n }\n\n let internalIcon = 'f105';\n\n if (\n theme?.accordionIcon &&\n theme.accordionIcon !== 110 &&\n theme.accordionIcon !== 1110100\n ) {\n internalIcon = (theme.accordionIcon as number).toString(16);\n }\n\n const internalIconStyle = theme?.iconStyle ? (theme.iconStyle as string) : 'fa-regular';\n\n return <StyledAccordionIcon className={internalIconStyle} $icon={internalIcon} />;\n }, [icon, theme, isFixed]);\n\n return (\n <StyledMotionAccordionHead\n animate={{ height: isOpen ? headHeight.open : headHeight.closed }}\n className=\"beta-chayns-accordion-head\"\n initial={false}\n >\n <StyledMotionIconWrapper\n animate={{ rotate: (isOpen || isFixed) && shouldRotateIcon ? 90 : 0 }}\n initial={false}\n onClick={!isFixed ? onClick : undefined}\n >\n {iconElement}\n </StyledMotionIconWrapper>\n <StyledMotionContentWrapper\n animate={{ opacity: isTitleGreyed ? 0.5 : 1 }}\n initial={false}\n onClick={!isFixed ? onClick : undefined}\n ref={titleWrapperRef}\n >\n <LayoutGroup>\n <StyledMotionTitleWrapper>\n <AnimatePresence initial={false}>\n <StyledMotionTitle\n animate={{ scale: 1 }}\n initial={{ scale: isOpen && !isWrapped ? 1 / 1.3 : 1.3 }}\n $isOpen={isOpen}\n $isWrapped={isWrapped}\n key={\n isOpen && !isWrapped\n ? 'accordionHeadTitleBig'\n : 'accordionHeadTitle'\n }\n >\n {title}\n </StyledMotionTitle>\n </AnimatePresence>\n </StyledMotionTitleWrapper>\n {titleElement && (\n <StyledMotionTitleElementWrapper layout>\n {titleElement}\n </StyledMotionTitleElementWrapper>\n )}\n </LayoutGroup>\n </StyledMotionContentWrapper>\n {(typeof onSearchChange === 'function' || rightElement) && (\n <StyledRightWrapper>\n <AnimatePresence initial={false}>\n {typeof onSearchChange === 'function' && isOpen ? (\n <>\n <StyledMotionRightInput\n animate={{ opacity: 1, width: '165px' }}\n autoComplete=\"off\"\n exit={{ opacity: 0, width: 0 }}\n $hasIcon={hasSearchIcon}\n initial={{ opacity: 0, width: 0 }}\n key=\"rightInput\"\n onChange={onSearchChange}\n placeholder={searchPlaceholder}\n type=\"text\"\n value={searchValue}\n />\n {hasSearchIcon && (\n <StyledMotionRightInputIconWrapper\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n key=\"rightInputIcon\"\n >\n <Icon icons={searchIcon} />\n </StyledMotionRightInputIconWrapper>\n )}\n </>\n ) : (\n <StyledMotionRightElementWrapper\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n key=\"rightElementWrapper\"\n >\n {rightElement}\n </StyledMotionRightElementWrapper>\n )}\n </AnimatePresence>\n </StyledRightWrapper>\n )}\n </StyledMotionAccordionHead>\n );\n};\n\nAccordionHead.displayName = 'AccordionHead';\n\nexport default AccordionHead;\n"],"mappings":"AAAA,SAASA,eAAe,EAAEC,WAAW,QAAQ,eAAe;AAC5D,OAAOC,KAAK,IAKRC,SAAS,EACTC,OAAO,EACPC,MAAM,EACNC,QAAQ,QACL,OAAO;AACd,SAASC,QAAQ,QAAQ,mBAAmB;AAC5C,SAASC,sBAAsB,QAAQ,0BAA0B;AACjE,OAAOC,IAAI,MAAM,iBAAiB;AAClC,SACIC,mBAAmB,EACnBC,yBAAyB,EACzBC,0BAA0B,EAC1BC,uBAAuB,EACvBC,+BAA+B,EAC/BC,sBAAsB,EACtBC,iCAAiC,EACjCC,iBAAiB,EACjBC,+BAA+B,EAC/BC,wBAAwB,EACxBC,kBAAkB,QACf,wBAAwB;AAwB/B,MAAMC,aAAqC,GAAGC,IAAA,IAexC;EAAA,IAfyC;IAC3CC,IAAI;IACJC,MAAM;IACNC,OAAO;IACPC,aAAa;IACbC,SAAS;IACTC,OAAO;IACPC,cAAc;IACdC,YAAY;IACZC,UAAU;IACVC,iBAAiB;IACjBC,WAAW;IACXC,gBAAgB;IAChBC,KAAK;IACLC;EACJ,CAAC,GAAAd,IAAA;EACG,MAAM,CAACe,UAAU,EAAEC,aAAa,CAAC,GAAGhC,QAAQ,CAAa;IACrDiC,MAAM,EAAEZ,SAAS,GAAG,EAAE,GAAG,EAAE;IAC3Ba,IAAI,EAAEb,SAAS,GAAG,EAAE,GAAG;EAC3B,CAAC,CAAC;EAEF,MAAMc,KAAK,GAAGlC,QAAQ,CAAC,CAAC;EAExB,MAAMmC,eAAe,GAAGrC,MAAM,CAAiB,IAAI,CAAC;EAEpD,MAAMsC,aAAa,GAAGC,KAAK,CAACC,OAAO,CAACd,UAAU,CAAC;EAE/C5B,SAAS,CAAC,MAAM;IACZmC,aAAa,CACT9B,sBAAsB,CAAC;MACnBmB,SAAS;MACTQ,KAAK;MACLW,KAAK,EAAE,CAACJ,eAAe,CAACK,OAAO,EAAEC,WAAW,IAAI,CAAC,IAAI;IACzD,CAAC,CACL,CAAC;EACL,CAAC,EAAE,CAACrB,SAAS,EAAEQ,KAAK,CAAC,CAAC;EAEtB,MAAMc,WAAW,GAAG7C,OAAO,CAAC,MAAM;IAC9B,IAAImB,IAAI,IAAIE,OAAO,EAAE;MACjB,oBACIvB,KAAA,CAAAgD,aAAA,CAACzC,IAAI;QAAC0C,KAAK,EAAE,CAAC1B,OAAO,GAAG,uBAAuB,GAAGF,IAAI,IAAI,qBAAqB;MAAE,CAAE,CAAC;IAE5F;IAEA,IAAI6B,YAAY,GAAG,MAAM;IAEzB,IACIX,KAAK,EAAEY,aAAa,IACpBZ,KAAK,CAACY,aAAa,KAAK,GAAG,IAC3BZ,KAAK,CAACY,aAAa,KAAK,OAAO,EACjC;MACED,YAAY,GAAIX,KAAK,CAACY,aAAa,CAAYC,QAAQ,CAAC,EAAE,CAAC;IAC/D;IAEA,MAAMC,iBAAiB,GAAGd,KAAK,EAAEe,SAAS,GAAIf,KAAK,CAACe,SAAS,GAAc,YAAY;IAEvF,oBAAOtD,KAAA,CAAAgD,aAAA,CAACxC,mBAAmB;MAAC+C,SAAS,EAAEF,iBAAkB;MAACG,KAAK,EAAEN;IAAa,CAAE,CAAC;EACrF,CAAC,EAAE,CAAC7B,IAAI,EAAEkB,KAAK,EAAEhB,OAAO,CAAC,CAAC;EAE1B,oBACIvB,KAAA,CAAAgD,aAAA,CAACvC,yBAAyB;IACtBgD,OAAO,EAAE;MAAEC,MAAM,EAAEpC,MAAM,GAAGa,UAAU,CAACG,IAAI,GAAGH,UAAU,CAACE;IAAO,CAAE;IAClEkB,SAAS,EAAC,4BAA4B;IACtCI,OAAO,EAAE;EAAM,gBAEf3D,KAAA,CAAAgD,aAAA,CAACrC,uBAAuB;IACpB8C,OAAO,EAAE;MAAEG,MAAM,EAAE,CAACtC,MAAM,IAAIC,OAAO,KAAKS,gBAAgB,GAAG,EAAE,GAAG;IAAE,CAAE;IACtE2B,OAAO,EAAE,KAAM;IACfjC,OAAO,EAAE,CAACH,OAAO,GAAGG,OAAO,GAAGmC;EAAU,GAEvCd,WACoB,CAAC,eAC1B/C,KAAA,CAAAgD,aAAA,CAACtC,0BAA0B;IACvB+C,OAAO,EAAE;MAAEK,OAAO,EAAEtC,aAAa,GAAG,GAAG,GAAG;IAAE,CAAE;IAC9CmC,OAAO,EAAE,KAAM;IACfjC,OAAO,EAAE,CAACH,OAAO,GAAGG,OAAO,GAAGmC,SAAU;IACxCE,GAAG,EAAEvB;EAAgB,gBAErBxC,KAAA,CAAAgD,aAAA,CAACjD,WAAW,qBACRC,KAAA,CAAAgD,aAAA,CAAC/B,wBAAwB,qBACrBjB,KAAA,CAAAgD,aAAA,CAAClD,eAAe;IAAC6D,OAAO,EAAE;EAAM,gBAC5B3D,KAAA,CAAAgD,aAAA,CAACjC,iBAAiB;IACd0C,OAAO,EAAE;MAAEO,KAAK,EAAE;IAAE,CAAE;IACtBL,OAAO,EAAE;MAAEK,KAAK,EAAE1C,MAAM,IAAI,CAACG,SAAS,GAAG,CAAC,GAAG,GAAG,GAAG;IAAI,CAAE;IACzDwC,OAAO,EAAE3C,MAAO;IAChB4C,UAAU,EAAEzC,SAAU;IACtB0C,GAAG,EACC7C,MAAM,IAAI,CAACG,SAAS,GACd,uBAAuB,GACvB;EACT,GAEAQ,KACc,CACN,CACK,CAAC,EAC1BC,YAAY,iBACTlC,KAAA,CAAAgD,aAAA,CAAChC,+BAA+B;IAACoD,MAAM;EAAA,GAClClC,YAC4B,CAE5B,CACW,CAAC,EAC5B,CAAC,OAAOP,cAAc,KAAK,UAAU,IAAIC,YAAY,kBAClD5B,KAAA,CAAAgD,aAAA,CAAC9B,kBAAkB,qBACflB,KAAA,CAAAgD,aAAA,CAAClD,eAAe;IAAC6D,OAAO,EAAE;EAAM,GAC3B,OAAOhC,cAAc,KAAK,UAAU,IAAIL,MAAM,gBAC3CtB,KAAA,CAAAgD,aAAA,CAAAhD,KAAA,CAAAqE,QAAA,qBACIrE,KAAA,CAAAgD,aAAA,CAACnC,sBAAsB;IACnB4C,OAAO,EAAE;MAAEK,OAAO,EAAE,CAAC;MAAElB,KAAK,EAAE;IAAQ,CAAE;IACxC0B,YAAY,EAAC,KAAK;IAClBC,IAAI,EAAE;MAAET,OAAO,EAAE,CAAC;MAAElB,KAAK,EAAE;IAAE,CAAE;IAC/B4B,QAAQ,EAAE/B,aAAc;IACxBkB,OAAO,EAAE;MAAEG,OAAO,EAAE,CAAC;MAAElB,KAAK,EAAE;IAAE,CAAE;IAClCuB,GAAG,EAAC,YAAY;IAChBM,QAAQ,EAAE9C,cAAe;IACzB+C,WAAW,EAAE5C,iBAAkB;IAC/B6C,IAAI,EAAC,MAAM;IACXC,KAAK,EAAE7C;EAAY,CACtB,CAAC,EACDU,aAAa,iBACVzC,KAAA,CAAAgD,aAAA,CAAClC,iCAAiC;IAC9B2C,OAAO,EAAE;MAAEK,OAAO,EAAE;IAAE,CAAE;IACxBS,IAAI,EAAE;MAAET,OAAO,EAAE;IAAE,CAAE;IACrBH,OAAO,EAAE;MAAEG,OAAO,EAAE;IAAE,CAAE;IACxBK,GAAG,EAAC;EAAgB,gBAEpBnE,KAAA,CAAAgD,aAAA,CAACzC,IAAI;IAAC0C,KAAK,EAAEpB;EAAW,CAAE,CACK,CAEzC,CAAC,gBAEH7B,KAAA,CAAAgD,aAAA,CAACpC,+BAA+B;IAC5B6C,OAAO,EAAE;MAAEK,OAAO,EAAE;IAAE,CAAE;IACxBS,IAAI,EAAE;MAAET,OAAO,EAAE;IAAE,CAAE;IACrBH,OAAO,EAAE;MAAEG,OAAO,EAAE;IAAE,CAAE;IACxBK,GAAG,EAAC;EAAqB,GAExBvC,YAC4B,CAExB,CACD,CAED,CAAC;AAEpC,CAAC;AAEDT,aAAa,CAAC0D,WAAW,GAAG,eAAe;AAE3C,eAAe1D,aAAa","ignoreList":[]}
1
+ {"version":3,"file":"AccordionHead.js","names":["AnimatePresence","LayoutGroup","React","useEffect","useMemo","useRef","useState","useTheme","getAccordionHeadHeight","Icon","StyledAccordionIcon","StyledMotionAccordionHead","StyledMotionContentWrapper","StyledMotionIconWrapper","StyledMotionRightElementWrapper","StyledMotionRightInput","StyledMotionRightInputIconWrapper","StyledMotionTitle","StyledMotionTitleElementWrapper","StyledMotionTitleWrapper","StyledRightWrapper","AccordionHead","_ref","icon","isOpen","isFixed","isTitleGreyed","isWrapped","onClick","onSearchChange","rightElement","searchIcon","searchPlaceholder","searchValue","shouldRotateIcon","title","titleElement","headHeight","setHeadHeight","closed","open","theme","titleWrapperRef","hasSearchIcon","Array","isArray","width","current","clientWidth","iconElement","createElement","icons","internalIcon","accordionIcon","toString","internalIconStyle","iconStyle","className","$icon","animate","height","initial","rotate","undefined","opacity","ref","scale","exit","$isOpen","$isWrapped","transition","duration","key","layout","Fragment","autoComplete","$hasIcon","onChange","placeholder","type","value","displayName"],"sources":["../../../../../src/components/accordion/accordion-head/AccordionHead.tsx"],"sourcesContent":["import { AnimatePresence, LayoutGroup } from 'framer-motion';\nimport React, {\n ChangeEventHandler,\n FC,\n MouseEventHandler,\n ReactNode,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { useTheme } from 'styled-components';\nimport { getAccordionHeadHeight } from '../../../utils/accordion';\nimport Icon from '../../icon/Icon';\nimport {\n StyledAccordionIcon,\n StyledMotionAccordionHead,\n StyledMotionContentWrapper,\n StyledMotionIconWrapper,\n StyledMotionRightElementWrapper,\n StyledMotionRightInput,\n StyledMotionRightInputIconWrapper,\n StyledMotionTitle,\n StyledMotionTitleElementWrapper,\n StyledMotionTitleWrapper,\n StyledRightWrapper,\n} from './AccordionHead.styles';\n\ntype AccordionHeadProps = {\n icon?: string;\n isOpen: boolean;\n isFixed: boolean;\n isTitleGreyed: boolean;\n isWrapped: boolean;\n onClick: MouseEventHandler<HTMLDivElement>;\n onSearchChange?: ChangeEventHandler<HTMLInputElement>;\n rightElement?: ReactNode;\n searchIcon?: string[];\n searchPlaceholder?: string;\n searchValue?: string;\n shouldRotateIcon?: boolean;\n title: string;\n titleElement?: ReactNode;\n};\n\ninterface HeadHeight {\n closed: number;\n open: number;\n}\n\nconst AccordionHead: FC<AccordionHeadProps> = ({\n icon,\n isOpen,\n isFixed,\n isTitleGreyed,\n isWrapped,\n onClick,\n onSearchChange,\n rightElement,\n searchIcon,\n searchPlaceholder,\n searchValue,\n shouldRotateIcon,\n title,\n titleElement,\n}) => {\n const [headHeight, setHeadHeight] = useState<HeadHeight>({\n closed: isWrapped ? 40 : 33,\n open: isWrapped ? 40 : 33,\n });\n\n const theme = useTheme();\n\n const titleWrapperRef = useRef<HTMLDivElement>(null);\n\n const hasSearchIcon = Array.isArray(searchIcon);\n\n useEffect(() => {\n setHeadHeight(\n getAccordionHeadHeight({\n isWrapped,\n title,\n width: (titleWrapperRef.current?.clientWidth ?? 0) - 10,\n }),\n );\n }, [isWrapped, title]);\n\n const iconElement = useMemo(() => {\n if (icon || isFixed) {\n return (\n <Icon icons={[isFixed ? 'fa fa-horizontal-rule' : icon ?? 'fa fa-chevron-right']} />\n );\n }\n\n let internalIcon = 'f105';\n\n if (\n theme?.accordionIcon &&\n theme.accordionIcon !== 110 &&\n theme.accordionIcon !== 1110100\n ) {\n internalIcon = (theme.accordionIcon as number).toString(16);\n }\n\n const internalIconStyle = theme?.iconStyle ? (theme.iconStyle as string) : 'fa-regular';\n\n return <StyledAccordionIcon className={internalIconStyle} $icon={internalIcon} />;\n }, [icon, theme, isFixed]);\n\n return (\n <StyledMotionAccordionHead\n animate={{ height: isOpen ? headHeight.open : headHeight.closed }}\n className=\"beta-chayns-accordion-head\"\n initial={false}\n >\n <StyledMotionIconWrapper\n animate={{ rotate: (isOpen || isFixed) && shouldRotateIcon ? 90 : 0 }}\n initial={false}\n onClick={!isFixed ? onClick : undefined}\n >\n {iconElement}\n </StyledMotionIconWrapper>\n <StyledMotionContentWrapper\n animate={{ opacity: isTitleGreyed ? 0.5 : 1 }}\n initial={false}\n onClick={!isFixed ? onClick : undefined}\n ref={titleWrapperRef}\n >\n <LayoutGroup>\n <StyledMotionTitleWrapper>\n <AnimatePresence initial={false}>\n <StyledMotionTitle\n animate={{ scale: 1 }}\n initial={{ scale: isOpen && !isWrapped ? 1 / 1.3 : 1.3 }}\n exit={{ opacity: 0 }}\n $isOpen={isOpen}\n $isWrapped={isWrapped}\n transition={{\n opacity: {\n duration: 0,\n },\n }}\n key={\n isOpen && !isWrapped\n ? 'accordionHeadTitleBig'\n : 'accordionHeadTitle'\n }\n >\n {title}\n </StyledMotionTitle>\n </AnimatePresence>\n </StyledMotionTitleWrapper>\n {titleElement && (\n <StyledMotionTitleElementWrapper layout>\n {titleElement}\n </StyledMotionTitleElementWrapper>\n )}\n </LayoutGroup>\n </StyledMotionContentWrapper>\n {(typeof onSearchChange === 'function' || rightElement) && (\n <StyledRightWrapper>\n <AnimatePresence initial={false}>\n {typeof onSearchChange === 'function' && isOpen ? (\n <>\n <StyledMotionRightInput\n animate={{ opacity: 1, width: '165px' }}\n autoComplete=\"off\"\n exit={{ opacity: 0, width: 0 }}\n $hasIcon={hasSearchIcon}\n initial={{ opacity: 0, width: 0 }}\n key=\"rightInput\"\n onChange={onSearchChange}\n placeholder={searchPlaceholder}\n type=\"text\"\n value={searchValue}\n />\n {hasSearchIcon && (\n <StyledMotionRightInputIconWrapper\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n key=\"rightInputIcon\"\n >\n <Icon icons={searchIcon} />\n </StyledMotionRightInputIconWrapper>\n )}\n </>\n ) : (\n <StyledMotionRightElementWrapper\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n key=\"rightElementWrapper\"\n >\n {rightElement}\n </StyledMotionRightElementWrapper>\n )}\n </AnimatePresence>\n </StyledRightWrapper>\n )}\n </StyledMotionAccordionHead>\n );\n};\n\nAccordionHead.displayName = 'AccordionHead';\n\nexport default AccordionHead;\n"],"mappings":"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","ignoreList":[]}
@@ -105,8 +105,7 @@ export const StyledMotionTitle = styled(motion.div)`
105
105
  $isWrapped
106
106
  } = _ref10;
107
107
  return $isWrapped && css`
108
- align-items: center;
109
- display: flex;
108
+ align-content: center;
110
109
  `;
111
110
  }}
112
111
  `;
@@ -1 +1 @@
1
- {"version":3,"file":"AccordionHead.styles.js","names":["motion","styled","css","StyledMotionAccordionHead","div","_ref","theme","text","StyledMotionIconWrapper","_ref2","onClick","StyledAccordionIcon","i","_ref3","headline","_ref4","$icon","StyledMotionContentWrapper","_ref5","StyledMotionTitleWrapper","StyledMotionTitle","_ref6","$isOpen","$isWrapped","undefined","_ref7","_ref8","_ref9","_ref10","StyledMotionTitleElementWrapper","StyledRightWrapper","StyledMotionRightElementWrapper","StyledMotionRightInput","input","_ref11","_ref12","_ref13","$hasIcon","StyledMotionRightInputIconWrapper"],"sources":["../../../../../src/components/accordion/accordion-head/AccordionHead.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type {\n FramerMotionBugFix,\n WithTheme,\n} from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledMotionAccordionHeadProps = WithTheme<unknown>;\n\nexport const StyledMotionAccordionHead = styled(motion.div)<StyledMotionAccordionHeadProps>`\n align-items: center;\n color: ${({ theme }: StyledMotionAccordionHeadProps) => theme.text};\n display: flex;\n overflow: hidden;\n padding: 4px 0;\n`;\n\nexport const StyledMotionIconWrapper = styled(motion.div)<FramerMotionBugFix>`\n align-items: center;\n cursor: ${({ onClick }) => (typeof onClick === 'function' ? 'pointer' : 'default')};\n display: flex;\n flex: 0 0 auto;\n height: 25px;\n justify-content: center;\n width: 25px;\n`;\n\ntype StyledAccordionIconProps = WithTheme<{ $icon: string }>;\n\nexport const StyledAccordionIcon = styled.i<StyledAccordionIconProps>`\n align-items: center;\n justify-content: center;\n display: flex;\n color: ${({ theme }: StyledAccordionIconProps) => theme.headline};\n\n &:before {\n content: ${({ $icon }) => `\"\\\\${$icon}\"`};\n font-family: 'Font Awesome 6 Pro', Fontawesome !important;\n }\n`;\n\nexport const StyledMotionContentWrapper = styled(motion.div)<FramerMotionBugFix>`\n align-self: flex-start;\n cursor: ${({ onClick }) => (typeof onClick === 'function' ? 'pointer' : 'default')};\n display: flex;\n flex: 1 1 auto;\n height: 100%;\n overflow: hidden;\n margin-right: 10px;\n`;\n\nexport const StyledMotionTitleWrapper = styled(motion.div)<FramerMotionBugFix>`\n display: grid;\n flex: 0 1 auto;\n grid-template-areas: 'header';\n`;\n\ninterface StyledMotionTitleProps {\n $isOpen: boolean;\n $isWrapped: boolean;\n}\n\nexport const StyledMotionTitle = styled(motion.div)<StyledMotionTitleProps>`\n font-size: ${({ $isOpen, $isWrapped }) => ($isOpen && !$isWrapped ? '1.3rem' : undefined)};\n font-weight: ${({ $isOpen, $isWrapped }) => ($isOpen && $isWrapped ? 700 : 'normal')};\n grid-area: header;\n height: ${({ $isWrapped }) => ($isWrapped ? '100%' : undefined)};\n overflow: hidden;\n text-overflow: ellipsis;\n transform-origin: top left;\n user-select: none;\n white-space: ${({ $isOpen, $isWrapped }) => ($isOpen && !$isWrapped ? 'normal' : 'nowrap')};\n\n ${({ $isWrapped }) =>\n $isWrapped &&\n css`\n align-items: center;\n display: flex;\n `}\n`;\n\nexport const StyledMotionTitleElementWrapper = styled(motion.div)<FramerMotionBugFix>`\n align-items: center;\n display: flex;\n margin-left: 8px;\n`;\n\nexport const StyledRightWrapper = styled.div`\n display: grid;\n flex: 0 0 auto;\n grid-template-areas: 'right';\n margin-right: 5px;\n overflow: hidden;\n position: relative;\n`;\n\nexport const StyledMotionRightElementWrapper = styled(motion.div)<FramerMotionBugFix>`\n align-items: center;\n display: flex;\n grid-area: header;\n justify-content: flex-end;\n`;\n\ntype StyledMotionRightInputProps = WithTheme<{\n $hasIcon: boolean;\n}>;\n\nexport const StyledMotionRightInput = styled(motion.input)<StyledMotionRightInputProps>`\n background-color: transparent;\n border: 1px solid transparent;\n border-bottom-color: rgba(\n ${({ theme }: StyledMotionRightInputProps) => theme['headline-rgb']},\n 0.45\n );\n color: ${({ theme }: StyledMotionRightInputProps) => theme.text};\n grid-area: header;\n padding: ${({ $hasIcon }) => ($hasIcon ? '5px 23px 5px 1px' : '5px 1px')};\n`;\n\nexport const StyledMotionRightInputIconWrapper = styled(motion.div)<FramerMotionBugFix>`\n align-items: center;\n display: flex;\n height: 100%;\n justify-content: center;\n position: absolute;\n right: 4px;\n top: 0;\n`;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"AccordionHead.styles.js","names":["motion","styled","css","StyledMotionAccordionHead","div","_ref","theme","text","StyledMotionIconWrapper","_ref2","onClick","StyledAccordionIcon","i","_ref3","headline","_ref4","$icon","StyledMotionContentWrapper","_ref5","StyledMotionTitleWrapper","StyledMotionTitle","_ref6","$isOpen","$isWrapped","undefined","_ref7","_ref8","_ref9","_ref10","StyledMotionTitleElementWrapper","StyledRightWrapper","StyledMotionRightElementWrapper","StyledMotionRightInput","input","_ref11","_ref12","_ref13","$hasIcon","StyledMotionRightInputIconWrapper"],"sources":["../../../../../src/components/accordion/accordion-head/AccordionHead.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type {\n FramerMotionBugFix,\n WithTheme,\n} from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledMotionAccordionHeadProps = WithTheme<unknown>;\n\nexport const StyledMotionAccordionHead = styled(motion.div)<StyledMotionAccordionHeadProps>`\n align-items: center;\n color: ${({ theme }: StyledMotionAccordionHeadProps) => theme.text};\n display: flex;\n overflow: hidden;\n padding: 4px 0;\n`;\n\nexport const StyledMotionIconWrapper = styled(motion.div)<FramerMotionBugFix>`\n align-items: center;\n cursor: ${({ onClick }) => (typeof onClick === 'function' ? 'pointer' : 'default')};\n display: flex;\n flex: 0 0 auto;\n height: 25px;\n justify-content: center;\n width: 25px;\n`;\n\ntype StyledAccordionIconProps = WithTheme<{ $icon: string }>;\n\nexport const StyledAccordionIcon = styled.i<StyledAccordionIconProps>`\n align-items: center;\n justify-content: center;\n display: flex;\n color: ${({ theme }: StyledAccordionIconProps) => theme.headline};\n\n &:before {\n content: ${({ $icon }) => `\"\\\\${$icon}\"`};\n font-family: 'Font Awesome 6 Pro', Fontawesome !important;\n }\n`;\n\nexport const StyledMotionContentWrapper = styled(motion.div)<FramerMotionBugFix>`\n align-self: flex-start;\n cursor: ${({ onClick }) => (typeof onClick === 'function' ? 'pointer' : 'default')};\n display: flex;\n flex: 1 1 auto;\n height: 100%;\n overflow: hidden;\n margin-right: 10px;\n`;\n\nexport const StyledMotionTitleWrapper = styled(motion.div)<FramerMotionBugFix>`\n display: grid;\n flex: 0 1 auto;\n grid-template-areas: 'header';\n`;\n\ninterface StyledMotionTitleProps {\n $isOpen: boolean;\n $isWrapped: boolean;\n}\n\nexport const StyledMotionTitle = styled(motion.div)<StyledMotionTitleProps>`\n font-size: ${({ $isOpen, $isWrapped }) => ($isOpen && !$isWrapped ? '1.3rem' : undefined)};\n font-weight: ${({ $isOpen, $isWrapped }) => ($isOpen && $isWrapped ? 700 : 'normal')};\n grid-area: header;\n height: ${({ $isWrapped }) => ($isWrapped ? '100%' : undefined)};\n overflow: hidden;\n text-overflow: ellipsis;\n transform-origin: top left;\n user-select: none;\n white-space: ${({ $isOpen, $isWrapped }) => ($isOpen && !$isWrapped ? 'normal' : 'nowrap')};\n\n ${({ $isWrapped }) =>\n $isWrapped &&\n css`\n align-content: center;\n `}\n`;\n\nexport const StyledMotionTitleElementWrapper = styled(motion.div)<FramerMotionBugFix>`\n align-items: center;\n display: flex;\n margin-left: 8px;\n`;\n\nexport const StyledRightWrapper = styled.div`\n display: grid;\n flex: 0 0 auto;\n grid-template-areas: 'right';\n margin-right: 5px;\n overflow: hidden;\n position: relative;\n`;\n\nexport const StyledMotionRightElementWrapper = styled(motion.div)<FramerMotionBugFix>`\n align-items: center;\n display: flex;\n grid-area: header;\n justify-content: flex-end;\n`;\n\ntype StyledMotionRightInputProps = WithTheme<{\n $hasIcon: boolean;\n}>;\n\nexport const StyledMotionRightInput = styled(motion.input)<StyledMotionRightInputProps>`\n background-color: transparent;\n border: 1px solid transparent;\n border-bottom-color: rgba(\n ${({ theme }: StyledMotionRightInputProps) => theme['headline-rgb']},\n 0.45\n );\n color: ${({ theme }: StyledMotionRightInputProps) => theme.text};\n grid-area: header;\n padding: ${({ $hasIcon }) => ($hasIcon ? '5px 23px 5px 1px' : '5px 1px')};\n`;\n\nexport const StyledMotionRightInputIconWrapper = styled(motion.div)<FramerMotionBugFix>`\n align-items: center;\n display: flex;\n height: 100%;\n justify-content: center;\n position: absolute;\n right: 4px;\n top: 0;\n`;\n"],"mappings":"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","ignoreList":[]}
@@ -15,10 +15,11 @@ export const getAccordionHeadHeight = _ref => {
15
15
  const closedHeight = Math.max(element.clientHeight + 8, isWrapped ? 40 : 33);
16
16
  if (isWrapped) {
17
17
  element.style.fontWeight = 'bold';
18
+ element.style.whiteSpace = 'nowrap';
18
19
  } else {
19
20
  element.style.fontSize = '1.3rem';
21
+ element.style.whiteSpace = 'normal';
20
22
  }
21
- element.style.whiteSpace = 'normal';
22
23
  const openHeight = Math.max(element.clientHeight + 8, isWrapped ? 40 : 33);
23
24
  document.body.removeChild(element);
24
25
  return {
@@ -1 +1 @@
1
- {"version":3,"file":"accordion.js","names":["getAccordionHeadHeight","_ref","isWrapped","title","width","element","document","createElement","style","fontSize","opacity","pointerEvents","whiteSpace","innerText","body","appendChild","closedHeight","Math","max","clientHeight","fontWeight","openHeight","removeChild","closed","open"],"sources":["../../../src/utils/accordion.ts"],"sourcesContent":["interface GetAccordionHeadHeightOptions {\n isWrapped?: boolean;\n title: string;\n width: number;\n}\n\ninterface GetAccordionHeadHeightResult {\n closed: number;\n open: number;\n}\n\nexport const getAccordionHeadHeight = ({\n isWrapped,\n title,\n width,\n}: GetAccordionHeadHeightOptions): GetAccordionHeadHeightResult => {\n const element = document.createElement('div');\n\n element.style.fontSize = '1rem';\n element.style.opacity = '0';\n element.style.pointerEvents = 'none';\n element.style.whiteSpace = 'nowrap';\n element.style.width = `${width}px`;\n\n element.innerText = title;\n\n document.body.appendChild(element);\n\n const closedHeight = Math.max(element.clientHeight + 8, isWrapped ? 40 : 33);\n\n if (isWrapped) {\n element.style.fontWeight = 'bold';\n } else {\n element.style.fontSize = '1.3rem';\n }\n\n element.style.whiteSpace = 'normal';\n\n const openHeight = Math.max(element.clientHeight + 8, isWrapped ? 40 : 33);\n\n document.body.removeChild(element);\n\n return { closed: closedHeight, open: openHeight };\n};\n"],"mappings":"AAWA,OAAO,MAAMA,sBAAsB,GAAGC,IAAA,IAI6B;EAAA,IAJ5B;IACnCC,SAAS;IACTC,KAAK;IACLC;EAC2B,CAAC,GAAAH,IAAA;EAC5B,MAAMI,OAAO,GAAGC,QAAQ,CAACC,aAAa,CAAC,KAAK,CAAC;EAE7CF,OAAO,CAACG,KAAK,CAACC,QAAQ,GAAG,MAAM;EAC/BJ,OAAO,CAACG,KAAK,CAACE,OAAO,GAAG,GAAG;EAC3BL,OAAO,CAACG,KAAK,CAACG,aAAa,GAAG,MAAM;EACpCN,OAAO,CAACG,KAAK,CAACI,UAAU,GAAG,QAAQ;EACnCP,OAAO,CAACG,KAAK,CAACJ,KAAK,GAAI,GAAEA,KAAM,IAAG;EAElCC,OAAO,CAACQ,SAAS,GAAGV,KAAK;EAEzBG,QAAQ,CAACQ,IAAI,CAACC,WAAW,CAACV,OAAO,CAAC;EAElC,MAAMW,YAAY,GAAGC,IAAI,CAACC,GAAG,CAACb,OAAO,CAACc,YAAY,GAAG,CAAC,EAAEjB,SAAS,GAAG,EAAE,GAAG,EAAE,CAAC;EAE5E,IAAIA,SAAS,EAAE;IACXG,OAAO,CAACG,KAAK,CAACY,UAAU,GAAG,MAAM;EACrC,CAAC,MAAM;IACHf,OAAO,CAACG,KAAK,CAACC,QAAQ,GAAG,QAAQ;EACrC;EAEAJ,OAAO,CAACG,KAAK,CAACI,UAAU,GAAG,QAAQ;EAEnC,MAAMS,UAAU,GAAGJ,IAAI,CAACC,GAAG,CAACb,OAAO,CAACc,YAAY,GAAG,CAAC,EAAEjB,SAAS,GAAG,EAAE,GAAG,EAAE,CAAC;EAE1EI,QAAQ,CAACQ,IAAI,CAACQ,WAAW,CAACjB,OAAO,CAAC;EAElC,OAAO;IAAEkB,MAAM,EAAEP,YAAY;IAAEQ,IAAI,EAAEH;EAAW,CAAC;AACrD,CAAC","ignoreList":[]}
1
+ {"version":3,"file":"accordion.js","names":["getAccordionHeadHeight","_ref","isWrapped","title","width","element","document","createElement","style","fontSize","opacity","pointerEvents","whiteSpace","innerText","body","appendChild","closedHeight","Math","max","clientHeight","fontWeight","openHeight","removeChild","closed","open"],"sources":["../../../src/utils/accordion.ts"],"sourcesContent":["interface GetAccordionHeadHeightOptions {\n isWrapped?: boolean;\n title: string;\n width: number;\n}\n\ninterface GetAccordionHeadHeightResult {\n closed: number;\n open: number;\n}\n\nexport const getAccordionHeadHeight = ({\n isWrapped,\n title,\n width,\n}: GetAccordionHeadHeightOptions): GetAccordionHeadHeightResult => {\n const element = document.createElement('div');\n\n element.style.fontSize = '1rem';\n element.style.opacity = '0';\n element.style.pointerEvents = 'none';\n element.style.whiteSpace = 'nowrap';\n element.style.width = `${width}px`;\n\n element.innerText = title;\n\n document.body.appendChild(element);\n\n const closedHeight = Math.max(element.clientHeight + 8, isWrapped ? 40 : 33);\n\n if (isWrapped) {\n element.style.fontWeight = 'bold';\n element.style.whiteSpace = 'nowrap';\n } else {\n element.style.fontSize = '1.3rem';\n element.style.whiteSpace = 'normal';\n }\n\n const openHeight = Math.max(element.clientHeight + 8, isWrapped ? 40 : 33);\n\n document.body.removeChild(element);\n\n return { closed: closedHeight, open: openHeight };\n};\n"],"mappings":"AAWA,OAAO,MAAMA,sBAAsB,GAAGC,IAAA,IAI6B;EAAA,IAJ5B;IACnCC,SAAS;IACTC,KAAK;IACLC;EAC2B,CAAC,GAAAH,IAAA;EAC5B,MAAMI,OAAO,GAAGC,QAAQ,CAACC,aAAa,CAAC,KAAK,CAAC;EAE7CF,OAAO,CAACG,KAAK,CAACC,QAAQ,GAAG,MAAM;EAC/BJ,OAAO,CAACG,KAAK,CAACE,OAAO,GAAG,GAAG;EAC3BL,OAAO,CAACG,KAAK,CAACG,aAAa,GAAG,MAAM;EACpCN,OAAO,CAACG,KAAK,CAACI,UAAU,GAAG,QAAQ;EACnCP,OAAO,CAACG,KAAK,CAACJ,KAAK,GAAI,GAAEA,KAAM,IAAG;EAElCC,OAAO,CAACQ,SAAS,GAAGV,KAAK;EAEzBG,QAAQ,CAACQ,IAAI,CAACC,WAAW,CAACV,OAAO,CAAC;EAElC,MAAMW,YAAY,GAAGC,IAAI,CAACC,GAAG,CAACb,OAAO,CAACc,YAAY,GAAG,CAAC,EAAEjB,SAAS,GAAG,EAAE,GAAG,EAAE,CAAC;EAE5E,IAAIA,SAAS,EAAE;IACXG,OAAO,CAACG,KAAK,CAACY,UAAU,GAAG,MAAM;IACjCf,OAAO,CAACG,KAAK,CAACI,UAAU,GAAG,QAAQ;EACvC,CAAC,MAAM;IACHP,OAAO,CAACG,KAAK,CAACC,QAAQ,GAAG,QAAQ;IACjCJ,OAAO,CAACG,KAAK,CAACI,UAAU,GAAG,QAAQ;EACvC;EAEA,MAAMS,UAAU,GAAGJ,IAAI,CAACC,GAAG,CAACb,OAAO,CAACc,YAAY,GAAG,CAAC,EAAEjB,SAAS,GAAG,EAAE,GAAG,EAAE,CAAC;EAE1EI,QAAQ,CAACQ,IAAI,CAACQ,WAAW,CAACjB,OAAO,CAAC;EAElC,OAAO;IAAEkB,MAAM,EAAEP,YAAY;IAAEQ,IAAI,EAAEH;EAAW,CAAC;AACrD,CAAC","ignoreList":[]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@chayns-components/core",
3
- "version": "5.0.0-beta.621",
3
+ "version": "5.0.0-beta.623",
4
4
  "description": "A set of beautiful React components for developing your own applications with chayns.",
5
5
  "sideEffects": false,
6
6
  "browserslist": [
@@ -85,5 +85,5 @@
85
85
  "publishConfig": {
86
86
  "access": "public"
87
87
  },
88
- "gitHead": "bb53692002edd41359dde733bfda8430b793c44b"
88
+ "gitHead": "9c4bdac66b8fa138c4266d6cad28183015d3f738"
89
89
  }