@chayns-components/core 5.0.0-beta.997 → 5.0.0

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

@@ -1,42 +1,34 @@
-import { motion } from 'framer-motion';
+import { motion } from 'motion/react';
 import styled, { css } from 'styled-components';
-export const StyledListItemHead = styled(motion.div)`
+import { LIST_ITEM_HEAD_HTML_TAG, LIST_ITEM_HEAD_INDICATOR_HTML_TAG, LIST_ITEM_HEAD_TITLE_HTML_TAG } from '../../../../constants/list';
+export const StyledListItemHead = styled[LIST_ITEM_HEAD_HTML_TAG]`
     //align-items: center;
     overflow: hidden;
-    color: ${_ref => {
-  let {
-    theme
-  } = _ref;
-  return theme.text;
-}};
+    color: ${({
+  theme
+}) => theme.text};
     display: flex;
     min-height: 64px;
     padding: 12px 9px;
+    position: relative;
+    width: 100%;
+    justify-content: center;
+    cursor: ${({
+  $isClickable
+}) => $isClickable ? 'pointer' : 'default'};
 
-    ${_ref2 => {
-  let {
-    $isAnyItemExpandable
-  } = _ref2;
-  return !$isAnyItemExpandable && css`
+    ${({
+  $isAnyItemExpandable
+}) => !$isAnyItemExpandable && css`
             padding-left: 12px;
-        `;
-}}
-
-    ${_ref3 => {
-  let {
-    $isClickable
-  } = _ref3;
-  return $isClickable && css`
-            cursor: pointer;
-        `;
-}}
+        `}
 `;
 export const StyledListItemHeadLeftWrapper = styled.div`
     display: flex;
     align-items: center;
     margin: auto 0;
 `;
-export const StyledMotionListItemHeadIndicator = styled(motion.div)`
+export const StyledListItemHeadIndicator = styled[LIST_ITEM_HEAD_INDICATOR_HTML_TAG]`
     align-items: center;
     display: flex;
     flex: 0 0 auto;
@@ -48,146 +40,47 @@ export const StyledListItemHeadContent = styled.div`
     display: flex;
     flex: 1 1 auto;
     flex-direction: column;
-    font-weight: ${_ref4 => {
-  let {
-    $isOpen
-  } = _ref4;
-  return $isOpen ? 'bold' : 'normal';
-}};
-    justify-content: start;
+    font-weight: ${({
+  $isOpen
+}) => $isOpen ? 'bold' : 'normal'};
+    justify-content: center;
     line-height: normal;
-    margin-left: ${_ref5 => {
-  let {
-    $isIconOrImageGiven
-  } = _ref5;
-  return $isIconOrImageGiven ? '10px' : undefined;
-}};
-    margin-top: ${_ref6 => {
-  let {
-    $marginTop
-  } = _ref6;
-  return $marginTop;
-}}px;
+    margin-left: ${({
+  $isIconOrImageGiven
+}) => $isIconOrImageGiven ? '10px' : undefined};
     min-width: 0;
 `;
-export const StyledListItemHeadTitle = styled.div`
+export const StyledListItemHeadTitle = styled[LIST_ITEM_HEAD_TITLE_HTML_TAG]`
     align-items: center;
     display: flex;
     justify-content: space-between;
 `;
 export const StyledListItemHeadTitleContent = styled.div`
+    align-items: center;
     display: flex;
     flex: 1 1 auto;
     max-width: 100%;
     min-width: 0;
     position: relative;
 `;
-export const StyledListItemHeadTitleElement = styled.div`
-    align-items: center;
-    display: flex;
-    flex: 0 0 auto;
-    margin-left: 8px;
-`;
-export const StyledListItemHeadTitleText = styled(motion.span)`
-    font-weight: ${_ref7 => {
-  let {
-    $isOpen
-  } = _ref7;
-  return $isOpen ? 'bold' : 'normal';
-}};
-    white-space: ${_ref8 => {
-  let {
-    $isOpen
-  } = _ref8;
-  return $isOpen ? 'normal' : 'nowrap';
-}};
-    min-width: ${_ref9 => {
-  let {
-    $isOpen,
-    $width
-  } = _ref9;
-  return $isOpen ? `${$width}px` : undefined;
-}};
-    overflow: hidden;
-    text-overflow: ellipsis;
-`;
-export const StyledListItemHeadTitleTextPseudo = styled.span`
-    font-weight: ${_ref10 => {
-  let {
-    $isOpen
-  } = _ref10;
-  return $isOpen ? 'bold' : 'normal';
-}};
-    white-space: ${_ref11 => {
-  let {
-    $isOpen
-  } = _ref11;
-  return $isOpen ? 'normal' : 'nowrap';
-}};
-    overflow: hidden;
-    text-overflow: ellipsis;
-
-    opacity: 0;
-    pointer-events: none;
-    user-select: none;
-    position: absolute;
-`;
 export const StyledListItemHeadSubtitle = styled.div`
     align-items: center;
     display: flex;
     justify-content: space-between;
     margin-top: 2px;
 `;
-export const StyledListItemHeadSubtitleText = styled.span`
-    font-weight: ${_ref12 => {
-  let {
-    $isOpen
-  } = _ref12;
-  return $isOpen ? 'bold' : 'normal';
-}};
-    white-space: ${_ref13 => {
-  let {
-    $isOpen
-  } = _ref13;
-  return $isOpen ? 'normal' : 'nowrap';
-}};
-    overflow: hidden;
-    text-overflow: ellipsis;
-
-    flex: 1 1 auto;
-    font-size: 85%;
-    min-width: 0;
-    opacity: 0.75;
-`;
-export const StyledListItemHeadSubtitleTextPseudo = styled.span`
-    font-weight: ${_ref14 => {
-  let {
-    $isOpen
-  } = _ref14;
-  return $isOpen ? 'bold' : 'normal';
-}};
-    white-space: ${_ref15 => {
-  let {
-    $isOpen
-  } = _ref15;
-  return $isOpen ? 'normal' : 'nowrap';
-}};
-    overflow: hidden;
-    text-overflow: ellipsis;
-
-    flex: 1 1 auto;
-    font-size: 85%;
-    min-width: 0;
-
-    opacity: 0;
-    pointer-events: none;
-    user-select: none;
-
-    position: absolute;
-`;
-export const StyledMotionListItemHeadHoverItem = styled(motion.div)`
+export const StyledMotionListItemHeadHoverItemWrapper = styled(motion.div)`
     overflow: hidden;
     flex-shrink: 0;
     margin: auto 0;
+    position: absolute;
+    right: 0;
+
+    background: ${({
+  theme
+}) => `linear-gradient(to right, transparent 0px, rgb(${theme['000-rgb'] ?? ''}) 40px)`};
+`;
+export const StyledMotionListItemHeadHoverItem = styled.div`
+    padding-left: 40px;
 `;
 //# sourceMappingURL=ListItemHead.styles.js.map

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","LIST_ITEM_HEAD_HTML_TAG","LIST_ITEM_HEAD_INDICATOR_HTML_TAG","LIST_ITEM_HEAD_TITLE_HTML_TAG","StyledListItemHead","theme","text","$isClickable","$isAnyItemExpandable","StyledListItemHeadLeftWrapper","div","StyledListItemHeadIndicator","StyledListItemHeadContent","$isOpen","$isIconOrImageGiven","undefined","StyledListItemHeadTitle","StyledListItemHeadTitleContent","StyledListItemHeadSubtitle","StyledMotionListItemHeadHoverItemWrapper","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 { WithTheme } from '../../../color-scheme-provider/ColorSchemeProvider';\nimport {\n    LIST_ITEM_HEAD_HTML_TAG,\n    LIST_ITEM_HEAD_INDICATOR_HTML_TAG,\n    LIST_ITEM_HEAD_TITLE_HTML_TAG,\n} from '../../../../constants/list';\n\ntype StyledListItemHeadProps = WithTheme<{\n    $isClickable: boolean;\n    $isAnyItemExpandable: boolean;\n}>;\n\nexport const StyledListItemHead = styled[LIST_ITEM_HEAD_HTML_TAG]<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    position: relative;\n    width: 100%;\n    justify-content: center;\n    cursor: ${({ $isClickable }) => ($isClickable ? 'pointer' : 'default')};\n\n    ${({ $isAnyItemExpandable }) =>\n        !$isAnyItemExpandable &&\n        css`\n            padding-left: 12px;\n        `}\n`;\n\nexport const StyledListItemHeadLeftWrapper = styled.div`\n    display: flex;\n    align-items: center;\n    margin: auto 0;\n`;\n\nexport const StyledListItemHeadIndicator = styled[LIST_ITEM_HEAD_INDICATOR_HTML_TAG]`\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};\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: center;\n    line-height: normal;\n    margin-left: ${({ $isIconOrImageGiven }) => ($isIconOrImageGiven ? '10px' : undefined)};\n    min-width: 0;\n`;\n\nexport const StyledListItemHeadTitle = styled[LIST_ITEM_HEAD_TITLE_HTML_TAG]`\n    align-items: center;\n    display: flex;\n    justify-content: space-between;\n`;\n\nexport const StyledListItemHeadTitleContent = styled.div`\n    align-items: center;\n    display: flex;\n    flex: 1 1 auto;\n    max-width: 100%;\n    min-width: 0;\n    position: relative;\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 StyledMotionListItemHeadHoverItemWrapperProps = WithTheme<unknown>;\n\nexport const StyledMotionListItemHeadHoverItemWrapper = styled(\n    motion.div,\n)<StyledMotionListItemHeadHoverItemWrapperProps>`\n    overflow: hidden;\n    flex-shrink: 0;\n    margin: auto 0;\n    position: absolute;\n    right: 0;\n\n    background: ${({ theme }: StyledMotionListItemHeadHoverItemWrapperProps) =>\n        `linear-gradient(to right, transparent 0px, rgb(${theme['000-rgb'] ?? ''}) 40px)`};\n`;\n\nexport const StyledMotionListItemHeadHoverItem = styled.div`\n    padding-left: 40px;\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,cAAc;AACrC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAE/C,SACIC,uBAAuB,EACvBC,iCAAiC,EACjCC,6BAA6B,QAC1B,4BAA4B;AAOnC,OAAO,MAAMC,kBAAkB,GAAGL,MAAM,CAACE,uBAAuB,CAA0B;AAC1F;AACA;AACA,aAAa,CAAC;EAAEI;AAA+B,CAAC,KAAKA,KAAK,CAACC,IAAI;AAC/D;AACA;AACA;AACA;AACA;AACA;AACA,cAAc,CAAC;EAAEC;AAAa,CAAC,KAAMA,YAAY,GAAG,SAAS,GAAG,SAAU;AAC1E;AACA,MAAM,CAAC;EAAEC;AAAqB,CAAC,KACvB,CAACA,oBAAoB,IACrBR,GAAG;AACX;AACA,SAAS;AACT,CAAC;AAED,OAAO,MAAMS,6BAA6B,GAAGV,MAAM,CAACW,GAAG;AACvD;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMC,2BAA2B,GAAGZ,MAAM,CAACG,iCAAiC,CAAC;AACpF;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAOD,OAAO,MAAMU,yBAAyB,GAAGb,MAAM,CAACW,GAAmC;AACnF;AACA;AACA;AACA,mBAAmB,CAAC;EAAEG;AAAQ,CAAC,KAAMA,OAAO,GAAG,MAAM,GAAG,QAAS;AACjE;AACA;AACA,mBAAmB,CAAC;EAAEC;AAAoB,CAAC,KAAMA,mBAAmB,GAAG,MAAM,GAAGC,SAAU;AAC1F;AACA,CAAC;AAED,OAAO,MAAMC,uBAAuB,GAAGjB,MAAM,CAACI,6BAA6B,CAAC;AAC5E;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMc,8BAA8B,GAAGlB,MAAM,CAACW,GAAG;AACxD;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMQ,0BAA0B,GAAGnB,MAAM,CAACW,GAAG;AACpD;AACA;AACA;AACA;AACA,CAAC;AAID,OAAO,MAAMS,wCAAwC,GAAGpB,MAAM,CAC1DD,MAAM,CAACY,GACX,CAAgD;AAChD;AACA;AACA;AACA;AACA;AACA;AACA,kBAAkB,CAAC;EAAEL;AAAqD,CAAC,KACnE,kDAAkDA,KAAK,CAAC,SAAS,CAAC,IAAI,EAAE,SAAS;AACzF,CAAC;AAED,OAAO,MAAMe,iCAAiC,GAAGrB,MAAM,CAACW,GAAG;AAC3D;AACA,CAAC","ignoreList":[]}

package/lib/esm/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.js

@@ -1,20 +1,17 @@
 import React from 'react';
 import Icon from '../../../../icon/Icon';
 import { StyledListItemIcon } from './ListItemIcon.styles';
-const ListItemIcon = _ref => {
-  let {
-    icons,
-    shouldHideBackground,
-    shouldShowRoundIcon
-  } = _ref;
-  return /*#__PURE__*/React.createElement(StyledListItemIcon, {
-    $shouldHideBackground: shouldHideBackground,
-    $shouldShowRoundIcon: shouldShowRoundIcon
-  }, /*#__PURE__*/React.createElement(Icon, {
-    icons: icons,
-    size: 22
-  }));
-};
+const ListItemIcon = ({
+  icons,
+  shouldHideBackground,
+  shouldShowRoundIcon
+}) => /*#__PURE__*/React.createElement(StyledListItemIcon, {
+  $shouldHideBackground: shouldHideBackground,
+  $shouldShowRoundIcon: shouldShowRoundIcon
+}, /*#__PURE__*/React.createElement(Icon, {
+  icons: icons,
+  size: 22
+}));
 ListItemIcon.displayName = 'ListItemIcon';
 export default ListItemIcon;
 //# sourceMappingURL=ListItemIcon.js.map

package/lib/esm/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItemIcon.js","names":["React","Icon","StyledListItemIcon","ListItemIcon","_ref","icons","shouldHideBackground","shouldShowRoundIcon","createElement","$shouldHideBackground","$shouldShowRoundIcon","size","displayName"],"sources":["../../../../../../../src/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.tsx"],"sourcesContent":["import React from 'react';\nimport Icon from '../../../../icon/Icon';\nimport { StyledListItemIcon } from './ListItemIcon.styles';\n\ntype ListItemIconProps = {\n    icons: string[];\n    shouldHideBackground: boolean;\n    shouldShowRoundIcon: boolean;\n};\n\nconst ListItemIcon: React.FC<ListItemIconProps> = ({\n    icons,\n    shouldHideBackground,\n    shouldShowRoundIcon,\n}) => (\n    <StyledListItemIcon\n        $shouldHideBackground={shouldHideBackground}\n        $shouldShowRoundIcon={shouldShowRoundIcon}\n    >\n        <Icon icons={icons} size={22} />\n    </StyledListItemIcon>\n);\n\nListItemIcon.displayName = 'ListItemIcon';\n\nexport default ListItemIcon;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,IAAI,MAAM,uBAAuB;AACxC,SAASC,kBAAkB,QAAQ,uBAAuB;AAQ1D,MAAMC,YAAyC,GAAGC,IAAA;EAAA,IAAC;IAC/CC,KAAK;IACLC,oBAAoB;IACpBC;EACJ,CAAC,GAAAH,IAAA;EAAA,oBACGJ,KAAA,CAAAQ,aAAA,CAACN,kBAAkB;IACfO,qBAAqB,EAAEH,oBAAqB;IAC5CI,oBAAoB,EAAEH;EAAoB,gBAE1CP,KAAA,CAAAQ,aAAA,CAACP,IAAI;IAACI,KAAK,EAAEA,KAAM;IAACM,IAAI,EAAE;EAAG,CAAE,CACf,CAAC;AAAA,CACxB;AAEDR,YAAY,CAACS,WAAW,GAAG,cAAc;AAEzC,eAAeT,YAAY","ignoreList":[]}
+{"version":3,"file":"ListItemIcon.js","names":["React","Icon","StyledListItemIcon","ListItemIcon","icons","shouldHideBackground","shouldShowRoundIcon","createElement","$shouldHideBackground","$shouldShowRoundIcon","size","displayName"],"sources":["../../../../../../../src/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.tsx"],"sourcesContent":["import React from 'react';\nimport Icon from '../../../../icon/Icon';\nimport { StyledListItemIcon } from './ListItemIcon.styles';\n\ntype ListItemIconProps = {\n    icons: string[];\n    shouldHideBackground: boolean;\n    shouldShowRoundIcon: boolean;\n};\n\nconst ListItemIcon: React.FC<ListItemIconProps> = ({\n    icons,\n    shouldHideBackground,\n    shouldShowRoundIcon,\n}) => (\n    <StyledListItemIcon\n        $shouldHideBackground={shouldHideBackground}\n        $shouldShowRoundIcon={shouldShowRoundIcon}\n    >\n        <Icon icons={icons} size={22} />\n    </StyledListItemIcon>\n);\n\nListItemIcon.displayName = 'ListItemIcon';\n\nexport default ListItemIcon;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,IAAI,MAAM,uBAAuB;AACxC,SAASC,kBAAkB,QAAQ,uBAAuB;AAQ1D,MAAMC,YAAyC,GAAGA,CAAC;EAC/CC,KAAK;EACLC,oBAAoB;EACpBC;AACJ,CAAC,kBACGN,KAAA,CAAAO,aAAA,CAACL,kBAAkB;EACfM,qBAAqB,EAAEH,oBAAqB;EAC5CI,oBAAoB,EAAEH;AAAoB,gBAE1CN,KAAA,CAAAO,aAAA,CAACN,IAAI;EAACG,KAAK,EAAEA,KAAM;EAACM,IAAI,EAAE;AAAG,CAAE,CACf,CACvB;AAEDP,YAAY,CAACQ,WAAW,GAAG,cAAc;AAEzC,eAAeR,YAAY","ignoreList":[]}

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

@@ -11,35 +11,23 @@ export const StyledListItemIcon = styled.div`
         box-shadow 0.3s ease;
     width: 40px;
 
-    border-radius: ${_ref => {
-  let {
-    $shouldShowRoundIcon
-  } = _ref;
-  return $shouldShowRoundIcon ? '50%' : undefined;
-}};
+    border-radius: ${({
+  $shouldShowRoundIcon
+}) => $shouldShowRoundIcon ? '50%' : undefined};
 
-    ${_ref2 => {
-  let {
-    $shouldHideBackground
-  } = _ref2;
-  return !$shouldHideBackground && css`
+    ${({
+  $shouldHideBackground
+}) => !$shouldHideBackground && css`
             background-color: rgba(
-                ${_ref3 => {
-    let {
-      theme
-    } = _ref3;
-    return theme['text-rgb'];
-  }},
+                ${({
+  theme
+}) => theme['text-rgb']},
                 0.1
             );
             box-shadow: 0 0 0 1px
-                rgba(${_ref4 => {
-    let {
-      theme
-    } = _ref4;
-    return theme['009-rgb'];
-  }}, 0.08) inset;
-        `;
-}}
+                rgba(${({
+  theme
+}) => theme['009-rgb']}, 0.08) inset;
+        `}
 `;
 //# sourceMappingURL=ListItemIcon.styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"ListItemIcon.styles.js","names":["styled","css","StyledListItemIcon","div","_ref","$shouldShowRoundIcon","undefined","_ref2","$shouldHideBackground","_ref3","theme","_ref4"],"sources":["../../../../../../../src/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledListItemIconProps = WithTheme<{\n    $shouldHideBackground?: boolean;\n    $shouldShowRoundIcon?: boolean;\n}>;\n\nexport const StyledListItemIcon = styled.div<StyledListItemIconProps>`\n    align-items: center;\n    display: flex;\n    flex: 0 0 auto;\n    height: 40px;\n    justify-content: center;\n    transition:\n        background-color 0.3s ease,\n        border-radius 0.3s ease,\n        box-shadow 0.3s ease;\n    width: 40px;\n\n    border-radius: ${({ $shouldShowRoundIcon }) => ($shouldShowRoundIcon ? '50%' : undefined)};\n\n    ${({ $shouldHideBackground }) =>\n        !$shouldHideBackground &&\n        css`\n            background-color: rgba(\n                ${({ theme }: StyledListItemIconProps) => theme['text-rgb']},\n                0.1\n            );\n            box-shadow: 0 0 0 1px\n                rgba(${({ theme }: StyledListItemIconProps) => theme['009-rgb']}, 0.08) inset;\n        `}\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAQ/C,OAAO,MAAMC,kBAAkB,GAAGF,MAAM,CAACG,GAA4B;AACrE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,qBAAqBC,IAAA;EAAA,IAAC;IAAEC;EAAqB,CAAC,GAAAD,IAAA;EAAA,OAAMC,oBAAoB,GAAG,KAAK,GAAGC,SAAS;AAAA,CAAC;AAC7F;AACA,MAAMC,KAAA;EAAA,IAAC;IAAEC;EAAsB,CAAC,GAAAD,KAAA;EAAA,OACxB,CAACC,qBAAqB,IACtBP,GAAG;AACX;AACA,kBAAkBQ,KAAA;IAAA,IAAC;MAAEC;IAA+B,CAAC,GAAAD,KAAA;IAAA,OAAKC,KAAK,CAAC,UAAU,CAAC;EAAA;AAC3E;AACA;AACA;AACA,uBAAuBC,KAAA;IAAA,IAAC;MAAED;IAA+B,CAAC,GAAAC,KAAA;IAAA,OAAKD,KAAK,CAAC,SAAS,CAAC;EAAA;AAC/E,SAAS;AAAA;AACT,CAAC","ignoreList":[]}
+{"version":3,"file":"ListItemIcon.styles.js","names":["styled","css","StyledListItemIcon","div","$shouldShowRoundIcon","undefined","$shouldHideBackground","theme"],"sources":["../../../../../../../src/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledListItemIconProps = WithTheme<{\n    $shouldHideBackground?: boolean;\n    $shouldShowRoundIcon?: boolean;\n}>;\n\nexport const StyledListItemIcon = styled.div<StyledListItemIconProps>`\n    align-items: center;\n    display: flex;\n    flex: 0 0 auto;\n    height: 40px;\n    justify-content: center;\n    transition:\n        background-color 0.3s ease,\n        border-radius 0.3s ease,\n        box-shadow 0.3s ease;\n    width: 40px;\n\n    border-radius: ${({ $shouldShowRoundIcon }) => ($shouldShowRoundIcon ? '50%' : undefined)};\n\n    ${({ $shouldHideBackground }) =>\n        !$shouldHideBackground &&\n        css`\n            background-color: rgba(\n                ${({ theme }: StyledListItemIconProps) => theme['text-rgb']},\n                0.1\n            );\n            box-shadow: 0 0 0 1px\n                rgba(${({ theme }: StyledListItemIconProps) => theme['009-rgb']}, 0.08) inset;\n        `}\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAQ/C,OAAO,MAAMC,kBAAkB,GAAGF,MAAM,CAACG,GAA4B;AACrE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,qBAAqB,CAAC;EAAEC;AAAqB,CAAC,KAAMA,oBAAoB,GAAG,KAAK,GAAGC,SAAU;AAC7F;AACA,MAAM,CAAC;EAAEC;AAAsB,CAAC,KACxB,CAACA,qBAAqB,IACtBL,GAAG;AACX;AACA,kBAAkB,CAAC;EAAEM;AAA+B,CAAC,KAAKA,KAAK,CAAC,UAAU,CAAC;AAC3E;AACA;AACA;AACA,uBAAuB,CAAC;EAAEA;AAA+B,CAAC,KAAKA,KAAK,CAAC,SAAS,CAAC;AAC/E,SAAS;AACT,CAAC","ignoreList":[]}

package/lib/esm/components/list/list-item/list-item-head/list-item-image/ListItemImage.js

@@ -1,19 +1,17 @@
 import { MediaType, openMedia } from 'chayns-api';
-import React, { useCallback, useState } from 'react';
-import GridImage from '../../../../grid-image/GridImage';
-import { StyledListItemHeadImage, StyledListItemHeadImageWrapper } from './ListItemImage.styles';
-const ListItemImage = _ref => {
-  let {
-    imageBackground,
-    images,
-    shouldHideBackground,
-    shouldShowRoundImage,
-    shouldOpenImageOnClick
-  } = _ref;
-  const [hasLoadedImage, setHasLoadedImage] = useState(false);
-  const handleImageLoaded = useCallback(() => {
-    setHasLoadedImage(true);
-  }, []);
+import React, { useCallback } from 'react';
+import GroupedImage from '../../../../grouped-image/GroupedImage';
+const ListItemImage = ({
+  careOfLocationId,
+  cornerImage,
+  imageBackground,
+  images,
+  shouldHideBackground,
+  shouldShowRoundImage,
+  shouldOpenImageOnClick,
+  cornerElement,
+  onImageError
+}) => {
   const handleImageClick = useCallback(event => {
     if (!shouldOpenImageOnClick) {
       return;
@@ -32,27 +30,18 @@ const ListItemImage = _ref => {
       startIndex: 0
     });
   }, [images, shouldOpenImageOnClick]);
-  if (images && images[0] && images[1] && images[2]) {
-    const gridImages = [images[0], images[1], images[2]];
-    return /*#__PURE__*/React.createElement(GridImage, {
-      background: imageBackground,
-      images: gridImages,
-      shouldShowRoundImage: shouldShowRoundImage,
-      size: 40,
-      onClick: handleImageClick
-    });
-  }
   if (images && images[0]) {
-    return /*#__PURE__*/React.createElement(StyledListItemHeadImageWrapper, {
+    const careOfImage = careOfLocationId ? `https://sub60.tobit.com/l/${careOfLocationId}?size=128` : undefined;
+    return /*#__PURE__*/React.createElement(GroupedImage, {
+      cornerElement: cornerElement,
+      cornerImage: cornerImage ?? careOfImage,
+      imageBackground: imageBackground,
+      images: images,
+      onImageError: onImageError,
       onClick: handleImageClick,
-      $background: imageBackground,
-      $shouldHideBackground: shouldHideBackground,
-      $shouldShowRoundImage: shouldShowRoundImage
-    }, /*#__PURE__*/React.createElement(StyledListItemHeadImage, {
-      $isHidden: !hasLoadedImage,
-      onLoad: handleImageLoaded,
-      src: images[0]
-    }));
+      shouldPreventBackground: shouldHideBackground,
+      shouldShowRoundImage: shouldShowRoundImage
+    });
   }
   return null;
 };

package/lib/esm/components/list/list-item/list-item-head/list-item-image/ListItemImage.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItemImage.js","names":["MediaType","openMedia","React","useCallback","useState","GridImage","StyledListItemHeadImage","StyledListItemHeadImageWrapper","ListItemImage","_ref","imageBackground","images","shouldHideBackground","shouldShowRoundImage","shouldOpenImageOnClick","hasLoadedImage","setHasLoadedImage","handleImageLoaded","handleImageClick","event","preventDefault","stopPropagation","items","map","image","url","mediaType","IMAGE","startIndex","gridImages","createElement","background","size","onClick","$background","$shouldHideBackground","$shouldShowRoundImage","$isHidden","onLoad","src","displayName"],"sources":["../../../../../../../src/components/list/list-item/list-item-head/list-item-image/ListItemImage.tsx"],"sourcesContent":["import { MediaType, openMedia, OpenMediaItem } from 'chayns-api';\nimport React, { CSSProperties, MouseEventHandler, useCallback, useState } from 'react';\nimport GridImage from '../../../../grid-image/GridImage';\nimport { StyledListItemHeadImage, StyledListItemHeadImageWrapper } from './ListItemImage.styles';\n\ntype ListItemImageProps = {\n    imageBackground?: CSSProperties['background'];\n    images: string[];\n    shouldHideBackground: boolean;\n    shouldShowRoundImage: boolean;\n    shouldOpenImageOnClick: boolean;\n};\n\nconst ListItemImage: React.FC<ListItemImageProps> = ({\n    imageBackground,\n    images,\n    shouldHideBackground,\n    shouldShowRoundImage,\n    shouldOpenImageOnClick,\n}) => {\n    const [hasLoadedImage, setHasLoadedImage] = useState(false);\n    const handleImageLoaded = useCallback(() => {\n        setHasLoadedImage(true);\n    }, []);\n\n    const handleImageClick = useCallback<MouseEventHandler<HTMLDivElement>>(\n        (event) => {\n            if (!shouldOpenImageOnClick) {\n                return;\n            }\n\n            event.preventDefault();\n            event.stopPropagation();\n\n            const items: OpenMediaItem[] = images.map((image) => ({\n                url: image,\n                mediaType: MediaType.IMAGE,\n            }));\n\n            // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n            // @ts-ignore\n            void openMedia({ items, startIndex: 0 });\n        },\n        [images, shouldOpenImageOnClick],\n    );\n\n    if (images && images[0] && images[1] && images[2]) {\n        const gridImages = [images[0], images[1], images[2]];\n\n        return (\n            <GridImage\n                background={imageBackground}\n                images={gridImages}\n                shouldShowRoundImage={shouldShowRoundImage}\n                size={40}\n                onClick={handleImageClick}\n            />\n        );\n    }\n\n    if (images && images[0]) {\n        return (\n            <StyledListItemHeadImageWrapper\n                onClick={handleImageClick}\n                $background={imageBackground}\n                $shouldHideBackground={shouldHideBackground}\n                $shouldShowRoundImage={shouldShowRoundImage}\n            >\n                <StyledListItemHeadImage\n                    $isHidden={!hasLoadedImage}\n                    onLoad={handleImageLoaded}\n                    src={images[0]}\n                />\n            </StyledListItemHeadImageWrapper>\n        );\n    }\n\n    return null;\n};\n\nListItemImage.displayName = 'ListItemImage';\n\nexport default ListItemImage;\n"],"mappings":"AAAA,SAASA,SAAS,EAAEC,SAAS,QAAuB,YAAY;AAChE,OAAOC,KAAK,IAAsCC,WAAW,EAAEC,QAAQ,QAAQ,OAAO;AACtF,OAAOC,SAAS,MAAM,kCAAkC;AACxD,SAASC,uBAAuB,EAAEC,8BAA8B,QAAQ,wBAAwB;AAUhG,MAAMC,aAA2C,GAAGC,IAAA,IAM9C;EAAA,IAN+C;IACjDC,eAAe;IACfC,MAAM;IACNC,oBAAoB;IACpBC,oBAAoB;IACpBC;EACJ,CAAC,GAAAL,IAAA;EACG,MAAM,CAACM,cAAc,EAAEC,iBAAiB,CAAC,GAAGZ,QAAQ,CAAC,KAAK,CAAC;EAC3D,MAAMa,iBAAiB,GAAGd,WAAW,CAAC,MAAM;IACxCa,iBAAiB,CAAC,IAAI,CAAC;EAC3B,CAAC,EAAE,EAAE,CAAC;EAEN,MAAME,gBAAgB,GAAGf,WAAW,CAC/BgB,KAAK,IAAK;IACP,IAAI,CAACL,sBAAsB,EAAE;MACzB;IACJ;IAEAK,KAAK,CAACC,cAAc,CAAC,CAAC;IACtBD,KAAK,CAACE,eAAe,CAAC,CAAC;IAEvB,MAAMC,KAAsB,GAAGX,MAAM,CAACY,GAAG,CAAEC,KAAK,KAAM;MAClDC,GAAG,EAAED,KAAK;MACVE,SAAS,EAAE1B,SAAS,CAAC2B;IACzB,CAAC,CAAC,CAAC;;IAEH;IACA;IACA,KAAK1B,SAAS,CAAC;MAAEqB,KAAK;MAAEM,UAAU,EAAE;IAAE,CAAC,CAAC;EAC5C,CAAC,EACD,CAACjB,MAAM,EAAEG,sBAAsB,CACnC,CAAC;EAED,IAAIH,MAAM,IAAIA,MAAM,CAAC,CAAC,CAAC,IAAIA,MAAM,CAAC,CAAC,CAAC,IAAIA,MAAM,CAAC,CAAC,CAAC,EAAE;IAC/C,MAAMkB,UAAU,GAAG,CAAClB,MAAM,CAAC,CAAC,CAAC,EAAEA,MAAM,CAAC,CAAC,CAAC,EAAEA,MAAM,CAAC,CAAC,CAAC,CAAC;IAEpD,oBACIT,KAAA,CAAA4B,aAAA,CAACzB,SAAS;MACN0B,UAAU,EAAErB,eAAgB;MAC5BC,MAAM,EAAEkB,UAAW;MACnBhB,oBAAoB,EAAEA,oBAAqB;MAC3CmB,IAAI,EAAE,EAAG;MACTC,OAAO,EAAEf;IAAiB,CAC7B,CAAC;EAEV;EAEA,IAAIP,MAAM,IAAIA,MAAM,CAAC,CAAC,CAAC,EAAE;IACrB,oBACIT,KAAA,CAAA4B,aAAA,CAACvB,8BAA8B;MAC3B0B,OAAO,EAAEf,gBAAiB;MAC1BgB,WAAW,EAAExB,eAAgB;MAC7ByB,qBAAqB,EAAEvB,oBAAqB;MAC5CwB,qBAAqB,EAAEvB;IAAqB,gBAE5CX,KAAA,CAAA4B,aAAA,CAACxB,uBAAuB;MACpB+B,SAAS,EAAE,CAACtB,cAAe;MAC3BuB,MAAM,EAAErB,iBAAkB;MAC1BsB,GAAG,EAAE5B,MAAM,CAAC,CAAC;IAAE,CAClB,CAC2B,CAAC;EAEzC;EAEA,OAAO,IAAI;AACf,CAAC;AAEDH,aAAa,CAACgC,WAAW,GAAG,eAAe;AAE3C,eAAehC,aAAa","ignoreList":[]}
+{"version":3,"file":"ListItemImage.js","names":["MediaType","openMedia","React","useCallback","GroupedImage","ListItemImage","careOfLocationId","cornerImage","imageBackground","images","shouldHideBackground","shouldShowRoundImage","shouldOpenImageOnClick","cornerElement","onImageError","handleImageClick","event","preventDefault","stopPropagation","items","map","image","url","mediaType","IMAGE","startIndex","careOfImage","undefined","createElement","onClick","shouldPreventBackground","displayName"],"sources":["../../../../../../../src/components/list/list-item/list-item-head/list-item-image/ListItemImage.tsx"],"sourcesContent":["import { MediaType, openMedia, OpenMediaItem } from 'chayns-api';\nimport React, {\n    CSSProperties,\n    MouseEventHandler,\n    ReactNode,\n    SyntheticEvent,\n    useCallback,\n} from 'react';\nimport GroupedImage from '../../../../grouped-image/GroupedImage';\n\ntype ListItemImageProps = {\n    careOfLocationId?: number;\n    cornerImage?: string;\n    imageBackground?: CSSProperties['background'];\n    images: string[];\n    shouldHideBackground: boolean;\n    shouldShowRoundImage: boolean;\n    shouldOpenImageOnClick: boolean;\n    cornerElement?: ReactNode;\n    onImageError?: (event: SyntheticEvent<HTMLImageElement, Event>, index: number) => void;\n};\n\nconst ListItemImage: React.FC<ListItemImageProps> = ({\n    careOfLocationId,\n    cornerImage,\n    imageBackground,\n    images,\n    shouldHideBackground,\n    shouldShowRoundImage,\n    shouldOpenImageOnClick,\n    cornerElement,\n    onImageError,\n}) => {\n    const handleImageClick = useCallback<MouseEventHandler<HTMLDivElement>>(\n        (event) => {\n            if (!shouldOpenImageOnClick) {\n                return;\n            }\n\n            event.preventDefault();\n            event.stopPropagation();\n\n            const items: OpenMediaItem[] = images.map((image) => ({\n                url: image,\n                mediaType: MediaType.IMAGE,\n            }));\n\n            // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n            // @ts-ignore\n            void openMedia({ items, startIndex: 0 });\n        },\n        [images, shouldOpenImageOnClick],\n    );\n\n    if (images && images[0]) {\n        const careOfImage = careOfLocationId\n            ? `https://sub60.tobit.com/l/${careOfLocationId}?size=128`\n            : undefined;\n\n        return (\n            <GroupedImage\n                cornerElement={cornerElement}\n                cornerImage={cornerImage ?? careOfImage}\n                imageBackground={imageBackground}\n                images={images}\n                onImageError={onImageError}\n                onClick={handleImageClick}\n                shouldPreventBackground={shouldHideBackground}\n                shouldShowRoundImage={shouldShowRoundImage}\n            />\n        );\n    }\n\n    return null;\n};\n\nListItemImage.displayName = 'ListItemImage';\n\nexport default ListItemImage;\n"],"mappings":"AAAA,SAASA,SAAS,EAAEC,SAAS,QAAuB,YAAY;AAChE,OAAOC,KAAK,IAKRC,WAAW,QACR,OAAO;AACd,OAAOC,YAAY,MAAM,wCAAwC;AAcjE,MAAMC,aAA2C,GAAGA,CAAC;EACjDC,gBAAgB;EAChBC,WAAW;EACXC,eAAe;EACfC,MAAM;EACNC,oBAAoB;EACpBC,oBAAoB;EACpBC,sBAAsB;EACtBC,aAAa;EACbC;AACJ,CAAC,KAAK;EACF,MAAMC,gBAAgB,GAAGZ,WAAW,CAC/Ba,KAAK,IAAK;IACP,IAAI,CAACJ,sBAAsB,EAAE;MACzB;IACJ;IAEAI,KAAK,CAACC,cAAc,CAAC,CAAC;IACtBD,KAAK,CAACE,eAAe,CAAC,CAAC;IAEvB,MAAMC,KAAsB,GAAGV,MAAM,CAACW,GAAG,CAAEC,KAAK,KAAM;MAClDC,GAAG,EAAED,KAAK;MACVE,SAAS,EAAEvB,SAAS,CAACwB;IACzB,CAAC,CAAC,CAAC;;IAEH;IACA;IACA,KAAKvB,SAAS,CAAC;MAAEkB,KAAK;MAAEM,UAAU,EAAE;IAAE,CAAC,CAAC;EAC5C,CAAC,EACD,CAAChB,MAAM,EAAEG,sBAAsB,CACnC,CAAC;EAED,IAAIH,MAAM,IAAIA,MAAM,CAAC,CAAC,CAAC,EAAE;IACrB,MAAMiB,WAAW,GAAGpB,gBAAgB,GAC9B,6BAA6BA,gBAAgB,WAAW,GACxDqB,SAAS;IAEf,oBACIzB,KAAA,CAAA0B,aAAA,CAACxB,YAAY;MACTS,aAAa,EAAEA,aAAc;MAC7BN,WAAW,EAAEA,WAAW,IAAImB,WAAY;MACxClB,eAAe,EAAEA,eAAgB;MACjCC,MAAM,EAAEA,MAAO;MACfK,YAAY,EAAEA,YAAa;MAC3Be,OAAO,EAAEd,gBAAiB;MAC1Be,uBAAuB,EAAEpB,oBAAqB;MAC9CC,oBAAoB,EAAEA;IAAqB,CAC9C,CAAC;EAEV;EAEA,OAAO,IAAI;AACf,CAAC;AAEDN,aAAa,CAAC0B,WAAW,GAAG,eAAe;AAE3C,eAAe1B,aAAa","ignoreList":[]}

package/lib/esm/components/list/list-item/list-item-head/list-item-right-element/ListItemRightElement.js

@@ -0,0 +1,35 @@
+import React, { isValidElement, useMemo } from 'react';
+import { StyledListItemRightElement } from './ListItemRightElement.styles';
+import { getElementClickEvent } from '../../../../../utils/accordion';
+const ListItemRightElement = ({
+  rightElements
+}) => {
+  const handlePreventClick = event => {
+    event.stopPropagation();
+    event.preventDefault();
+  };
+  const centerElement = useMemo(() => {
+    if (typeof rightElements === 'string' || /*#__PURE__*/isValidElement(rightElements)) {
+      return rightElements;
+    }
+    if (typeof rightElements === 'object' && rightElements && 'center' in rightElements) {
+      return rightElements.center;
+    }
+    return undefined;
+  }, [rightElements]);
+  const shouldPreventRightElementClick = useMemo(() => {
+    if (centerElement) {
+      return getElementClickEvent(centerElement);
+    }
+    return false;
+  }, [centerElement]);
+  if (!centerElement) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement(StyledListItemRightElement, {
+    onClick: shouldPreventRightElementClick ? handlePreventClick : undefined
+  }, centerElement);
+};
+ListItemRightElement.displayName = 'ListItemRightElement';
+export default ListItemRightElement;
+//# sourceMappingURL=ListItemRightElement.js.map

package/lib/esm/components/list/list-item/list-item-head/list-item-right-element/ListItemRightElement.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItemRightElement.js","names":["React","isValidElement","useMemo","StyledListItemRightElement","getElementClickEvent","ListItemRightElement","rightElements","handlePreventClick","event","stopPropagation","preventDefault","centerElement","center","undefined","shouldPreventRightElementClick","createElement","onClick","displayName"],"sources":["../../../../../../../src/components/list/list-item/list-item-head/list-item-right-element/ListItemRightElement.tsx"],"sourcesContent":["import React, { FC, isValidElement, useMemo } from 'react';\nimport type { IListItemRightElement, IListItemRightElements } from '../../../../../types/list';\nimport { StyledListItemRightElement } from './ListItemRightElement.styles';\nimport { getElementClickEvent } from '../../../../../utils/accordion';\n\ntype ListItemRightElementProps = {\n    rightElements?: IListItemRightElements;\n};\n\nconst ListItemRightElement: FC<ListItemRightElementProps> = ({ rightElements }) => {\n    const handlePreventClick = (event: React.MouseEvent) => {\n        event.stopPropagation();\n        event.preventDefault();\n    };\n\n    const centerElement = useMemo(() => {\n        if (typeof rightElements === 'string' || isValidElement(rightElements)) {\n            return rightElements;\n        }\n\n        if (typeof rightElements === 'object' && rightElements && 'center' in rightElements) {\n            return (rightElements as unknown as IListItemRightElement).center;\n        }\n\n        return undefined;\n    }, [rightElements]);\n\n    const shouldPreventRightElementClick = useMemo(() => {\n        if (centerElement) {\n            return getElementClickEvent(centerElement);\n        }\n\n        return false;\n    }, [centerElement]);\n\n    if (!centerElement) {\n        return null;\n    }\n\n    return (\n        <StyledListItemRightElement\n            onClick={shouldPreventRightElementClick ? handlePreventClick : undefined}\n        >\n            {centerElement}\n        </StyledListItemRightElement>\n    );\n};\n\nListItemRightElement.displayName = 'ListItemRightElement';\n\nexport default ListItemRightElement;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAQC,cAAc,EAAEC,OAAO,QAAQ,OAAO;AAE1D,SAASC,0BAA0B,QAAQ,+BAA+B;AAC1E,SAASC,oBAAoB,QAAQ,gCAAgC;AAMrE,MAAMC,oBAAmD,GAAGA,CAAC;EAAEC;AAAc,CAAC,KAAK;EAC/E,MAAMC,kBAAkB,GAAIC,KAAuB,IAAK;IACpDA,KAAK,CAACC,eAAe,CAAC,CAAC;IACvBD,KAAK,CAACE,cAAc,CAAC,CAAC;EAC1B,CAAC;EAED,MAAMC,aAAa,GAAGT,OAAO,CAAC,MAAM;IAChC,IAAI,OAAOI,aAAa,KAAK,QAAQ,iBAAIL,cAAc,CAACK,aAAa,CAAC,EAAE;MACpE,OAAOA,aAAa;IACxB;IAEA,IAAI,OAAOA,aAAa,KAAK,QAAQ,IAAIA,aAAa,IAAI,QAAQ,IAAIA,aAAa,EAAE;MACjF,OAAQA,aAAa,CAAsCM,MAAM;IACrE;IAEA,OAAOC,SAAS;EACpB,CAAC,EAAE,CAACP,aAAa,CAAC,CAAC;EAEnB,MAAMQ,8BAA8B,GAAGZ,OAAO,CAAC,MAAM;IACjD,IAAIS,aAAa,EAAE;MACf,OAAOP,oBAAoB,CAACO,aAAa,CAAC;IAC9C;IAEA,OAAO,KAAK;EAChB,CAAC,EAAE,CAACA,aAAa,CAAC,CAAC;EAEnB,IAAI,CAACA,aAAa,EAAE;IAChB,OAAO,IAAI;EACf;EAEA,oBACIX,KAAA,CAAAe,aAAA,CAACZ,0BAA0B;IACvBa,OAAO,EAAEF,8BAA8B,GAAGP,kBAAkB,GAAGM;EAAU,GAExEF,aACuB,CAAC;AAErC,CAAC;AAEDN,oBAAoB,CAACY,WAAW,GAAG,sBAAsB;AAEzD,eAAeZ,oBAAoB","ignoreList":[]}

package/lib/esm/components/list/list-item/list-item-head/list-item-right-element/ListItemRightElement.styles.js

@@ -0,0 +1,8 @@
+import styled from 'styled-components';
+export const StyledListItemRightElement = styled.div`
+    margin: auto 0 auto 12px;
+    display: flex;
+    flex: 0 0 auto;
+    line-height: normal;
+`;
+//# sourceMappingURL=ListItemRightElement.styles.js.map

package/lib/esm/components/list/list-item/list-item-head/list-item-right-element/ListItemRightElement.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItemRightElement.styles.js","names":["styled","StyledListItemRightElement","div"],"sources":["../../../../../../../src/components/list/list-item/list-item-head/list-item-right-element/ListItemRightElement.styles.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport const StyledListItemRightElement = styled.div`\n    margin: auto 0 auto 12px;\n    display: flex;\n    flex: 0 0 auto;\n    line-height: normal;\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,MAAM,mBAAmB;AAEtC,OAAO,MAAMC,0BAA0B,GAAGD,MAAM,CAACE,GAAG;AACpD;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}

package/lib/esm/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.js

@@ -0,0 +1,33 @@
+import React, { useMemo } from 'react';
+import { StyledListItemHeadSubtitleText, StyledListItemSubtitle, StyledListItemBottomRightElement } from './ListItemSubtitle.styles';
+import { getElementClickEvent } from '../../../../../utils/accordion';
+const ListItemSubtitle = ({
+  rightElements,
+  subtitle,
+  isOpen
+}) => {
+  const handlePreventClick = event => {
+    event.stopPropagation();
+    event.preventDefault();
+  };
+  const bottomElement = useMemo(() => {
+    if (typeof rightElements === 'object' && rightElements && 'bottom' in rightElements) {
+      return rightElements.bottom;
+    }
+    return undefined;
+  }, [rightElements]);
+  const shouldPreventRightElementClick = useMemo(() => {
+    if (bottomElement) {
+      return getElementClickEvent(bottomElement);
+    }
+    return false;
+  }, [bottomElement]);
+  return /*#__PURE__*/React.createElement(StyledListItemSubtitle, null, /*#__PURE__*/React.createElement(StyledListItemHeadSubtitleText, {
+    $isOpen: isOpen
+  }, subtitle), bottomElement && /*#__PURE__*/React.createElement(StyledListItemBottomRightElement, {
+    onClick: shouldPreventRightElementClick ? handlePreventClick : undefined
+  }, bottomElement));
+};
+ListItemSubtitle.displayName = 'ListItemSubtitle';
+export default ListItemSubtitle;
+//# sourceMappingURL=ListItemSubtitle.js.map

package/lib/esm/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItemSubtitle.js","names":["React","useMemo","StyledListItemHeadSubtitleText","StyledListItemSubtitle","StyledListItemBottomRightElement","getElementClickEvent","ListItemSubtitle","rightElements","subtitle","isOpen","handlePreventClick","event","stopPropagation","preventDefault","bottomElement","bottom","undefined","shouldPreventRightElementClick","createElement","$isOpen","onClick","displayName"],"sources":["../../../../../../../src/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.tsx"],"sourcesContent":["import React, { FC, ReactNode, useMemo } from 'react';\nimport type { IListItemRightElement, IListItemRightElements } from '../../../../../types/list';\nimport {\n    StyledListItemHeadSubtitleText,\n    StyledListItemSubtitle,\n    StyledListItemBottomRightElement,\n} from './ListItemSubtitle.styles';\nimport { getElementClickEvent } from '../../../../../utils/accordion';\n\ntype ListItemSubtitleProps = {\n    rightElements?: IListItemRightElements;\n    subtitle?: ReactNode;\n    isOpen: boolean;\n};\n\nconst ListItemSubtitle: FC<ListItemSubtitleProps> = ({ rightElements, subtitle, isOpen }) => {\n    const handlePreventClick = (event: React.MouseEvent) => {\n        event.stopPropagation();\n        event.preventDefault();\n    };\n\n    const bottomElement = useMemo(() => {\n        if (typeof rightElements === 'object' && rightElements && 'bottom' in rightElements) {\n            return (rightElements as unknown as IListItemRightElement).bottom;\n        }\n\n        return undefined;\n    }, [rightElements]);\n\n    const shouldPreventRightElementClick = useMemo(() => {\n        if (bottomElement) {\n            return getElementClickEvent(bottomElement);\n        }\n\n        return false;\n    }, [bottomElement]);\n\n    return (\n        <StyledListItemSubtitle>\n            <StyledListItemHeadSubtitleText $isOpen={isOpen}>\n                {subtitle}\n            </StyledListItemHeadSubtitleText>\n            {bottomElement && (\n                <StyledListItemBottomRightElement\n                    onClick={shouldPreventRightElementClick ? handlePreventClick : undefined}\n                >\n                    {bottomElement}\n                </StyledListItemBottomRightElement>\n            )}\n        </StyledListItemSubtitle>\n    );\n};\n\nListItemSubtitle.displayName = 'ListItemSubtitle';\n\nexport default ListItemSubtitle;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAmBC,OAAO,QAAQ,OAAO;AAErD,SACIC,8BAA8B,EAC9BC,sBAAsB,EACtBC,gCAAgC,QAC7B,2BAA2B;AAClC,SAASC,oBAAoB,QAAQ,gCAAgC;AAQrE,MAAMC,gBAA2C,GAAGA,CAAC;EAAEC,aAAa;EAAEC,QAAQ;EAAEC;AAAO,CAAC,KAAK;EACzF,MAAMC,kBAAkB,GAAIC,KAAuB,IAAK;IACpDA,KAAK,CAACC,eAAe,CAAC,CAAC;IACvBD,KAAK,CAACE,cAAc,CAAC,CAAC;EAC1B,CAAC;EAED,MAAMC,aAAa,GAAGb,OAAO,CAAC,MAAM;IAChC,IAAI,OAAOM,aAAa,KAAK,QAAQ,IAAIA,aAAa,IAAI,QAAQ,IAAIA,aAAa,EAAE;MACjF,OAAQA,aAAa,CAAsCQ,MAAM;IACrE;IAEA,OAAOC,SAAS;EACpB,CAAC,EAAE,CAACT,aAAa,CAAC,CAAC;EAEnB,MAAMU,8BAA8B,GAAGhB,OAAO,CAAC,MAAM;IACjD,IAAIa,aAAa,EAAE;MACf,OAAOT,oBAAoB,CAACS,aAAa,CAAC;IAC9C;IAEA,OAAO,KAAK;EAChB,CAAC,EAAE,CAACA,aAAa,CAAC,CAAC;EAEnB,oBACId,KAAA,CAAAkB,aAAA,CAACf,sBAAsB,qBACnBH,KAAA,CAAAkB,aAAA,CAAChB,8BAA8B;IAACiB,OAAO,EAAEV;EAAO,GAC3CD,QAC2B,CAAC,EAChCM,aAAa,iBACVd,KAAA,CAAAkB,aAAA,CAACd,gCAAgC;IAC7BgB,OAAO,EAAEH,8BAA8B,GAAGP,kBAAkB,GAAGM;EAAU,GAExEF,aAC6B,CAElB,CAAC;AAEjC,CAAC;AAEDR,gBAAgB,CAACe,WAAW,GAAG,kBAAkB;AAEjD,eAAef,gBAAgB","ignoreList":[]}

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

@@ -0,0 +1,33 @@
+import styled from 'styled-components';
+export const StyledListItemSubtitle = styled.div`
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 12px;
+    width: 100%;
+`;
+export const StyledListItemHeadSubtitleText = styled.span`
+    font-weight: ${({
+  $isOpen
+}) => $isOpen ? 'bold' : 'normal'};
+    white-space: ${({
+  $isOpen
+}) => $isOpen ? 'normal' : 'nowrap'};
+    overflow: hidden;
+    text-overflow: ellipsis;
+
+    flex: 1 1 auto;
+    font-size: 85%;
+    min-width: 0;
+    opacity: 0.75;
+`;
+export const StyledListItemBottomRightElement = styled.div`
+    display: flex;
+    flex: 0 0 auto;
+    font-size: 85%;
+    margin-left: auto;
+    height: 50%;
+    align-items: center;
+    line-height: normal;
+`;
+//# sourceMappingURL=ListItemSubtitle.styles.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ListItemSubtitle.styles.js","names":["styled","StyledListItemSubtitle","div","StyledListItemHeadSubtitleText","span","$isOpen","StyledListItemBottomRightElement"],"sources":["../../../../../../../src/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.styles.ts"],"sourcesContent":["import styled from 'styled-components';\nimport type { WithTheme } from '../../../../color-scheme-provider/ColorSchemeProvider';\n\nexport const StyledListItemSubtitle = styled.div`\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 12px;\n    width: 100%;\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\nexport const StyledListItemBottomRightElement = styled.div`\n    display: flex;\n    flex: 0 0 auto;\n    font-size: 85%;\n    margin-left: auto;\n    height: 50%;\n    align-items: center;\n    line-height: normal;\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,MAAM,mBAAmB;AAGtC,OAAO,MAAMC,sBAAsB,GAAGD,MAAM,CAACE,GAAG;AAChD;AACA;AACA;AACA;AACA;AACA,CAAC;AAID,OAAO,MAAMC,8BAA8B,GAAGH,MAAM,CAACI,IAAyC;AAC9F,mBAAmB,CAAC;EAAEC;AAAQ,CAAC,KAAMA,OAAO,GAAG,MAAM,GAAG,QAAS;AACjE,mBAAmB,CAAC;EAAEA;AAAQ,CAAC,KAAMA,OAAO,GAAG,QAAQ,GAAG,QAAS;AACnE;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMC,gCAAgC,GAAGN,MAAM,CAACE,GAAG;AAC1D;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}