@chayns-components/core 5.0.0-beta.1004 → 5.0.0-beta.1005

package/lib/esm/components/file-input/FileInput.styles.js

@@ -1,4 +1,4 @@
-import { motion } from 'framer-motion';
+import { motion } from 'motion/react';
 import styled, { css } from 'styled-components';
 export const StyledFileInput = styled.div``;
 export const StyledFileInputWrapper = styled.div`

package/lib/esm/components/file-input/FileInput.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"FileInput.styles.js","names":["motion","styled","css","StyledFileInput","div","StyledFileInputWrapper","_ref","$isDisabled","_ref2","StyledUploadedFilesList","_ref3","$shouldShowBorder","theme","headline","StyledFileInputContainer","_ref4","text","_ref5","$isImageSelection","StyledFileInputText","p","_ref6","StyledMotionFileInputList"],"sources":["../../../../src/components/file-input/FileInput.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type { FramerMotionBugFix, WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\nexport const StyledFileInput = styled.div``;\n\ntype StyledFileInputWrapperProps = WithTheme<{\n    $isDisabled: boolean;\n}>;\n\nexport const StyledFileInputWrapper = styled.div<StyledFileInputWrapperProps>`\n    display: flex;\n\n    cursor: ${({ $isDisabled }) => ($isDisabled ? 'default' : 'pointer')};\n    opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n`;\n\ntype StyledFileInputContainerProps = WithTheme<{\n    $isImageSelection?: boolean;\n}>;\n\ntype StyledUploadedFilesListProps = WithTheme<{ $shouldShowBorder: boolean }>;\n\nexport const StyledUploadedFilesList = styled.div<StyledUploadedFilesListProps>`\n    ${({ $shouldShowBorder, theme }: StyledUploadedFilesListProps) =>\n        $shouldShowBorder &&\n        css`\n            border-top: 1px solid ${theme.headline};\n        `}\n`;\n\nexport const StyledFileInputContainer = styled.div<StyledFileInputContainerProps>`\n    border: ${({ theme }: StyledFileInputContainerProps) => theme.text} 1px dotted;\n    display: flex;\n    gap: 10px;\n    align-items: center;\n    padding: 15px;\n    justify-content: center;\n    width: 100%;\n\n    ${({ $isImageSelection }) =>\n        $isImageSelection &&\n        css`\n            border-left: none;\n        `}\n`;\n\ntype StyledFileInputTextProps = WithTheme<unknown>;\n\nexport const StyledFileInputText = styled.p<StyledFileInputTextProps>`\n    color: ${({ theme }: StyledFileInputTextProps) => theme.text};\n`;\n\nexport const StyledMotionFileInputList = styled(motion.div)<FramerMotionBugFix>``;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,eAAe;AACtC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAG/C,OAAO,MAAMC,eAAe,GAAGF,MAAM,CAACG,GAAG,EAAE;AAM3C,OAAO,MAAMC,sBAAsB,GAAGJ,MAAM,CAACG,GAAgC;AAC7E;AACA;AACA,cAAcE,IAAA;EAAA,IAAC;IAAEC;EAAY,CAAC,GAAAD,IAAA;EAAA,OAAMC,WAAW,GAAG,SAAS,GAAG,SAAS;AAAA,CAAC;AACxE,eAAeC,KAAA;EAAA,IAAC;IAAED;EAAY,CAAC,GAAAC,KAAA;EAAA,OAAMD,WAAW,GAAG,GAAG,GAAG,CAAC;AAAA,CAAC;AAC3D,CAAC;AAQD,OAAO,MAAME,uBAAuB,GAAGR,MAAM,CAACG,GAAiC;AAC/E,MAAMM,KAAA;EAAA,IAAC;IAAEC,iBAAiB;IAAEC;EAAoC,CAAC,GAAAF,KAAA;EAAA,OACzDC,iBAAiB,IACjBT,GAAG;AACX,oCAAoCU,KAAK,CAACC,QAAQ;AAClD,SAAS;AAAA;AACT,CAAC;AAED,OAAO,MAAMC,wBAAwB,GAAGb,MAAM,CAACG,GAAkC;AACjF,cAAcW,KAAA;EAAA,IAAC;IAAEH;EAAqC,CAAC,GAAAG,KAAA;EAAA,OAAKH,KAAK,CAACI,IAAI;AAAA;AACtE;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,KAAA;EAAA,IAAC;IAAEC;EAAkB,CAAC,GAAAD,KAAA;EAAA,OACpBC,iBAAiB,IACjBhB,GAAG;AACX;AACA,SAAS;AAAA;AACT,CAAC;AAID,OAAO,MAAMiB,mBAAmB,GAAGlB,MAAM,CAACmB,CAA2B;AACrE,aAAaC,KAAA;EAAA,IAAC;IAAET;EAAgC,CAAC,GAAAS,KAAA;EAAA,OAAKT,KAAK,CAACI,IAAI;AAAA;AAChE,CAAC;AAED,OAAO,MAAMM,yBAAyB,GAAGrB,MAAM,CAACD,MAAM,CAACI,GAAG,CAAqB,EAAE","ignoreList":[]}
+{"version":3,"file":"FileInput.styles.js","names":["motion","styled","css","StyledFileInput","div","StyledFileInputWrapper","_ref","$isDisabled","_ref2","StyledUploadedFilesList","_ref3","$shouldShowBorder","theme","headline","StyledFileInputContainer","_ref4","text","_ref5","$isImageSelection","StyledFileInputText","p","_ref6","StyledMotionFileInputList"],"sources":["../../../../src/components/file-input/FileInput.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport type { FramerMotionBugFix, WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\nexport const StyledFileInput = styled.div``;\n\ntype StyledFileInputWrapperProps = WithTheme<{\n    $isDisabled: boolean;\n}>;\n\nexport const StyledFileInputWrapper = styled.div<StyledFileInputWrapperProps>`\n    display: flex;\n\n    cursor: ${({ $isDisabled }) => ($isDisabled ? 'default' : 'pointer')};\n    opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n`;\n\ntype StyledFileInputContainerProps = WithTheme<{\n    $isImageSelection?: boolean;\n}>;\n\ntype StyledUploadedFilesListProps = WithTheme<{ $shouldShowBorder: boolean }>;\n\nexport const StyledUploadedFilesList = styled.div<StyledUploadedFilesListProps>`\n    ${({ $shouldShowBorder, theme }: StyledUploadedFilesListProps) =>\n        $shouldShowBorder &&\n        css`\n            border-top: 1px solid ${theme.headline};\n        `}\n`;\n\nexport const StyledFileInputContainer = styled.div<StyledFileInputContainerProps>`\n    border: ${({ theme }: StyledFileInputContainerProps) => theme.text} 1px dotted;\n    display: flex;\n    gap: 10px;\n    align-items: center;\n    padding: 15px;\n    justify-content: center;\n    width: 100%;\n\n    ${({ $isImageSelection }) =>\n        $isImageSelection &&\n        css`\n            border-left: none;\n        `}\n`;\n\ntype StyledFileInputTextProps = WithTheme<unknown>;\n\nexport const StyledFileInputText = styled.p<StyledFileInputTextProps>`\n    color: ${({ theme }: StyledFileInputTextProps) => theme.text};\n`;\n\nexport const StyledMotionFileInputList = styled(motion.div)<FramerMotionBugFix>``;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,cAAc;AACrC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAG/C,OAAO,MAAMC,eAAe,GAAGF,MAAM,CAACG,GAAG,EAAE;AAM3C,OAAO,MAAMC,sBAAsB,GAAGJ,MAAM,CAACG,GAAgC;AAC7E;AACA;AACA,cAAcE,IAAA;EAAA,IAAC;IAAEC;EAAY,CAAC,GAAAD,IAAA;EAAA,OAAMC,WAAW,GAAG,SAAS,GAAG,SAAS;AAAA,CAAC;AACxE,eAAeC,KAAA;EAAA,IAAC;IAAED;EAAY,CAAC,GAAAC,KAAA;EAAA,OAAMD,WAAW,GAAG,GAAG,GAAG,CAAC;AAAA,CAAC;AAC3D,CAAC;AAQD,OAAO,MAAME,uBAAuB,GAAGR,MAAM,CAACG,GAAiC;AAC/E,MAAMM,KAAA;EAAA,IAAC;IAAEC,iBAAiB;IAAEC;EAAoC,CAAC,GAAAF,KAAA;EAAA,OACzDC,iBAAiB,IACjBT,GAAG;AACX,oCAAoCU,KAAK,CAACC,QAAQ;AAClD,SAAS;AAAA;AACT,CAAC;AAED,OAAO,MAAMC,wBAAwB,GAAGb,MAAM,CAACG,GAAkC;AACjF,cAAcW,KAAA;EAAA,IAAC;IAAEH;EAAqC,CAAC,GAAAG,KAAA;EAAA,OAAKH,KAAK,CAACI,IAAI;AAAA;AACtE;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,KAAA;EAAA,IAAC;IAAEC;EAAkB,CAAC,GAAAD,KAAA;EAAA,OACpBC,iBAAiB,IACjBhB,GAAG;AACX;AACA,SAAS;AAAA;AACT,CAAC;AAID,OAAO,MAAMiB,mBAAmB,GAAGlB,MAAM,CAACmB,CAA2B;AACrE,aAAaC,KAAA;EAAA,IAAC;IAAET;EAAgC,CAAC,GAAAS,KAAA;EAAA,OAAKT,KAAK,CAACI,IAAI;AAAA;AAChE,CAAC;AAED,OAAO,MAAMM,yBAAyB,GAAGrB,MAAM,CAACD,MAAM,CAACI,GAAG,CAAqB,EAAE","ignoreList":[]}

package/lib/esm/components/filter-buttons/filter-button/FilterButton.styles.js

@@ -1,4 +1,4 @@
-import { motion } from 'framer-motion';
+import { motion } from 'motion/react';
 import styled, { css } from 'styled-components';
 import { FilterButtonItemShape, FilterButtonSize } from '../../../types/filterButtons';
 export const StyledFilterButtonItem = styled.div`

