@chayns-components/core 5.0.0-beta.12 → 5.0.0-beta.1200

package/lib/esm/components/accordion/accordion-head/AccordionHead.js

@@ -0,0 +1,202 @@
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import { AnimatePresence, LayoutGroup } from 'motion/react';
+import React, { useEffect, useMemo, useRef, useState } from 'react';
+import { useTheme } from 'styled-components';
+import { useElementSize } from '../../../hooks/element';
+import { getAccordionHeadHeight, getElementClickEvent } from '../../../utils/accordion';
+import { AreaContext } from '../../area-provider/AreaContextProvider';
+import Icon from '../../icon/Icon';
+import Input, { InputSize } from '../../input/Input';
+import SearchInput from '../../search-input/SearchInput';
+import { StyledAccordionIcon, StyledMotionAccordionHead, StyledMotionContentWrapper, StyledMotionIconWrapper, StyledMotionRightElementWrapper, StyledMotionSearchWrapper, StyledMotionTitle, StyledMotionTitleElementWrapper, StyledMotionTitleWrapper, StyledRightWrapper } from './AccordionHead.styles';
+const AccordionHead = ({
+  icon,
+  isOpen,
+  isFixed,
+  isTitleGreyed,
+  isWrapped,
+  onClick,
+  onSearchChange,
+  rightElement,
+  searchPlaceholder,
+  searchValue,
+  shouldRotateIcon,
+  title,
+  titleElement,
+  uuid,
+  titleInputProps,
+  onTitleInputChange,
+  titleColor
+}) => {
+  const [headHeight, setHeadHeight] = useState({
+    closed: isWrapped ? 40 : 32,
+    open: isWrapped ? 40 : 32
+  });
+  const [isSearchActive, setIsSearchActive] = useState(false);
+  const theme = useTheme();
+  const titleElementWrapperRef = useRef(null);
+  const titleWrapperRef = useRef(null);
+  const [internalSearchValue, setInternalSearchValue] = useState();
+  useEffect(() => {
+    setInternalSearchValue(searchValue);
+  }, [searchValue]);
+  useEffect(() => {
+    if (typeof onSearchChange === 'function' && !isOpen) {
+      setIsSearchActive(false);
+    }
+  }, [isOpen, onSearchChange]);
+  const handleOnSearchChance = event => {
+    setInternalSearchValue(event.target.value);
+    if (typeof onSearchChange === 'function') {
+      onSearchChange(event);
+    }
+  };
+  const titleElementChildrenSize = useElementSize(titleElementWrapperRef, {
+    shouldUseChildElement: true
+  });
+  const shouldPreventRightElementClick = useMemo(() => getElementClickEvent(rightElement), [rightElement]);
+  useEffect(() => {
+    if (typeof onTitleInputChange === 'function') {
+      setHeadHeight({
+        closed: 50,
+        open: 50
+      });
+    } else {
+      // The timeout is needed because the width is incorrect on the first render
+      window.setTimeout(() => {
+        setHeadHeight(getAccordionHeadHeight({
+          isWrapped,
+          title,
+          width: titleWrapperRef.current?.clientWidth ?? 0,
+          hasSearch: typeof onSearchChange === 'function'
+        }));
+      }, 1);
+    }
+    // The fontSize need to be included to trigger a new calculation.
+    // After the size is increased, the Title is cut at the bottom.
+  }, [isWrapped, onSearchChange, onTitleInputChange, theme.fontSize, title]);
+  const iconElement = useMemo(() => {
+    if (icon || isFixed) {
+      return /*#__PURE__*/React.createElement(Icon, {
+        icons: [isFixed ? 'fa fa-horizontal-rule' : icon ?? 'fa fa-chevron-right']
+      });
+    }
+    let internalIcon = 'f105';
+    if (theme?.accordionIcon && theme.accordionIcon !== 110 && theme.accordionIcon !== 1110100) {
+      internalIcon = theme.accordionIcon.toString(16);
+    }
+    const internalIconStyle = theme?.iconStyle ? theme.iconStyle : 'fa-regular';
+    return /*#__PURE__*/React.createElement(StyledAccordionIcon, {
+      className: internalIconStyle,
+      $icon: internalIcon
+    });
+  }, [icon, theme, isFixed]);
+  let accordionHeadHeight = isOpen ? headHeight.open : headHeight.closed;
+  if (titleElementChildrenSize && titleElementChildrenSize.height > accordionHeadHeight) {
+    // If the titleElement is bigger than the title, the height of the accordion head should be increased.
+    // The height of the titleElement is increased by 8px because of the padding of the accordion head element.
+    accordionHeadHeight = titleElementChildrenSize.height + 8;
+  }
+  return /*#__PURE__*/React.createElement(StyledMotionAccordionHead, {
+    animate: {
+      height: accordionHeadHeight
+    },
+    className: "beta-chayns-accordion-head",
+    initial: false,
+    key: `accordionHead--${uuid}`
+  }, /*#__PURE__*/React.createElement(StyledMotionIconWrapper, {
+    animate: {
+      rotate: (isOpen || isFixed) && shouldRotateIcon ? 90 : 0
+    },
+    initial: false,
+    onClick: !isFixed ? onClick : undefined,
+    key: `accordionHeadIcon--${uuid}`
+  }, iconElement), /*#__PURE__*/React.createElement(StyledMotionContentWrapper, {
+    animate: {
+      opacity: isTitleGreyed ? 0.5 : 1
+    },
+    initial: false,
+    onClick: !isFixed ? onClick : undefined,
+    ref: titleWrapperRef,
+    $isWrapped: isWrapped,
+    key: `accordionHeadContentWrapper--${uuid}`
+  }, typeof onTitleInputChange === 'function' ?
+  /*#__PURE__*/
+  // eslint-disable-next-line react/jsx-no-constructed-context-values
+  React.createElement(AreaContext.Provider, {
+    value: {
+      shouldChangeColor: true
+    }
+  }, /*#__PURE__*/React.createElement(Input, _extends({}, titleInputProps, {
+    value: title,
+    onChange: onTitleInputChange
+  }))) : /*#__PURE__*/React.createElement(LayoutGroup, {
+    key: `accordionHeadLayoutGroup--${uuid}`
+  }, /*#__PURE__*/React.createElement(StyledMotionTitleWrapper, {
+    key: `accordionHeadTitleWrapperWrapper--${uuid}`
+  }, /*#__PURE__*/React.createElement(AnimatePresence, {
+    initial: false,
+    key: `accordionHeadTitleWrapper--${uuid}`
+  }, /*#__PURE__*/React.createElement(StyledMotionTitle, {
+    animate: {
+      scale: 1
+    },
+    initial: {
+      scale: isOpen && !isWrapped ? 1 / 1.3 : 1.3
+    },
+    exit: {
+      opacity: 0
+    },
+    $isOpen: isOpen,
+    $isWrapped: isWrapped,
+    $color: titleColor,
+    $hasSearch: typeof onSearchChange === 'function',
+    transition: {
+      opacity: {
+        duration: 0
+      }
+    },
+    key: isOpen && !isWrapped ? `accordionHeadTitleBig--${uuid}` : `accordionHeadTitle--${uuid}`
+  }, title))), titleElement && /*#__PURE__*/React.createElement(StyledMotionTitleElementWrapper, {
+    layout: true,
+    key: `accordionTitleElement--${uuid}`,
+    ref: titleElementWrapperRef
+  }, titleElement))), (typeof onSearchChange === 'function' || rightElement) && /*#__PURE__*/React.createElement(StyledRightWrapper, {
+    $isSearchActive: isSearchActive
+  }, /*#__PURE__*/React.createElement(AnimatePresence, {
+    initial: false,
+    key: `accordionRightWrapper--${uuid}`
+  }, typeof onSearchChange === 'function' && isOpen && /*#__PURE__*/React.createElement(StyledMotionSearchWrapper, {
+    animate: {
+      opacity: 1
+    },
+    exit: {
+      opacity: 0
+    },
+    initial: {
+      opacity: 0
+    },
+    key: `searchWrapper--${uuid}`
+  }, /*#__PURE__*/React.createElement(SearchInput, {
+    onChange: handleOnSearchChance,
+    onActiveChange: isActive => setIsSearchActive(isActive),
+    placeholder: searchPlaceholder,
+    size: InputSize.Small,
+    value: internalSearchValue
+  })), rightElement && /*#__PURE__*/React.createElement(StyledMotionRightElementWrapper, {
+    animate: {
+      opacity: 1
+    },
+    exit: {
+      opacity: 0
+    },
+    initial: {
+      opacity: 0
+    },
+    key: `rightElementWrapper--${uuid}`,
+    onClick: !isFixed && !shouldPreventRightElementClick ? onClick : undefined
+  }, rightElement))));
+};
+AccordionHead.displayName = 'AccordionHead';
+export default AccordionHead;
+//# sourceMappingURL=AccordionHead.js.map