package/lib/esm/components/filter-buttons/filter-button/FilterButton.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"FilterButton.styles.js","names":["motion","styled","css","FilterButtonItemShape","FilterButtonSize","StyledFilterButtonItem","div","_ref","$size","Normal","_ref2","$isSelected","StyledFilterButtonItemLabel","StyledFilterButtonItemLabelText","p","_ref3","theme","text","StyledFilterButtonItemLabelCount","_ref4","StyledFilterButtonItemBorder","_ref5","$shape","Round","_ref6","$color","headline","StyledMotionFilterButtonItemBackground","_ref7","_ref8","_ref9"],"sources":["../../../../../src/components/filter-buttons/filter-button/FilterButton.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport type { CSSProperties } from 'react';\nimport styled, { css } from 'styled-components';\nimport { FilterButtonItemShape, FilterButtonSize } from '../../../types/filterButtons';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledFilterButtonItemProps = WithTheme<{ $size: FilterButtonSize; $isSelected: boolean }>;\n\nexport const StyledFilterButtonItem = styled.div<StyledFilterButtonItemProps>`\n    position: relative;\n    line-height: 1;\n    cursor: pointer;\n    user-select: none;\n    padding: ${({ $size }) => ($size === FilterButtonSize.Normal ? '8px 14px' : '4px 8px')};\n\n    display: flex;\n    align-items: center;\n\n    &:hover > div:last-child {\n        ${({ $isSelected }) =>\n            !$isSelected &&\n            css`\n                opacity: 0.2;\n            `}\n    }\n`;\n\nexport const StyledFilterButtonItemLabel = styled.div`\n    display: flex;\n    gap: 5px;\n    align-items: baseline;\n    position: relative;\n    z-index: 1;\n`;\n\ntype StyledFilterButtonItemLabelTextProps = WithTheme<unknown>;\n\nexport const StyledFilterButtonItemLabelText = styled.p<StyledFilterButtonItemLabelTextProps>`\n    color: ${({ theme }: StyledFilterButtonItemLabelTextProps) => theme.text};\n    margin: 0;\n    line-height: 1;\n`;\n\ntype StyledFilterButtonItemLabelCountProps = WithTheme<unknown>;\n\nexport const StyledFilterButtonItemLabelCount = styled.p<StyledFilterButtonItemLabelCountProps>`\n    color: ${({ theme }: StyledFilterButtonItemLabelTextProps) => theme.text};\n    margin: 0;\n    line-height: 1;\n    font-weight: bold;\n`;\n\ntype StyledFilterButtonItemBorderProps = WithTheme<{\n    $shape: FilterButtonItemShape;\n    $color: CSSProperties['color'];\n    $isSelected: boolean;\n}>;\n\nexport const StyledFilterButtonItemBorder = styled.div<StyledFilterButtonItemBorderProps>`\n    position: absolute;\n    top: 0;\n    left: 0;\n    height: 100%;\n    width: 100%;\n    opacity: 0.4;\n    z-index: 0;\n    border-radius: ${({ $shape }) => ($shape === FilterButtonItemShape.Round ? 100 : 3)}px;\n\n    ${({ $color, theme, $isSelected }: StyledFilterButtonItemBorderProps) =>\n        !$isSelected &&\n        css`\n            border-width: 1px;\n            border-style: solid;\n            border-color: ${$color ?? theme.headline};\n        `};\n`;\n\ntype StyledFilterButtonItemBackgroundProps = WithTheme<{\n    $shape: FilterButtonItemShape;\n    $color: CSSProperties['color'];\n    $isSelected: boolean;\n}>;\n\nexport const StyledMotionFilterButtonItemBackground = styled(\n    motion.div,\n)<StyledFilterButtonItemBackgroundProps>`\n    position: absolute;\n    top: 0;\n    left: 0;\n    height: 100%;\n    width: 100%;\n    z-index: 0;\n    opacity: ${({ $isSelected }) => ($isSelected ? 0.4 : 0)};\n    transition: opacity 0.5s ease;\n    border-radius: ${({ $shape }) => ($shape === FilterButtonItemShape.Round ? 100 : 3)}px;\n    background-color: ${({ $color, theme }: StyledFilterButtonItemBackgroundProps) =>\n        $color ?? theme.headline};\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,eAAe;AAEtC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAC/C,SAASC,qBAAqB,EAAEC,gBAAgB,QAAQ,8BAA8B;AAKtF,OAAO,MAAMC,sBAAsB,GAAGJ,MAAM,CAACK,GAAgC;AAC7E;AACA;AACA;AACA;AACA,eAAeC,IAAA;EAAA,IAAC;IAAEC;EAAM,CAAC,GAAAD,IAAA;EAAA,OAAMC,KAAK,KAAKJ,gBAAgB,CAACK,MAAM,GAAG,UAAU,GAAG,SAAS;AAAA,CAAC;AAC1F;AACA;AACA;AACA;AACA;AACA,UAAUC,KAAA;EAAA,IAAC;IAAEC;EAAY,CAAC,GAAAD,KAAA;EAAA,OACd,CAACC,WAAW,IACZT,GAAG;AACf;AACA,aAAa;AAAA;AACb;AACA,CAAC;AAED,OAAO,MAAMU,2BAA2B,GAAGX,MAAM,CAACK,GAAG;AACrD;AACA;AACA;AACA;AACA;AACA,CAAC;AAID,OAAO,MAAMO,+BAA+B,GAAGZ,MAAM,CAACa,CAAuC;AAC7F,aAAaC,KAAA;EAAA,IAAC;IAAEC;EAA4C,CAAC,GAAAD,KAAA;EAAA,OAAKC,KAAK,CAACC,IAAI;AAAA;AAC5E;AACA;AACA,CAAC;AAID,OAAO,MAAMC,gCAAgC,GAAGjB,MAAM,CAACa,CAAwC;AAC/F,aAAaK,KAAA;EAAA,IAAC;IAAEH;EAA4C,CAAC,GAAAG,KAAA;EAAA,OAAKH,KAAK,CAACC,IAAI;AAAA;AAC5E;AACA;AACA;AACA,CAAC;AAQD,OAAO,MAAMG,4BAA4B,GAAGnB,MAAM,CAACK,GAAsC;AACzF;AACA;AACA;AACA;AACA;AACA;AACA;AACA,qBAAqBe,KAAA;EAAA,IAAC;IAAEC;EAAO,CAAC,GAAAD,KAAA;EAAA,OAAMC,MAAM,KAAKnB,qBAAqB,CAACoB,KAAK,GAAG,GAAG,GAAG,CAAC;AAAA,CAAC;AACvF;AACA,MAAMC,KAAA;EAAA,IAAC;IAAEC,MAAM;IAAET,KAAK;IAAEL;EAA+C,CAAC,GAAAa,KAAA;EAAA,OAChE,CAACb,WAAW,IACZT,GAAG;AACX;AACA;AACA,4BAA4BuB,MAAM,IAAIT,KAAK,CAACU,QAAQ;AACpD,SAAS;AAAA;AACT,CAAC;AAQD,OAAO,MAAMC,sCAAsC,GAAG1B,MAAM,CACxDD,MAAM,CAACM,GACX,CAAwC;AACxC;AACA;AACA;AACA;AACA;AACA;AACA,eAAesB,KAAA;EAAA,IAAC;IAAEjB;EAAY,CAAC,GAAAiB,KAAA;EAAA,OAAMjB,WAAW,GAAG,GAAG,GAAG,CAAC;AAAA,CAAC;AAC3D;AACA,qBAAqBkB,KAAA;EAAA,IAAC;IAAEP;EAAO,CAAC,GAAAO,KAAA;EAAA,OAAMP,MAAM,KAAKnB,qBAAqB,CAACoB,KAAK,GAAG,GAAG,GAAG,CAAC;AAAA,CAAC;AACvF,wBAAwBO,KAAA;EAAA,IAAC;IAAEL,MAAM;IAAET;EAA6C,CAAC,GAAAc,KAAA;EAAA,OACzEL,MAAM,IAAIT,KAAK,CAACU,QAAQ;AAAA;AAChC,CAAC","ignoreList":[]}
+{"version":3,"file":"FilterButton.styles.js","names":["motion","styled","css","FilterButtonItemShape","FilterButtonSize","StyledFilterButtonItem","div","_ref","$size","Normal","_ref2","$isSelected","StyledFilterButtonItemLabel","StyledFilterButtonItemLabelText","p","_ref3","theme","text","StyledFilterButtonItemLabelCount","_ref4","StyledFilterButtonItemBorder","_ref5","$shape","Round","_ref6","$color","headline","StyledMotionFilterButtonItemBackground","_ref7","_ref8","_ref9"],"sources":["../../../../../src/components/filter-buttons/filter-button/FilterButton.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport type { CSSProperties } from 'react';\nimport styled, { css } from 'styled-components';\nimport { FilterButtonItemShape, FilterButtonSize } from '../../../types/filterButtons';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledFilterButtonItemProps = WithTheme<{ $size: FilterButtonSize; $isSelected: boolean }>;\n\nexport const StyledFilterButtonItem = styled.div<StyledFilterButtonItemProps>`\n    position: relative;\n    line-height: 1;\n    cursor: pointer;\n    user-select: none;\n    padding: ${({ $size }) => ($size === FilterButtonSize.Normal ? '8px 14px' : '4px 8px')};\n\n    display: flex;\n    align-items: center;\n\n    &:hover > div:last-child {\n        ${({ $isSelected }) =>\n            !$isSelected &&\n            css`\n                opacity: 0.2;\n            `}\n    }\n`;\n\nexport const StyledFilterButtonItemLabel = styled.div`\n    display: flex;\n    gap: 5px;\n    align-items: baseline;\n    position: relative;\n    z-index: 1;\n`;\n\ntype StyledFilterButtonItemLabelTextProps = WithTheme<unknown>;\n\nexport const StyledFilterButtonItemLabelText = styled.p<StyledFilterButtonItemLabelTextProps>`\n    color: ${({ theme }: StyledFilterButtonItemLabelTextProps) => theme.text};\n    margin: 0;\n    line-height: 1;\n`;\n\ntype StyledFilterButtonItemLabelCountProps = WithTheme<unknown>;\n\nexport const StyledFilterButtonItemLabelCount = styled.p<StyledFilterButtonItemLabelCountProps>`\n    color: ${({ theme }: StyledFilterButtonItemLabelTextProps) => theme.text};\n    margin: 0;\n    line-height: 1;\n    font-weight: bold;\n`;\n\ntype StyledFilterButtonItemBorderProps = WithTheme<{\n    $shape: FilterButtonItemShape;\n    $color: CSSProperties['color'];\n    $isSelected: boolean;\n}>;\n\nexport const StyledFilterButtonItemBorder = styled.div<StyledFilterButtonItemBorderProps>`\n    position: absolute;\n    top: 0;\n    left: 0;\n    height: 100%;\n    width: 100%;\n    opacity: 0.4;\n    z-index: 0;\n    border-radius: ${({ $shape }) => ($shape === FilterButtonItemShape.Round ? 100 : 3)}px;\n\n    ${({ $color, theme, $isSelected }: StyledFilterButtonItemBorderProps) =>\n        !$isSelected &&\n        css`\n            border-width: 1px;\n            border-style: solid;\n            border-color: ${$color ?? theme.headline};\n        `};\n`;\n\ntype StyledFilterButtonItemBackgroundProps = WithTheme<{\n    $shape: FilterButtonItemShape;\n    $color: CSSProperties['color'];\n    $isSelected: boolean;\n}>;\n\nexport const StyledMotionFilterButtonItemBackground = styled(\n    motion.div,\n)<StyledFilterButtonItemBackgroundProps>`\n    position: absolute;\n    top: 0;\n    left: 0;\n    height: 100%;\n    width: 100%;\n    z-index: 0;\n    opacity: ${({ $isSelected }) => ($isSelected ? 0.4 : 0)};\n    transition: opacity 0.5s ease;\n    border-radius: ${({ $shape }) => ($shape === FilterButtonItemShape.Round ? 100 : 3)}px;\n    background-color: ${({ $color, theme }: StyledFilterButtonItemBackgroundProps) =>\n        $color ?? theme.headline};\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,cAAc;AAErC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAC/C,SAASC,qBAAqB,EAAEC,gBAAgB,QAAQ,8BAA8B;AAKtF,OAAO,MAAMC,sBAAsB,GAAGJ,MAAM,CAACK,GAAgC;AAC7E;AACA;AACA;AACA;AACA,eAAeC,IAAA;EAAA,IAAC;IAAEC;EAAM,CAAC,GAAAD,IAAA;EAAA,OAAMC,KAAK,KAAKJ,gBAAgB,CAACK,MAAM,GAAG,UAAU,GAAG,SAAS;AAAA,CAAC;AAC1F;AACA;AACA;AACA;AACA;AACA,UAAUC,KAAA;EAAA,IAAC;IAAEC;EAAY,CAAC,GAAAD,KAAA;EAAA,OACd,CAACC,WAAW,IACZT,GAAG;AACf;AACA,aAAa;AAAA;AACb;AACA,CAAC;AAED,OAAO,MAAMU,2BAA2B,GAAGX,MAAM,CAACK,GAAG;AACrD;AACA;AACA;AACA;AACA;AACA,CAAC;AAID,OAAO,MAAMO,+BAA+B,GAAGZ,MAAM,CAACa,CAAuC;AAC7F,aAAaC,KAAA;EAAA,IAAC;IAAEC;EAA4C,CAAC,GAAAD,KAAA;EAAA,OAAKC,KAAK,CAACC,IAAI;AAAA;AAC5E;AACA;AACA,CAAC;AAID,OAAO,MAAMC,gCAAgC,GAAGjB,MAAM,CAACa,CAAwC;AAC/F,aAAaK,KAAA;EAAA,IAAC;IAAEH;EAA4C,CAAC,GAAAG,KAAA;EAAA,OAAKH,KAAK,CAACC,IAAI;AAAA;AAC5E;AACA;AACA;AACA,CAAC;AAQD,OAAO,MAAMG,4BAA4B,GAAGnB,MAAM,CAACK,GAAsC;AACzF;AACA;AACA;AACA;AACA;AACA;AACA;AACA,qBAAqBe,KAAA;EAAA,IAAC;IAAEC;EAAO,CAAC,GAAAD,KAAA;EAAA,OAAMC,MAAM,KAAKnB,qBAAqB,CAACoB,KAAK,GAAG,GAAG,GAAG,CAAC;AAAA,CAAC;AACvF;AACA,MAAMC,KAAA;EAAA,IAAC;IAAEC,MAAM;IAAET,KAAK;IAAEL;EAA+C,CAAC,GAAAa,KAAA;EAAA,OAChE,CAACb,WAAW,IACZT,GAAG;AACX;AACA;AACA,4BAA4BuB,MAAM,IAAIT,KAAK,CAACU,QAAQ;AACpD,SAAS;AAAA;AACT,CAAC;AAQD,OAAO,MAAMC,sCAAsC,GAAG1B,MAAM,CACxDD,MAAM,CAACM,GACX,CAAwC;AACxC;AACA;AACA;AACA;AACA;AACA;AACA,eAAesB,KAAA;EAAA,IAAC;IAAEjB;EAAY,CAAC,GAAAiB,KAAA;EAAA,OAAMjB,WAAW,GAAG,GAAG,GAAG,CAAC;AAAA,CAAC;AAC3D;AACA,qBAAqBkB,KAAA;EAAA,IAAC;IAAEP;EAAO,CAAC,GAAAO,KAAA;EAAA,OAAMP,MAAM,KAAKnB,qBAAqB,CAACoB,KAAK,GAAG,GAAG,GAAG,CAAC;AAAA,CAAC;AACvF,wBAAwBO,KAAA;EAAA,IAAC;IAAEL,MAAM;IAAET;EAA6C,CAAC,GAAAc,KAAA;EAAA,OACzEL,MAAM,IAAIT,KAAK,CAACU,QAAQ;AAAA;AAChC,CAAC","ignoreList":[]}

package/lib/esm/components/input/Input.styles.js

@@ -1,4 +1,4 @@
-import { motion } from 'framer-motion';
+import { motion } from 'motion/react';
 import styled, { css } from 'styled-components';
 export const StyledInput = styled.div`
     opacity: ${_ref => {

package/lib/esm/components/input/Input.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Input.styles.js","names":["motion","styled","css","StyledInput","div","_ref","$isDisabled","StyledInputContentWrapper","_ref2","theme","$shouldChangeColor","colorMode","_ref3","$isInvalid","wrong","_ref4","_ref5","$size","_ref6","$shouldShowOnlyBottomBorder","_ref7","$shouldRoundRightCorners","StyledInputContent","_ref8","StyledInputField","input","_ref9","text","_ref10","$placeholderWidth","_ref11","$shouldShowCenteredContent","StyledMotionInputLabelWrapper","label","StyledMotionInputElement","StyledInputLabel","_ref12","StyledMotionInputClearIcon","_ref13","_ref14","_ref15","StyledInputIconWrapper","StyledInputRightElement"],"sources":["../../../../src/components/input/Input.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport type { InputSize } from './Input';\n\ntype StyledInputProps = WithTheme<{ $isDisabled?: boolean }>;\n\nexport const StyledInput = styled.div<StyledInputProps>`\n    opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n    display: flex;\n    width: 100%;\n`;\n\ntype StyledInputContentWrapperProps = WithTheme<{\n    $shouldRoundRightCorners: boolean;\n    $shouldShowOnlyBottomBorder?: boolean;\n    $isInvalid?: boolean;\n    $shouldChangeColor: boolean;\n    $size: InputSize;\n}>;\n\nexport const StyledInputContentWrapper = styled.div<StyledInputContentWrapperProps>`\n    align-items: center;\n    background-color: ${({ theme, $shouldChangeColor }: StyledInputContentWrapperProps) =>\n        theme.colorMode === 'classic' || $shouldChangeColor ? theme['000'] : theme['100']};\n    border: 1px solid\n        ${({ theme, $isInvalid }: StyledInputContentWrapperProps) =>\n            $isInvalid ? theme.wrong : 'rgba(160, 160, 160, 0.3)'};\n    color: ${({ theme }: StyledInputContentWrapperProps) => theme['006']};\n    display: flex;\n    justify-content: space-between;\n    width: 100%;\n    transition: opacity 0.3s ease;\n\n    ${({ $size }) =>\n        $size === 'small' &&\n        css`\n            height: 32px;\n        `}\n\n    ${({ $shouldShowOnlyBottomBorder, $size }) =>\n        !$shouldShowOnlyBottomBorder &&\n        css`\n            min-height: ${$size === 'medium' ? '42px' : '32px'};\n        `}\n\n    ${({ $shouldRoundRightCorners, $shouldShowOnlyBottomBorder, theme }) => {\n        if ($shouldShowOnlyBottomBorder) {\n            return css`\n                border-top: none;\n                border-right: none;\n                border-left: none;\n                background-color: transparent;\n                border-color: ${theme['408']};\n            `;\n        }\n\n        if ($shouldRoundRightCorners) {\n            return css`\n                border-radius: 3px;\n            `;\n        }\n\n        return css`\n            border-bottom-left-radius: 3px;\n            border-top-left-radius: 3px;\n            border-right: none;\n        `;\n    }}\n`;\n\ntype StyledInputContentProps = WithTheme<{ $shouldShowOnlyBottomBorder?: boolean }>;\n\nexport const StyledInputContent = styled.div<StyledInputContentProps>`\n    display: flex;\n    flex: 1 1 auto;\n    min-width: 0;\n    margin: ${({ $shouldShowOnlyBottomBorder }) =>\n        !$shouldShowOnlyBottomBorder ? '8px 10px' : '4px 0'};\n    position: relative;\n`;\n\ntype StyledInputFieldProps = WithTheme<{\n    $isInvalid?: boolean;\n    $shouldShowCenteredContent: boolean;\n    $placeholderWidth: number;\n}>;\n\nexport const StyledInputField = styled.input<StyledInputFieldProps>`\n    background: none;\n    border: none;\n    color: ${({ theme, $isInvalid }: StyledInputFieldProps) =>\n        $isInvalid ? theme.wrong : theme.text};\n    padding: 0;\n    width: ${({ $placeholderWidth }) => `calc(100% - ${$placeholderWidth}px)`};\n    line-height: 1em;\n\n    ${({ $shouldShowCenteredContent }) =>\n        $shouldShowCenteredContent &&\n        css`\n            text-align: center;\n        `}\n`;\n\nexport const StyledMotionInputLabelWrapper = styled(motion.label)`\n    align-items: center;\n    display: flex;\n    flex: 0 0 auto;\n    gap: 4px;\n    line-height: 1.3;\n    pointer-events: none;\n    position: absolute;\n    user-select: none;\n    max-width: 100%;\n`;\n\nexport const StyledMotionInputElement = styled(motion.div)`\n    display: flex;\n`;\n\ntype StyledInputLabelProps = WithTheme<{ $isInvalid?: boolean }>;\n\nexport const StyledInputLabel = styled.label<StyledInputLabelProps>`\n    line-height: 1.3;\n    pointer-events: none;\n    width: 100%;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    color: ${({ theme, $isInvalid }: StyledInputLabelProps) =>\n        $isInvalid ? theme.wrong : `rgba(${theme['text-rgb'] ?? ''}, 0.45)`};\n`;\n\ntype StyledMotionInputClearIconProps = WithTheme<{\n    $shouldShowOnlyBottomBorder?: boolean;\n    $size: InputSize;\n}>;\n\nexport const StyledMotionInputClearIcon = styled(motion.div)<StyledMotionInputClearIconProps>`\n    align-items: center;\n    border-left: ${({ $shouldShowOnlyBottomBorder }) =>\n        $shouldShowOnlyBottomBorder ? 'none' : '1px solid rgba(160, 160, 160, 0.3)'};\n    cursor: pointer;\n    display: flex;\n    flex: 0 0 auto;\n    height: ${({ $size }) => ($size === 'medium' ? '40px' : '30px')};\n    justify-content: center;\n    width: ${({ $size }) => ($size === 'medium' ? '40px' : '30px')};\n`;\n\nexport const StyledInputIconWrapper = styled.div`\n    align-items: baseline;\n    display: flex;\n    flex: 0 0 auto;\n    justify-content: center;\n    margin-left: 10px;\n`;\n\nexport const StyledInputRightElement = styled.div`\n    border-bottom-right-radius: 3px;\n    border-top-right-radius: 3px;\n    overflow: hidden;\n    flex: 0 0 auto;\n`;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Input.styles.js","names":["motion","styled","css","StyledInput","div","_ref","$isDisabled","StyledInputContentWrapper","_ref2","theme","$shouldChangeColor","colorMode","_ref3","$isInvalid","wrong","_ref4","_ref5","$size","_ref6","$shouldShowOnlyBottomBorder","_ref7","$shouldRoundRightCorners","StyledInputContent","_ref8","StyledInputField","input","_ref9","text","_ref10","$placeholderWidth","_ref11","$shouldShowCenteredContent","StyledMotionInputLabelWrapper","label","StyledMotionInputElement","StyledInputLabel","_ref12","StyledMotionInputClearIcon","_ref13","_ref14","_ref15","StyledInputIconWrapper","StyledInputRightElement"],"sources":["../../../../src/components/input/Input.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport type { InputSize } from './Input';\n\ntype StyledInputProps = WithTheme<{ $isDisabled?: boolean }>;\n\nexport const StyledInput = styled.div<StyledInputProps>`\n    opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n    display: flex;\n    width: 100%;\n`;\n\ntype StyledInputContentWrapperProps = WithTheme<{\n    $shouldRoundRightCorners: boolean;\n    $shouldShowOnlyBottomBorder?: boolean;\n    $isInvalid?: boolean;\n    $shouldChangeColor: boolean;\n    $size: InputSize;\n}>;\n\nexport const StyledInputContentWrapper = styled.div<StyledInputContentWrapperProps>`\n    align-items: center;\n    background-color: ${({ theme, $shouldChangeColor }: StyledInputContentWrapperProps) =>\n        theme.colorMode === 'classic' || $shouldChangeColor ? theme['000'] : theme['100']};\n    border: 1px solid\n        ${({ theme, $isInvalid }: StyledInputContentWrapperProps) =>\n            $isInvalid ? theme.wrong : 'rgba(160, 160, 160, 0.3)'};\n    color: ${({ theme }: StyledInputContentWrapperProps) => theme['006']};\n    display: flex;\n    justify-content: space-between;\n    width: 100%;\n    transition: opacity 0.3s ease;\n\n    ${({ $size }) =>\n        $size === 'small' &&\n        css`\n            height: 32px;\n        `}\n\n    ${({ $shouldShowOnlyBottomBorder, $size }) =>\n        !$shouldShowOnlyBottomBorder &&\n        css`\n            min-height: ${$size === 'medium' ? '42px' : '32px'};\n        `}\n\n    ${({ $shouldRoundRightCorners, $shouldShowOnlyBottomBorder, theme }) => {\n        if ($shouldShowOnlyBottomBorder) {\n            return css`\n                border-top: none;\n                border-right: none;\n                border-left: none;\n                background-color: transparent;\n                border-color: ${theme['408']};\n            `;\n        }\n\n        if ($shouldRoundRightCorners) {\n            return css`\n                border-radius: 3px;\n            `;\n        }\n\n        return css`\n            border-bottom-left-radius: 3px;\n            border-top-left-radius: 3px;\n            border-right: none;\n        `;\n    }}\n`;\n\ntype StyledInputContentProps = WithTheme<{ $shouldShowOnlyBottomBorder?: boolean }>;\n\nexport const StyledInputContent = styled.div<StyledInputContentProps>`\n    display: flex;\n    flex: 1 1 auto;\n    min-width: 0;\n    margin: ${({ $shouldShowOnlyBottomBorder }) =>\n        !$shouldShowOnlyBottomBorder ? '8px 10px' : '4px 0'};\n    position: relative;\n`;\n\ntype StyledInputFieldProps = WithTheme<{\n    $isInvalid?: boolean;\n    $shouldShowCenteredContent: boolean;\n    $placeholderWidth: number;\n}>;\n\nexport const StyledInputField = styled.input<StyledInputFieldProps>`\n    background: none;\n    border: none;\n    color: ${({ theme, $isInvalid }: StyledInputFieldProps) =>\n        $isInvalid ? theme.wrong : theme.text};\n    padding: 0;\n    width: ${({ $placeholderWidth }) => `calc(100% - ${$placeholderWidth}px)`};\n    line-height: 1em;\n\n    ${({ $shouldShowCenteredContent }) =>\n        $shouldShowCenteredContent &&\n        css`\n            text-align: center;\n        `}\n`;\n\nexport const StyledMotionInputLabelWrapper = styled(motion.label)`\n    align-items: center;\n    display: flex;\n    flex: 0 0 auto;\n    gap: 4px;\n    line-height: 1.3;\n    pointer-events: none;\n    position: absolute;\n    user-select: none;\n    max-width: 100%;\n`;\n\nexport const StyledMotionInputElement = styled(motion.div)`\n    display: flex;\n`;\n\ntype StyledInputLabelProps = WithTheme<{ $isInvalid?: boolean }>;\n\nexport const StyledInputLabel = styled.label<StyledInputLabelProps>`\n    line-height: 1.3;\n    pointer-events: none;\n    width: 100%;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    color: ${({ theme, $isInvalid }: StyledInputLabelProps) =>\n        $isInvalid ? theme.wrong : `rgba(${theme['text-rgb'] ?? ''}, 0.45)`};\n`;\n\ntype StyledMotionInputClearIconProps = WithTheme<{\n    $shouldShowOnlyBottomBorder?: boolean;\n    $size: InputSize;\n}>;\n\nexport const StyledMotionInputClearIcon = styled(motion.div)<StyledMotionInputClearIconProps>`\n    align-items: center;\n    border-left: ${({ $shouldShowOnlyBottomBorder }) =>\n        $shouldShowOnlyBottomBorder ? 'none' : '1px solid rgba(160, 160, 160, 0.3)'};\n    cursor: pointer;\n    display: flex;\n    flex: 0 0 auto;\n    height: ${({ $size }) => ($size === 'medium' ? '40px' : '30px')};\n    justify-content: center;\n    width: ${({ $size }) => ($size === 'medium' ? '40px' : '30px')};\n`;\n\nexport const StyledInputIconWrapper = styled.div`\n    align-items: baseline;\n    display: flex;\n    flex: 0 0 auto;\n    justify-content: center;\n    margin-left: 10px;\n`;\n\nexport const StyledInputRightElement = styled.div`\n    border-bottom-right-radius: 3px;\n    border-top-right-radius: 3px;\n    overflow: hidden;\n    flex: 0 0 auto;\n`;\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/list/List.js

@@ -1,4 +1,4 @@
-import { AnimatePresence, MotionConfig } from 'framer-motion';
+import { AnimatePresence, MotionConfig } from 'motion/react';
 import React, { useCallback, useMemo, useState } from 'react';
 export const ListContext = /*#__PURE__*/React.createContext({
   incrementExpandableItemCount: () => () => {},

package/lib/esm/components/list/List.js.map

@@ -1 +1 @@
-{"version":3,"file":"List.js","names":["AnimatePresence","MotionConfig","React","useCallback","useMemo","useState","ListContext","createContext","incrementExpandableItemCount","isAnyItemExpandable","isWrapped","openItemUuid","undefined","updateOpenItemUuid","displayName","List","_ref","children","setOpenItemUuid","expandableItemCount","setExpandableItemCount","uuid","shouldOnlyOpen","arguments","length","currentOpenItemUuid","count","providerValue","createElement","Provider","value","transition","type","initial"],"sources":["../../../../src/components/list/List.tsx"],"sourcesContent":["import { AnimatePresence, MotionConfig } from 'framer-motion';\nimport React, { FC, ReactNode, useCallback, useMemo, useState } from 'react';\n\ninterface IListContext {\n    incrementExpandableItemCount: () => () => void;\n    isAnyItemExpandable: boolean;\n    isWrapped: boolean;\n    openItemUuid: string | undefined;\n    updateOpenItemUuid: (uuid: string, options?: { shouldOnlyOpen?: boolean }) => void;\n}\n\nexport const ListContext = React.createContext<IListContext>({\n    incrementExpandableItemCount: () => () => {},\n    isAnyItemExpandable: false,\n    isWrapped: false,\n    openItemUuid: undefined,\n    updateOpenItemUuid: () => {},\n});\n\nListContext.displayName = 'ListContext';\n\ntype ListProps = {\n    /**\n     * The items of the list\n     */\n    children: ReactNode;\n    /**\n     * This value must be set for nested AccordionGroup components. This adjusts the style of\n     * the head and the padding of the content accordions.\n     */\n    isWrapped?: boolean;\n};\n\nconst List: FC<ListProps> = ({ children, isWrapped = false }) => {\n    const [openItemUuid, setOpenItemUuid] = useState<IListContext['openItemUuid']>(undefined);\n    const [expandableItemCount, setExpandableItemCount] = useState<number>(0);\n\n    const updateOpenItemUuid = useCallback<IListContext['updateOpenItemUuid']>(\n        (uuid, { shouldOnlyOpen } = {}) => {\n            setOpenItemUuid((currentOpenItemUuid) => {\n                if (currentOpenItemUuid === uuid && shouldOnlyOpen !== true) {\n                    return undefined;\n                }\n\n                return uuid;\n            });\n        },\n        [setOpenItemUuid],\n    );\n\n    const incrementExpandableItemCount = useCallback(() => {\n        setExpandableItemCount((count) => count + 1);\n\n        return () => {\n            setExpandableItemCount((count) => count - 1);\n        };\n    }, [setExpandableItemCount]);\n\n    const providerValue = useMemo<IListContext>(\n        () => ({\n            incrementExpandableItemCount,\n            isAnyItemExpandable: expandableItemCount > 0,\n            isWrapped,\n            openItemUuid,\n            updateOpenItemUuid,\n        }),\n        [\n            expandableItemCount,\n            incrementExpandableItemCount,\n            isWrapped,\n            openItemUuid,\n            updateOpenItemUuid,\n        ],\n    );\n\n    return (\n        <ListContext.Provider value={providerValue}>\n            <MotionConfig transition={{ type: 'tween' }}>\n                <AnimatePresence initial={false}>{children}</AnimatePresence>\n            </MotionConfig>\n        </ListContext.Provider>\n    );\n};\n\nList.displayName = 'List';\n\nexport default List;\n"],"mappings":"AAAA,SAASA,eAAe,EAAEC,YAAY,QAAQ,eAAe;AAC7D,OAAOC,KAAK,IAAmBC,WAAW,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,OAAO;AAU5E,OAAO,MAAMC,WAAW,gBAAGJ,KAAK,CAACK,aAAa,CAAe;EACzDC,4BAA4B,EAAEA,CAAA,KAAM,MAAM,CAAC,CAAC;EAC5CC,mBAAmB,EAAE,KAAK;EAC1BC,SAAS,EAAE,KAAK;EAChBC,YAAY,EAAEC,SAAS;EACvBC,kBAAkB,EAAEA,CAAA,KAAM,CAAC;AAC/B,CAAC,CAAC;AAEFP,WAAW,CAACQ,WAAW,GAAG,aAAa;AAcvC,MAAMC,IAAmB,GAAGC,IAAA,IAAqC;EAAA,IAApC;IAAEC,QAAQ;IAAEP,SAAS,GAAG;EAAM,CAAC,GAAAM,IAAA;EACxD,MAAM,CAACL,YAAY,EAAEO,eAAe,CAAC,GAAGb,QAAQ,CAA+BO,SAAS,CAAC;EACzF,MAAM,CAACO,mBAAmB,EAAEC,sBAAsB,CAAC,GAAGf,QAAQ,CAAS,CAAC,CAAC;EAEzE,MAAMQ,kBAAkB,GAAGV,WAAW,CAClC,UAACkB,IAAI,EAA8B;IAAA,IAA5B;MAAEC;IAAe,CAAC,GAAAC,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAX,SAAA,GAAAW,SAAA,MAAG,CAAC,CAAC;IAC1BL,eAAe,CAAEO,mBAAmB,IAAK;MACrC,IAAIA,mBAAmB,KAAKJ,IAAI,IAAIC,cAAc,KAAK,IAAI,EAAE;QACzD,OAAOV,SAAS;MACpB;MAEA,OAAOS,IAAI;IACf,CAAC,CAAC;EACN,CAAC,EACD,CAACH,eAAe,CACpB,CAAC;EAED,MAAMV,4BAA4B,GAAGL,WAAW,CAAC,MAAM;IACnDiB,sBAAsB,CAAEM,KAAK,IAAKA,KAAK,GAAG,CAAC,CAAC;IAE5C,OAAO,MAAM;MACTN,sBAAsB,CAAEM,KAAK,IAAKA,KAAK,GAAG,CAAC,CAAC;IAChD,CAAC;EACL,CAAC,EAAE,CAACN,sBAAsB,CAAC,CAAC;EAE5B,MAAMO,aAAa,GAAGvB,OAAO,CACzB,OAAO;IACHI,4BAA4B;IAC5BC,mBAAmB,EAAEU,mBAAmB,GAAG,CAAC;IAC5CT,SAAS;IACTC,YAAY;IACZE;EACJ,CAAC,CAAC,EACF,CACIM,mBAAmB,EACnBX,4BAA4B,EAC5BE,SAAS,EACTC,YAAY,EACZE,kBAAkB,CAE1B,CAAC;EAED,oBACIX,KAAA,CAAA0B,aAAA,CAACtB,WAAW,CAACuB,QAAQ;IAACC,KAAK,EAAEH;EAAc,gBACvCzB,KAAA,CAAA0B,aAAA,CAAC3B,YAAY;IAAC8B,UAAU,EAAE;MAAEC,IAAI,EAAE;IAAQ;EAAE,gBACxC9B,KAAA,CAAA0B,aAAA,CAAC5B,eAAe;IAACiC,OAAO,EAAE;EAAM,GAAEhB,QAA0B,CAClD,CACI,CAAC;AAE/B,CAAC;AAEDF,IAAI,CAACD,WAAW,GAAG,MAAM;AAEzB,eAAeC,IAAI","ignoreList":[]}
+{"version":3,"file":"List.js","names":["AnimatePresence","MotionConfig","React","useCallback","useMemo","useState","ListContext","createContext","incrementExpandableItemCount","isAnyItemExpandable","isWrapped","openItemUuid","undefined","updateOpenItemUuid","displayName","List","_ref","children","setOpenItemUuid","expandableItemCount","setExpandableItemCount","uuid","shouldOnlyOpen","arguments","length","currentOpenItemUuid","count","providerValue","createElement","Provider","value","transition","type","initial"],"sources":["../../../../src/components/list/List.tsx"],"sourcesContent":["import { AnimatePresence, MotionConfig } from 'motion/react';\nimport React, { FC, ReactNode, useCallback, useMemo, useState } from 'react';\n\ninterface IListContext {\n    incrementExpandableItemCount: () => () => void;\n    isAnyItemExpandable: boolean;\n    isWrapped: boolean;\n    openItemUuid: string | undefined;\n    updateOpenItemUuid: (uuid: string, options?: { shouldOnlyOpen?: boolean }) => void;\n}\n\nexport const ListContext = React.createContext<IListContext>({\n    incrementExpandableItemCount: () => () => {},\n    isAnyItemExpandable: false,\n    isWrapped: false,\n    openItemUuid: undefined,\n    updateOpenItemUuid: () => {},\n});\n\nListContext.displayName = 'ListContext';\n\ntype ListProps = {\n    /**\n     * The items of the list\n     */\n    children: ReactNode;\n    /**\n     * This value must be set for nested AccordionGroup components. This adjusts the style of\n     * the head and the padding of the content accordions.\n     */\n    isWrapped?: boolean;\n};\n\nconst List: FC<ListProps> = ({ children, isWrapped = false }) => {\n    const [openItemUuid, setOpenItemUuid] = useState<IListContext['openItemUuid']>(undefined);\n    const [expandableItemCount, setExpandableItemCount] = useState<number>(0);\n\n    const updateOpenItemUuid = useCallback<IListContext['updateOpenItemUuid']>(\n        (uuid, { shouldOnlyOpen } = {}) => {\n            setOpenItemUuid((currentOpenItemUuid) => {\n                if (currentOpenItemUuid === uuid && shouldOnlyOpen !== true) {\n                    return undefined;\n                }\n\n                return uuid;\n            });\n        },\n        [setOpenItemUuid],\n    );\n\n    const incrementExpandableItemCount = useCallback(() => {\n        setExpandableItemCount((count) => count + 1);\n\n        return () => {\n            setExpandableItemCount((count) => count - 1);\n        };\n    }, [setExpandableItemCount]);\n\n    const providerValue = useMemo<IListContext>(\n        () => ({\n            incrementExpandableItemCount,\n            isAnyItemExpandable: expandableItemCount > 0,\n            isWrapped,\n            openItemUuid,\n            updateOpenItemUuid,\n        }),\n        [\n            expandableItemCount,\n            incrementExpandableItemCount,\n            isWrapped,\n            openItemUuid,\n            updateOpenItemUuid,\n        ],\n    );\n\n    return (\n        <ListContext.Provider value={providerValue}>\n            <MotionConfig transition={{ type: 'tween' }}>\n                <AnimatePresence initial={false}>{children}</AnimatePresence>\n            </MotionConfig>\n        </ListContext.Provider>\n    );\n};\n\nList.displayName = 'List';\n\nexport default List;\n"],"mappings":"AAAA,SAASA,eAAe,EAAEC,YAAY,QAAQ,cAAc;AAC5D,OAAOC,KAAK,IAAmBC,WAAW,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,OAAO;AAU5E,OAAO,MAAMC,WAAW,gBAAGJ,KAAK,CAACK,aAAa,CAAe;EACzDC,4BAA4B,EAAEA,CAAA,KAAM,MAAM,CAAC,CAAC;EAC5CC,mBAAmB,EAAE,KAAK;EAC1BC,SAAS,EAAE,KAAK;EAChBC,YAAY,EAAEC,SAAS;EACvBC,kBAAkB,EAAEA,CAAA,KAAM,CAAC;AAC/B,CAAC,CAAC;AAEFP,WAAW,CAACQ,WAAW,GAAG,aAAa;AAcvC,MAAMC,IAAmB,GAAGC,IAAA,IAAqC;EAAA,IAApC;IAAEC,QAAQ;IAAEP,SAAS,GAAG;EAAM,CAAC,GAAAM,IAAA;EACxD,MAAM,CAACL,YAAY,EAAEO,eAAe,CAAC,GAAGb,QAAQ,CAA+BO,SAAS,CAAC;EACzF,MAAM,CAACO,mBAAmB,EAAEC,sBAAsB,CAAC,GAAGf,QAAQ,CAAS,CAAC,CAAC;EAEzE,MAAMQ,kBAAkB,GAAGV,WAAW,CAClC,UAACkB,IAAI,EAA8B;IAAA,IAA5B;MAAEC;IAAe,CAAC,GAAAC,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAX,SAAA,GAAAW,SAAA,MAAG,CAAC,CAAC;IAC1BL,eAAe,CAAEO,mBAAmB,IAAK;MACrC,IAAIA,mBAAmB,KAAKJ,IAAI,IAAIC,cAAc,KAAK,IAAI,EAAE;QACzD,OAAOV,SAAS;MACpB;MAEA,OAAOS,IAAI;IACf,CAAC,CAAC;EACN,CAAC,EACD,CAACH,eAAe,CACpB,CAAC;EAED,MAAMV,4BAA4B,GAAGL,WAAW,CAAC,MAAM;IACnDiB,sBAAsB,CAAEM,KAAK,IAAKA,KAAK,GAAG,CAAC,CAAC;IAE5C,OAAO,MAAM;MACTN,sBAAsB,CAAEM,KAAK,IAAKA,KAAK,GAAG,CAAC,CAAC;IAChD,CAAC;EACL,CAAC,EAAE,CAACN,sBAAsB,CAAC,CAAC;EAE5B,MAAMO,aAAa,GAAGvB,OAAO,CACzB,OAAO;IACHI,4BAA4B;IAC5BC,mBAAmB,EAAEU,mBAAmB,GAAG,CAAC;IAC5CT,SAAS;IACTC,YAAY;IACZE;EACJ,CAAC,CAAC,EACF,CACIM,mBAAmB,EACnBX,4BAA4B,EAC5BE,SAAS,EACTC,YAAY,EACZE,kBAAkB,CAE1B,CAAC;EAED,oBACIX,KAAA,CAAA0B,aAAA,CAACtB,WAAW,CAACuB,QAAQ;IAACC,KAAK,EAAEH;EAAc,gBACvCzB,KAAA,CAAA0B,aAAA,CAAC3B,YAAY;IAAC8B,UAAU,EAAE;MAAEC,IAAI,EAAE;IAAQ;EAAE,gBACxC9B,KAAA,CAAA0B,aAAA,CAAC5B,eAAe;IAACiC,OAAO,EAAE;EAAM,GAAEhB,QAA0B,CAClD,CACI,CAAC;AAE/B,CAAC;AAEDF,IAAI,CAACD,WAAW,GAAG,MAAM;AAEzB,eAAeC,IAAI","ignoreList":[]}

package/lib/esm/components/list/list-item/ListItem.js

@@ -1,4 +1,4 @@
-import { AnimatePresence } from 'framer-motion';
+import { AnimatePresence } from 'motion/react';
 import React, { useCallback, useContext, useEffect, useRef } from 'react';
 import { useUuid } from '../../../hooks/uuid';
 import { AccordionContext } from '../../accordion/Accordion';

package/lib/esm/components/list/list-item/ListItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItem.js","names":["AnimatePresence","React","useCallback","useContext","useEffect","useRef","useUuid","AccordionContext","AreaContextProvider","ListContext","ListItemBody","ListItemHead","StyledMotionListItem","ListItem","_ref","children","hoverItem","icons","imageBackground","images","isDefaultOpen","isOpen","isTitleGreyed","leftElements","onClick","onClose","onLongPress","onOpen","rightElements","shouldForceBackground","shouldHideBottomLine","shouldHideImageOrIconBackground","shouldHideIndicator","shouldOpenImageOnClick","shouldPreventLayoutAnimation","shouldShowRoundImageOrIcon","shouldShowSeparatorBelow","subtitle","title","titleElement","incrementExpandableItemCount","isAnyItemExpandable","isWrapped","openItemUuid","updateOpenItemUuid","isParentAccordionWrapped","isInitialRenderRef","uuid","isExpandable","undefined","isItemOpen","onCloseRef","onOpenRef","current","handleHeadClick","event","shouldOnlyOpen","isClickable","createElement","animate","height","opacity","className","exit","initial","key","layout","$isClickable","$isInAccordion","$isOpen","$isWrapped","$shouldForceBackground","$shouldHideBottomLine","$shouldHideIndicator","$shouldShowSeparatorBelow","id","displayName"],"sources":["../../../../../src/components/list/list-item/ListItem.tsx"],"sourcesContent":["import { AnimatePresence } from 'framer-motion';\nimport React, {\n    CSSProperties,\n    FC,\n    MouseEventHandler,\n    ReactNode,\n    TouchEventHandler,\n    useCallback,\n    useContext,\n    useEffect,\n    useRef,\n} from 'react';\nimport { useUuid } from '../../../hooks/uuid';\nimport type { IListItemRightElements } from '../../../types/list';\nimport { AccordionContext } from '../../accordion/Accordion';\nimport AreaContextProvider from '../../area-provider/AreaContextProvider';\nimport { ListContext } from '../List';\nimport ListItemBody from './list-item-body/ListItemBody';\nimport ListItemHead from './list-item-head/ListItemHead';\nimport { StyledMotionListItem } from './ListItem.styles';\n\nexport type ListItemElements = [ReactNode, ...ReactNode[]];\n\nexport type ListItemProps = {\n    /**\n     * The content of the `ListItem` body. When the `ListItem` has children,\n     * it can be opened and also gets an icon as an indicator automatically.\n     */\n    children?: ReactNode;\n    /**\n     * Element that is displayed when hovering over the `ListItem` on the right\n     * side. On mobile devices, this element is not displayed.\n     */\n    hoverItem?: ReactNode;\n    /**\n     * The FontAwesome or tobit icons to render like an image on the left side\n     * of the header. Multiple icons are stacked. See the `Icon` component\n     * documentation for more information.\n     */\n    icons?: string[];\n    /**\n     * The background of the image. This is only used if images are passed.\n     */\n    imageBackground?: CSSProperties['background'];\n    /**\n     * A list of image URLs that are displayed on the left side of the header.\n     * If multiple URLs are passed, the image is assembled from the first three\n     * image URLs as a puzzle.\n     */\n    images?: string[];\n    /**\n     * This can be used to automatically expand the `ListItem` during the first render.\n     */\n    isDefaultOpen?: boolean;\n    /**\n     * This overrides the internal opening state of the item and makes it controlled.\n     */\n    isOpen?: boolean;\n    /**\n     * Whether the ListItem locks disabled but has full functionality.\n     */\n    isTitleGreyed?: boolean;\n    /**\n     * Elements that are displayed on the left side of the header. If multiple\n     * elements are specified, they are displayed one aside the other.\n     */\n    leftElements?: ListItemElements;\n    /**\n     * Function to be executed when the header of the `ListItem` was clicked\n     */\n    onClick?: MouseEventHandler<HTMLDivElement>;\n    /**\n     * Function to be executed when the ListItem is closed.\n     */\n    onClose?: VoidFunction;\n    /**\n     * Function to be executed when the header of the `ListItem` is pressed for\n     * 400 milliseconds.\n     */\n    onLongPress?: TouchEventHandler<HTMLDivElement>;\n    /**\n     * Function to be executed when the ListItem is opened.\n     */\n    onOpen?: VoidFunction;\n    /**\n     * Elements that are displayed on the right side of the header. If multiple\n     * elements are specified, they are displayed one below the other.\n     */\n    rightElements?: IListItemRightElements;\n    /**\n     * This will force the background color of the ListItem to be used even if it is closed and not hovered.\n     */\n    shouldForceBackground?: boolean;\n    /**\n     * Whether the bottom line should be hidden.\n     */\n    shouldHideBottomLine?: boolean;\n    /**\n     * Whether the background and border of the shape on which the image or icon of the element is displayed should be\n     * hidden.\n     */\n    shouldHideImageOrIconBackground?: boolean;\n    /**\n     * If the `ListItem` is expandable, the indicator is displayed on the left\n     * side of the header. If this property is set to true, the indicator is\n     * hidden.\n     */\n    shouldHideIndicator?: boolean;\n    /**\n     * Whether the image should be opened on click.\n     */\n    shouldOpenImageOnClick?: boolean;\n    /**\n     * Whether the layout animation should be prevented. This is useful when the\n     * `ListItem` is used in a list with a lot of items and the layout animation\n     * is not desired.\n     */\n    shouldPreventLayoutAnimation?: boolean;\n    /**\n     * Whether the image or icon should be displayed in a round shape. This should be always used for images of persons.\n     */\n    shouldShowRoundImageOrIcon?: boolean;\n    /**\n     * Whether a separator should be displayed below this item. In this case, the border is displayed thicker than normal.\n     */\n    shouldShowSeparatorBelow?: boolean;\n    /**\n     * Subtitle of the `ListItem` displayed in the head below the title\n     */\n    subtitle?: ReactNode;\n    /**\n     * Title of the `ListItem` displayed in the head\n     */\n    title: ReactNode;\n    /**\n     * Additional elements to be displayed in the header next to the title.\n     */\n    titleElement?: ReactNode;\n};\n\nconst ListItem: FC<ListItemProps> = ({\n    children,\n    hoverItem,\n    icons,\n    imageBackground,\n    images,\n    isDefaultOpen,\n    isOpen,\n    isTitleGreyed,\n    leftElements,\n    onClick,\n    onClose,\n    onLongPress,\n    onOpen,\n    rightElements,\n    shouldForceBackground = false,\n    shouldHideBottomLine = false,\n    shouldHideImageOrIconBackground,\n    shouldHideIndicator = false,\n    shouldOpenImageOnClick = false,\n    shouldPreventLayoutAnimation = false,\n    shouldShowRoundImageOrIcon,\n    shouldShowSeparatorBelow = false,\n    subtitle,\n    title,\n    titleElement,\n}) => {\n    const {\n        incrementExpandableItemCount,\n        isAnyItemExpandable,\n        isWrapped,\n        openItemUuid,\n        updateOpenItemUuid,\n    } = useContext(ListContext);\n\n    const { isWrapped: isParentAccordionWrapped } = useContext(AccordionContext);\n\n    const isInitialRenderRef = useRef(true);\n\n    const uuid = useUuid();\n\n    const isExpandable = children !== undefined;\n    const isItemOpen = isOpen ?? openItemUuid === uuid;\n\n    const onCloseRef = useRef(onClose);\n    const onOpenRef = useRef(onOpen);\n\n    useEffect(() => {\n        onCloseRef.current = onClose;\n        onOpenRef.current = onOpen;\n    }, [isOpen, onClose, onOpen]);\n\n    useEffect(() => {\n        if (isInitialRenderRef.current) {\n            isInitialRenderRef.current = false;\n        } else if (isItemOpen) {\n            if (typeof onOpenRef.current === 'function') {\n                onOpenRef.current();\n            }\n        } else if (typeof onCloseRef.current === 'function') {\n            onCloseRef.current();\n        }\n    }, [isItemOpen]);\n\n    const handleHeadClick = useCallback<MouseEventHandler<HTMLDivElement>>(\n        (event) => {\n            if (isExpandable) {\n                updateOpenItemUuid(uuid);\n            }\n\n            if (typeof onClick === 'function') {\n                onClick(event);\n            }\n        },\n        [isExpandable, onClick, updateOpenItemUuid, uuid],\n    );\n\n    useEffect(() => {\n        if (isExpandable && !shouldHideIndicator) {\n            // The incrementExpandableItemCount function returns an cleanup\n            // function to decrement expandableItemCount if component unmounts\n            return incrementExpandableItemCount();\n        }\n\n        return undefined;\n    }, [incrementExpandableItemCount, isExpandable, shouldHideIndicator]);\n\n    useEffect(() => {\n        if (isDefaultOpen) {\n            updateOpenItemUuid(uuid, { shouldOnlyOpen: true });\n        }\n    }, [isDefaultOpen, updateOpenItemUuid, uuid]);\n\n    const isClickable = typeof onClick === 'function' || isExpandable;\n\n    return (\n        <StyledMotionListItem\n            animate={{ height: 'auto', opacity: 1 }}\n            className=\"beta-chayns-list-item\"\n            exit={{ height: 0, opacity: 0 }}\n            initial={{ height: 0, opacity: 0 }}\n            key={`list-item-${uuid}`}\n            layout={shouldPreventLayoutAnimation ? undefined : 'position'}\n            $isClickable={isClickable}\n            $isInAccordion={typeof isParentAccordionWrapped === 'boolean'}\n            $isOpen={isItemOpen}\n            $isWrapped={isWrapped}\n            $shouldForceBackground={shouldForceBackground}\n            $shouldHideBottomLine={shouldHideBottomLine}\n            $shouldHideIndicator={shouldHideIndicator}\n            $shouldShowSeparatorBelow={shouldShowSeparatorBelow}\n        >\n            <ListItemHead\n                hoverItem={hoverItem}\n                icons={icons}\n                imageBackground={imageBackground}\n                images={images}\n                isAnyItemExpandable={isAnyItemExpandable}\n                isExpandable={isExpandable}\n                isOpen={isItemOpen}\n                isTitleGreyed={isTitleGreyed}\n                leftElements={leftElements}\n                onClick={isClickable ? handleHeadClick : undefined}\n                onLongPress={onLongPress}\n                rightElements={rightElements}\n                shouldHideImageOrIconBackground={shouldHideImageOrIconBackground}\n                shouldHideIndicator={shouldHideIndicator}\n                shouldOpenImageOnClick={shouldOpenImageOnClick}\n                shouldShowRoundImageOrIcon={shouldShowRoundImageOrIcon}\n                subtitle={subtitle}\n                title={title}\n                titleElement={titleElement}\n            />\n            <AnimatePresence initial={false}>\n                {isExpandable && isItemOpen && (\n                    <ListItemBody id={uuid}>\n                        <AreaContextProvider>{children}</AreaContextProvider>\n                    </ListItemBody>\n                )}\n            </AnimatePresence>\n        </StyledMotionListItem>\n    );\n};\n\nListItem.displayName = 'ListItem';\n\nexport default ListItem;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"ListItem.js","names":["AnimatePresence","React","useCallback","useContext","useEffect","useRef","useUuid","AccordionContext","AreaContextProvider","ListContext","ListItemBody","ListItemHead","StyledMotionListItem","ListItem","_ref","children","hoverItem","icons","imageBackground","images","isDefaultOpen","isOpen","isTitleGreyed","leftElements","onClick","onClose","onLongPress","onOpen","rightElements","shouldForceBackground","shouldHideBottomLine","shouldHideImageOrIconBackground","shouldHideIndicator","shouldOpenImageOnClick","shouldPreventLayoutAnimation","shouldShowRoundImageOrIcon","shouldShowSeparatorBelow","subtitle","title","titleElement","incrementExpandableItemCount","isAnyItemExpandable","isWrapped","openItemUuid","updateOpenItemUuid","isParentAccordionWrapped","isInitialRenderRef","uuid","isExpandable","undefined","isItemOpen","onCloseRef","onOpenRef","current","handleHeadClick","event","shouldOnlyOpen","isClickable","createElement","animate","height","opacity","className","exit","initial","key","layout","$isClickable","$isInAccordion","$isOpen","$isWrapped","$shouldForceBackground","$shouldHideBottomLine","$shouldHideIndicator","$shouldShowSeparatorBelow","id","displayName"],"sources":["../../../../../src/components/list/list-item/ListItem.tsx"],"sourcesContent":["import { AnimatePresence } from 'motion/react';\nimport React, {\n    CSSProperties,\n    FC,\n    MouseEventHandler,\n    ReactNode,\n    TouchEventHandler,\n    useCallback,\n    useContext,\n    useEffect,\n    useRef,\n} from 'react';\nimport { useUuid } from '../../../hooks/uuid';\nimport type { IListItemRightElements } from '../../../types/list';\nimport { AccordionContext } from '../../accordion/Accordion';\nimport AreaContextProvider from '../../area-provider/AreaContextProvider';\nimport { ListContext } from '../List';\nimport ListItemBody from './list-item-body/ListItemBody';\nimport ListItemHead from './list-item-head/ListItemHead';\nimport { StyledMotionListItem } from './ListItem.styles';\n\nexport type ListItemElements = [ReactNode, ...ReactNode[]];\n\nexport type ListItemProps = {\n    /**\n     * The content of the `ListItem` body. When the `ListItem` has children,\n     * it can be opened and also gets an icon as an indicator automatically.\n     */\n    children?: ReactNode;\n    /**\n     * Element that is displayed when hovering over the `ListItem` on the right\n     * side. On mobile devices, this element is not displayed.\n     */\n    hoverItem?: ReactNode;\n    /**\n     * The FontAwesome or tobit icons to render like an image on the left side\n     * of the header. Multiple icons are stacked. See the `Icon` component\n     * documentation for more information.\n     */\n    icons?: string[];\n    /**\n     * The background of the image. This is only used if images are passed.\n     */\n    imageBackground?: CSSProperties['background'];\n    /**\n     * A list of image URLs that are displayed on the left side of the header.\n     * If multiple URLs are passed, the image is assembled from the first three\n     * image URLs as a puzzle.\n     */\n    images?: string[];\n    /**\n     * This can be used to automatically expand the `ListItem` during the first render.\n     */\n    isDefaultOpen?: boolean;\n    /**\n     * This overrides the internal opening state of the item and makes it controlled.\n     */\n    isOpen?: boolean;\n    /**\n     * Whether the ListItem locks disabled but has full functionality.\n     */\n    isTitleGreyed?: boolean;\n    /**\n     * Elements that are displayed on the left side of the header. If multiple\n     * elements are specified, they are displayed one aside the other.\n     */\n    leftElements?: ListItemElements;\n    /**\n     * Function to be executed when the header of the `ListItem` was clicked\n     */\n    onClick?: MouseEventHandler<HTMLDivElement>;\n    /**\n     * Function to be executed when the ListItem is closed.\n     */\n    onClose?: VoidFunction;\n    /**\n     * Function to be executed when the header of the `ListItem` is pressed for\n     * 400 milliseconds.\n     */\n    onLongPress?: TouchEventHandler<HTMLDivElement>;\n    /**\n     * Function to be executed when the ListItem is opened.\n     */\n    onOpen?: VoidFunction;\n    /**\n     * Elements that are displayed on the right side of the header. If multiple\n     * elements are specified, they are displayed one below the other.\n     */\n    rightElements?: IListItemRightElements;\n    /**\n     * This will force the background color of the ListItem to be used even if it is closed and not hovered.\n     */\n    shouldForceBackground?: boolean;\n    /**\n     * Whether the bottom line should be hidden.\n     */\n    shouldHideBottomLine?: boolean;\n    /**\n     * Whether the background and border of the shape on which the image or icon of the element is displayed should be\n     * hidden.\n     */\n    shouldHideImageOrIconBackground?: boolean;\n    /**\n     * If the `ListItem` is expandable, the indicator is displayed on the left\n     * side of the header. If this property is set to true, the indicator is\n     * hidden.\n     */\n    shouldHideIndicator?: boolean;\n    /**\n     * Whether the image should be opened on click.\n     */\n    shouldOpenImageOnClick?: boolean;\n    /**\n     * Whether the layout animation should be prevented. This is useful when the\n     * `ListItem` is used in a list with a lot of items and the layout animation\n     * is not desired.\n     */\n    shouldPreventLayoutAnimation?: boolean;\n    /**\n     * Whether the image or icon should be displayed in a round shape. This should be always used for images of persons.\n     */\n    shouldShowRoundImageOrIcon?: boolean;\n    /**\n     * Whether a separator should be displayed below this item. In this case, the border is displayed thicker than normal.\n     */\n    shouldShowSeparatorBelow?: boolean;\n    /**\n     * Subtitle of the `ListItem` displayed in the head below the title\n     */\n    subtitle?: ReactNode;\n    /**\n     * Title of the `ListItem` displayed in the head\n     */\n    title: ReactNode;\n    /**\n     * Additional elements to be displayed in the header next to the title.\n     */\n    titleElement?: ReactNode;\n};\n\nconst ListItem: FC<ListItemProps> = ({\n    children,\n    hoverItem,\n    icons,\n    imageBackground,\n    images,\n    isDefaultOpen,\n    isOpen,\n    isTitleGreyed,\n    leftElements,\n    onClick,\n    onClose,\n    onLongPress,\n    onOpen,\n    rightElements,\n    shouldForceBackground = false,\n    shouldHideBottomLine = false,\n    shouldHideImageOrIconBackground,\n    shouldHideIndicator = false,\n    shouldOpenImageOnClick = false,\n    shouldPreventLayoutAnimation = false,\n    shouldShowRoundImageOrIcon,\n    shouldShowSeparatorBelow = false,\n    subtitle,\n    title,\n    titleElement,\n}) => {\n    const {\n        incrementExpandableItemCount,\n        isAnyItemExpandable,\n        isWrapped,\n        openItemUuid,\n        updateOpenItemUuid,\n    } = useContext(ListContext);\n\n    const { isWrapped: isParentAccordionWrapped } = useContext(AccordionContext);\n\n    const isInitialRenderRef = useRef(true);\n\n    const uuid = useUuid();\n\n    const isExpandable = children !== undefined;\n    const isItemOpen = isOpen ?? openItemUuid === uuid;\n\n    const onCloseRef = useRef(onClose);\n    const onOpenRef = useRef(onOpen);\n\n    useEffect(() => {\n        onCloseRef.current = onClose;\n        onOpenRef.current = onOpen;\n    }, [isOpen, onClose, onOpen]);\n\n    useEffect(() => {\n        if (isInitialRenderRef.current) {\n            isInitialRenderRef.current = false;\n        } else if (isItemOpen) {\n            if (typeof onOpenRef.current === 'function') {\n                onOpenRef.current();\n            }\n        } else if (typeof onCloseRef.current === 'function') {\n            onCloseRef.current();\n        }\n    }, [isItemOpen]);\n\n    const handleHeadClick = useCallback<MouseEventHandler<HTMLDivElement>>(\n        (event) => {\n            if (isExpandable) {\n                updateOpenItemUuid(uuid);\n            }\n\n            if (typeof onClick === 'function') {\n                onClick(event);\n            }\n        },\n        [isExpandable, onClick, updateOpenItemUuid, uuid],\n    );\n\n    useEffect(() => {\n        if (isExpandable && !shouldHideIndicator) {\n            // The incrementExpandableItemCount function returns an cleanup\n            // function to decrement expandableItemCount if component unmounts\n            return incrementExpandableItemCount();\n        }\n\n        return undefined;\n    }, [incrementExpandableItemCount, isExpandable, shouldHideIndicator]);\n\n    useEffect(() => {\n        if (isDefaultOpen) {\n            updateOpenItemUuid(uuid, { shouldOnlyOpen: true });\n        }\n    }, [isDefaultOpen, updateOpenItemUuid, uuid]);\n\n    const isClickable = typeof onClick === 'function' || isExpandable;\n\n    return (\n        <StyledMotionListItem\n            animate={{ height: 'auto', opacity: 1 }}\n            className=\"beta-chayns-list-item\"\n            exit={{ height: 0, opacity: 0 }}\n            initial={{ height: 0, opacity: 0 }}\n            key={`list-item-${uuid}`}\n            layout={shouldPreventLayoutAnimation ? undefined : 'position'}\n            $isClickable={isClickable}\n            $isInAccordion={typeof isParentAccordionWrapped === 'boolean'}\n            $isOpen={isItemOpen}\n            $isWrapped={isWrapped}\n            $shouldForceBackground={shouldForceBackground}\n            $shouldHideBottomLine={shouldHideBottomLine}\n            $shouldHideIndicator={shouldHideIndicator}\n            $shouldShowSeparatorBelow={shouldShowSeparatorBelow}\n        >\n            <ListItemHead\n                hoverItem={hoverItem}\n                icons={icons}\n                imageBackground={imageBackground}\n                images={images}\n                isAnyItemExpandable={isAnyItemExpandable}\n                isExpandable={isExpandable}\n                isOpen={isItemOpen}\n                isTitleGreyed={isTitleGreyed}\n                leftElements={leftElements}\n                onClick={isClickable ? handleHeadClick : undefined}\n                onLongPress={onLongPress}\n                rightElements={rightElements}\n                shouldHideImageOrIconBackground={shouldHideImageOrIconBackground}\n                shouldHideIndicator={shouldHideIndicator}\n                shouldOpenImageOnClick={shouldOpenImageOnClick}\n                shouldShowRoundImageOrIcon={shouldShowRoundImageOrIcon}\n                subtitle={subtitle}\n                title={title}\n                titleElement={titleElement}\n            />\n            <AnimatePresence initial={false}>\n                {isExpandable && isItemOpen && (\n                    <ListItemBody id={uuid}>\n                        <AreaContextProvider>{children}</AreaContextProvider>\n                    </ListItemBody>\n                )}\n            </AnimatePresence>\n        </StyledMotionListItem>\n    );\n};\n\nListItem.displayName = 'ListItem';\n\nexport default ListItem;\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/list/list-item/ListItem.styles.js

@@ -1,4 +1,4 @@
-import { motion } from 'framer-motion';
+import { motion } from 'motion/react';
 import styled, { css } from 'styled-components';
 export const StyledMotionListItem = styled(motion.div)`
     overflow: hidden;

package/lib/esm/components/list/list-item/ListItem.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItem.styles.js","names":["motion","styled","css","StyledMotionListItem","div","_ref","$isInAccordion","$shouldHideIndicator","_ref2","$isOpen","$shouldForceBackground","theme","cardBackgroundOpacity","_ref3","$isClickable","_ref4","$isWrapped","$shouldShowSeparatorBelow","$shouldHideBottomLine","accordionLines","_ref5"],"sources":["../../../../../src/components/list/list-item/ListItem.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledListItemProps = WithTheme<{\n    $isClickable: boolean;\n    $isOpen: boolean;\n    $isInAccordion: boolean;\n    $isWrapped: boolean;\n    $shouldHideIndicator: boolean;\n    $shouldForceBackground?: boolean;\n    $shouldShowSeparatorBelow: boolean;\n    $shouldHideBottomLine: boolean;\n}>;\n\nexport const StyledMotionListItem = styled(motion.div)<StyledListItemProps>`\n    overflow: hidden;\n    transition: background-color 0.3s ease;\n\n    ${({ $isInAccordion, $shouldHideIndicator }: StyledListItemProps) =>\n        $isInAccordion &&\n        css`\n            padding-left: ${$shouldHideIndicator ? '16px' : '8px'};\n        `}\n\n    ${({ $isInAccordion, $isOpen,$shouldForceBackground, theme }) =>\n        ((!$isInAccordion &&\n        $isOpen) || $shouldForceBackground) &&\n        css`\n            background-color: rgba(${theme['100-rgb']}, ${theme.cardBackgroundOpacity});\n        `}\n\n    ${({ $isClickable, $isInAccordion, theme }) =>\n        $isClickable &&\n        !$isInAccordion &&\n        css`\n            &&:hover {\n                background-color: rgba(${theme['100-rgb']}, ${theme.cardBackgroundOpacity});\n            }\n        `}\n    \n    ${({\n        $isOpen,\n        $isInAccordion,\n        $isWrapped,\n        $shouldShowSeparatorBelow,\n           $shouldHideBottomLine,\n        theme,\n    }: StyledListItemProps) =>\n        ($shouldShowSeparatorBelow ||\n            ((!$isOpen || $isWrapped || $isInAccordion) && (theme.accordionLines && !$shouldHideBottomLine))) &&\n        css`\n            &&:not(:last-child) {\n                border-bottom: ${$shouldShowSeparatorBelow ? '4px' : '1px'} solid\n                    rgba(${theme['headline-rgb']}, 0.5);\n            }\n        `}\n\n    ${({ $isWrapped }) =>\n        $isWrapped &&\n        css`\n            padding-left: 26px;\n        `}\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,eAAe;AACtC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAc/C,OAAO,MAAMC,oBAAoB,GAAGF,MAAM,CAACD,MAAM,CAACI,GAAG,CAAsB;AAC3E;AACA;AACA;AACA,MAAMC,IAAA;EAAA,IAAC;IAAEC,cAAc;IAAEC;EAA0C,CAAC,GAAAF,IAAA;EAAA,OAC5DC,cAAc,IACdJ,GAAG;AACX,4BAA4BK,oBAAoB,GAAG,MAAM,GAAG,KAAK;AACjE,SAAS;AAAA;AACT;AACA,MAAMC,KAAA;EAAA,IAAC;IAAEF,cAAc;IAAEG,OAAO;IAACC,sBAAsB;IAAEC;EAAM,CAAC,GAAAH,KAAA;EAAA,OACxD,CAAE,CAACF,cAAc,IACjBG,OAAO,IAAKC,sBAAsB,KAClCR,GAAG;AACX,qCAAqCS,KAAK,CAAC,SAAS,CAAC,KAAKA,KAAK,CAACC,qBAAqB;AACrF,SAAS;AAAA;AACT;AACA,MAAMC,KAAA;EAAA,IAAC;IAAEC,YAAY;IAAER,cAAc;IAAEK;EAAM,CAAC,GAAAE,KAAA;EAAA,OACtCC,YAAY,IACZ,CAACR,cAAc,IACfJ,GAAG;AACX;AACA,yCAAyCS,KAAK,CAAC,SAAS,CAAC,KAAKA,KAAK,CAACC,qBAAqB;AACzF;AACA,SAAS;AAAA;AACT;AACA,MAAMG,KAAA;EAAA,IAAC;IACCN,OAAO;IACPH,cAAc;IACdU,UAAU;IACVC,yBAAyB;IACtBC,qBAAqB;IACxBP;EACiB,CAAC,GAAAI,KAAA;EAAA,OAClB,CAACE,yBAAyB,IACrB,CAAC,CAACR,OAAO,IAAIO,UAAU,IAAIV,cAAc,KAAMK,KAAK,CAACQ,cAAc,IAAI,CAACD,qBAAuB,KACpGhB,GAAG;AACX;AACA,iCAAiCe,yBAAyB,GAAG,KAAK,GAAG,KAAK;AAC1E,2BAA2BN,KAAK,CAAC,cAAc,CAAC;AAChD;AACA,SAAS;AAAA;AACT;AACA,MAAMS,KAAA;EAAA,IAAC;IAAEJ;EAAW,CAAC,GAAAI,KAAA;EAAA,OACbJ,UAAU,IACVd,GAAG;AACX;AACA,SAAS;AAAA;AACT,CAAC","ignoreList":[]}
+{"version":3,"file":"ListItem.styles.js","names":["motion","styled","css","StyledMotionListItem","div","_ref","$isInAccordion","$shouldHideIndicator","_ref2","$isOpen","$shouldForceBackground","theme","cardBackgroundOpacity","_ref3","$isClickable","_ref4","$isWrapped","$shouldShowSeparatorBelow","$shouldHideBottomLine","accordionLines","_ref5"],"sources":["../../../../../src/components/list/list-item/ListItem.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledListItemProps = WithTheme<{\n    $isClickable: boolean;\n    $isOpen: boolean;\n    $isInAccordion: boolean;\n    $isWrapped: boolean;\n    $shouldHideIndicator: boolean;\n    $shouldForceBackground?: boolean;\n    $shouldShowSeparatorBelow: boolean;\n    $shouldHideBottomLine: boolean;\n}>;\n\nexport const StyledMotionListItem = styled(motion.div)<StyledListItemProps>`\n    overflow: hidden;\n    transition: background-color 0.3s ease;\n\n    ${({ $isInAccordion, $shouldHideIndicator }: StyledListItemProps) =>\n        $isInAccordion &&\n        css`\n            padding-left: ${$shouldHideIndicator ? '16px' : '8px'};\n        `}\n\n    ${({ $isInAccordion, $isOpen, $shouldForceBackground, theme }) =>\n        ((!$isInAccordion && $isOpen) || $shouldForceBackground) &&\n        css`\n            background-color: rgba(${theme['100-rgb']}, ${theme.cardBackgroundOpacity});\n        `}\n\n    ${({ $isClickable, $isInAccordion, theme }) =>\n        $isClickable &&\n        !$isInAccordion &&\n        css`\n            &&:hover {\n                background-color: rgba(${theme['100-rgb']}, ${theme.cardBackgroundOpacity});\n            }\n        `}\n    \n    ${({\n        $isOpen,\n        $isInAccordion,\n        $isWrapped,\n        $shouldShowSeparatorBelow,\n        $shouldHideBottomLine,\n        theme,\n    }: StyledListItemProps) =>\n        ($shouldShowSeparatorBelow ||\n            ((!$isOpen || $isWrapped || $isInAccordion) &&\n                theme.accordionLines &&\n                !$shouldHideBottomLine)) &&\n        css`\n            &&:not(:last-child) {\n                border-bottom: ${$shouldShowSeparatorBelow ? '4px' : '1px'} solid\n                    rgba(${theme['headline-rgb']}, 0.5);\n            }\n        `}\n\n    ${({ $isWrapped }) =>\n        $isWrapped &&\n        css`\n            padding-left: 26px;\n        `}\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,cAAc;AACrC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAc/C,OAAO,MAAMC,oBAAoB,GAAGF,MAAM,CAACD,MAAM,CAACI,GAAG,CAAsB;AAC3E;AACA;AACA;AACA,MAAMC,IAAA;EAAA,IAAC;IAAEC,cAAc;IAAEC;EAA0C,CAAC,GAAAF,IAAA;EAAA,OAC5DC,cAAc,IACdJ,GAAG;AACX,4BAA4BK,oBAAoB,GAAG,MAAM,GAAG,KAAK;AACjE,SAAS;AAAA;AACT;AACA,MAAMC,KAAA;EAAA,IAAC;IAAEF,cAAc;IAAEG,OAAO;IAAEC,sBAAsB;IAAEC;EAAM,CAAC,GAAAH,KAAA;EAAA,OACzD,CAAE,CAACF,cAAc,IAAIG,OAAO,IAAKC,sBAAsB,KACvDR,GAAG;AACX,qCAAqCS,KAAK,CAAC,SAAS,CAAC,KAAKA,KAAK,CAACC,qBAAqB;AACrF,SAAS;AAAA;AACT;AACA,MAAMC,KAAA;EAAA,IAAC;IAAEC,YAAY;IAAER,cAAc;IAAEK;EAAM,CAAC,GAAAE,KAAA;EAAA,OACtCC,YAAY,IACZ,CAACR,cAAc,IACfJ,GAAG;AACX;AACA,yCAAyCS,KAAK,CAAC,SAAS,CAAC,KAAKA,KAAK,CAACC,qBAAqB;AACzF;AACA,SAAS;AAAA;AACT;AACA,MAAMG,KAAA;EAAA,IAAC;IACCN,OAAO;IACPH,cAAc;IACdU,UAAU;IACVC,yBAAyB;IACzBC,qBAAqB;IACrBP;EACiB,CAAC,GAAAI,KAAA;EAAA,OAClB,CAACE,yBAAyB,IACrB,CAAC,CAACR,OAAO,IAAIO,UAAU,IAAIV,cAAc,KACtCK,KAAK,CAACQ,cAAc,IACpB,CAACD,qBAAsB,KAC/BhB,GAAG;AACX;AACA,iCAAiCe,yBAAyB,GAAG,KAAK,GAAG,KAAK;AAC1E,2BAA2BN,KAAK,CAAC,cAAc,CAAC;AAChD;AACA,SAAS;AAAA;AACT;AACA,MAAMS,KAAA;EAAA,IAAC;IAAEJ;EAAW,CAAC,GAAAI,KAAA;EAAA,OACbJ,UAAU,IACVd,GAAG;AACX;AACA,SAAS;AAAA;AACT,CAAC","ignoreList":[]}

package/lib/esm/components/list/list-item/list-item-body/ListItemBody.styles.js

@@ -1,4 +1,4 @@
-import { motion } from 'framer-motion';
+import { motion } from 'motion/react';
 import styled from 'styled-components';
 export const StyledMotionListItemBody = styled(motion.div)`
     overflow: hidden;

package/lib/esm/components/list/list-item/list-item-body/ListItemBody.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItemBody.styles.js","names":["motion","styled","StyledMotionListItemBody","div"],"sources":["../../../../../../src/components/list/list-item/list-item-body/ListItemBody.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled from 'styled-components';\nimport type { FramerMotionBugFix } from '../../../color-scheme-provider/ColorSchemeProvider';\n\nexport const StyledMotionListItemBody = styled(motion.div)<FramerMotionBugFix>`\n    overflow: hidden;\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,eAAe;AACtC,OAAOC,MAAM,MAAM,mBAAmB;AAGtC,OAAO,MAAMC,wBAAwB,GAAGD,MAAM,CAACD,MAAM,CAACG,GAAG,CAAqB;AAC9E;AACA,CAAC","ignoreList":[]}
+{"version":3,"file":"ListItemBody.styles.js","names":["motion","styled","StyledMotionListItemBody","div"],"sources":["../../../../../../src/components/list/list-item/list-item-body/ListItemBody.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled from 'styled-components';\nimport type { FramerMotionBugFix } from '../../../color-scheme-provider/ColorSchemeProvider';\n\nexport const StyledMotionListItemBody = styled(motion.div)<FramerMotionBugFix>`\n    overflow: hidden;\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,cAAc;AACrC,OAAOC,MAAM,MAAM,mBAAmB;AAGtC,OAAO,MAAMC,wBAAwB,GAAGD,MAAM,CAACD,MAAM,CAACG,GAAG,CAAqB;AAC9E;AACA,CAAC","ignoreList":[]}

package/lib/esm/components/list/list-item/list-item-head/ListItemHead.styles.js

@@ -1,4 +1,4 @@
-import { motion } from 'framer-motion';
+import { motion } from 'motion/react';
 import styled, { css } from 'styled-components';
 export const StyledListItemHead = styled(motion.div)`
     //align-items: center;

package/lib/esm/components/list/list-item/list-item-head/ListItemHead.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItemHead.styles.js","names":["motion","styled","css","StyledListItemHead","div","_ref","theme","text","_ref2","$isAnyItemExpandable","_ref3","$isClickable","StyledListItemHeadLeftWrapper","StyledMotionListItemHeadIndicator","StyledListItemHeadContent","_ref4","$isOpen","_ref5","$isIconOrImageGiven","undefined","_ref6","$marginTop","StyledListItemHeadTitle","StyledListItemHeadTitleContent","StyledListItemHeadTitleElement","StyledListItemHeadTitleText","span","_ref7","_ref8","_ref9","$width","StyledListItemHeadTitleTextPseudo","_ref10","_ref11","StyledListItemHeadSubtitle","StyledListItemHeadSubtitleText","_ref12","_ref13","StyledListItemHeadSubtitleTextPseudo","_ref14","_ref15","StyledMotionListItemHeadHoverItem"],"sources":["../../../../../../src/components/list/list-item/list-item-head/ListItemHead.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 StyledListItemHeadProps = WithTheme<{\n    $isClickable: boolean;\n    $isAnyItemExpandable: boolean;\n}>;\n\nexport const StyledListItemHead = styled(motion.div)<StyledListItemHeadProps>`\n    //align-items: center;\n    overflow: hidden;\n    color: ${({ theme }: StyledListItemHeadProps) => theme.text};\n    display: flex;\n    min-height: 64px;\n    padding: 12px 9px;\n\n    ${({ $isAnyItemExpandable }) =>\n        !$isAnyItemExpandable &&\n        css`\n            padding-left: 12px;\n        `}\n\n    ${({ $isClickable }) =>\n        $isClickable &&\n        css`\n            cursor: pointer;\n        `}\n`;\n\nexport const StyledListItemHeadLeftWrapper = styled.div`\n    display: flex;\n    align-items: center;\n    margin: auto 0;\n`;\n\nexport const StyledMotionListItemHeadIndicator = styled(motion.div)<FramerMotionBugFix>`\n    align-items: center;\n    display: flex;\n    flex: 0 0 auto;\n    height: 26px;\n    justify-content: center;\n    width: 26px;\n`;\n\ntype StyledListItemHeadContentProps = {\n    $isIconOrImageGiven: boolean;\n    $isOpen: boolean;\n    $marginTop: number;\n};\n\nexport const StyledListItemHeadContent = styled.div<StyledListItemHeadContentProps>`\n    display: flex;\n    flex: 1 1 auto;\n    flex-direction: column;\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    justify-content: start;\n    line-height: normal;\n    margin-left: ${({ $isIconOrImageGiven }) => ($isIconOrImageGiven ? '10px' : undefined)};\n    margin-top: ${({ $marginTop }) => $marginTop}px;\n    min-width: 0;\n`;\n\nexport const StyledListItemHeadTitle = styled.div`\n    align-items: center;\n    display: flex;\n    justify-content: space-between;\n`;\n\nexport const StyledListItemHeadTitleContent = styled.div`\n    display: flex;\n    flex: 1 1 auto;\n    max-width: 100%;\n    min-width: 0;\n    position: relative;\n`;\n\nexport const StyledListItemHeadTitleElement = styled.div`\n    align-items: center;\n    display: flex;\n    flex: 0 0 auto;\n    margin-left: 8px;\n`;\n\ntype StyledListItemHeadTitleTextProps = WithTheme<{ $isOpen: boolean; $width: number }>;\n\nexport const StyledListItemHeadTitleText = styled(motion.span)<StyledListItemHeadTitleTextProps>`\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    white-space: ${({ $isOpen }) => ($isOpen ? 'normal' : 'nowrap')};\n    min-width: ${({ $isOpen, $width }) => ($isOpen ? `${$width}px` : undefined)};\n    overflow: hidden;\n    text-overflow: ellipsis;\n`;\n\ntype StyledListItemHeadTitleTextPseudoProps = WithTheme<{ $isOpen: boolean }>;\n\nexport const StyledListItemHeadTitleTextPseudo = styled.span<StyledListItemHeadTitleTextPseudoProps>`\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    white-space: ${({ $isOpen }) => ($isOpen ? 'normal' : 'nowrap')};\n    overflow: hidden;\n    text-overflow: ellipsis;\n\n    opacity: 0;\n    pointer-events: none;\n    user-select: none;\n    position: absolute;\n`;\n\nexport const StyledListItemHeadSubtitle = styled.div`\n    align-items: center;\n    display: flex;\n    justify-content: space-between;\n    margin-top: 2px;\n`;\n\ntype StyledListItemHeadSubtitleTextProps = WithTheme<{ $isOpen: boolean }>;\n\nexport const StyledListItemHeadSubtitleText = styled.span<StyledListItemHeadSubtitleTextProps>`\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    white-space: ${({ $isOpen }) => ($isOpen ? 'normal' : 'nowrap')};\n    overflow: hidden;\n    text-overflow: ellipsis;\n\n    flex: 1 1 auto;\n    font-size: 85%;\n    min-width: 0;\n    opacity: 0.75;\n`;\n\ntype StyledListItemHeadSubtitleTextPseudoProps = WithTheme<{ $isOpen: boolean }>;\n\nexport const StyledListItemHeadSubtitleTextPseudo = styled.span<StyledListItemHeadSubtitleTextPseudoProps>`\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    white-space: ${({ $isOpen }) => ($isOpen ? 'normal' : 'nowrap')};\n    overflow: hidden;\n    text-overflow: ellipsis;\n\n    flex: 1 1 auto;\n    font-size: 85%;\n    min-width: 0;\n\n    opacity: 0;\n    pointer-events: none;\n    user-select: none;\n\n    position: absolute;\n`;\n\nexport const StyledMotionListItemHeadHoverItem = styled(motion.div)<FramerMotionBugFix>`\n    overflow: hidden;\n    flex-shrink: 0;\n    margin: auto 0;\n`;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"ListItemHead.styles.js","names":["motion","styled","css","StyledListItemHead","div","_ref","theme","text","_ref2","$isAnyItemExpandable","_ref3","$isClickable","StyledListItemHeadLeftWrapper","StyledMotionListItemHeadIndicator","StyledListItemHeadContent","_ref4","$isOpen","_ref5","$isIconOrImageGiven","undefined","_ref6","$marginTop","StyledListItemHeadTitle","StyledListItemHeadTitleContent","StyledListItemHeadTitleElement","StyledListItemHeadTitleText","span","_ref7","_ref8","_ref9","$width","StyledListItemHeadTitleTextPseudo","_ref10","_ref11","StyledListItemHeadSubtitle","StyledListItemHeadSubtitleText","_ref12","_ref13","StyledListItemHeadSubtitleTextPseudo","_ref14","_ref15","StyledMotionListItemHeadHoverItem"],"sources":["../../../../../../src/components/list/list-item/list-item-head/ListItemHead.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport type {\n    FramerMotionBugFix,\n    WithTheme,\n} from '../../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledListItemHeadProps = WithTheme<{\n    $isClickable: boolean;\n    $isAnyItemExpandable: boolean;\n}>;\n\nexport const StyledListItemHead = styled(motion.div)<StyledListItemHeadProps>`\n    //align-items: center;\n    overflow: hidden;\n    color: ${({ theme }: StyledListItemHeadProps) => theme.text};\n    display: flex;\n    min-height: 64px;\n    padding: 12px 9px;\n\n    ${({ $isAnyItemExpandable }) =>\n        !$isAnyItemExpandable &&\n        css`\n            padding-left: 12px;\n        `}\n\n    ${({ $isClickable }) =>\n        $isClickable &&\n        css`\n            cursor: pointer;\n        `}\n`;\n\nexport const StyledListItemHeadLeftWrapper = styled.div`\n    display: flex;\n    align-items: center;\n    margin: auto 0;\n`;\n\nexport const StyledMotionListItemHeadIndicator = styled(motion.div)<FramerMotionBugFix>`\n    align-items: center;\n    display: flex;\n    flex: 0 0 auto;\n    height: 26px;\n    justify-content: center;\n    width: 26px;\n`;\n\ntype StyledListItemHeadContentProps = {\n    $isIconOrImageGiven: boolean;\n    $isOpen: boolean;\n    $marginTop: number;\n};\n\nexport const StyledListItemHeadContent = styled.div<StyledListItemHeadContentProps>`\n    display: flex;\n    flex: 1 1 auto;\n    flex-direction: column;\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    justify-content: start;\n    line-height: normal;\n    margin-left: ${({ $isIconOrImageGiven }) => ($isIconOrImageGiven ? '10px' : undefined)};\n    margin-top: ${({ $marginTop }) => $marginTop}px;\n    min-width: 0;\n`;\n\nexport const StyledListItemHeadTitle = styled.div`\n    align-items: center;\n    display: flex;\n    justify-content: space-between;\n`;\n\nexport const StyledListItemHeadTitleContent = styled.div`\n    display: flex;\n    flex: 1 1 auto;\n    max-width: 100%;\n    min-width: 0;\n    position: relative;\n`;\n\nexport const StyledListItemHeadTitleElement = styled.div`\n    align-items: center;\n    display: flex;\n    flex: 0 0 auto;\n    margin-left: 8px;\n`;\n\ntype StyledListItemHeadTitleTextProps = WithTheme<{ $isOpen: boolean; $width: number }>;\n\nexport const StyledListItemHeadTitleText = styled(motion.span)<StyledListItemHeadTitleTextProps>`\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    white-space: ${({ $isOpen }) => ($isOpen ? 'normal' : 'nowrap')};\n    min-width: ${({ $isOpen, $width }) => ($isOpen ? `${$width}px` : undefined)};\n    overflow: hidden;\n    text-overflow: ellipsis;\n`;\n\ntype StyledListItemHeadTitleTextPseudoProps = WithTheme<{ $isOpen: boolean }>;\n\nexport const StyledListItemHeadTitleTextPseudo = styled.span<StyledListItemHeadTitleTextPseudoProps>`\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    white-space: ${({ $isOpen }) => ($isOpen ? 'normal' : 'nowrap')};\n    overflow: hidden;\n    text-overflow: ellipsis;\n\n    opacity: 0;\n    pointer-events: none;\n    user-select: none;\n    position: absolute;\n`;\n\nexport const StyledListItemHeadSubtitle = styled.div`\n    align-items: center;\n    display: flex;\n    justify-content: space-between;\n    margin-top: 2px;\n`;\n\ntype StyledListItemHeadSubtitleTextProps = WithTheme<{ $isOpen: boolean }>;\n\nexport const StyledListItemHeadSubtitleText = styled.span<StyledListItemHeadSubtitleTextProps>`\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    white-space: ${({ $isOpen }) => ($isOpen ? 'normal' : 'nowrap')};\n    overflow: hidden;\n    text-overflow: ellipsis;\n\n    flex: 1 1 auto;\n    font-size: 85%;\n    min-width: 0;\n    opacity: 0.75;\n`;\n\ntype StyledListItemHeadSubtitleTextPseudoProps = WithTheme<{ $isOpen: boolean }>;\n\nexport const StyledListItemHeadSubtitleTextPseudo = styled.span<StyledListItemHeadSubtitleTextPseudoProps>`\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    white-space: ${({ $isOpen }) => ($isOpen ? 'normal' : 'nowrap')};\n    overflow: hidden;\n    text-overflow: ellipsis;\n\n    flex: 1 1 auto;\n    font-size: 85%;\n    min-width: 0;\n\n    opacity: 0;\n    pointer-events: none;\n    user-select: none;\n\n    position: absolute;\n`;\n\nexport const StyledMotionListItemHeadHoverItem = styled(motion.div)<FramerMotionBugFix>`\n    overflow: hidden;\n    flex-shrink: 0;\n    margin: auto 0;\n`;\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/mention-finder/MentionFinder.js

@@ -1,4 +1,4 @@
-import { AnimatePresence } from 'framer-motion';
+import { AnimatePresence } from 'motion/react';
 import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import MentionFinderItem from './mention-finder-item/MentionFinderItem';
 import { StyledMentionFinder, StyledMotionMentionFinderPopup } from './MentionFinder.styles';

package/lib/esm/components/mention-finder/MentionFinder.js.map

@@ -1 +1 @@
-{"version":3,"file":"MentionFinder.js","names":["AnimatePresence","React","useCallback","useEffect","useMemo","useRef","useState","MentionFinderItem","StyledMentionFinder","StyledMotionMentionFinderPopup","MentionFinder","_ref","inputValue","members","onSelect","popupAlignment","activeMember","setActiveMember","focusedIndex","setFocusedIndex","ref","fullMatch","searchString","regExpMatchArray","match","toLowerCase","filteredMembers","filter","_ref2","id","info","name","includes","replace","handleKeyDown","event","key","preventDefault","children","current","length","newIndex","prevElement","tabIndex","member","newElement","focus","stopPropagation","handleMemberClick","handleMemberHover","isActiveMemberShown","some","_ref3","items","map","createElement","isActive","onClick","onHover","shouldShowPopup","window","addEventListener","removeEventListener","className","initial","animate","height","opacity","exit","$popupAlignment","transition","duration","displayName"],"sources":["../../../../src/components/mention-finder/MentionFinder.tsx"],"sourcesContent":["import { AnimatePresence } from 'framer-motion';\nimport React, { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport type { MentionFinderPopupAlignment } from '../../constants/mentionFinder';\nimport MentionFinderItem from './mention-finder-item/MentionFinderItem';\nimport { StyledMentionFinder, StyledMotionMentionFinderPopup } from './MentionFinder.styles';\n\nexport type MentionMember = {\n    id: string;\n    info: string;\n    imageUrl: string;\n    name: string;\n    shouldShowRoundImage?: boolean;\n};\n\nexport type MentionFinderProps = {\n    /**\n     * The text from the input field\n     */\n    inputValue: string;\n    /**\n     * Members that can be selected\n     */\n    members: MentionMember[];\n    /**\n     * Function to be executed when a member is selected\n     */\n    onSelect: ({ fullMatch, member }: { fullMatch: string; member: MentionMember }) => void;\n    /**\n     * Alignment of the popup\n     */\n    popupAlignment: MentionFinderPopupAlignment;\n};\n\nconst MentionFinder: FC<MentionFinderProps> = ({\n    inputValue,\n    members,\n    onSelect,\n    popupAlignment,\n}) => {\n    const [activeMember, setActiveMember] = useState(members[0]);\n    const [focusedIndex, setFocusedIndex] = useState(0);\n\n    const ref = useRef<HTMLDivElement>(null);\n\n    const [fullMatch, searchString] = useMemo(() => {\n        // eslint-disable-next-line no-irregular-whitespace\n        const regExpMatchArray = inputValue.match(/@([^\\s​]*)/);\n\n        return [regExpMatchArray?.[0], regExpMatchArray?.[1]?.toLowerCase() ?? ''];\n    }, [inputValue]);\n\n    const filteredMembers = useMemo(\n        () =>\n            searchString !== ''\n                ? members.filter(\n                      ({ id, info, name }) =>\n                          id.toLowerCase().includes(searchString) ||\n                          info.replace('chayns', '').toLowerCase().includes(searchString) ||\n                          name.toLowerCase().includes(searchString),\n                  )\n                : members,\n        [members, searchString],\n    );\n\n    const handleKeyDown = useCallback(\n        (event: KeyboardEvent) => {\n            if (event.key === 'ArrowUp' || event.key === 'ArrowDown') {\n                event.preventDefault();\n\n                const children = ref.current?.children;\n\n                if (children && children.length > 0) {\n                    const newIndex =\n                        focusedIndex !== null\n                            ? (focusedIndex +\n                                  (event.key === 'ArrowUp' ? -1 : 1) +\n                                  children.length) %\n                              children.length\n                            : 0;\n\n                    if (focusedIndex !== null) {\n                        const prevElement = children[focusedIndex] as HTMLDivElement;\n                        prevElement.tabIndex = -1;\n                    }\n\n                    setFocusedIndex(newIndex);\n\n                    const member = filteredMembers[newIndex];\n\n                    setActiveMember(member);\n\n                    const newElement = children[newIndex] as HTMLDivElement;\n                    newElement.tabIndex = 0;\n                    newElement.focus();\n                }\n            } else if (event.key === 'Enter') {\n                event.preventDefault();\n                event.stopPropagation();\n\n                if (fullMatch && activeMember) {\n                    onSelect({ fullMatch, member: activeMember });\n                }\n            }\n        },\n        [activeMember, filteredMembers, focusedIndex, fullMatch, onSelect],\n    );\n\n    const handleMemberClick = useCallback(\n        (member: MentionMember) => {\n            if (fullMatch) {\n                onSelect({ fullMatch, member });\n            }\n        },\n        [fullMatch, onSelect],\n    );\n\n    const handleMemberHover = useCallback((member: MentionMember) => {\n        setActiveMember(member);\n    }, []);\n\n    useEffect(() => {\n        if (filteredMembers.length > 0) {\n            const isActiveMemberShown = filteredMembers.some(({ id }) => id === activeMember?.id);\n\n            if (!isActiveMemberShown) {\n                setActiveMember(filteredMembers[0]);\n            }\n        }\n    }, [activeMember?.id, filteredMembers]);\n\n    const items = useMemo(\n        () =>\n            filteredMembers.map((member) => (\n                <MentionFinderItem\n                    isActive={member.id === activeMember?.id}\n                    key={member.id}\n                    member={member}\n                    onClick={handleMemberClick}\n                    onHover={handleMemberHover}\n                />\n            )),\n        [activeMember, filteredMembers, handleMemberClick, handleMemberHover],\n    );\n\n    const shouldShowPopup = useMemo(() => fullMatch && items.length > 0, [fullMatch, items.length]);\n\n    useEffect(() => {\n        if (shouldShowPopup) {\n            window.addEventListener('keydown', handleKeyDown, true);\n        }\n\n        return () => {\n            window.removeEventListener('keydown', handleKeyDown, true);\n        };\n    }, [handleKeyDown, shouldShowPopup]);\n\n    return (\n        <StyledMentionFinder className=\"beta-chayns-mention-finder\">\n            <AnimatePresence initial={false}>\n                {shouldShowPopup && (\n                    <StyledMotionMentionFinderPopup\n                        ref={ref}\n                        animate={{ height: 'auto', opacity: 1 }}\n                        className=\"prevent-lose-focus\"\n                        exit={{ height: 0, opacity: 0 }}\n                        initial={{ height: 0, opacity: 0 }}\n                        $popupAlignment={popupAlignment}\n                        transition={{ duration: 0.15 }}\n                        tabIndex={0}\n                    >\n                        {items}\n                    </StyledMotionMentionFinderPopup>\n                )}\n            </AnimatePresence>\n        </StyledMentionFinder>\n    );\n};\n\nMentionFinder.displayName = 'MentionFinder';\n\nexport default MentionFinder;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"MentionFinder.js","names":["AnimatePresence","React","useCallback","useEffect","useMemo","useRef","useState","MentionFinderItem","StyledMentionFinder","StyledMotionMentionFinderPopup","MentionFinder","_ref","inputValue","members","onSelect","popupAlignment","activeMember","setActiveMember","focusedIndex","setFocusedIndex","ref","fullMatch","searchString","regExpMatchArray","match","toLowerCase","filteredMembers","filter","_ref2","id","info","name","includes","replace","handleKeyDown","event","key","preventDefault","children","current","length","newIndex","prevElement","tabIndex","member","newElement","focus","stopPropagation","handleMemberClick","handleMemberHover","isActiveMemberShown","some","_ref3","items","map","createElement","isActive","onClick","onHover","shouldShowPopup","window","addEventListener","removeEventListener","className","initial","animate","height","opacity","exit","$popupAlignment","transition","duration","displayName"],"sources":["../../../../src/components/mention-finder/MentionFinder.tsx"],"sourcesContent":["import { AnimatePresence } from 'motion/react';\nimport React, { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport type { MentionFinderPopupAlignment } from '../../constants/mentionFinder';\nimport MentionFinderItem from './mention-finder-item/MentionFinderItem';\nimport { StyledMentionFinder, StyledMotionMentionFinderPopup } from './MentionFinder.styles';\n\nexport type MentionMember = {\n    id: string;\n    info: string;\n    imageUrl: string;\n    name: string;\n    shouldShowRoundImage?: boolean;\n};\n\nexport type MentionFinderProps = {\n    /**\n     * The text from the input field\n     */\n    inputValue: string;\n    /**\n     * Members that can be selected\n     */\n    members: MentionMember[];\n    /**\n     * Function to be executed when a member is selected\n     */\n    onSelect: ({ fullMatch, member }: { fullMatch: string; member: MentionMember }) => void;\n    /**\n     * Alignment of the popup\n     */\n    popupAlignment: MentionFinderPopupAlignment;\n};\n\nconst MentionFinder: FC<MentionFinderProps> = ({\n    inputValue,\n    members,\n    onSelect,\n    popupAlignment,\n}) => {\n    const [activeMember, setActiveMember] = useState(members[0]);\n    const [focusedIndex, setFocusedIndex] = useState(0);\n\n    const ref = useRef<HTMLDivElement>(null);\n\n    const [fullMatch, searchString] = useMemo(() => {\n        // eslint-disable-next-line no-irregular-whitespace\n        const regExpMatchArray = inputValue.match(/@([^\\s​]*)/);\n\n        return [regExpMatchArray?.[0], regExpMatchArray?.[1]?.toLowerCase() ?? ''];\n    }, [inputValue]);\n\n    const filteredMembers = useMemo(\n        () =>\n            searchString !== ''\n                ? members.filter(\n                      ({ id, info, name }) =>\n                          id.toLowerCase().includes(searchString) ||\n                          info.replace('chayns', '').toLowerCase().includes(searchString) ||\n                          name.toLowerCase().includes(searchString),\n                  )\n                : members,\n        [members, searchString],\n    );\n\n    const handleKeyDown = useCallback(\n        (event: KeyboardEvent) => {\n            if (event.key === 'ArrowUp' || event.key === 'ArrowDown') {\n                event.preventDefault();\n\n                const children = ref.current?.children;\n\n                if (children && children.length > 0) {\n                    const newIndex =\n                        focusedIndex !== null\n                            ? (focusedIndex +\n                                  (event.key === 'ArrowUp' ? -1 : 1) +\n                                  children.length) %\n                              children.length\n                            : 0;\n\n                    if (focusedIndex !== null) {\n                        const prevElement = children[focusedIndex] as HTMLDivElement;\n                        prevElement.tabIndex = -1;\n                    }\n\n                    setFocusedIndex(newIndex);\n\n                    const member = filteredMembers[newIndex];\n\n                    setActiveMember(member);\n\n                    const newElement = children[newIndex] as HTMLDivElement;\n                    newElement.tabIndex = 0;\n                    newElement.focus();\n                }\n            } else if (event.key === 'Enter') {\n                event.preventDefault();\n                event.stopPropagation();\n\n                if (fullMatch && activeMember) {\n                    onSelect({ fullMatch, member: activeMember });\n                }\n            }\n        },\n        [activeMember, filteredMembers, focusedIndex, fullMatch, onSelect],\n    );\n\n    const handleMemberClick = useCallback(\n        (member: MentionMember) => {\n            if (fullMatch) {\n                onSelect({ fullMatch, member });\n            }\n        },\n        [fullMatch, onSelect],\n    );\n\n    const handleMemberHover = useCallback((member: MentionMember) => {\n        setActiveMember(member);\n    }, []);\n\n    useEffect(() => {\n        if (filteredMembers.length > 0) {\n            const isActiveMemberShown = filteredMembers.some(({ id }) => id === activeMember?.id);\n\n            if (!isActiveMemberShown) {\n                setActiveMember(filteredMembers[0]);\n            }\n        }\n    }, [activeMember?.id, filteredMembers]);\n\n    const items = useMemo(\n        () =>\n            filteredMembers.map((member) => (\n                <MentionFinderItem\n                    isActive={member.id === activeMember?.id}\n                    key={member.id}\n                    member={member}\n                    onClick={handleMemberClick}\n                    onHover={handleMemberHover}\n                />\n            )),\n        [activeMember, filteredMembers, handleMemberClick, handleMemberHover],\n    );\n\n    const shouldShowPopup = useMemo(() => fullMatch && items.length > 0, [fullMatch, items.length]);\n\n    useEffect(() => {\n        if (shouldShowPopup) {\n            window.addEventListener('keydown', handleKeyDown, true);\n        }\n\n        return () => {\n            window.removeEventListener('keydown', handleKeyDown, true);\n        };\n    }, [handleKeyDown, shouldShowPopup]);\n\n    return (\n        <StyledMentionFinder className=\"beta-chayns-mention-finder\">\n            <AnimatePresence initial={false}>\n                {shouldShowPopup && (\n                    <StyledMotionMentionFinderPopup\n                        ref={ref}\n                        animate={{ height: 'auto', opacity: 1 }}\n                        className=\"prevent-lose-focus\"\n                        exit={{ height: 0, opacity: 0 }}\n                        initial={{ height: 0, opacity: 0 }}\n                        $popupAlignment={popupAlignment}\n                        transition={{ duration: 0.15 }}\n                        tabIndex={0}\n                    >\n                        {items}\n                    </StyledMotionMentionFinderPopup>\n                )}\n            </AnimatePresence>\n        </StyledMentionFinder>\n    );\n};\n\nMentionFinder.displayName = 'MentionFinder';\n\nexport default MentionFinder;\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/mention-finder/MentionFinder.styles.js

@@ -1,4 +1,4 @@
-import { motion } from 'framer-motion';
+import { motion } from 'motion/react';
 import styled, { css } from 'styled-components';
 import { MentionFinderPopupAlignment } from '../../constants/mentionFinder';
 export const StyledMentionFinder = styled.div`

package/lib/esm/components/mention-finder/MentionFinder.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"MentionFinder.styles.js","names":["motion","styled","css","MentionFinderPopupAlignment","StyledMentionFinder","div","StyledMotionMentionFinderPopup","_ref","theme","_ref2","$popupAlignment","Bottom","Top","undefined","_ref3","_ref4"],"sources":["../../../../src/components/mention-finder/MentionFinder.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport { MentionFinderPopupAlignment } from '../../constants/mentionFinder';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\nexport const StyledMentionFinder = styled.div`\n    position: relative;\n`;\n\ntype StyledMentionFinderPopupProps = WithTheme<{ $popupAlignment: MentionFinderPopupAlignment }>;\n\nexport const StyledMotionMentionFinderPopup = styled(motion.div)<StyledMentionFinderPopupProps>`\n    background-color: ${({ theme }: StyledMentionFinderPopupProps) => theme['001']};\n    border: 1px solid rgba(0, 0, 0, 0.1);\n    border-radius: 3px;\n    box-shadow: 1px 3px 8px rgba(0, 0, 0, 0.1);\n    left: 0;\n    max-height: 275px;\n    overflow-y: scroll;\n    position: absolute;\n    width: 100%;\n\n    ${({ $popupAlignment }) => {\n        switch ($popupAlignment) {\n            case MentionFinderPopupAlignment.Bottom:\n                return css`\n                    top: 0;\n                `;\n            case MentionFinderPopupAlignment.Top:\n                return css`\n                    bottom: 0;\n                `;\n            default:\n                return undefined;\n        }\n    }}\n\n    // Styles for custom scrollbar\n    &::-webkit-scrollbar {\n        width: 5px;\n    }\n\n    &::-webkit-scrollbar-track {\n        background-color: transparent;\n    }\n\n    &::-webkit-scrollbar-button {\n        background-color: transparent;\n        height: 5px;\n    }\n\n    &::-webkit-scrollbar-thumb {\n        background-color: rgba(\n            ${({ theme }: StyledMentionFinderPopupProps) => theme['text-rgb']},\n            0.15\n        );\n        border-radius: 20px;\n    }\n\n    // Scrollbar styles for Firefox. The above styles are not supported in Firefox, these styles are\n    // only supported in Firefox:\n    * {\n        scrollbar-color: rgba(\n                ${({ theme }: StyledMentionFinderPopupProps) => theme['text-rgb']},\n                0.15\n            )\n            transparent;\n        scrollbar-width: thin;\n    }\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,eAAe;AACtC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAC/C,SAASC,2BAA2B,QAAQ,+BAA+B;AAG3E,OAAO,MAAMC,mBAAmB,GAAGH,MAAM,CAACI,GAAG;AAC7C;AACA,CAAC;AAID,OAAO,MAAMC,8BAA8B,GAAGL,MAAM,CAACD,MAAM,CAACK,GAAG,CAAgC;AAC/F,wBAAwBE,IAAA;EAAA,IAAC;IAAEC;EAAqC,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAAC,KAAK,CAAC;AAAA;AAClF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,KAAA,IAAyB;EAAA,IAAxB;IAAEC;EAAgB,CAAC,GAAAD,KAAA;EAClB,QAAQC,eAAe;IACnB,KAAKP,2BAA2B,CAACQ,MAAM;MACnC,OAAOT,GAAG;AAC1B;AACA,iBAAiB;IACL,KAAKC,2BAA2B,CAACS,GAAG;MAChC,OAAOV,GAAG;AAC1B;AACA,iBAAiB;IACL;MACI,OAAOW,SAAS;EACxB;AACJ,CAAC;AACL;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,cAAcC,KAAA;EAAA,IAAC;IAAEN;EAAqC,CAAC,GAAAM,KAAA;EAAA,OAAKN,KAAK,CAAC,UAAU,CAAC;AAAA;AAC7E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,kBAAkBO,KAAA;EAAA,IAAC;IAAEP;EAAqC,CAAC,GAAAO,KAAA;EAAA,OAAKP,KAAK,CAAC,UAAU,CAAC;AAAA;AACjF;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}
+{"version":3,"file":"MentionFinder.styles.js","names":["motion","styled","css","MentionFinderPopupAlignment","StyledMentionFinder","div","StyledMotionMentionFinderPopup","_ref","theme","_ref2","$popupAlignment","Bottom","Top","undefined","_ref3","_ref4"],"sources":["../../../../src/components/mention-finder/MentionFinder.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport { MentionFinderPopupAlignment } from '../../constants/mentionFinder';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\nexport const StyledMentionFinder = styled.div`\n    position: relative;\n`;\n\ntype StyledMentionFinderPopupProps = WithTheme<{ $popupAlignment: MentionFinderPopupAlignment }>;\n\nexport const StyledMotionMentionFinderPopup = styled(motion.div)<StyledMentionFinderPopupProps>`\n    background-color: ${({ theme }: StyledMentionFinderPopupProps) => theme['001']};\n    border: 1px solid rgba(0, 0, 0, 0.1);\n    border-radius: 3px;\n    box-shadow: 1px 3px 8px rgba(0, 0, 0, 0.1);\n    left: 0;\n    max-height: 275px;\n    overflow-y: scroll;\n    position: absolute;\n    width: 100%;\n\n    ${({ $popupAlignment }) => {\n        switch ($popupAlignment) {\n            case MentionFinderPopupAlignment.Bottom:\n                return css`\n                    top: 0;\n                `;\n            case MentionFinderPopupAlignment.Top:\n                return css`\n                    bottom: 0;\n                `;\n            default:\n                return undefined;\n        }\n    }}\n\n    // Styles for custom scrollbar\n    &::-webkit-scrollbar {\n        width: 5px;\n    }\n\n    &::-webkit-scrollbar-track {\n        background-color: transparent;\n    }\n\n    &::-webkit-scrollbar-button {\n        background-color: transparent;\n        height: 5px;\n    }\n\n    &::-webkit-scrollbar-thumb {\n        background-color: rgba(\n            ${({ theme }: StyledMentionFinderPopupProps) => theme['text-rgb']},\n            0.15\n        );\n        border-radius: 20px;\n    }\n\n    // Scrollbar styles for Firefox. The above styles are not supported in Firefox, these styles are\n    // only supported in Firefox:\n    * {\n        scrollbar-color: rgba(\n                ${({ theme }: StyledMentionFinderPopupProps) => theme['text-rgb']},\n                0.15\n            )\n            transparent;\n        scrollbar-width: thin;\n    }\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,cAAc;AACrC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAC/C,SAASC,2BAA2B,QAAQ,+BAA+B;AAG3E,OAAO,MAAMC,mBAAmB,GAAGH,MAAM,CAACI,GAAG;AAC7C;AACA,CAAC;AAID,OAAO,MAAMC,8BAA8B,GAAGL,MAAM,CAACD,MAAM,CAACK,GAAG,CAAgC;AAC/F,wBAAwBE,IAAA;EAAA,IAAC;IAAEC;EAAqC,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAAC,KAAK,CAAC;AAAA;AAClF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,KAAA,IAAyB;EAAA,IAAxB;IAAEC;EAAgB,CAAC,GAAAD,KAAA;EAClB,QAAQC,eAAe;IACnB,KAAKP,2BAA2B,CAACQ,MAAM;MACnC,OAAOT,GAAG;AAC1B;AACA,iBAAiB;IACL,KAAKC,2BAA2B,CAACS,GAAG;MAChC,OAAOV,GAAG;AAC1B;AACA,iBAAiB;IACL;MACI,OAAOW,SAAS;EACxB;AACJ,CAAC;AACL;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,cAAcC,KAAA;EAAA,IAAC;IAAEN;EAAqC,CAAC,GAAAM,KAAA;EAAA,OAAKN,KAAK,CAAC,UAAU,CAAC;AAAA;AAC7E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,kBAAkBO,KAAA;EAAA,IAAC;IAAEP;EAAqC,CAAC,GAAAO,KAAA;EAAA,OAAKP,KAAK,CAAC,UAAU,CAAC;AAAA;AACjF;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}

package/lib/esm/components/popup/Popup.js

@@ -1,5 +1,5 @@
 import { getWindowMetrics } from 'chayns-api';
-import { AnimatePresence } from 'framer-motion';
+import { AnimatePresence } from 'motion/react';
 import React, { forwardRef, useCallback, useEffect, useImperativeHandle, useRef, useState } from 'react';
 import { createPortal } from 'react-dom';
 import { useUuid } from '../../hooks/uuid';

package/lib/esm/components/popup/Popup.js.map

@@ -1 +1 @@
-{"version":3,"file":"Popup.js","names":["getWindowMetrics","AnimatePresence","React","forwardRef","useCallback","useEffect","useImperativeHandle","useRef","useState","createPortal","useUuid","PopupAlignment","AreaContextProvider","PopupContentWrapper","StyledPopup","StyledPopupPseudo","Popup","_ref","ref","content","onShow","container","onHide","children","shouldHideOnChildrenLeave","shouldShowOnHover","shouldUseChildrenWidth","yOffset","coordinates","setCoordinates","x","y","alignment","setAlignment","TopLeft","offset","setOffset","isOpen","setIsOpen","portal","setPortal","menuHeight","setMenuHeight","isMeasuring","setIsMeasuring","pseudoSize","setPseudoSize","newContainer","setNewContainer","timeout","uuid","popupContentRef","popupPseudoContentRef","popupRef","current","el","element","closest","Element","measureHeight","height","offsetHeight","width","offsetWidth","handleResize","setTimeout","window","addEventListener","removeEventListener","handleShow","pseudoHeight","pseudoWidth","childrenHeight","left","childrenLeft","top","childrenTop","childrenWidth","getBoundingClientRect","containerRect","isRight","BottomRight","BottomLeft","newOffset","innerWidth","right","newX","TopRight","handleChildrenClick","handleHide","handleMouseEnter","clearTimeout","handleMouseLeave","handleDocumentClick","event","contains","target","hide","show","then","result","topBarHeight","document","createElement","initial","key","onMouseLeave","onMouseEnter","shouldChangeColor","Fragment","$menuHeight","onClick","$shouldUseChildrenWidth","displayName"],"sources":["../../../../src/components/popup/Popup.tsx"],"sourcesContent":["import { getWindowMetrics } from 'chayns-api';\nimport { AnimatePresence } from 'framer-motion';\nimport React, {\n    forwardRef,\n    ReactNode,\n    ReactPortal,\n    useCallback,\n    useEffect,\n    useImperativeHandle,\n    useRef,\n    useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { useUuid } from '../../hooks/uuid';\nimport { PopupAlignment, PopupCoordinates, PopupRef } from '../../types/popup';\nimport AreaContextProvider from '../area-provider/AreaContextProvider';\nimport PopupContentWrapper from './popup-content-wrapper/PopupContentWrapper';\nimport { StyledPopup, StyledPopupPseudo } from './Popup.styles';\n\nexport type PopupProps = {\n    /**\n     * The element over which the content of the `ContextMenu` should be displayed.\n     */\n    children?: ReactNode;\n    /**\n     * The element where the content of the `Popup` should be rendered via React Portal.\n     */\n    container?: Element;\n    /**\n     * The content that should be displayed inside the popup.\n     */\n    content: ReactNode;\n    /**\n     * Function to be executed when the content of the Context menu has been hidden.\n     */\n    onHide?: VoidFunction;\n    /**\n     * Function to be executed when the content of the Context menu has been shown.\n     */\n    onShow?: VoidFunction;\n    /**\n     * Whether the tooltip should be hidden after the children is not hovered.\n     */\n    shouldHideOnChildrenLeave?: boolean;\n    /**\n     * Whether the popup should be opened on hover. If not, the popup will be opened on click.\n     */\n    shouldShowOnHover?: boolean;\n    /**\n     * Whether the width of the children should be used.\n     */\n    shouldUseChildrenWidth?: boolean;\n    /**\n     * The Y offset of the popup to the children.\n     */\n    yOffset?: number;\n};\n\nconst Popup = forwardRef<PopupRef, PopupProps>(\n    (\n        {\n            content,\n            onShow,\n            container,\n            onHide,\n            children,\n            shouldHideOnChildrenLeave,\n            shouldShowOnHover = false,\n            shouldUseChildrenWidth = true,\n            yOffset = 0,\n        },\n        ref,\n    ) => {\n        const [coordinates, setCoordinates] = useState<PopupCoordinates>({\n            x: 0,\n            y: 0,\n        });\n\n        const [alignment, setAlignment] = useState<PopupAlignment>(PopupAlignment.TopLeft);\n        const [offset, setOffset] = useState<number>(0);\n        const [isOpen, setIsOpen] = useState(false);\n        const [portal, setPortal] = useState<ReactPortal>();\n        const [menuHeight, setMenuHeight] = useState(0);\n        const [isMeasuring, setIsMeasuring] = useState(true);\n        const [pseudoSize, setPseudoSize] = useState<{ height: number; width: number }>();\n        const [newContainer, setNewContainer] = useState<Element | null>(container ?? null);\n\n        const timeout = useRef<number>();\n\n        const uuid = useUuid();\n\n        // ToDo: Replace with hook if new chayns api is ready\n\n        const popupContentRef = useRef<HTMLDivElement>(null);\n        const popupPseudoContentRef = useRef<HTMLDivElement>(null);\n        const popupRef = useRef<HTMLDivElement>(null);\n\n        useEffect(() => {\n            if (popupRef.current && !container) {\n                const el = popupRef.current as HTMLElement;\n\n                const element = el.closest('.dialog-inner, .page-provider, .tapp, body');\n\n                setNewContainer(element);\n            }\n        }, [container]);\n\n        useEffect(() => {\n            if (container instanceof Element) {\n                setNewContainer(container);\n            }\n        }, [container]);\n\n        const measureHeight = () => {\n            if (popupPseudoContentRef.current) {\n                const height = popupPseudoContentRef.current.offsetHeight;\n                const width = popupPseudoContentRef.current.offsetWidth + 1;\n\n                setPseudoSize({ height, width });\n            }\n        };\n\n        useEffect(() => {\n            measureHeight();\n\n            setIsMeasuring(false);\n        }, []);\n\n        useEffect(() => {\n            const handleResize = () => {\n                setIsMeasuring(true);\n\n                setTimeout(() => {\n                    measureHeight();\n                    setIsMeasuring(false);\n                }, 0);\n            };\n\n            window.addEventListener('resize', handleResize);\n\n            return () => {\n                window.removeEventListener('resize', handleResize);\n            };\n        }, []);\n\n        const handleShow = useCallback(() => {\n            if (popupRef.current && pseudoSize) {\n                const { height: pseudoHeight, width: pseudoWidth } = pseudoSize;\n\n                const {\n                    height: childrenHeight,\n                    left: childrenLeft,\n                    top: childrenTop,\n                    width: childrenWidth,\n                } = popupRef.current.getBoundingClientRect();\n\n                const containerRect = newContainer?.getBoundingClientRect();\n\n                if (pseudoHeight > childrenTop - 25) {\n                    let isRight = false;\n\n                    if (pseudoWidth > childrenLeft + childrenWidth / 2 - 25) {\n                        setAlignment(PopupAlignment.BottomRight);\n\n                        isRight = true;\n                    } else {\n                        setAlignment(PopupAlignment.BottomLeft);\n                    }\n\n                    const x = childrenLeft - (containerRect?.left ?? 0) + childrenWidth / 2;\n                    const y = childrenTop - (containerRect?.top ?? 0) + childrenHeight + yOffset;\n\n                    let newOffset;\n\n                    if (isRight) {\n                        newOffset =\n                            x + pseudoWidth >= window.innerWidth\n                                ? x + pseudoWidth - window.innerWidth\n                                : 0;\n                    } else {\n                        newOffset = 0;\n\n                        const right = window.innerWidth - (childrenLeft + childrenWidth / 2);\n\n                        newOffset =\n                            right + pseudoWidth >= window.innerWidth\n                                ? right + pseudoWidth - window.innerWidth\n                                : 0;\n                    }\n\n                    setOffset(newOffset);\n\n                    const newX = x - newOffset;\n\n                    setCoordinates({\n                        x: newX < 23 ? 23 : newX,\n                        y: y - yOffset,\n                    });\n                } else {\n                    let isRight = false;\n\n                    if (pseudoWidth > childrenLeft + childrenWidth / 2 - 25) {\n                        setAlignment(PopupAlignment.TopRight);\n\n                        isRight = true;\n                    } else {\n                        setAlignment(PopupAlignment.TopLeft);\n                    }\n\n                    const x = childrenLeft - (containerRect?.left ?? 0) + childrenWidth / 2;\n                    const y = childrenTop - (containerRect?.top ?? 0) - yOffset;\n\n                    let newOffset;\n\n                    if (isRight) {\n                        newOffset =\n                            x + pseudoWidth >= window.innerWidth\n                                ? x + pseudoWidth - window.innerWidth\n                                : 0;\n                    } else {\n                        newOffset = 0;\n\n                        const right = window.innerWidth - (childrenLeft + childrenWidth / 2);\n\n                        newOffset =\n                            right + pseudoWidth >= window.innerWidth\n                                ? right + pseudoWidth - window.innerWidth\n                                : 0;\n                    }\n\n                    setOffset(newOffset);\n\n                    const newX = x - newOffset;\n\n                    setCoordinates({\n                        x: newX < 23 ? 23 : newX,\n                        y: y - yOffset,\n                    });\n                }\n\n                setIsOpen(true);\n            }\n        }, [pseudoSize, yOffset]);\n\n        const handleChildrenClick = () => {\n            handleShow();\n        };\n\n        const handleHide = useCallback(() => {\n            setIsOpen(false);\n        }, []);\n\n        const handleMouseEnter = useCallback(() => {\n            if (shouldShowOnHover) {\n                window.clearTimeout(timeout.current);\n                handleShow();\n            }\n        }, [handleShow, shouldShowOnHover]);\n\n        const handleMouseLeave = useCallback(() => {\n            if (!shouldShowOnHover) {\n                return;\n            }\n\n            if (shouldHideOnChildrenLeave) {\n                handleHide();\n\n                return;\n            }\n\n            timeout.current = window.setTimeout(() => {\n                handleHide();\n            }, 500);\n        }, [handleHide, shouldHideOnChildrenLeave, shouldShowOnHover]);\n\n        const handleDocumentClick = useCallback<EventListener>(\n            (event) => {\n                if (!popupContentRef.current?.contains(event.target as Node)) {\n                    handleHide();\n                }\n            },\n            [handleHide],\n        );\n\n        useImperativeHandle(\n            ref,\n            () => ({\n                hide: handleHide,\n                show: handleShow,\n            }),\n            [handleHide, handleShow],\n        );\n\n        useEffect(() => {\n            void getWindowMetrics().then((result) => {\n                if (result.topBarHeight) {\n                    setMenuHeight(result.topBarHeight);\n                }\n            });\n        }, []);\n\n        useEffect(() => {\n            if (isOpen) {\n                document.addEventListener('click', handleDocumentClick, true);\n                window.addEventListener('blur', handleHide);\n\n                if (typeof onShow === 'function') {\n                    onShow();\n                }\n            } else if (typeof onHide === 'function') {\n                onHide();\n            }\n\n            return () => {\n                document.removeEventListener('click', handleDocumentClick, true);\n                window.removeEventListener('blur', handleHide);\n            };\n        }, [handleDocumentClick, handleHide, isOpen, onHide, onShow]);\n\n        useEffect(() => {\n            if (!newContainer) {\n                return;\n            }\n\n            setPortal(() =>\n                createPortal(\n                    <AnimatePresence initial={false}>\n                        {isOpen && (\n                            <PopupContentWrapper\n                                width={pseudoSize?.width ?? 0}\n                                offset={offset}\n                                coordinates={coordinates}\n                                key={`tooltip_${uuid}`}\n                                alignment={alignment}\n                                ref={popupContentRef}\n                                onMouseLeave={handleMouseLeave}\n                                onMouseEnter={handleMouseEnter}\n                            >\n                                <AreaContextProvider shouldChangeColor={false}>\n                                    {content}\n                                </AreaContextProvider>\n                            </PopupContentWrapper>\n                        )}\n                    </AnimatePresence>,\n                    newContainer,\n                ),\n            );\n        }, [\n            alignment,\n            newContainer,\n            content,\n            coordinates,\n            handleMouseEnter,\n            handleMouseLeave,\n            isOpen,\n            offset,\n            pseudoSize?.width,\n            uuid,\n        ]);\n\n        return (\n            <>\n                {isMeasuring && (\n                    <StyledPopupPseudo ref={popupPseudoContentRef} $menuHeight={menuHeight}>\n                        {content}\n                    </StyledPopupPseudo>\n                )}\n                <StyledPopup\n                    ref={popupRef}\n                    onClick={handleChildrenClick}\n                    onMouseLeave={handleMouseLeave}\n                    onMouseEnter={handleMouseEnter}\n                    $shouldUseChildrenWidth={shouldUseChildrenWidth}\n                >\n                    {children}\n                </StyledPopup>\n                {portal}\n            </>\n        );\n    },\n);\n\nPopup.displayName = 'Popup';\n\nexport default Popup;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Popup.js","names":["getWindowMetrics","AnimatePresence","React","forwardRef","useCallback","useEffect","useImperativeHandle","useRef","useState","createPortal","useUuid","PopupAlignment","AreaContextProvider","PopupContentWrapper","StyledPopup","StyledPopupPseudo","Popup","_ref","ref","content","onShow","container","onHide","children","shouldHideOnChildrenLeave","shouldShowOnHover","shouldUseChildrenWidth","yOffset","coordinates","setCoordinates","x","y","alignment","setAlignment","TopLeft","offset","setOffset","isOpen","setIsOpen","portal","setPortal","menuHeight","setMenuHeight","isMeasuring","setIsMeasuring","pseudoSize","setPseudoSize","newContainer","setNewContainer","timeout","uuid","popupContentRef","popupPseudoContentRef","popupRef","current","el","element","closest","Element","measureHeight","height","offsetHeight","width","offsetWidth","handleResize","setTimeout","window","addEventListener","removeEventListener","handleShow","pseudoHeight","pseudoWidth","childrenHeight","left","childrenLeft","top","childrenTop","childrenWidth","getBoundingClientRect","containerRect","isRight","BottomRight","BottomLeft","newOffset","innerWidth","right","newX","TopRight","handleChildrenClick","handleHide","handleMouseEnter","clearTimeout","handleMouseLeave","handleDocumentClick","event","contains","target","hide","show","then","result","topBarHeight","document","createElement","initial","key","onMouseLeave","onMouseEnter","shouldChangeColor","Fragment","$menuHeight","onClick","$shouldUseChildrenWidth","displayName"],"sources":["../../../../src/components/popup/Popup.tsx"],"sourcesContent":["import { getWindowMetrics } from 'chayns-api';\nimport { AnimatePresence } from 'motion/react';\nimport React, {\n    forwardRef,\n    ReactNode,\n    ReactPortal,\n    useCallback,\n    useEffect,\n    useImperativeHandle,\n    useRef,\n    useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { useUuid } from '../../hooks/uuid';\nimport { PopupAlignment, PopupCoordinates, PopupRef } from '../../types/popup';\nimport AreaContextProvider from '../area-provider/AreaContextProvider';\nimport PopupContentWrapper from './popup-content-wrapper/PopupContentWrapper';\nimport { StyledPopup, StyledPopupPseudo } from './Popup.styles';\n\nexport type PopupProps = {\n    /**\n     * The element over which the content of the `ContextMenu` should be displayed.\n     */\n    children?: ReactNode;\n    /**\n     * The element where the content of the `Popup` should be rendered via React Portal.\n     */\n    container?: Element;\n    /**\n     * The content that should be displayed inside the popup.\n     */\n    content: ReactNode;\n    /**\n     * Function to be executed when the content of the Context menu has been hidden.\n     */\n    onHide?: VoidFunction;\n    /**\n     * Function to be executed when the content of the Context menu has been shown.\n     */\n    onShow?: VoidFunction;\n    /**\n     * Whether the tooltip should be hidden after the children is not hovered.\n     */\n    shouldHideOnChildrenLeave?: boolean;\n    /**\n     * Whether the popup should be opened on hover. If not, the popup will be opened on click.\n     */\n    shouldShowOnHover?: boolean;\n    /**\n     * Whether the width of the children should be used.\n     */\n    shouldUseChildrenWidth?: boolean;\n    /**\n     * The Y offset of the popup to the children.\n     */\n    yOffset?: number;\n};\n\nconst Popup = forwardRef<PopupRef, PopupProps>(\n    (\n        {\n            content,\n            onShow,\n            container,\n            onHide,\n            children,\n            shouldHideOnChildrenLeave,\n            shouldShowOnHover = false,\n            shouldUseChildrenWidth = true,\n            yOffset = 0,\n        },\n        ref,\n    ) => {\n        const [coordinates, setCoordinates] = useState<PopupCoordinates>({\n            x: 0,\n            y: 0,\n        });\n\n        const [alignment, setAlignment] = useState<PopupAlignment>(PopupAlignment.TopLeft);\n        const [offset, setOffset] = useState<number>(0);\n        const [isOpen, setIsOpen] = useState(false);\n        const [portal, setPortal] = useState<ReactPortal>();\n        const [menuHeight, setMenuHeight] = useState(0);\n        const [isMeasuring, setIsMeasuring] = useState(true);\n        const [pseudoSize, setPseudoSize] = useState<{ height: number; width: number }>();\n        const [newContainer, setNewContainer] = useState<Element | null>(container ?? null);\n\n        const timeout = useRef<number>();\n\n        const uuid = useUuid();\n\n        // ToDo: Replace with hook if new chayns api is ready\n\n        const popupContentRef = useRef<HTMLDivElement>(null);\n        const popupPseudoContentRef = useRef<HTMLDivElement>(null);\n        const popupRef = useRef<HTMLDivElement>(null);\n\n        useEffect(() => {\n            if (popupRef.current && !container) {\n                const el = popupRef.current as HTMLElement;\n\n                const element = el.closest('.dialog-inner, .page-provider, .tapp, body');\n\n                setNewContainer(element);\n            }\n        }, [container]);\n\n        useEffect(() => {\n            if (container instanceof Element) {\n                setNewContainer(container);\n            }\n        }, [container]);\n\n        const measureHeight = () => {\n            if (popupPseudoContentRef.current) {\n                const height = popupPseudoContentRef.current.offsetHeight;\n                const width = popupPseudoContentRef.current.offsetWidth + 1;\n\n                setPseudoSize({ height, width });\n            }\n        };\n\n        useEffect(() => {\n            measureHeight();\n\n            setIsMeasuring(false);\n        }, []);\n\n        useEffect(() => {\n            const handleResize = () => {\n                setIsMeasuring(true);\n\n                setTimeout(() => {\n                    measureHeight();\n                    setIsMeasuring(false);\n                }, 0);\n            };\n\n            window.addEventListener('resize', handleResize);\n\n            return () => {\n                window.removeEventListener('resize', handleResize);\n            };\n        }, []);\n\n        const handleShow = useCallback(() => {\n            if (popupRef.current && pseudoSize) {\n                const { height: pseudoHeight, width: pseudoWidth } = pseudoSize;\n\n                const {\n                    height: childrenHeight,\n                    left: childrenLeft,\n                    top: childrenTop,\n                    width: childrenWidth,\n                } = popupRef.current.getBoundingClientRect();\n\n                const containerRect = newContainer?.getBoundingClientRect();\n\n                if (pseudoHeight > childrenTop - 25) {\n                    let isRight = false;\n\n                    if (pseudoWidth > childrenLeft + childrenWidth / 2 - 25) {\n                        setAlignment(PopupAlignment.BottomRight);\n\n                        isRight = true;\n                    } else {\n                        setAlignment(PopupAlignment.BottomLeft);\n                    }\n\n                    const x = childrenLeft - (containerRect?.left ?? 0) + childrenWidth / 2;\n                    const y = childrenTop - (containerRect?.top ?? 0) + childrenHeight + yOffset;\n\n                    let newOffset;\n\n                    if (isRight) {\n                        newOffset =\n                            x + pseudoWidth >= window.innerWidth\n                                ? x + pseudoWidth - window.innerWidth\n                                : 0;\n                    } else {\n                        newOffset = 0;\n\n                        const right = window.innerWidth - (childrenLeft + childrenWidth / 2);\n\n                        newOffset =\n                            right + pseudoWidth >= window.innerWidth\n                                ? right + pseudoWidth - window.innerWidth\n                                : 0;\n                    }\n\n                    setOffset(newOffset);\n\n                    const newX = x - newOffset;\n\n                    setCoordinates({\n                        x: newX < 23 ? 23 : newX,\n                        y: y - yOffset,\n                    });\n                } else {\n                    let isRight = false;\n\n                    if (pseudoWidth > childrenLeft + childrenWidth / 2 - 25) {\n                        setAlignment(PopupAlignment.TopRight);\n\n                        isRight = true;\n                    } else {\n                        setAlignment(PopupAlignment.TopLeft);\n                    }\n\n                    const x = childrenLeft - (containerRect?.left ?? 0) + childrenWidth / 2;\n                    const y = childrenTop - (containerRect?.top ?? 0) - yOffset;\n\n                    let newOffset;\n\n                    if (isRight) {\n                        newOffset =\n                            x + pseudoWidth >= window.innerWidth\n                                ? x + pseudoWidth - window.innerWidth\n                                : 0;\n                    } else {\n                        newOffset = 0;\n\n                        const right = window.innerWidth - (childrenLeft + childrenWidth / 2);\n\n                        newOffset =\n                            right + pseudoWidth >= window.innerWidth\n                                ? right + pseudoWidth - window.innerWidth\n                                : 0;\n                    }\n\n                    setOffset(newOffset);\n\n                    const newX = x - newOffset;\n\n                    setCoordinates({\n                        x: newX < 23 ? 23 : newX,\n                        y: y - yOffset,\n                    });\n                }\n\n                setIsOpen(true);\n            }\n        }, [pseudoSize, yOffset]);\n\n        const handleChildrenClick = () => {\n            handleShow();\n        };\n\n        const handleHide = useCallback(() => {\n            setIsOpen(false);\n        }, []);\n\n        const handleMouseEnter = useCallback(() => {\n            if (shouldShowOnHover) {\n                window.clearTimeout(timeout.current);\n                handleShow();\n            }\n        }, [handleShow, shouldShowOnHover]);\n\n        const handleMouseLeave = useCallback(() => {\n            if (!shouldShowOnHover) {\n                return;\n            }\n\n            if (shouldHideOnChildrenLeave) {\n                handleHide();\n\n                return;\n            }\n\n            timeout.current = window.setTimeout(() => {\n                handleHide();\n            }, 500);\n        }, [handleHide, shouldHideOnChildrenLeave, shouldShowOnHover]);\n\n        const handleDocumentClick = useCallback<EventListener>(\n            (event) => {\n                if (!popupContentRef.current?.contains(event.target as Node)) {\n                    handleHide();\n                }\n            },\n            [handleHide],\n        );\n\n        useImperativeHandle(\n            ref,\n            () => ({\n                hide: handleHide,\n                show: handleShow,\n            }),\n            [handleHide, handleShow],\n        );\n\n        useEffect(() => {\n            void getWindowMetrics().then((result) => {\n                if (result.topBarHeight) {\n                    setMenuHeight(result.topBarHeight);\n                }\n            });\n        }, []);\n\n        useEffect(() => {\n            if (isOpen) {\n                document.addEventListener('click', handleDocumentClick, true);\n                window.addEventListener('blur', handleHide);\n\n                if (typeof onShow === 'function') {\n                    onShow();\n                }\n            } else if (typeof onHide === 'function') {\n                onHide();\n            }\n\n            return () => {\n                document.removeEventListener('click', handleDocumentClick, true);\n                window.removeEventListener('blur', handleHide);\n            };\n        }, [handleDocumentClick, handleHide, isOpen, onHide, onShow]);\n\n        useEffect(() => {\n            if (!newContainer) {\n                return;\n            }\n\n            setPortal(() =>\n                createPortal(\n                    <AnimatePresence initial={false}>\n                        {isOpen && (\n                            <PopupContentWrapper\n                                width={pseudoSize?.width ?? 0}\n                                offset={offset}\n                                coordinates={coordinates}\n                                key={`tooltip_${uuid}`}\n                                alignment={alignment}\n                                ref={popupContentRef}\n                                onMouseLeave={handleMouseLeave}\n                                onMouseEnter={handleMouseEnter}\n                            >\n                                <AreaContextProvider shouldChangeColor={false}>\n                                    {content}\n                                </AreaContextProvider>\n                            </PopupContentWrapper>\n                        )}\n                    </AnimatePresence>,\n                    newContainer,\n                ),\n            );\n        }, [\n            alignment,\n            newContainer,\n            content,\n            coordinates,\n            handleMouseEnter,\n            handleMouseLeave,\n            isOpen,\n            offset,\n            pseudoSize?.width,\n            uuid,\n        ]);\n\n        return (\n            <>\n                {isMeasuring && (\n                    <StyledPopupPseudo ref={popupPseudoContentRef} $menuHeight={menuHeight}>\n                        {content}\n                    </StyledPopupPseudo>\n                )}\n                <StyledPopup\n                    ref={popupRef}\n                    onClick={handleChildrenClick}\n                    onMouseLeave={handleMouseLeave}\n                    onMouseEnter={handleMouseEnter}\n                    $shouldUseChildrenWidth={shouldUseChildrenWidth}\n                >\n                    {children}\n                </StyledPopup>\n                {portal}\n            </>\n        );\n    },\n);\n\nPopup.displayName = 'Popup';\n\nexport default Popup;\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/popup/popup-content-wrapper/PopupContentWrapper.styles.js

@@ -1,5 +1,5 @@
 import { ColorMode } from 'chayns-api';
-import { motion } from 'framer-motion';
+import { motion } from 'motion/react';
 import styled, { css } from 'styled-components';
 import { PopupAlignment } from '../../../types/popup';
 export const StyledMotionPopupContentWrapper = styled(motion.div)`