package/lib/esm/components/accordion/accordion-head/AccordionHead.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionHead.js","names":["AnimatePresence","LayoutGroup","React","useEffect","useMemo","useRef","useState","useTheme","useElementSize","getAccordionHeadHeight","getElementClickEvent","AreaContext","Icon","Input","InputSize","SearchInput","StyledAccordionIcon","StyledMotionAccordionHead","StyledMotionContentWrapper","StyledMotionIconWrapper","StyledMotionRightElementWrapper","StyledMotionSearchWrapper","StyledMotionTitle","StyledMotionTitleElementWrapper","StyledMotionTitleWrapper","StyledRightWrapper","AccordionHead","icon","isOpen","isFixed","isTitleGreyed","isWrapped","onClick","onSearchChange","rightElement","searchPlaceholder","searchValue","shouldRotateIcon","title","titleElement","uuid","titleInputProps","onTitleInputChange","titleColor","headHeight","setHeadHeight","closed","open","isSearchActive","setIsSearchActive","theme","titleElementWrapperRef","titleWrapperRef","internalSearchValue","setInternalSearchValue","handleOnSearchChance","event","target","value","titleElementChildrenSize","shouldUseChildElement","shouldPreventRightElementClick","window","setTimeout","width","current","clientWidth","hasSearch","fontSize","iconElement","createElement","icons","internalIcon","accordionIcon","toString","internalIconStyle","iconStyle","className","$icon","accordionHeadHeight","height","animate","initial","key","rotate","undefined","opacity","ref","$isWrapped","Provider","shouldChangeColor","_extends","onChange","scale","exit","$isOpen","$color","$hasSearch","transition","duration","layout","$isSearchActive","onActiveChange","isActive","placeholder","size","Small","displayName"],"sources":["../../../../../src/components/accordion/accordion-head/AccordionHead.tsx"],"sourcesContent":["import { AnimatePresence, LayoutGroup } from 'motion/react';\nimport React, {\n    ChangeEvent,\n    ChangeEventHandler,\n    FC,\n    MouseEventHandler,\n    ReactNode,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n    type CSSProperties,\n} from 'react';\nimport { useTheme } from 'styled-components';\nimport { useElementSize } from '../../../hooks/element';\nimport { getAccordionHeadHeight, getElementClickEvent } from '../../../utils/accordion';\nimport { AreaContext } from '../../area-provider/AreaContextProvider';\nimport type { Theme } from '../../color-scheme-provider/ColorSchemeProvider';\nimport Icon from '../../icon/Icon';\nimport Input, { InputSize, type InputProps } from '../../input/Input';\nimport SearchInput from '../../search-input/SearchInput';\nimport {\n    StyledAccordionIcon,\n    StyledMotionAccordionHead,\n    StyledMotionContentWrapper,\n    StyledMotionIconWrapper,\n    StyledMotionRightElementWrapper,\n    StyledMotionSearchWrapper,\n    StyledMotionTitle,\n    StyledMotionTitleElementWrapper,\n    StyledMotionTitleWrapper,\n    StyledRightWrapper,\n} from './AccordionHead.styles';\n\nexport type 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    searchPlaceholder?: string;\n    searchValue?: string;\n    shouldRotateIcon?: boolean;\n    title: string;\n    titleElement?: ReactNode;\n    uuid: string;\n    onTitleInputChange?: ChangeEventHandler<HTMLInputElement>;\n    titleInputProps?: InputProps;\n    titleColor?: CSSProperties['color'];\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    searchPlaceholder,\n    searchValue,\n    shouldRotateIcon,\n    title,\n    titleElement,\n    uuid,\n    titleInputProps,\n    onTitleInputChange,\n    titleColor,\n}) => {\n    const [headHeight, setHeadHeight] = useState<HeadHeight>({\n        closed: isWrapped ? 40 : 32,\n        open: isWrapped ? 40 : 32,\n    });\n\n    const [isSearchActive, setIsSearchActive] = useState(false);\n\n    const theme = useTheme() as Theme;\n\n    const titleElementWrapperRef = useRef<HTMLDivElement>(null);\n    const titleWrapperRef = useRef<HTMLDivElement>(null);\n\n    const [internalSearchValue, setInternalSearchValue] = useState<string>();\n\n    useEffect(() => {\n        setInternalSearchValue(searchValue);\n    }, [searchValue]);\n\n    useEffect(() => {\n        if (typeof onSearchChange === 'function' && !isOpen) {\n            setIsSearchActive(false);\n        }\n    }, [isOpen, onSearchChange]);\n\n    const handleOnSearchChance = (event: ChangeEvent<HTMLInputElement>) => {\n        setInternalSearchValue(event.target.value);\n        if (typeof onSearchChange === 'function') {\n            onSearchChange(event);\n        }\n    };\n\n    const titleElementChildrenSize = useElementSize(titleElementWrapperRef, {\n        shouldUseChildElement: true,\n    });\n\n    const shouldPreventRightElementClick = useMemo(\n        () => getElementClickEvent(rightElement),\n        [rightElement],\n    );\n\n    useEffect(() => {\n        if (typeof onTitleInputChange === 'function') {\n            setHeadHeight({ closed: 50, open: 50 });\n        } else {\n            // The timeout is needed because the width is incorrect on the first render\n            window.setTimeout(() => {\n                setHeadHeight(\n                    getAccordionHeadHeight({\n                        isWrapped,\n                        title,\n                        width: titleWrapperRef.current?.clientWidth ?? 0,\n                        hasSearch: typeof onSearchChange === 'function',\n                    }),\n                );\n            }, 1);\n        }\n        // The fontSize need to be included to trigger a new calculation.\n        // After the size is increased, the Title is cut at the bottom.\n    }, [isWrapped, onSearchChange, onTitleInputChange, theme.fontSize, title]);\n\n    const iconElement = useMemo(() => {\n        if (icon || isFixed) {\n            return (\n                <Icon\n                    icons={[isFixed ? 'fa fa-horizontal-rule' : (icon ?? 'fa fa-chevron-right')]}\n                />\n            );\n        }\n\n        let internalIcon = 'f105';\n\n        if (\n            theme?.accordionIcon &&\n            (theme.accordionIcon as unknown as number) !== 110 &&\n            (theme.accordionIcon as unknown as number) !== 1110100\n        ) {\n            internalIcon = (theme.accordionIcon as unknown as number).toString(16);\n        }\n\n        const internalIconStyle = theme?.iconStyle ? theme.iconStyle : 'fa-regular';\n\n        return <StyledAccordionIcon className={internalIconStyle} $icon={internalIcon} />;\n    }, [icon, theme, isFixed]);\n\n    let accordionHeadHeight = isOpen ? headHeight.open : headHeight.closed;\n\n    if (titleElementChildrenSize && titleElementChildrenSize.height > accordionHeadHeight) {\n        // If the titleElement is bigger than the title, the height of the accordion head should be increased.\n        // The height of the titleElement is increased by 8px because of the padding of the accordion head element.\n        accordionHeadHeight = titleElementChildrenSize.height + 8;\n    }\n\n    return (\n        <StyledMotionAccordionHead\n            animate={{ height: accordionHeadHeight }}\n            className=\"beta-chayns-accordion-head\"\n            initial={false}\n            key={`accordionHead--${uuid}`}\n        >\n            <StyledMotionIconWrapper\n                animate={{ rotate: (isOpen || isFixed) && shouldRotateIcon ? 90 : 0 }}\n                initial={false}\n                onClick={!isFixed ? onClick : undefined}\n                key={`accordionHeadIcon--${uuid}`}\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                $isWrapped={isWrapped}\n                key={`accordionHeadContentWrapper--${uuid}`}\n            >\n                {typeof onTitleInputChange === 'function' ? (\n                    // eslint-disable-next-line react/jsx-no-constructed-context-values\n                    <AreaContext.Provider value={{ shouldChangeColor: true }}>\n                        {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n                        <Input {...titleInputProps} value={title} onChange={onTitleInputChange} />\n                    </AreaContext.Provider>\n                ) : (\n                    <LayoutGroup key={`accordionHeadLayoutGroup--${uuid}`}>\n                        <StyledMotionTitleWrapper key={`accordionHeadTitleWrapperWrapper--${uuid}`}>\n                            <AnimatePresence\n                                initial={false}\n                                key={`accordionHeadTitleWrapper--${uuid}`}\n                            >\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                                    $color={titleColor}\n                                    $hasSearch={typeof onSearchChange === 'function'}\n                                    transition={{\n                                        opacity: {\n                                            duration: 0,\n                                        },\n                                    }}\n                                    key={\n                                        isOpen && !isWrapped\n                                            ? `accordionHeadTitleBig--${uuid}`\n                                            : `accordionHeadTitle--${uuid}`\n                                    }\n                                >\n                                    {title}\n                                </StyledMotionTitle>\n                            </AnimatePresence>\n                        </StyledMotionTitleWrapper>\n                        {titleElement && (\n                            <StyledMotionTitleElementWrapper\n                                layout\n                                key={`accordionTitleElement--${uuid}`}\n                                ref={titleElementWrapperRef}\n                            >\n                                {titleElement}\n                            </StyledMotionTitleElementWrapper>\n                        )}\n                    </LayoutGroup>\n                )}\n            </StyledMotionContentWrapper>\n            {(typeof onSearchChange === 'function' || rightElement) && (\n                <StyledRightWrapper $isSearchActive={isSearchActive}>\n                    <AnimatePresence initial={false} key={`accordionRightWrapper--${uuid}`}>\n                        {typeof onSearchChange === 'function' && isOpen && (\n                            <StyledMotionSearchWrapper\n                                animate={{ opacity: 1 }}\n                                exit={{ opacity: 0 }}\n                                initial={{ opacity: 0 }}\n                                key={`searchWrapper--${uuid}`}\n                            >\n                                <SearchInput\n                                    onChange={handleOnSearchChance}\n                                    onActiveChange={(isActive) => setIsSearchActive(isActive)}\n                                    placeholder={searchPlaceholder}\n                                    size={InputSize.Small}\n                                    value={internalSearchValue}\n                                />\n                            </StyledMotionSearchWrapper>\n                        )}\n                        {rightElement && (\n                            <StyledMotionRightElementWrapper\n                                animate={{ opacity: 1 }}\n                                exit={{ opacity: 0 }}\n                                initial={{ opacity: 0 }}\n                                key={`rightElementWrapper--${uuid}`}\n                                onClick={\n                                    !isFixed && !shouldPreventRightElementClick\n                                        ? onClick\n                                        : undefined\n                                }\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":[]}

package/lib/esm/components/accordion/accordion-head/AccordionHead.styles.js

@@ -0,0 +1,158 @@
+import { motion } from 'motion/react';
+import styled, { css } from 'styled-components';
+export const StyledMotionAccordionHead = styled(motion.div)`
+    align-items: center;
+    color: ${({
+  theme
+}) => theme.text};
+    display: flex;
+    overflow: hidden;
+    padding: 4px 0;
+`;
+export const StyledMotionIconWrapper = styled(motion.div)`
+    align-items: center;
+    cursor: ${({
+  onClick
+}) => typeof onClick === 'function' ? 'pointer' : 'default'};
+    display: flex;
+    flex: 0 0 auto;
+    height: 25px;
+    justify-content: center;
+    width: 25px;
+`;
+export const StyledAccordionIcon = styled.i`
+    align-items: center;
+    justify-content: center;
+    display: flex;
+    color: ${({
+  theme
+}) => theme.headline};
+
+    &:before {
+        content: ${({
+  $icon
+}) => `"\\${$icon}"`};
+        font-family: 'Font Awesome 6 Pro', Fontawesome !important;
+    }
+`;
+export const StyledMotionContentWrapper = styled(motion.div)`
+    align-self: flex-start;
+    cursor: ${({
+  onClick
+}) => typeof onClick === 'function' ? 'pointer' : 'default'};
+    display: flex;
+    flex: 1 1 auto;
+    height: 100%;
+    overflow: hidden;
+    margin-right: 10px;
+
+    ${({
+  $isWrapped
+}) => $isWrapped && css`
+            align-items: center;
+        `}
+`;
+export const StyledMotionTitleWrapper = styled(motion.div)`
+    display: grid;
+    flex: 0 1 auto;
+    grid-template-areas: 'header';
+`;
+export const StyledMotionTitle = styled(motion.div)`
+    font-size: ${({
+  $isOpen,
+  $isWrapped
+}) => $isOpen && !$isWrapped ? '1.3rem' : undefined};
+    font-weight: ${({
+  $isOpen,
+  $isWrapped
+}) => $isOpen && $isWrapped ? 700 : 'normal'};
+    grid-area: header;
+    height: ${({
+  $isWrapped,
+  $hasSearch
+}) => $isWrapped || $hasSearch ? '100%' : undefined};
+    overflow: hidden;
+    text-overflow: ellipsis;
+    transform-origin: top left;
+    user-select: none;
+    color: ${({
+  $color,
+  theme
+}) => $color ?? theme.text};
+    white-space: ${({
+  $isOpen,
+  $isWrapped,
+  $hasSearch
+}) => $isOpen && !$isWrapped && !$hasSearch ? 'normal' : 'nowrap'};
+
+    will-change: unset !important;
+
+    ${({
+  $isWrapped
+}) => $isWrapped && css`
+            align-content: center;
+        `}
+`;
+export const StyledMotionTitleElementWrapper = styled(motion.div)`
+    align-items: center;
+    display: flex;
+    flex: 1 1 auto;
+    margin-left: 8px;
+    min-width: 0;
+`;
+export const StyledRightWrapper = styled.div`
+    display: flex;
+    flex: 0 0 auto;
+    gap: 8px;
+    margin-right: 5px;
+    overflow: hidden;
+    position: relative;
+
+    width: ${({
+  $isSearchActive
+}) => $isSearchActive ? '40%' : undefined};
+`;
+export const StyledMotionSearchWrapper = styled(motion.div)`
+    align-items: center;
+    justify-content: end;
+    position: relative;
+    display: flex;
+    width: 100%;
+`;
+export const StyledMotionRightElementWrapper = styled(motion.div)`
+    align-items: center;
+    display: flex;
+
+    cursor: ${({
+  onClick
+}) => typeof onClick === 'function' ? 'pointer' : 'default'};
+
+    will-change: unset !important;
+`;
+export const StyledMotionRightInput = styled(motion.input)`
+    background-color: transparent;
+    border: 1px solid transparent;
+    border-bottom-color: rgba(
+        ${({
+  theme
+}) => theme['headline-rgb']},
+        0.45
+    );
+    color: ${({
+  theme
+}) => theme.text};
+    grid-area: header;
+    padding: ${({
+  $hasIcon
+}) => $hasIcon ? '5px 23px 5px 1px' : '5px 1px'};
+`;
+export const StyledMotionRightInputIconWrapper = styled(motion.div)`
+    align-items: center;
+    display: flex;
+    height: 100%;
+    justify-content: center;
+    position: absolute;
+    right: 4px;
+    top: 0;
+`;
+//# sourceMappingURL=AccordionHead.styles.js.map

package/lib/esm/components/accordion/accordion-head/AccordionHead.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionHead.styles.js","names":["motion","styled","css","StyledMotionAccordionHead","div","theme","text","StyledMotionIconWrapper","onClick","StyledAccordionIcon","i","headline","$icon","StyledMotionContentWrapper","$isWrapped","StyledMotionTitleWrapper","StyledMotionTitle","$isOpen","undefined","$hasSearch","$color","StyledMotionTitleElementWrapper","StyledRightWrapper","$isSearchActive","StyledMotionSearchWrapper","StyledMotionRightElementWrapper","StyledMotionRightInput","input","$hasIcon","StyledMotionRightInputIconWrapper"],"sources":["../../../../../src/components/accordion/accordion-head/AccordionHead.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport type { CSSProperties } from 'react';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } 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)`\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\ntype StyledMotionContentWrapperProps = WithTheme<{ $isWrapped: boolean }>;\n\nexport const StyledMotionContentWrapper = styled(motion.div)<StyledMotionContentWrapperProps>`\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    ${({ $isWrapped }) =>\n        $isWrapped &&\n        css`\n            align-items: center;\n        `}\n`;\n\nexport const StyledMotionTitleWrapper = styled(motion.div)`\n    display: grid;\n    flex: 0 1 auto;\n    grid-template-areas: 'header';\n`;\n\ntype StyledMotionTitleProps = WithTheme<{\n    $isOpen: boolean;\n    $isWrapped: boolean;\n    $color?: CSSProperties['color'];\n    $hasSearch: 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, $hasSearch }) => ($isWrapped || $hasSearch ? '100%' : undefined)};\n    overflow: hidden;\n    text-overflow: ellipsis;\n    transform-origin: top left;\n    user-select: none;\n    color: ${({ $color, theme }: StyledMotionTitleProps) => $color ?? theme.text};\n    white-space: ${({ $isOpen, $isWrapped, $hasSearch }) =>\n        $isOpen && !$isWrapped && !$hasSearch ? 'normal' : 'nowrap'};\n\n    will-change: unset !important;\n\n    ${({ $isWrapped }) =>\n        $isWrapped &&\n        css`\n            align-content: center;\n        `}\n`;\n\nexport const StyledMotionTitleElementWrapper = styled(motion.div)`\n    align-items: center;\n    display: flex;\n    flex: 1 1 auto;\n    margin-left: 8px;\n    min-width: 0;\n`;\n\ntype StyledRightWrapperProps = {\n    $isSearchActive: boolean;\n};\n\nexport const StyledRightWrapper = styled.div<StyledRightWrapperProps>`\n    display: flex;\n    flex: 0 0 auto;\n    gap: 8px;\n    margin-right: 5px;\n    overflow: hidden;\n    position: relative;\n\n    width: ${({ $isSearchActive }) => ($isSearchActive ? '40%' : undefined)};\n`;\n\nexport const StyledMotionSearchWrapper = styled(motion.div)`\n    align-items: center;\n    justify-content: end;\n    position: relative;\n    display: flex;\n    width: 100%;\n`;\n\nexport const StyledMotionRightElementWrapper = styled(motion.div)`\n    align-items: center;\n    display: flex;\n\n    cursor: ${({ onClick }) => (typeof onClick === 'function' ? 'pointer' : 'default')};\n\n    will-change: unset !important;\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)`\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":[]}

package/lib/esm/components/accordion/accordion-intro/AccordionIntro.js

@@ -0,0 +1,10 @@
+import React from 'react';
+import { StyledAccordionIntro } from './AccordionIntro.styles';
+const AccordionIntro = ({
+  children
+}) => /*#__PURE__*/React.createElement(StyledAccordionIntro, {
+  className: "beta-chayns-accordion-intro"
+}, children);
+AccordionIntro.displayName = 'AccordionIntro';
+export default AccordionIntro;
+//# sourceMappingURL=AccordionIntro.js.map

package/lib/esm/components/accordion/accordion-intro/AccordionIntro.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionIntro.js","names":["React","StyledAccordionIntro","AccordionIntro","children","createElement","className","displayName"],"sources":["../../../../../src/components/accordion/accordion-intro/AccordionIntro.tsx"],"sourcesContent":["import React, { FC, ReactNode } from 'react';\nimport { StyledAccordionIntro } from './AccordionIntro.styles';\n\nexport type AccordionIntroProps = {\n    /**\n     * The content of the accordion content element\n     */\n    children: ReactNode;\n};\n\nconst AccordionIntro: FC<AccordionIntroProps> = ({ children }) => (\n    <StyledAccordionIntro className=\"beta-chayns-accordion-intro\">{children}</StyledAccordionIntro>\n);\n\nAccordionIntro.displayName = 'AccordionIntro';\n\nexport default AccordionIntro;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAyB,OAAO;AAC5C,SAASC,oBAAoB,QAAQ,yBAAyB;AAS9D,MAAMC,cAAuC,GAAGA,CAAC;EAAEC;AAAS,CAAC,kBACzDH,KAAA,CAAAI,aAAA,CAACH,oBAAoB;EAACI,SAAS,EAAC;AAA6B,GAAEF,QAA+B,CACjG;AAEDD,cAAc,CAACI,WAAW,GAAG,gBAAgB;AAE7C,eAAeJ,cAAc","ignoreList":[]}

package/lib/esm/components/accordion/accordion-intro/AccordionIntro.styles.js

@@ -0,0 +1,5 @@
+import styled from 'styled-components';
+export const StyledAccordionIntro = styled.div`
+    padding: 0 9px 6px;
+`;
+//# sourceMappingURL=AccordionIntro.styles.js.map

package/lib/esm/components/accordion/accordion-intro/AccordionIntro.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionIntro.styles.js","names":["styled","StyledAccordionIntro","div"],"sources":["../../../../../src/components/accordion/accordion-intro/AccordionIntro.styles.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport const StyledAccordionIntro = styled.div`\n    padding: 0 9px 6px;\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,MAAM,mBAAmB;AAEtC,OAAO,MAAMC,oBAAoB,GAAGD,MAAM,CAACE,GAAG;AAC9C;AACA,CAAC","ignoreList":[]}

package/lib/esm/components/accordion/accordion-item/AccordionItem.js

@@ -0,0 +1,14 @@
+import React from 'react';
+import { AccordionContext } from '../Accordion';
+import { StyledAccordionItem } from './AccordionItem.styles';
+const AccordionItem = ({
+  children
+}) => /*#__PURE__*/React.createElement(AccordionContext.Consumer, null, ({
+  isWrapped
+}) => /*#__PURE__*/React.createElement(StyledAccordionItem, {
+  className: "beta-chayns-accordion-item",
+  $isWrapped: isWrapped
+}, children));
+AccordionItem.displayName = 'AccordionItem';
+export default AccordionItem;
+//# sourceMappingURL=AccordionItem.js.map

package/lib/esm/components/accordion/accordion-item/AccordionItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionItem.js","names":["React","AccordionContext","StyledAccordionItem","AccordionItem","children","createElement","Consumer","isWrapped","className","$isWrapped","displayName"],"sources":["../../../../../src/components/accordion/accordion-item/AccordionItem.tsx"],"sourcesContent":["import React, { FC, ReactNode } from 'react';\nimport { AccordionContext } from '../Accordion';\nimport { StyledAccordionItem } from './AccordionItem.styles';\n\nexport type AccordionItemProps = {\n    /**\n     * The content of the accordion content element\n     */\n    children: ReactNode;\n};\n\nconst AccordionItem: FC<AccordionItemProps> = ({ children }) => (\n    <AccordionContext.Consumer>\n        {({ isWrapped }) => (\n            <StyledAccordionItem className=\"beta-chayns-accordion-item\" $isWrapped={isWrapped}>\n                {children}\n            </StyledAccordionItem>\n        )}\n    </AccordionContext.Consumer>\n);\n\nAccordionItem.displayName = 'AccordionItem';\n\nexport default AccordionItem;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAyB,OAAO;AAC5C,SAASC,gBAAgB,QAAQ,cAAc;AAC/C,SAASC,mBAAmB,QAAQ,wBAAwB;AAS5D,MAAMC,aAAqC,GAAGA,CAAC;EAAEC;AAAS,CAAC,kBACvDJ,KAAA,CAAAK,aAAA,CAACJ,gBAAgB,CAACK,QAAQ,QACrB,CAAC;EAAEC;AAAU,CAAC,kBACXP,KAAA,CAAAK,aAAA,CAACH,mBAAmB;EAACM,SAAS,EAAC,4BAA4B;EAACC,UAAU,EAAEF;AAAU,GAC7EH,QACgB,CAEF,CAC9B;AAEDD,aAAa,CAACO,WAAW,GAAG,eAAe;AAE3C,eAAeP,aAAa","ignoreList":[]}

package/lib/esm/components/accordion/accordion-item/AccordionItem.styles.js

@@ -0,0 +1,17 @@
+import styled from 'styled-components';
+export const StyledAccordionItem = styled.div`
+    color: ${({
+  theme
+}) => theme.text};
+    padding: ${({
+  $isWrapped
+}) => $isWrapped ? '8px 9px 8px 30px' : '8px 9px'};
+
+    &:not(:first-child) {
+        border-top: 1px solid
+            rgba(${({
+  theme
+}) => theme['headline-rgb']}, 0.5);
+    }
+`;
+//# sourceMappingURL=AccordionItem.styles.js.map

package/lib/esm/components/accordion/accordion-item/AccordionItem.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionItem.styles.js","names":["styled","StyledAccordionItem","div","theme","text","$isWrapped"],"sources":["../../../../../src/components/accordion/accordion-item/AccordionItem.styles.ts"],"sourcesContent":["import styled from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledAccordionItemProps = WithTheme<{\n    $isWrapped?: boolean;\n}>;\n\nexport const StyledAccordionItem = styled.div<StyledAccordionItemProps>`\n    color: ${({ theme }: StyledAccordionItemProps) => theme.text};\n    padding: ${({ $isWrapped }) => ($isWrapped ? '8px 9px 8px 30px' : '8px 9px')};\n\n    &:not(:first-child) {\n        border-top: 1px solid\n            rgba(${({ theme }: StyledAccordionItemProps) => theme['headline-rgb']}, 0.5);\n    }\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,MAAM,mBAAmB;AAOtC,OAAO,MAAMC,mBAAmB,GAAGD,MAAM,CAACE,GAA6B;AACvE,aAAa,CAAC;EAAEC;AAAgC,CAAC,KAAKA,KAAK,CAACC,IAAI;AAChE,eAAe,CAAC;EAAEC;AAAW,CAAC,KAAMA,UAAU,GAAG,kBAAkB,GAAG,SAAU;AAChF;AACA;AACA;AACA,mBAAmB,CAAC;EAAEF;AAAgC,CAAC,KAAKA,KAAK,CAAC,cAAc,CAAC;AACjF;AACA,CAAC","ignoreList":[]}

package/lib/esm/components/accordion/accordion-provider/AccordionContextProvider.js

@@ -0,0 +1,6 @@
+import React from 'react';
+export const AccordionWrappedContext = /*#__PURE__*/React.createContext({
+  isWrapped: undefined
+});
+AccordionWrappedContext.displayName = 'AccordionWrappedContext';
+//# sourceMappingURL=AccordionContextProvider.js.map

package/lib/esm/components/accordion/accordion-provider/AccordionContextProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionContextProvider.js","names":["React","AccordionWrappedContext","createContext","isWrapped","undefined","displayName"],"sources":["../../../../../src/components/accordion/accordion-provider/AccordionContextProvider.tsx"],"sourcesContent":["import React from 'react';\n\ninterface IAccordionWrappedContextProvider {\n    isWrapped?: boolean;\n}\n\nexport const AccordionWrappedContext = React.createContext<IAccordionWrappedContextProvider>({\n    isWrapped: undefined,\n});\n\nAccordionWrappedContext.displayName = 'AccordionWrappedContext';\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAMzB,OAAO,MAAMC,uBAAuB,gBAAGD,KAAK,CAACE,aAAa,CAAmC;EACzFC,SAAS,EAAEC;AACf,CAAC,CAAC;AAEFH,uBAAuB,CAACI,WAAW,GAAG,yBAAyB","ignoreList":[]}