@chayns-components/core 5.0.0-beta.763 → 5.0.0-beta.766

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -44,6 +44,16 @@ const AccordionHead = ({
44
44
  const theme = (0, _styledComponents.useTheme)();
45
45
  const titleElementWrapperRef = (0, _react.useRef)(null);
46
46
  const titleWrapperRef = (0, _react.useRef)(null);
47
+ const [internalSearchValue, setInternalSearchValue] = (0, _react.useState)();
48
+ (0, _react.useEffect)(() => {
49
+ setInternalSearchValue(searchValue);
50
+ }, [searchValue]);
51
+ const handleOnSearchChance = event => {
52
+ setInternalSearchValue(event.target.value);
53
+ if (typeof onSearchChange === 'function') {
54
+ onSearchChange(event);
55
+ }
56
+ };
47
57
  const titleElementChildrenSize = (0, _useElementSize.useElementSize)(titleElementWrapperRef, {
48
58
  shouldUseChildElement: true
49
59
  });
@@ -176,10 +186,10 @@ const AccordionHead = ({
176
186
  },
177
187
  key: `searchWrapper--${uuid}`
178
188
  }, /*#__PURE__*/_react.default.createElement(_SearchInput.default, {
179
- onChange: onSearchChange,
189
+ onChange: handleOnSearchChance,
180
190
  placeholder: searchPlaceholder,
181
191
  size: _Input.InputSize.Small,
182
- value: searchValue
192
+ value: internalSearchValue
183
193
  })), rightElement && /*#__PURE__*/_react.default.createElement(_AccordionHead.StyledMotionRightElementWrapper, {
184
194
  animate: {
185
195
  opacity: 1
@@ -1 +1 @@
1
- {"version":3,"file":"AccordionHead.js","names":["_framerMotion","require","_react","_interopRequireWildcard","_styledComponents","_useElementSize","_accordion","_AreaContextProvider","_Icon","_interopRequireDefault","_Input","_SearchInput","_AccordionHead","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","_extends","assign","bind","arguments","length","apply","AccordionHead","icon","isOpen","isFixed","isTitleGreyed","isWrapped","onClick","onSearchChange","rightElement","searchPlaceholder","searchValue","shouldRotateIcon","title","titleElement","uuid","titleInputProps","onTitleInputChange","titleColor","headHeight","setHeadHeight","useState","closed","open","theme","useTheme","titleElementWrapperRef","useRef","titleWrapperRef","titleElementChildrenSize","useElementSize","shouldUseChildElement","useEffect","_titleWrapperRef$curr","getAccordionHeadHeight","width","current","clientWidth","fontSize","iconElement","useMemo","createElement","icons","internalIcon","accordionIcon","toString","internalIconStyle","iconStyle","StyledAccordionIcon","className","$icon","accordionHeadHeight","height","tmp","setTmp","StyledMotionAccordionHead","animate","initial","key","StyledMotionIconWrapper","rotate","undefined","StyledMotionContentWrapper","opacity","ref","AreaContext","Provider","value","shouldChangeColor","onFocus","event","onBlur","onChange","LayoutGroup","StyledMotionTitleWrapper","AnimatePresence","StyledMotionTitle","scale","exit","$isOpen","$isWrapped","$color","transition","duration","StyledMotionTitleElementWrapper","layout","StyledRightWrapper","StyledMotionSearchWrapper","placeholder","size","InputSize","Small","StyledMotionRightElementWrapper","displayName","_default","exports"],"sources":["../../../../../src/components/accordion/accordion-head/AccordionHead.tsx"],"sourcesContent":["import { AnimatePresence, LayoutGroup } from 'framer-motion';\nimport React, {\n ChangeEventHandler,\n FC,\n MouseEventHandler,\n ReactNode,\n useEffect,\n useMemo,\n useRef,\n useState,\n type CSSProperties,\n} from 'react';\nimport { useTheme } from 'styled-components';\nimport { useElementSize } from '../../../hooks/useElementSize';\nimport { getAccordionHeadHeight } from '../../../utils/accordion';\nimport { AreaContext } from '../../area-provider/AreaContextProvider';\nimport Icon from '../../icon/Icon';\nimport Input, { InputSize, type InputProps } from '../../input/Input';\nimport SearchInput from '../../search-input/SearchInput';\nimport {\n StyledAccordionIcon,\n StyledMotionAccordionHead,\n StyledMotionContentWrapper,\n StyledMotionIconWrapper,\n StyledMotionRightElementWrapper,\n StyledMotionSearchWrapper,\n StyledMotionTitle,\n StyledMotionTitleElementWrapper,\n StyledMotionTitleWrapper,\n StyledRightWrapper,\n} from './AccordionHead.styles';\n\nexport type AccordionHeadProps = {\n icon?: string;\n isOpen: boolean;\n isFixed: boolean;\n isTitleGreyed: boolean;\n isWrapped: boolean;\n onClick: MouseEventHandler<HTMLDivElement>;\n onSearchChange?: ChangeEventHandler<HTMLInputElement>;\n rightElement?: ReactNode;\n searchPlaceholder?: string;\n searchValue?: string;\n shouldRotateIcon?: boolean;\n title: string;\n titleElement?: ReactNode;\n uuid: string;\n onTitleInputChange?: ChangeEventHandler<HTMLInputElement>;\n titleInputProps?: InputProps;\n titleColor?: CSSProperties['color'];\n};\n\ninterface HeadHeight {\n closed: number;\n open: number;\n}\n\nconst AccordionHead: FC<AccordionHeadProps> = ({\n icon,\n isOpen,\n isFixed,\n isTitleGreyed,\n isWrapped,\n onClick,\n onSearchChange,\n rightElement,\n searchPlaceholder,\n searchValue,\n shouldRotateIcon,\n title,\n titleElement,\n uuid,\n titleInputProps,\n onTitleInputChange,\n titleColor,\n}) => {\n const [headHeight, setHeadHeight] = useState<HeadHeight>({\n closed: isWrapped ? 40 : 33,\n open: isWrapped ? 40 : 33,\n });\n\n const theme = useTheme();\n\n const titleElementWrapperRef = useRef<HTMLDivElement>(null);\n const titleWrapperRef = useRef<HTMLDivElement>(null);\n\n const titleElementChildrenSize = useElementSize(titleElementWrapperRef, {\n shouldUseChildElement: true,\n });\n useEffect(() => {\n if (typeof onTitleInputChange === 'function') {\n setHeadHeight({ closed: 50, open: 50 });\n } else {\n setHeadHeight(\n getAccordionHeadHeight({\n isWrapped,\n title,\n width: (titleWrapperRef.current?.clientWidth ?? 0) - 10,\n }),\n );\n }\n // The fontSize need to be included to trigger a new calculation.\n // After the size is increased, the Title is cut at the bottom.\n }, [isWrapped, onTitleInputChange, theme.fontSize, title]);\n\n const iconElement = useMemo(() => {\n if (icon || isFixed) {\n return (\n <Icon\n icons={[isFixed ? 'fa fa-horizontal-rule' : (icon ?? 'fa fa-chevron-right')]}\n />\n );\n }\n\n let internalIcon = 'f105';\n\n if (\n theme?.accordionIcon &&\n theme.accordionIcon !== 110 &&\n theme.accordionIcon !== 1110100\n ) {\n internalIcon = (theme.accordionIcon as number).toString(16);\n }\n\n const internalIconStyle = theme?.iconStyle ? (theme.iconStyle as string) : 'fa-regular';\n\n return <StyledAccordionIcon className={internalIconStyle} $icon={internalIcon} />;\n }, [icon, theme, isFixed]);\n\n let accordionHeadHeight = isOpen ? headHeight.open : headHeight.closed;\n\n if (titleElementChildrenSize && titleElementChildrenSize.height > accordionHeadHeight) {\n // If the titleElement is bigger than the title, the height of the accordion head should be increased.\n // The height of the titleElement is increased by 8px because of the padding of the accordion head element.\n accordionHeadHeight = titleElementChildrenSize.height + 8;\n }\n\n const [tmp, setTmp] = useState(true);\n\n return (\n <StyledMotionAccordionHead\n animate={{ height: accordionHeadHeight }}\n className=\"beta-chayns-accordion-head\"\n initial={false}\n key={`accordionHead--${uuid}`}\n >\n <StyledMotionIconWrapper\n animate={{ rotate: (isOpen || isFixed) && shouldRotateIcon ? 90 : 0 }}\n initial={false}\n onClick={!isFixed ? onClick : undefined}\n key={`accordionHeadIcon--${uuid}`}\n >\n {iconElement}\n </StyledMotionIconWrapper>\n <StyledMotionContentWrapper\n animate={{ opacity: isTitleGreyed ? 0.5 : 1 }}\n initial={false}\n onClick={!isFixed && tmp ? onClick : undefined}\n ref={titleWrapperRef}\n key={`accordionHeadContentWrapper--${uuid}`}\n >\n {typeof onTitleInputChange === 'function' ? (\n // eslint-disable-next-line react/jsx-no-constructed-context-values\n <AreaContext.Provider value={{ shouldChangeColor: true }}>\n <Input\n {...titleInputProps}\n value={title}\n onFocus={(event) => {\n setTmp(false);\n\n if (titleInputProps?.onFocus) {\n titleInputProps.onFocus(event);\n }\n }}\n onBlur={(event) => {\n setTmp(true);\n\n if (titleInputProps?.onBlur) {\n titleInputProps.onBlur(event);\n }\n }}\n onChange={onTitleInputChange}\n />\n </AreaContext.Provider>\n ) : (\n <LayoutGroup key={`accordionHeadLayoutGroup--${uuid}`}>\n <StyledMotionTitleWrapper key={`accordionHeadTitleWrapperWrapper--${uuid}`}>\n <AnimatePresence\n initial={false}\n key={`accordionHeadTitleWrapper--${uuid}`}\n >\n <StyledMotionTitle\n animate={{ scale: 1 }}\n initial={{ scale: isOpen && !isWrapped ? 1 / 1.3 : 1.3 }}\n exit={{ opacity: 0 }}\n $isOpen={isOpen}\n $isWrapped={isWrapped}\n $color={titleColor}\n transition={{\n opacity: {\n duration: 0,\n },\n }}\n key={\n isOpen && !isWrapped\n ? `accordionHeadTitleBig--${uuid}`\n : `accordionHeadTitle--${uuid}`\n }\n >\n {title}\n </StyledMotionTitle>\n </AnimatePresence>\n </StyledMotionTitleWrapper>\n {titleElement && (\n <StyledMotionTitleElementWrapper\n layout\n key={`accordionTitleElement--${uuid}`}\n ref={titleElementWrapperRef}\n >\n {titleElement}\n </StyledMotionTitleElementWrapper>\n )}\n </LayoutGroup>\n )}\n </StyledMotionContentWrapper>\n {(typeof onSearchChange === 'function' || rightElement) && (\n <StyledRightWrapper>\n <AnimatePresence initial={false} key={`accordionRightWrapper--${uuid}`}>\n {typeof onSearchChange === 'function' && isOpen && (\n <StyledMotionSearchWrapper\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n key={`searchWrapper--${uuid}`}\n >\n <SearchInput\n onChange={onSearchChange}\n placeholder={searchPlaceholder}\n size={InputSize.Small}\n value={searchValue}\n />\n </StyledMotionSearchWrapper>\n )}\n {rightElement && (\n <StyledMotionRightElementWrapper\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n key={`rightElementWrapper--${uuid}`}\n >\n {rightElement}\n </StyledMotionRightElementWrapper>\n )}\n </AnimatePresence>\n </StyledRightWrapper>\n )}\n </StyledMotionAccordionHead>\n );\n};\n\nAccordionHead.displayName = 'AccordionHead';\n\nexport default AccordionHead;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"AccordionHead.js","names":["_framerMotion","require","_react","_interopRequireWildcard","_styledComponents","_useElementSize","_accordion","_AreaContextProvider","_Icon","_interopRequireDefault","_Input","_SearchInput","_AccordionHead","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","_extends","assign","bind","arguments","length","apply","AccordionHead","icon","isOpen","isFixed","isTitleGreyed","isWrapped","onClick","onSearchChange","rightElement","searchPlaceholder","searchValue","shouldRotateIcon","title","titleElement","uuid","titleInputProps","onTitleInputChange","titleColor","headHeight","setHeadHeight","useState","closed","open","theme","useTheme","titleElementWrapperRef","useRef","titleWrapperRef","internalSearchValue","setInternalSearchValue","useEffect","handleOnSearchChance","event","target","value","titleElementChildrenSize","useElementSize","shouldUseChildElement","_titleWrapperRef$curr","getAccordionHeadHeight","width","current","clientWidth","fontSize","iconElement","useMemo","createElement","icons","internalIcon","accordionIcon","toString","internalIconStyle","iconStyle","StyledAccordionIcon","className","$icon","accordionHeadHeight","height","tmp","setTmp","StyledMotionAccordionHead","animate","initial","key","StyledMotionIconWrapper","rotate","undefined","StyledMotionContentWrapper","opacity","ref","AreaContext","Provider","shouldChangeColor","onFocus","onBlur","onChange","LayoutGroup","StyledMotionTitleWrapper","AnimatePresence","StyledMotionTitle","scale","exit","$isOpen","$isWrapped","$color","transition","duration","StyledMotionTitleElementWrapper","layout","StyledRightWrapper","StyledMotionSearchWrapper","placeholder","size","InputSize","Small","StyledMotionRightElementWrapper","displayName","_default","exports"],"sources":["../../../../../src/components/accordion/accordion-head/AccordionHead.tsx"],"sourcesContent":["import { AnimatePresence, LayoutGroup } from 'framer-motion';\nimport React, {\n ChangeEvent,\n ChangeEventHandler,\n FC,\n MouseEventHandler,\n ReactNode,\n useEffect,\n useMemo,\n useRef,\n useState,\n type CSSProperties,\n} from 'react';\nimport { useTheme } from 'styled-components';\nimport { useElementSize } from '../../../hooks/useElementSize';\nimport { getAccordionHeadHeight } from '../../../utils/accordion';\nimport { AreaContext } from '../../area-provider/AreaContextProvider';\nimport Icon from '../../icon/Icon';\nimport Input, { InputSize, type InputProps } from '../../input/Input';\nimport SearchInput from '../../search-input/SearchInput';\nimport {\n StyledAccordionIcon,\n StyledMotionAccordionHead,\n StyledMotionContentWrapper,\n StyledMotionIconWrapper,\n StyledMotionRightElementWrapper,\n StyledMotionSearchWrapper,\n StyledMotionTitle,\n StyledMotionTitleElementWrapper,\n StyledMotionTitleWrapper,\n StyledRightWrapper,\n} from './AccordionHead.styles';\n\nexport type AccordionHeadProps = {\n icon?: string;\n isOpen: boolean;\n isFixed: boolean;\n isTitleGreyed: boolean;\n isWrapped: boolean;\n onClick: MouseEventHandler<HTMLDivElement>;\n onSearchChange?: ChangeEventHandler<HTMLInputElement>;\n rightElement?: ReactNode;\n searchPlaceholder?: string;\n searchValue?: string;\n shouldRotateIcon?: boolean;\n title: string;\n titleElement?: ReactNode;\n uuid: string;\n onTitleInputChange?: ChangeEventHandler<HTMLInputElement>;\n titleInputProps?: InputProps;\n titleColor?: CSSProperties['color'];\n};\n\ninterface HeadHeight {\n closed: number;\n open: number;\n}\n\nconst AccordionHead: FC<AccordionHeadProps> = ({\n icon,\n isOpen,\n isFixed,\n isTitleGreyed,\n isWrapped,\n onClick,\n onSearchChange,\n rightElement,\n searchPlaceholder,\n searchValue,\n shouldRotateIcon,\n title,\n titleElement,\n uuid,\n titleInputProps,\n onTitleInputChange,\n titleColor,\n}) => {\n const [headHeight, setHeadHeight] = useState<HeadHeight>({\n closed: isWrapped ? 40 : 33,\n open: isWrapped ? 40 : 33,\n });\n\n const theme = useTheme();\n\n const titleElementWrapperRef = useRef<HTMLDivElement>(null);\n const titleWrapperRef = useRef<HTMLDivElement>(null);\n\n const [internalSearchValue, setInternalSearchValue] = useState<string>();\n\n useEffect(() => {\n setInternalSearchValue(searchValue);\n }, [searchValue]);\n\n const handleOnSearchChance = (event: ChangeEvent<HTMLInputElement>) => {\n setInternalSearchValue(event.target.value);\n if (typeof onSearchChange === 'function') {\n onSearchChange(event);\n }\n };\n\n const titleElementChildrenSize = useElementSize(titleElementWrapperRef, {\n shouldUseChildElement: true,\n });\n useEffect(() => {\n if (typeof onTitleInputChange === 'function') {\n setHeadHeight({ closed: 50, open: 50 });\n } else {\n setHeadHeight(\n getAccordionHeadHeight({\n isWrapped,\n title,\n width: (titleWrapperRef.current?.clientWidth ?? 0) - 10,\n }),\n );\n }\n // The fontSize need to be included to trigger a new calculation.\n // After the size is increased, the Title is cut at the bottom.\n }, [isWrapped, onTitleInputChange, theme.fontSize, title]);\n\n const iconElement = useMemo(() => {\n if (icon || isFixed) {\n return (\n <Icon\n icons={[isFixed ? 'fa fa-horizontal-rule' : (icon ?? 'fa fa-chevron-right')]}\n />\n );\n }\n\n let internalIcon = 'f105';\n\n if (\n theme?.accordionIcon &&\n theme.accordionIcon !== 110 &&\n theme.accordionIcon !== 1110100\n ) {\n internalIcon = (theme.accordionIcon as number).toString(16);\n }\n\n const internalIconStyle = theme?.iconStyle ? (theme.iconStyle as string) : 'fa-regular';\n\n return <StyledAccordionIcon className={internalIconStyle} $icon={internalIcon} />;\n }, [icon, theme, isFixed]);\n\n let accordionHeadHeight = isOpen ? headHeight.open : headHeight.closed;\n\n if (titleElementChildrenSize && titleElementChildrenSize.height > accordionHeadHeight) {\n // If the titleElement is bigger than the title, the height of the accordion head should be increased.\n // The height of the titleElement is increased by 8px because of the padding of the accordion head element.\n accordionHeadHeight = titleElementChildrenSize.height + 8;\n }\n\n const [tmp, setTmp] = useState(true);\n\n return (\n <StyledMotionAccordionHead\n animate={{ height: accordionHeadHeight }}\n className=\"beta-chayns-accordion-head\"\n initial={false}\n key={`accordionHead--${uuid}`}\n >\n <StyledMotionIconWrapper\n animate={{ rotate: (isOpen || isFixed) && shouldRotateIcon ? 90 : 0 }}\n initial={false}\n onClick={!isFixed ? onClick : undefined}\n key={`accordionHeadIcon--${uuid}`}\n >\n {iconElement}\n </StyledMotionIconWrapper>\n <StyledMotionContentWrapper\n animate={{ opacity: isTitleGreyed ? 0.5 : 1 }}\n initial={false}\n onClick={!isFixed && tmp ? onClick : undefined}\n ref={titleWrapperRef}\n key={`accordionHeadContentWrapper--${uuid}`}\n >\n {typeof onTitleInputChange === 'function' ? (\n // eslint-disable-next-line react/jsx-no-constructed-context-values\n <AreaContext.Provider value={{ shouldChangeColor: true }}>\n <Input\n {...titleInputProps}\n value={title}\n onFocus={(event) => {\n setTmp(false);\n\n if (titleInputProps?.onFocus) {\n titleInputProps.onFocus(event);\n }\n }}\n onBlur={(event) => {\n setTmp(true);\n\n if (titleInputProps?.onBlur) {\n titleInputProps.onBlur(event);\n }\n }}\n onChange={onTitleInputChange}\n />\n </AreaContext.Provider>\n ) : (\n <LayoutGroup key={`accordionHeadLayoutGroup--${uuid}`}>\n <StyledMotionTitleWrapper key={`accordionHeadTitleWrapperWrapper--${uuid}`}>\n <AnimatePresence\n initial={false}\n key={`accordionHeadTitleWrapper--${uuid}`}\n >\n <StyledMotionTitle\n animate={{ scale: 1 }}\n initial={{ scale: isOpen && !isWrapped ? 1 / 1.3 : 1.3 }}\n exit={{ opacity: 0 }}\n $isOpen={isOpen}\n $isWrapped={isWrapped}\n $color={titleColor}\n transition={{\n opacity: {\n duration: 0,\n },\n }}\n key={\n isOpen && !isWrapped\n ? `accordionHeadTitleBig--${uuid}`\n : `accordionHeadTitle--${uuid}`\n }\n >\n {title}\n </StyledMotionTitle>\n </AnimatePresence>\n </StyledMotionTitleWrapper>\n {titleElement && (\n <StyledMotionTitleElementWrapper\n layout\n key={`accordionTitleElement--${uuid}`}\n ref={titleElementWrapperRef}\n >\n {titleElement}\n </StyledMotionTitleElementWrapper>\n )}\n </LayoutGroup>\n )}\n </StyledMotionContentWrapper>\n {(typeof onSearchChange === 'function' || rightElement) && (\n <StyledRightWrapper>\n <AnimatePresence initial={false} key={`accordionRightWrapper--${uuid}`}>\n {typeof onSearchChange === 'function' && isOpen && (\n <StyledMotionSearchWrapper\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n key={`searchWrapper--${uuid}`}\n >\n <SearchInput\n onChange={handleOnSearchChance}\n placeholder={searchPlaceholder}\n size={InputSize.Small}\n value={internalSearchValue}\n />\n </StyledMotionSearchWrapper>\n )}\n {rightElement && (\n <StyledMotionRightElementWrapper\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n key={`rightElementWrapper--${uuid}`}\n >\n {rightElement}\n </StyledMotionRightElementWrapper>\n )}\n </AnimatePresence>\n </StyledRightWrapper>\n )}\n </StyledMotionAccordionHead>\n );\n};\n\nAccordionHead.displayName = 'AccordionHead';\n\nexport default AccordionHead;\n"],"mappings":"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","ignoreList":[]}
@@ -44,9 +44,7 @@ const ComboBoxItem = ({
44
44
  $shouldShowRoundImage: shouldShowRoundImage
45
45
  }), icons && /*#__PURE__*/_react.default.createElement(_Icon.default, {
46
46
  icons: icons
47
- }), /*#__PURE__*/_react.default.createElement(_ComboBoxItem.StyledComboBoxItemContent, null, /*#__PURE__*/_react.default.createElement(_ComboBoxItem.StyledComboBoxItemContentHeader, null, /*#__PURE__*/_react.default.createElement(_ComboBoxItem.StyledComboBoxItemContentHeaderText, {
48
- $shouldShowBoldText: typeof subtext === 'string'
49
- }, text, suffixElement), /*#__PURE__*/_react.default.createElement(_ComboBoxItem.StyledComboBoxItemContentHeaderRightElement, null, rightElement)), /*#__PURE__*/_react.default.createElement(_ComboBoxItem.StyledComboBoxItemContentSubtext, null, subtext))), [handleItemClick, icons, id, imageUrl, isSelected, isTouch, rightElement, shouldShowRoundImage, subtext, suffixElement, text]);
47
+ }), /*#__PURE__*/_react.default.createElement(_ComboBoxItem.StyledComboBoxItemContent, null, /*#__PURE__*/_react.default.createElement(_ComboBoxItem.StyledComboBoxItemContentHeader, null, /*#__PURE__*/_react.default.createElement(_ComboBoxItem.StyledComboBoxItemContentHeaderText, null, text, suffixElement), /*#__PURE__*/_react.default.createElement(_ComboBoxItem.StyledComboBoxItemContentHeaderRightElement, null, rightElement)), /*#__PURE__*/_react.default.createElement(_ComboBoxItem.StyledComboBoxItemContentSubtext, null, subtext))), [handleItemClick, icons, id, imageUrl, isSelected, isTouch, rightElement, shouldShowRoundImage, subtext, suffixElement, text]);
50
48
  };
51
49
  ComboBoxItem.displayName = 'ComboBoxItem';
52
50
  var _default = exports.default = ComboBoxItem;
@@ -1 +1 @@
1
- {"version":3,"file":"ComboBoxItem.js","names":["_react","_interopRequireWildcard","require","_environment","_Icon","_interopRequireDefault","_ComboBoxItem","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ComboBoxItem","icons","id","imageUrl","isSelected","onSelect","rightElement","shouldShowRoundImage","subtext","suffixElement","text","value","handleItemClick","useCallback","isTouch","getIsTouch","useMemo","createElement","StyledComboBoxItem","String","onClick","$isTouch","$isSelected","StyledComboBoxItemImage","src","$shouldShowBigImage","$shouldShowRoundImage","StyledComboBoxItemContent","StyledComboBoxItemContentHeader","StyledComboBoxItemContentHeaderText","$shouldShowBoldText","StyledComboBoxItemContentHeaderRightElement","StyledComboBoxItemContentSubtext","displayName","_default","exports"],"sources":["../../../../../src/components/combobox/combobox-item/ComboBoxItem.tsx"],"sourcesContent":["import React, { FC, ReactNode, useCallback, useMemo } from 'react';\nimport { getIsTouch } from '../../../utils/environment';\nimport Icon from '../../icon/Icon';\nimport type { ComboBoxProps, IComboBoxItem } from '../ComboBox';\nimport {\n StyledComboBoxItem,\n StyledComboBoxItemContent,\n StyledComboBoxItemContentHeader,\n StyledComboBoxItemContentHeaderRightElement,\n StyledComboBoxItemContentHeaderText,\n StyledComboBoxItemContentSubtext,\n StyledComboBoxItemImage,\n} from './ComboBoxItem.styles';\n\nexport type ComboBoxItemProps = {\n icons?: IComboBoxItem['icons'];\n id: IComboBoxItem['value'];\n imageUrl: IComboBoxItem['imageUrl'];\n isSelected: boolean;\n onSelect: (itemToSelect: IComboBoxItem) => void;\n rightElement: IComboBoxItem['rightElement'];\n shouldShowRoundImage: ComboBoxProps['shouldShowRoundImage'];\n subtext: IComboBoxItem['subtext'];\n suffixElement?: ReactNode;\n text: IComboBoxItem['text'];\n value: IComboBoxItem['value'];\n};\n\nconst ComboBoxItem: FC<ComboBoxItemProps> = ({\n icons,\n id,\n imageUrl,\n isSelected,\n onSelect,\n rightElement,\n shouldShowRoundImage,\n subtext,\n suffixElement,\n text,\n value,\n}) => {\n const handleItemClick = useCallback(() => {\n onSelect({ text, value, suffixElement, imageUrl });\n }, [imageUrl, onSelect, suffixElement, text, value]);\n\n const isTouch = getIsTouch();\n\n return useMemo(\n () => (\n <StyledComboBoxItem\n id={`combobox-item__${typeof id === 'number' ? String(id) : id}`}\n onClick={handleItemClick}\n $isTouch={isTouch}\n $isSelected={isSelected}\n >\n {imageUrl && (\n <StyledComboBoxItemImage\n src={imageUrl}\n $shouldShowBigImage={typeof subtext === 'string'}\n $shouldShowRoundImage={shouldShowRoundImage}\n />\n )}\n {icons && <Icon icons={icons} />}\n <StyledComboBoxItemContent>\n <StyledComboBoxItemContentHeader>\n <StyledComboBoxItemContentHeaderText\n $shouldShowBoldText={typeof subtext === 'string'}\n >\n {text}\n {suffixElement}\n </StyledComboBoxItemContentHeaderText>\n <StyledComboBoxItemContentHeaderRightElement>\n {rightElement}\n </StyledComboBoxItemContentHeaderRightElement>\n </StyledComboBoxItemContentHeader>\n <StyledComboBoxItemContentSubtext>{subtext}</StyledComboBoxItemContentSubtext>\n </StyledComboBoxItemContent>\n </StyledComboBoxItem>\n ),\n [\n handleItemClick,\n icons,\n id,\n imageUrl,\n isSelected,\n isTouch,\n rightElement,\n shouldShowRoundImage,\n subtext,\n suffixElement,\n text,\n ],\n );\n};\n\nComboBoxItem.displayName = 'ComboBoxItem';\n\nexport default ComboBoxItem;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"ComboBoxItem.js","names":["_react","_interopRequireWildcard","require","_environment","_Icon","_interopRequireDefault","_ComboBoxItem","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ComboBoxItem","icons","id","imageUrl","isSelected","onSelect","rightElement","shouldShowRoundImage","subtext","suffixElement","text","value","handleItemClick","useCallback","isTouch","getIsTouch","useMemo","createElement","StyledComboBoxItem","String","onClick","$isTouch","$isSelected","StyledComboBoxItemImage","src","$shouldShowBigImage","$shouldShowRoundImage","StyledComboBoxItemContent","StyledComboBoxItemContentHeader","StyledComboBoxItemContentHeaderText","StyledComboBoxItemContentHeaderRightElement","StyledComboBoxItemContentSubtext","displayName","_default","exports"],"sources":["../../../../../src/components/combobox/combobox-item/ComboBoxItem.tsx"],"sourcesContent":["import React, { FC, ReactNode, useCallback, useMemo } from 'react';\nimport { getIsTouch } from '../../../utils/environment';\nimport Icon from '../../icon/Icon';\nimport type { ComboBoxProps, IComboBoxItem } from '../ComboBox';\nimport {\n StyledComboBoxItem,\n StyledComboBoxItemContent,\n StyledComboBoxItemContentHeader,\n StyledComboBoxItemContentHeaderRightElement,\n StyledComboBoxItemContentHeaderText,\n StyledComboBoxItemContentSubtext,\n StyledComboBoxItemImage,\n} from './ComboBoxItem.styles';\n\nexport type ComboBoxItemProps = {\n icons?: IComboBoxItem['icons'];\n id: IComboBoxItem['value'];\n imageUrl: IComboBoxItem['imageUrl'];\n isSelected: boolean;\n onSelect: (itemToSelect: IComboBoxItem) => void;\n rightElement: IComboBoxItem['rightElement'];\n shouldShowRoundImage: ComboBoxProps['shouldShowRoundImage'];\n subtext: IComboBoxItem['subtext'];\n suffixElement?: ReactNode;\n text: IComboBoxItem['text'];\n value: IComboBoxItem['value'];\n};\n\nconst ComboBoxItem: FC<ComboBoxItemProps> = ({\n icons,\n id,\n imageUrl,\n isSelected,\n onSelect,\n rightElement,\n shouldShowRoundImage,\n subtext,\n suffixElement,\n text,\n value,\n}) => {\n const handleItemClick = useCallback(() => {\n onSelect({ text, value, suffixElement, imageUrl });\n }, [imageUrl, onSelect, suffixElement, text, value]);\n\n const isTouch = getIsTouch();\n\n return useMemo(\n () => (\n <StyledComboBoxItem\n id={`combobox-item__${typeof id === 'number' ? String(id) : id}`}\n onClick={handleItemClick}\n $isTouch={isTouch}\n $isSelected={isSelected}\n >\n {imageUrl && (\n <StyledComboBoxItemImage\n src={imageUrl}\n $shouldShowBigImage={typeof subtext === 'string'}\n $shouldShowRoundImage={shouldShowRoundImage}\n />\n )}\n {icons && <Icon icons={icons} />}\n <StyledComboBoxItemContent>\n <StyledComboBoxItemContentHeader>\n <StyledComboBoxItemContentHeaderText>\n {text}\n {suffixElement}\n </StyledComboBoxItemContentHeaderText>\n <StyledComboBoxItemContentHeaderRightElement>\n {rightElement}\n </StyledComboBoxItemContentHeaderRightElement>\n </StyledComboBoxItemContentHeader>\n <StyledComboBoxItemContentSubtext>{subtext}</StyledComboBoxItemContentSubtext>\n </StyledComboBoxItemContent>\n </StyledComboBoxItem>\n ),\n [\n handleItemClick,\n icons,\n id,\n imageUrl,\n isSelected,\n isTouch,\n rightElement,\n shouldShowRoundImage,\n subtext,\n suffixElement,\n text,\n ],\n );\n};\n\nComboBoxItem.displayName = 'ComboBoxItem';\n\nexport default ComboBoxItem;\n"],"mappings":"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","ignoreList":[]}
@@ -65,15 +65,11 @@ const StyledComboBoxItemContentHeader = exports.StyledComboBoxItemContentHeader
65
65
  `;
66
66
  const StyledComboBoxItemContentHeaderText = exports.StyledComboBoxItemContentHeaderText = _styledComponents.default.div`
67
67
  display: flex;
68
- font-weight: ${({
69
- $shouldShowBoldText
70
- }) => $shouldShowBoldText ? 'bold' : 'normal'};
71
68
  gap: 4px;
72
69
  `;
73
70
  const StyledComboBoxItemContentHeaderRightElement = exports.StyledComboBoxItemContentHeaderRightElement = _styledComponents.default.div``;
74
71
  const StyledComboBoxItemContentSubtext = exports.StyledComboBoxItemContentSubtext = _styledComponents.default.div`
75
- font-size: 85%;
72
+ font-size: 90%;
76
73
  margin-top: 2px;
77
- opacity: 0.85;
78
74
  `;
79
75
  //# sourceMappingURL=ComboBoxItem.styles.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ComboBoxItem.styles.js","names":["_styledComponents","_interopRequireWildcard","require","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","StyledComboBoxItem","exports","styled","div","theme","$isSelected","text","$isTouch","css","StyledComboBoxItemImage","img","$shouldShowRoundImage","$shouldShowBigImage","StyledComboBoxItemContent","StyledComboBoxItemContentHeader","StyledComboBoxItemContentHeaderText","$shouldShowBoldText","StyledComboBoxItemContentHeaderRightElement","StyledComboBoxItemContentSubtext"],"sources":["../../../../../src/components/combobox/combobox-item/ComboBoxItem.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledComboBoxItemProps = WithTheme<{\n $isTouch: boolean;\n $isSelected: boolean;\n}>;\n\nexport const StyledComboBoxItem = styled.div<StyledComboBoxItemProps>`\n align-items: center;\n background-color: ${({ theme, $isSelected }: StyledComboBoxItemProps) =>\n $isSelected && theme['secondary-103']};\n color: ${({ theme }: StyledComboBoxItemProps) => theme.text};\n display: flex;\n gap: 10px;\n padding: 4px 10px;\n transition: background-color 0.2s ease-in-out;\n\n ${({ $isTouch, theme }: StyledComboBoxItemProps) =>\n !$isTouch &&\n css`\n &:hover {\n background-color: ${theme['secondary-102']};\n }\n\n &:focus {\n background-color: ${theme['secondary-102']};\n }\n `}\n`;\n\ntype StyledComboBoxItemImageProps = WithTheme<{\n $shouldShowBigImage?: boolean;\n $shouldShowRoundImage?: boolean;\n}>;\n\nexport const StyledComboBoxItemImage = styled.img<StyledComboBoxItemImageProps>`\n ${({ $shouldShowRoundImage }) =>\n $shouldShowRoundImage &&\n css`\n border-radius: 50%;\n `}\n\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledComboBoxItemImageProps) => theme['009-rgb']}, 0.15);\n flex: 0 0 auto;\n height: ${({ $shouldShowBigImage }) => ($shouldShowBigImage ? '40px' : '22px')};\n width: ${({ $shouldShowBigImage }) => ($shouldShowBigImage ? '40px' : '22px')};\n`;\n\nexport const StyledComboBoxItemContent = styled.div`\n display: flex;\n flex: 1 1 auto;\n flex-direction: column;\n line-height: normal;\n`;\n\nexport const StyledComboBoxItemContentHeader = styled.div`\n display: flex;\n justify-content: space-between;\n`;\n\ntype StyledComboBoxItemContentHeaderTextProps = WithTheme<{ $shouldShowBoldText?: boolean }>;\n\nexport const StyledComboBoxItemContentHeaderText = styled.div<StyledComboBoxItemContentHeaderTextProps>`\n display: flex;\n font-weight: ${({ $shouldShowBoldText }) => ($shouldShowBoldText ? 'bold' : 'normal')};\n gap: 4px;\n`;\n\nexport const StyledComboBoxItemContentHeaderRightElement = styled.div``;\n\nexport const StyledComboBoxItemContentSubtext = styled.div`\n font-size: 85%;\n margin-top: 2px;\n opacity: 0.85;\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,uBAAA,CAAAC,OAAA;AAAgD,SAAAC,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAH,wBAAAG,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAQzC,MAAMW,kBAAkB,GAAAC,OAAA,CAAAD,kBAAA,GAAGE,yBAAM,CAACC,GAA4B;AACrE;AACA,wBAAwB,CAAC;EAAEC,KAAK;EAAEC;AAAqC,CAAC,KAChEA,WAAW,IAAID,KAAK,CAAC,eAAe,CAAC;AAC7C,aAAa,CAAC;EAAEA;AAA+B,CAAC,KAAKA,KAAK,CAACE,IAAI;AAC/D;AACA;AACA;AACA;AACA;AACA,MAAM,CAAC;EAAEC,QAAQ;EAAEH;AAA+B,CAAC,KAC3C,CAACG,QAAQ,IACT,IAAAC,qBAAG;AACX;AACA,oCAAoCJ,KAAK,CAAC,eAAe,CAAC;AAC1D;AACA;AACA;AACA,oCAAoCA,KAAK,CAAC,eAAe,CAAC;AAC1D;AACA,SAAS;AACT,CAAC;AAOM,MAAMK,uBAAuB,GAAAR,OAAA,CAAAQ,uBAAA,GAAGP,yBAAM,CAACQ,GAAiC;AAC/E,MAAM,CAAC;EAAEC;AAAsB,CAAC,KACxBA,qBAAqB,IACrB,IAAAH,qBAAG;AACX;AACA,SAAS;AACT;AACA;AACA,eAAe,CAAC;EAAEJ;AAAoC,CAAC,KAAKA,KAAK,CAAC,SAAS,CAAC;AAC5E;AACA,cAAc,CAAC;EAAEQ;AAAoB,CAAC,KAAMA,mBAAmB,GAAG,MAAM,GAAG,MAAO;AAClF,aAAa,CAAC;EAAEA;AAAoB,CAAC,KAAMA,mBAAmB,GAAG,MAAM,GAAG,MAAO;AACjF,CAAC;AAEM,MAAMC,yBAAyB,GAAAZ,OAAA,CAAAY,yBAAA,GAAGX,yBAAM,CAACC,GAAG;AACnD;AACA;AACA;AACA;AACA,CAAC;AAEM,MAAMW,+BAA+B,GAAAb,OAAA,CAAAa,+BAAA,GAAGZ,yBAAM,CAACC,GAAG;AACzD;AACA;AACA,CAAC;AAIM,MAAMY,mCAAmC,GAAAd,OAAA,CAAAc,mCAAA,GAAGb,yBAAM,CAACC,GAA6C;AACvG;AACA,mBAAmB,CAAC;EAAEa;AAAoB,CAAC,KAAMA,mBAAmB,GAAG,MAAM,GAAG,QAAS;AACzF;AACA,CAAC;AAEM,MAAMC,2CAA2C,GAAAhB,OAAA,CAAAgB,2CAAA,GAAGf,yBAAM,CAACC,GAAG,EAAE;AAEhE,MAAMe,gCAAgC,GAAAjB,OAAA,CAAAiB,gCAAA,GAAGhB,yBAAM,CAACC,GAAG;AAC1D;AACA;AACA;AACA,CAAC","ignoreList":[]}
1
+ {"version":3,"file":"ComboBoxItem.styles.js","names":["_styledComponents","_interopRequireWildcard","require","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","StyledComboBoxItem","exports","styled","div","theme","$isSelected","text","$isTouch","css","StyledComboBoxItemImage","img","$shouldShowRoundImage","$shouldShowBigImage","StyledComboBoxItemContent","StyledComboBoxItemContentHeader","StyledComboBoxItemContentHeaderText","StyledComboBoxItemContentHeaderRightElement","StyledComboBoxItemContentSubtext"],"sources":["../../../../../src/components/combobox/combobox-item/ComboBoxItem.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledComboBoxItemProps = WithTheme<{\n $isTouch: boolean;\n $isSelected: boolean;\n}>;\n\nexport const StyledComboBoxItem = styled.div<StyledComboBoxItemProps>`\n align-items: center;\n background-color: ${({ theme, $isSelected }: StyledComboBoxItemProps) =>\n $isSelected && theme['secondary-103']};\n color: ${({ theme }: StyledComboBoxItemProps) => theme.text};\n display: flex;\n gap: 10px;\n padding: 4px 10px;\n transition: background-color 0.2s ease-in-out;\n\n ${({ $isTouch, theme }: StyledComboBoxItemProps) =>\n !$isTouch &&\n css`\n &:hover {\n background-color: ${theme['secondary-102']};\n }\n\n &:focus {\n background-color: ${theme['secondary-102']};\n }\n `}\n`;\n\ntype StyledComboBoxItemImageProps = WithTheme<{\n $shouldShowBigImage?: boolean;\n $shouldShowRoundImage?: boolean;\n}>;\n\nexport const StyledComboBoxItemImage = styled.img<StyledComboBoxItemImageProps>`\n ${({ $shouldShowRoundImage }) =>\n $shouldShowRoundImage &&\n css`\n border-radius: 50%;\n `}\n\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledComboBoxItemImageProps) => theme['009-rgb']}, 0.15);\n flex: 0 0 auto;\n height: ${({ $shouldShowBigImage }) => ($shouldShowBigImage ? '40px' : '22px')};\n width: ${({ $shouldShowBigImage }) => ($shouldShowBigImage ? '40px' : '22px')};\n`;\n\nexport const StyledComboBoxItemContent = styled.div`\n display: flex;\n flex: 1 1 auto;\n flex-direction: column;\n line-height: normal;\n`;\n\nexport const StyledComboBoxItemContentHeader = styled.div`\n display: flex;\n justify-content: space-between;\n`;\n\nexport const StyledComboBoxItemContentHeaderText = styled.div`\n display: flex;\n gap: 4px;\n`;\n\nexport const StyledComboBoxItemContentHeaderRightElement = styled.div``;\n\nexport const StyledComboBoxItemContentSubtext = styled.div`\n font-size: 90%;\n margin-top: 2px;\n`;\n"],"mappings":"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","ignoreList":[]}
@@ -36,6 +36,16 @@ const AccordionHead = _ref => {
36
36
  const theme = useTheme();
37
37
  const titleElementWrapperRef = useRef(null);
38
38
  const titleWrapperRef = useRef(null);
39
+ const [internalSearchValue, setInternalSearchValue] = useState();
40
+ useEffect(() => {
41
+ setInternalSearchValue(searchValue);
42
+ }, [searchValue]);
43
+ const handleOnSearchChance = event => {
44
+ setInternalSearchValue(event.target.value);
45
+ if (typeof onSearchChange === 'function') {
46
+ onSearchChange(event);
47
+ }
48
+ };
39
49
  const titleElementChildrenSize = useElementSize(titleElementWrapperRef, {
40
50
  shouldUseChildElement: true
41
51
  });
@@ -167,10 +177,10 @@ const AccordionHead = _ref => {
167
177
  },
168
178
  key: `searchWrapper--${uuid}`
169
179
  }, /*#__PURE__*/React.createElement(SearchInput, {
170
- onChange: onSearchChange,
180
+ onChange: handleOnSearchChance,
171
181
  placeholder: searchPlaceholder,
172
182
  size: InputSize.Small,
173
- value: searchValue
183
+ value: internalSearchValue
174
184
  })), rightElement && /*#__PURE__*/React.createElement(StyledMotionRightElementWrapper, {
175
185
  animate: {
176
186
  opacity: 1
@@ -1 +1 @@
1
- {"version":3,"file":"AccordionHead.js","names":["AnimatePresence","LayoutGroup","React","useEffect","useMemo","useRef","useState","useTheme","useElementSize","getAccordionHeadHeight","AreaContext","Icon","Input","InputSize","SearchInput","StyledAccordionIcon","StyledMotionAccordionHead","StyledMotionContentWrapper","StyledMotionIconWrapper","StyledMotionRightElementWrapper","StyledMotionSearchWrapper","StyledMotionTitle","StyledMotionTitleElementWrapper","StyledMotionTitleWrapper","StyledRightWrapper","AccordionHead","_ref","icon","isOpen","isFixed","isTitleGreyed","isWrapped","onClick","onSearchChange","rightElement","searchPlaceholder","searchValue","shouldRotateIcon","title","titleElement","uuid","titleInputProps","onTitleInputChange","titleColor","headHeight","setHeadHeight","closed","open","theme","titleElementWrapperRef","titleWrapperRef","titleElementChildrenSize","shouldUseChildElement","width","current","clientWidth","fontSize","iconElement","createElement","icons","internalIcon","accordionIcon","toString","internalIconStyle","iconStyle","className","$icon","accordionHeadHeight","height","tmp","setTmp","animate","initial","key","rotate","undefined","opacity","ref","Provider","value","shouldChangeColor","_extends","onFocus","event","onBlur","onChange","scale","exit","$isOpen","$isWrapped","$color","transition","duration","layout","placeholder","size","Small","displayName"],"sources":["../../../../../src/components/accordion/accordion-head/AccordionHead.tsx"],"sourcesContent":["import { AnimatePresence, LayoutGroup } from 'framer-motion';\nimport React, {\n ChangeEventHandler,\n FC,\n MouseEventHandler,\n ReactNode,\n useEffect,\n useMemo,\n useRef,\n useState,\n type CSSProperties,\n} from 'react';\nimport { useTheme } from 'styled-components';\nimport { useElementSize } from '../../../hooks/useElementSize';\nimport { getAccordionHeadHeight } from '../../../utils/accordion';\nimport { AreaContext } from '../../area-provider/AreaContextProvider';\nimport Icon from '../../icon/Icon';\nimport Input, { InputSize, type InputProps } from '../../input/Input';\nimport SearchInput from '../../search-input/SearchInput';\nimport {\n StyledAccordionIcon,\n StyledMotionAccordionHead,\n StyledMotionContentWrapper,\n StyledMotionIconWrapper,\n StyledMotionRightElementWrapper,\n StyledMotionSearchWrapper,\n StyledMotionTitle,\n StyledMotionTitleElementWrapper,\n StyledMotionTitleWrapper,\n StyledRightWrapper,\n} from './AccordionHead.styles';\n\nexport type AccordionHeadProps = {\n icon?: string;\n isOpen: boolean;\n isFixed: boolean;\n isTitleGreyed: boolean;\n isWrapped: boolean;\n onClick: MouseEventHandler<HTMLDivElement>;\n onSearchChange?: ChangeEventHandler<HTMLInputElement>;\n rightElement?: ReactNode;\n searchPlaceholder?: string;\n searchValue?: string;\n shouldRotateIcon?: boolean;\n title: string;\n titleElement?: ReactNode;\n uuid: string;\n onTitleInputChange?: ChangeEventHandler<HTMLInputElement>;\n titleInputProps?: InputProps;\n titleColor?: CSSProperties['color'];\n};\n\ninterface HeadHeight {\n closed: number;\n open: number;\n}\n\nconst AccordionHead: FC<AccordionHeadProps> = ({\n icon,\n isOpen,\n isFixed,\n isTitleGreyed,\n isWrapped,\n onClick,\n onSearchChange,\n rightElement,\n searchPlaceholder,\n searchValue,\n shouldRotateIcon,\n title,\n titleElement,\n uuid,\n titleInputProps,\n onTitleInputChange,\n titleColor,\n}) => {\n const [headHeight, setHeadHeight] = useState<HeadHeight>({\n closed: isWrapped ? 40 : 33,\n open: isWrapped ? 40 : 33,\n });\n\n const theme = useTheme();\n\n const titleElementWrapperRef = useRef<HTMLDivElement>(null);\n const titleWrapperRef = useRef<HTMLDivElement>(null);\n\n const titleElementChildrenSize = useElementSize(titleElementWrapperRef, {\n shouldUseChildElement: true,\n });\n useEffect(() => {\n if (typeof onTitleInputChange === 'function') {\n setHeadHeight({ closed: 50, open: 50 });\n } else {\n setHeadHeight(\n getAccordionHeadHeight({\n isWrapped,\n title,\n width: (titleWrapperRef.current?.clientWidth ?? 0) - 10,\n }),\n );\n }\n // The fontSize need to be included to trigger a new calculation.\n // After the size is increased, the Title is cut at the bottom.\n }, [isWrapped, onTitleInputChange, theme.fontSize, title]);\n\n const iconElement = useMemo(() => {\n if (icon || isFixed) {\n return (\n <Icon\n icons={[isFixed ? 'fa fa-horizontal-rule' : (icon ?? 'fa fa-chevron-right')]}\n />\n );\n }\n\n let internalIcon = 'f105';\n\n if (\n theme?.accordionIcon &&\n theme.accordionIcon !== 110 &&\n theme.accordionIcon !== 1110100\n ) {\n internalIcon = (theme.accordionIcon as number).toString(16);\n }\n\n const internalIconStyle = theme?.iconStyle ? (theme.iconStyle as string) : 'fa-regular';\n\n return <StyledAccordionIcon className={internalIconStyle} $icon={internalIcon} />;\n }, [icon, theme, isFixed]);\n\n let accordionHeadHeight = isOpen ? headHeight.open : headHeight.closed;\n\n if (titleElementChildrenSize && titleElementChildrenSize.height > accordionHeadHeight) {\n // If the titleElement is bigger than the title, the height of the accordion head should be increased.\n // The height of the titleElement is increased by 8px because of the padding of the accordion head element.\n accordionHeadHeight = titleElementChildrenSize.height + 8;\n }\n\n const [tmp, setTmp] = useState(true);\n\n return (\n <StyledMotionAccordionHead\n animate={{ height: accordionHeadHeight }}\n className=\"beta-chayns-accordion-head\"\n initial={false}\n key={`accordionHead--${uuid}`}\n >\n <StyledMotionIconWrapper\n animate={{ rotate: (isOpen || isFixed) && shouldRotateIcon ? 90 : 0 }}\n initial={false}\n onClick={!isFixed ? onClick : undefined}\n key={`accordionHeadIcon--${uuid}`}\n >\n {iconElement}\n </StyledMotionIconWrapper>\n <StyledMotionContentWrapper\n animate={{ opacity: isTitleGreyed ? 0.5 : 1 }}\n initial={false}\n onClick={!isFixed && tmp ? onClick : undefined}\n ref={titleWrapperRef}\n key={`accordionHeadContentWrapper--${uuid}`}\n >\n {typeof onTitleInputChange === 'function' ? (\n // eslint-disable-next-line react/jsx-no-constructed-context-values\n <AreaContext.Provider value={{ shouldChangeColor: true }}>\n <Input\n {...titleInputProps}\n value={title}\n onFocus={(event) => {\n setTmp(false);\n\n if (titleInputProps?.onFocus) {\n titleInputProps.onFocus(event);\n }\n }}\n onBlur={(event) => {\n setTmp(true);\n\n if (titleInputProps?.onBlur) {\n titleInputProps.onBlur(event);\n }\n }}\n onChange={onTitleInputChange}\n />\n </AreaContext.Provider>\n ) : (\n <LayoutGroup key={`accordionHeadLayoutGroup--${uuid}`}>\n <StyledMotionTitleWrapper key={`accordionHeadTitleWrapperWrapper--${uuid}`}>\n <AnimatePresence\n initial={false}\n key={`accordionHeadTitleWrapper--${uuid}`}\n >\n <StyledMotionTitle\n animate={{ scale: 1 }}\n initial={{ scale: isOpen && !isWrapped ? 1 / 1.3 : 1.3 }}\n exit={{ opacity: 0 }}\n $isOpen={isOpen}\n $isWrapped={isWrapped}\n $color={titleColor}\n transition={{\n opacity: {\n duration: 0,\n },\n }}\n key={\n isOpen && !isWrapped\n ? `accordionHeadTitleBig--${uuid}`\n : `accordionHeadTitle--${uuid}`\n }\n >\n {title}\n </StyledMotionTitle>\n </AnimatePresence>\n </StyledMotionTitleWrapper>\n {titleElement && (\n <StyledMotionTitleElementWrapper\n layout\n key={`accordionTitleElement--${uuid}`}\n ref={titleElementWrapperRef}\n >\n {titleElement}\n </StyledMotionTitleElementWrapper>\n )}\n </LayoutGroup>\n )}\n </StyledMotionContentWrapper>\n {(typeof onSearchChange === 'function' || rightElement) && (\n <StyledRightWrapper>\n <AnimatePresence initial={false} key={`accordionRightWrapper--${uuid}`}>\n {typeof onSearchChange === 'function' && isOpen && (\n <StyledMotionSearchWrapper\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n key={`searchWrapper--${uuid}`}\n >\n <SearchInput\n onChange={onSearchChange}\n placeholder={searchPlaceholder}\n size={InputSize.Small}\n value={searchValue}\n />\n </StyledMotionSearchWrapper>\n )}\n {rightElement && (\n <StyledMotionRightElementWrapper\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n key={`rightElementWrapper--${uuid}`}\n >\n {rightElement}\n </StyledMotionRightElementWrapper>\n )}\n </AnimatePresence>\n </StyledRightWrapper>\n )}\n </StyledMotionAccordionHead>\n );\n};\n\nAccordionHead.displayName = 'AccordionHead';\n\nexport default AccordionHead;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"AccordionHead.js","names":["AnimatePresence","LayoutGroup","React","useEffect","useMemo","useRef","useState","useTheme","useElementSize","getAccordionHeadHeight","AreaContext","Icon","Input","InputSize","SearchInput","StyledAccordionIcon","StyledMotionAccordionHead","StyledMotionContentWrapper","StyledMotionIconWrapper","StyledMotionRightElementWrapper","StyledMotionSearchWrapper","StyledMotionTitle","StyledMotionTitleElementWrapper","StyledMotionTitleWrapper","StyledRightWrapper","AccordionHead","_ref","icon","isOpen","isFixed","isTitleGreyed","isWrapped","onClick","onSearchChange","rightElement","searchPlaceholder","searchValue","shouldRotateIcon","title","titleElement","uuid","titleInputProps","onTitleInputChange","titleColor","headHeight","setHeadHeight","closed","open","theme","titleElementWrapperRef","titleWrapperRef","internalSearchValue","setInternalSearchValue","handleOnSearchChance","event","target","value","titleElementChildrenSize","shouldUseChildElement","width","current","clientWidth","fontSize","iconElement","createElement","icons","internalIcon","accordionIcon","toString","internalIconStyle","iconStyle","className","$icon","accordionHeadHeight","height","tmp","setTmp","animate","initial","key","rotate","undefined","opacity","ref","Provider","shouldChangeColor","_extends","onFocus","onBlur","onChange","scale","exit","$isOpen","$isWrapped","$color","transition","duration","layout","placeholder","size","Small","displayName"],"sources":["../../../../../src/components/accordion/accordion-head/AccordionHead.tsx"],"sourcesContent":["import { AnimatePresence, LayoutGroup } from 'framer-motion';\nimport React, {\n ChangeEvent,\n ChangeEventHandler,\n FC,\n MouseEventHandler,\n ReactNode,\n useEffect,\n useMemo,\n useRef,\n useState,\n type CSSProperties,\n} from 'react';\nimport { useTheme } from 'styled-components';\nimport { useElementSize } from '../../../hooks/useElementSize';\nimport { getAccordionHeadHeight } from '../../../utils/accordion';\nimport { AreaContext } from '../../area-provider/AreaContextProvider';\nimport Icon from '../../icon/Icon';\nimport Input, { InputSize, type InputProps } from '../../input/Input';\nimport SearchInput from '../../search-input/SearchInput';\nimport {\n StyledAccordionIcon,\n StyledMotionAccordionHead,\n StyledMotionContentWrapper,\n StyledMotionIconWrapper,\n StyledMotionRightElementWrapper,\n StyledMotionSearchWrapper,\n StyledMotionTitle,\n StyledMotionTitleElementWrapper,\n StyledMotionTitleWrapper,\n StyledRightWrapper,\n} from './AccordionHead.styles';\n\nexport type AccordionHeadProps = {\n icon?: string;\n isOpen: boolean;\n isFixed: boolean;\n isTitleGreyed: boolean;\n isWrapped: boolean;\n onClick: MouseEventHandler<HTMLDivElement>;\n onSearchChange?: ChangeEventHandler<HTMLInputElement>;\n rightElement?: ReactNode;\n searchPlaceholder?: string;\n searchValue?: string;\n shouldRotateIcon?: boolean;\n title: string;\n titleElement?: ReactNode;\n uuid: string;\n onTitleInputChange?: ChangeEventHandler<HTMLInputElement>;\n titleInputProps?: InputProps;\n titleColor?: CSSProperties['color'];\n};\n\ninterface HeadHeight {\n closed: number;\n open: number;\n}\n\nconst AccordionHead: FC<AccordionHeadProps> = ({\n icon,\n isOpen,\n isFixed,\n isTitleGreyed,\n isWrapped,\n onClick,\n onSearchChange,\n rightElement,\n searchPlaceholder,\n searchValue,\n shouldRotateIcon,\n title,\n titleElement,\n uuid,\n titleInputProps,\n onTitleInputChange,\n titleColor,\n}) => {\n const [headHeight, setHeadHeight] = useState<HeadHeight>({\n closed: isWrapped ? 40 : 33,\n open: isWrapped ? 40 : 33,\n });\n\n const theme = useTheme();\n\n const titleElementWrapperRef = useRef<HTMLDivElement>(null);\n const titleWrapperRef = useRef<HTMLDivElement>(null);\n\n const [internalSearchValue, setInternalSearchValue] = useState<string>();\n\n useEffect(() => {\n setInternalSearchValue(searchValue);\n }, [searchValue]);\n\n const handleOnSearchChance = (event: ChangeEvent<HTMLInputElement>) => {\n setInternalSearchValue(event.target.value);\n if (typeof onSearchChange === 'function') {\n onSearchChange(event);\n }\n };\n\n const titleElementChildrenSize = useElementSize(titleElementWrapperRef, {\n shouldUseChildElement: true,\n });\n useEffect(() => {\n if (typeof onTitleInputChange === 'function') {\n setHeadHeight({ closed: 50, open: 50 });\n } else {\n setHeadHeight(\n getAccordionHeadHeight({\n isWrapped,\n title,\n width: (titleWrapperRef.current?.clientWidth ?? 0) - 10,\n }),\n );\n }\n // The fontSize need to be included to trigger a new calculation.\n // After the size is increased, the Title is cut at the bottom.\n }, [isWrapped, onTitleInputChange, theme.fontSize, title]);\n\n const iconElement = useMemo(() => {\n if (icon || isFixed) {\n return (\n <Icon\n icons={[isFixed ? 'fa fa-horizontal-rule' : (icon ?? 'fa fa-chevron-right')]}\n />\n );\n }\n\n let internalIcon = 'f105';\n\n if (\n theme?.accordionIcon &&\n theme.accordionIcon !== 110 &&\n theme.accordionIcon !== 1110100\n ) {\n internalIcon = (theme.accordionIcon as number).toString(16);\n }\n\n const internalIconStyle = theme?.iconStyle ? (theme.iconStyle as string) : 'fa-regular';\n\n return <StyledAccordionIcon className={internalIconStyle} $icon={internalIcon} />;\n }, [icon, theme, isFixed]);\n\n let accordionHeadHeight = isOpen ? headHeight.open : headHeight.closed;\n\n if (titleElementChildrenSize && titleElementChildrenSize.height > accordionHeadHeight) {\n // If the titleElement is bigger than the title, the height of the accordion head should be increased.\n // The height of the titleElement is increased by 8px because of the padding of the accordion head element.\n accordionHeadHeight = titleElementChildrenSize.height + 8;\n }\n\n const [tmp, setTmp] = useState(true);\n\n return (\n <StyledMotionAccordionHead\n animate={{ height: accordionHeadHeight }}\n className=\"beta-chayns-accordion-head\"\n initial={false}\n key={`accordionHead--${uuid}`}\n >\n <StyledMotionIconWrapper\n animate={{ rotate: (isOpen || isFixed) && shouldRotateIcon ? 90 : 0 }}\n initial={false}\n onClick={!isFixed ? onClick : undefined}\n key={`accordionHeadIcon--${uuid}`}\n >\n {iconElement}\n </StyledMotionIconWrapper>\n <StyledMotionContentWrapper\n animate={{ opacity: isTitleGreyed ? 0.5 : 1 }}\n initial={false}\n onClick={!isFixed && tmp ? onClick : undefined}\n ref={titleWrapperRef}\n key={`accordionHeadContentWrapper--${uuid}`}\n >\n {typeof onTitleInputChange === 'function' ? (\n // eslint-disable-next-line react/jsx-no-constructed-context-values\n <AreaContext.Provider value={{ shouldChangeColor: true }}>\n <Input\n {...titleInputProps}\n value={title}\n onFocus={(event) => {\n setTmp(false);\n\n if (titleInputProps?.onFocus) {\n titleInputProps.onFocus(event);\n }\n }}\n onBlur={(event) => {\n setTmp(true);\n\n if (titleInputProps?.onBlur) {\n titleInputProps.onBlur(event);\n }\n }}\n onChange={onTitleInputChange}\n />\n </AreaContext.Provider>\n ) : (\n <LayoutGroup key={`accordionHeadLayoutGroup--${uuid}`}>\n <StyledMotionTitleWrapper key={`accordionHeadTitleWrapperWrapper--${uuid}`}>\n <AnimatePresence\n initial={false}\n key={`accordionHeadTitleWrapper--${uuid}`}\n >\n <StyledMotionTitle\n animate={{ scale: 1 }}\n initial={{ scale: isOpen && !isWrapped ? 1 / 1.3 : 1.3 }}\n exit={{ opacity: 0 }}\n $isOpen={isOpen}\n $isWrapped={isWrapped}\n $color={titleColor}\n transition={{\n opacity: {\n duration: 0,\n },\n }}\n key={\n isOpen && !isWrapped\n ? `accordionHeadTitleBig--${uuid}`\n : `accordionHeadTitle--${uuid}`\n }\n >\n {title}\n </StyledMotionTitle>\n </AnimatePresence>\n </StyledMotionTitleWrapper>\n {titleElement && (\n <StyledMotionTitleElementWrapper\n layout\n key={`accordionTitleElement--${uuid}`}\n ref={titleElementWrapperRef}\n >\n {titleElement}\n </StyledMotionTitleElementWrapper>\n )}\n </LayoutGroup>\n )}\n </StyledMotionContentWrapper>\n {(typeof onSearchChange === 'function' || rightElement) && (\n <StyledRightWrapper>\n <AnimatePresence initial={false} key={`accordionRightWrapper--${uuid}`}>\n {typeof onSearchChange === 'function' && isOpen && (\n <StyledMotionSearchWrapper\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n key={`searchWrapper--${uuid}`}\n >\n <SearchInput\n onChange={handleOnSearchChance}\n placeholder={searchPlaceholder}\n size={InputSize.Small}\n value={internalSearchValue}\n />\n </StyledMotionSearchWrapper>\n )}\n {rightElement && (\n <StyledMotionRightElementWrapper\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n key={`rightElementWrapper--${uuid}`}\n >\n {rightElement}\n </StyledMotionRightElementWrapper>\n )}\n </AnimatePresence>\n </StyledRightWrapper>\n )}\n </StyledMotionAccordionHead>\n );\n};\n\nAccordionHead.displayName = 'AccordionHead';\n\nexport default AccordionHead;\n"],"mappings":"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","ignoreList":[]}
@@ -36,9 +36,7 @@ const ComboBoxItem = _ref => {
36
36
  $shouldShowRoundImage: shouldShowRoundImage
37
37
  }), icons && /*#__PURE__*/React.createElement(Icon, {
38
38
  icons: icons
39
- }), /*#__PURE__*/React.createElement(StyledComboBoxItemContent, null, /*#__PURE__*/React.createElement(StyledComboBoxItemContentHeader, null, /*#__PURE__*/React.createElement(StyledComboBoxItemContentHeaderText, {
40
- $shouldShowBoldText: typeof subtext === 'string'
41
- }, text, suffixElement), /*#__PURE__*/React.createElement(StyledComboBoxItemContentHeaderRightElement, null, rightElement)), /*#__PURE__*/React.createElement(StyledComboBoxItemContentSubtext, null, subtext))), [handleItemClick, icons, id, imageUrl, isSelected, isTouch, rightElement, shouldShowRoundImage, subtext, suffixElement, text]);
39
+ }), /*#__PURE__*/React.createElement(StyledComboBoxItemContent, null, /*#__PURE__*/React.createElement(StyledComboBoxItemContentHeader, null, /*#__PURE__*/React.createElement(StyledComboBoxItemContentHeaderText, null, text, suffixElement), /*#__PURE__*/React.createElement(StyledComboBoxItemContentHeaderRightElement, null, rightElement)), /*#__PURE__*/React.createElement(StyledComboBoxItemContentSubtext, null, subtext))), [handleItemClick, icons, id, imageUrl, isSelected, isTouch, rightElement, shouldShowRoundImage, subtext, suffixElement, text]);
42
40
  };
43
41
  ComboBoxItem.displayName = 'ComboBoxItem';
44
42
  export default ComboBoxItem;
@@ -1 +1 @@
1
- {"version":3,"file":"ComboBoxItem.js","names":["React","useCallback","useMemo","getIsTouch","Icon","StyledComboBoxItem","StyledComboBoxItemContent","StyledComboBoxItemContentHeader","StyledComboBoxItemContentHeaderRightElement","StyledComboBoxItemContentHeaderText","StyledComboBoxItemContentSubtext","StyledComboBoxItemImage","ComboBoxItem","_ref","icons","id","imageUrl","isSelected","onSelect","rightElement","shouldShowRoundImage","subtext","suffixElement","text","value","handleItemClick","isTouch","createElement","String","onClick","$isTouch","$isSelected","src","$shouldShowBigImage","$shouldShowRoundImage","$shouldShowBoldText","displayName"],"sources":["../../../../../src/components/combobox/combobox-item/ComboBoxItem.tsx"],"sourcesContent":["import React, { FC, ReactNode, useCallback, useMemo } from 'react';\nimport { getIsTouch } from '../../../utils/environment';\nimport Icon from '../../icon/Icon';\nimport type { ComboBoxProps, IComboBoxItem } from '../ComboBox';\nimport {\n StyledComboBoxItem,\n StyledComboBoxItemContent,\n StyledComboBoxItemContentHeader,\n StyledComboBoxItemContentHeaderRightElement,\n StyledComboBoxItemContentHeaderText,\n StyledComboBoxItemContentSubtext,\n StyledComboBoxItemImage,\n} from './ComboBoxItem.styles';\n\nexport type ComboBoxItemProps = {\n icons?: IComboBoxItem['icons'];\n id: IComboBoxItem['value'];\n imageUrl: IComboBoxItem['imageUrl'];\n isSelected: boolean;\n onSelect: (itemToSelect: IComboBoxItem) => void;\n rightElement: IComboBoxItem['rightElement'];\n shouldShowRoundImage: ComboBoxProps['shouldShowRoundImage'];\n subtext: IComboBoxItem['subtext'];\n suffixElement?: ReactNode;\n text: IComboBoxItem['text'];\n value: IComboBoxItem['value'];\n};\n\nconst ComboBoxItem: FC<ComboBoxItemProps> = ({\n icons,\n id,\n imageUrl,\n isSelected,\n onSelect,\n rightElement,\n shouldShowRoundImage,\n subtext,\n suffixElement,\n text,\n value,\n}) => {\n const handleItemClick = useCallback(() => {\n onSelect({ text, value, suffixElement, imageUrl });\n }, [imageUrl, onSelect, suffixElement, text, value]);\n\n const isTouch = getIsTouch();\n\n return useMemo(\n () => (\n <StyledComboBoxItem\n id={`combobox-item__${typeof id === 'number' ? String(id) : id}`}\n onClick={handleItemClick}\n $isTouch={isTouch}\n $isSelected={isSelected}\n >\n {imageUrl && (\n <StyledComboBoxItemImage\n src={imageUrl}\n $shouldShowBigImage={typeof subtext === 'string'}\n $shouldShowRoundImage={shouldShowRoundImage}\n />\n )}\n {icons && <Icon icons={icons} />}\n <StyledComboBoxItemContent>\n <StyledComboBoxItemContentHeader>\n <StyledComboBoxItemContentHeaderText\n $shouldShowBoldText={typeof subtext === 'string'}\n >\n {text}\n {suffixElement}\n </StyledComboBoxItemContentHeaderText>\n <StyledComboBoxItemContentHeaderRightElement>\n {rightElement}\n </StyledComboBoxItemContentHeaderRightElement>\n </StyledComboBoxItemContentHeader>\n <StyledComboBoxItemContentSubtext>{subtext}</StyledComboBoxItemContentSubtext>\n </StyledComboBoxItemContent>\n </StyledComboBoxItem>\n ),\n [\n handleItemClick,\n icons,\n id,\n imageUrl,\n isSelected,\n isTouch,\n rightElement,\n shouldShowRoundImage,\n subtext,\n suffixElement,\n text,\n ],\n );\n};\n\nComboBoxItem.displayName = 'ComboBoxItem';\n\nexport default ComboBoxItem;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAmBC,WAAW,EAAEC,OAAO,QAAQ,OAAO;AAClE,SAASC,UAAU,QAAQ,4BAA4B;AACvD,OAAOC,IAAI,MAAM,iBAAiB;AAElC,SACIC,kBAAkB,EAClBC,yBAAyB,EACzBC,+BAA+B,EAC/BC,2CAA2C,EAC3CC,mCAAmC,EACnCC,gCAAgC,EAChCC,uBAAuB,QACpB,uBAAuB;AAgB9B,MAAMC,YAAmC,GAAGC,IAAA,IAYtC;EAAA,IAZuC;IACzCC,KAAK;IACLC,EAAE;IACFC,QAAQ;IACRC,UAAU;IACVC,QAAQ;IACRC,YAAY;IACZC,oBAAoB;IACpBC,OAAO;IACPC,aAAa;IACbC,IAAI;IACJC;EACJ,CAAC,GAAAX,IAAA;EACG,MAAMY,eAAe,GAAGxB,WAAW,CAAC,MAAM;IACtCiB,QAAQ,CAAC;MAAEK,IAAI;MAAEC,KAAK;MAAEF,aAAa;MAAEN;IAAS,CAAC,CAAC;EACtD,CAAC,EAAE,CAACA,QAAQ,EAAEE,QAAQ,EAAEI,aAAa,EAAEC,IAAI,EAAEC,KAAK,CAAC,CAAC;EAEpD,MAAME,OAAO,GAAGvB,UAAU,CAAC,CAAC;EAE5B,OAAOD,OAAO,CACV,mBACIF,KAAA,CAAA2B,aAAA,CAACtB,kBAAkB;IACfU,EAAE,EAAE,kBAAkB,OAAOA,EAAE,KAAK,QAAQ,GAAGa,MAAM,CAACb,EAAE,CAAC,GAAGA,EAAE,EAAG;IACjEc,OAAO,EAAEJ,eAAgB;IACzBK,QAAQ,EAAEJ,OAAQ;IAClBK,WAAW,EAAEd;EAAW,GAEvBD,QAAQ,iBACLhB,KAAA,CAAA2B,aAAA,CAAChB,uBAAuB;IACpBqB,GAAG,EAAEhB,QAAS;IACdiB,mBAAmB,EAAE,OAAOZ,OAAO,KAAK,QAAS;IACjDa,qBAAqB,EAAEd;EAAqB,CAC/C,CACJ,EACAN,KAAK,iBAAId,KAAA,CAAA2B,aAAA,CAACvB,IAAI;IAACU,KAAK,EAAEA;EAAM,CAAE,CAAC,eAChCd,KAAA,CAAA2B,aAAA,CAACrB,yBAAyB,qBACtBN,KAAA,CAAA2B,aAAA,CAACpB,+BAA+B,qBAC5BP,KAAA,CAAA2B,aAAA,CAAClB,mCAAmC;IAChC0B,mBAAmB,EAAE,OAAOd,OAAO,KAAK;EAAS,GAEhDE,IAAI,EACJD,aACgC,CAAC,eACtCtB,KAAA,CAAA2B,aAAA,CAACnB,2CAA2C,QACvCW,YACwC,CAChB,CAAC,eAClCnB,KAAA,CAAA2B,aAAA,CAACjB,gCAAgC,QAAEW,OAA0C,CACtD,CACX,CACvB,EACD,CACII,eAAe,EACfX,KAAK,EACLC,EAAE,EACFC,QAAQ,EACRC,UAAU,EACVS,OAAO,EACPP,YAAY,EACZC,oBAAoB,EACpBC,OAAO,EACPC,aAAa,EACbC,IAAI,CAEZ,CAAC;AACL,CAAC;AAEDX,YAAY,CAACwB,WAAW,GAAG,cAAc;AAEzC,eAAexB,YAAY","ignoreList":[]}
1
+ {"version":3,"file":"ComboBoxItem.js","names":["React","useCallback","useMemo","getIsTouch","Icon","StyledComboBoxItem","StyledComboBoxItemContent","StyledComboBoxItemContentHeader","StyledComboBoxItemContentHeaderRightElement","StyledComboBoxItemContentHeaderText","StyledComboBoxItemContentSubtext","StyledComboBoxItemImage","ComboBoxItem","_ref","icons","id","imageUrl","isSelected","onSelect","rightElement","shouldShowRoundImage","subtext","suffixElement","text","value","handleItemClick","isTouch","createElement","String","onClick","$isTouch","$isSelected","src","$shouldShowBigImage","$shouldShowRoundImage","displayName"],"sources":["../../../../../src/components/combobox/combobox-item/ComboBoxItem.tsx"],"sourcesContent":["import React, { FC, ReactNode, useCallback, useMemo } from 'react';\nimport { getIsTouch } from '../../../utils/environment';\nimport Icon from '../../icon/Icon';\nimport type { ComboBoxProps, IComboBoxItem } from '../ComboBox';\nimport {\n StyledComboBoxItem,\n StyledComboBoxItemContent,\n StyledComboBoxItemContentHeader,\n StyledComboBoxItemContentHeaderRightElement,\n StyledComboBoxItemContentHeaderText,\n StyledComboBoxItemContentSubtext,\n StyledComboBoxItemImage,\n} from './ComboBoxItem.styles';\n\nexport type ComboBoxItemProps = {\n icons?: IComboBoxItem['icons'];\n id: IComboBoxItem['value'];\n imageUrl: IComboBoxItem['imageUrl'];\n isSelected: boolean;\n onSelect: (itemToSelect: IComboBoxItem) => void;\n rightElement: IComboBoxItem['rightElement'];\n shouldShowRoundImage: ComboBoxProps['shouldShowRoundImage'];\n subtext: IComboBoxItem['subtext'];\n suffixElement?: ReactNode;\n text: IComboBoxItem['text'];\n value: IComboBoxItem['value'];\n};\n\nconst ComboBoxItem: FC<ComboBoxItemProps> = ({\n icons,\n id,\n imageUrl,\n isSelected,\n onSelect,\n rightElement,\n shouldShowRoundImage,\n subtext,\n suffixElement,\n text,\n value,\n}) => {\n const handleItemClick = useCallback(() => {\n onSelect({ text, value, suffixElement, imageUrl });\n }, [imageUrl, onSelect, suffixElement, text, value]);\n\n const isTouch = getIsTouch();\n\n return useMemo(\n () => (\n <StyledComboBoxItem\n id={`combobox-item__${typeof id === 'number' ? String(id) : id}`}\n onClick={handleItemClick}\n $isTouch={isTouch}\n $isSelected={isSelected}\n >\n {imageUrl && (\n <StyledComboBoxItemImage\n src={imageUrl}\n $shouldShowBigImage={typeof subtext === 'string'}\n $shouldShowRoundImage={shouldShowRoundImage}\n />\n )}\n {icons && <Icon icons={icons} />}\n <StyledComboBoxItemContent>\n <StyledComboBoxItemContentHeader>\n <StyledComboBoxItemContentHeaderText>\n {text}\n {suffixElement}\n </StyledComboBoxItemContentHeaderText>\n <StyledComboBoxItemContentHeaderRightElement>\n {rightElement}\n </StyledComboBoxItemContentHeaderRightElement>\n </StyledComboBoxItemContentHeader>\n <StyledComboBoxItemContentSubtext>{subtext}</StyledComboBoxItemContentSubtext>\n </StyledComboBoxItemContent>\n </StyledComboBoxItem>\n ),\n [\n handleItemClick,\n icons,\n id,\n imageUrl,\n isSelected,\n isTouch,\n rightElement,\n shouldShowRoundImage,\n subtext,\n suffixElement,\n text,\n ],\n );\n};\n\nComboBoxItem.displayName = 'ComboBoxItem';\n\nexport default ComboBoxItem;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAmBC,WAAW,EAAEC,OAAO,QAAQ,OAAO;AAClE,SAASC,UAAU,QAAQ,4BAA4B;AACvD,OAAOC,IAAI,MAAM,iBAAiB;AAElC,SACIC,kBAAkB,EAClBC,yBAAyB,EACzBC,+BAA+B,EAC/BC,2CAA2C,EAC3CC,mCAAmC,EACnCC,gCAAgC,EAChCC,uBAAuB,QACpB,uBAAuB;AAgB9B,MAAMC,YAAmC,GAAGC,IAAA,IAYtC;EAAA,IAZuC;IACzCC,KAAK;IACLC,EAAE;IACFC,QAAQ;IACRC,UAAU;IACVC,QAAQ;IACRC,YAAY;IACZC,oBAAoB;IACpBC,OAAO;IACPC,aAAa;IACbC,IAAI;IACJC;EACJ,CAAC,GAAAX,IAAA;EACG,MAAMY,eAAe,GAAGxB,WAAW,CAAC,MAAM;IACtCiB,QAAQ,CAAC;MAAEK,IAAI;MAAEC,KAAK;MAAEF,aAAa;MAAEN;IAAS,CAAC,CAAC;EACtD,CAAC,EAAE,CAACA,QAAQ,EAAEE,QAAQ,EAAEI,aAAa,EAAEC,IAAI,EAAEC,KAAK,CAAC,CAAC;EAEpD,MAAME,OAAO,GAAGvB,UAAU,CAAC,CAAC;EAE5B,OAAOD,OAAO,CACV,mBACIF,KAAA,CAAA2B,aAAA,CAACtB,kBAAkB;IACfU,EAAE,EAAE,kBAAkB,OAAOA,EAAE,KAAK,QAAQ,GAAGa,MAAM,CAACb,EAAE,CAAC,GAAGA,EAAE,EAAG;IACjEc,OAAO,EAAEJ,eAAgB;IACzBK,QAAQ,EAAEJ,OAAQ;IAClBK,WAAW,EAAEd;EAAW,GAEvBD,QAAQ,iBACLhB,KAAA,CAAA2B,aAAA,CAAChB,uBAAuB;IACpBqB,GAAG,EAAEhB,QAAS;IACdiB,mBAAmB,EAAE,OAAOZ,OAAO,KAAK,QAAS;IACjDa,qBAAqB,EAAEd;EAAqB,CAC/C,CACJ,EACAN,KAAK,iBAAId,KAAA,CAAA2B,aAAA,CAACvB,IAAI;IAACU,KAAK,EAAEA;EAAM,CAAE,CAAC,eAChCd,KAAA,CAAA2B,aAAA,CAACrB,yBAAyB,qBACtBN,KAAA,CAAA2B,aAAA,CAACpB,+BAA+B,qBAC5BP,KAAA,CAAA2B,aAAA,CAAClB,mCAAmC,QAC/Bc,IAAI,EACJD,aACgC,CAAC,eACtCtB,KAAA,CAAA2B,aAAA,CAACnB,2CAA2C,QACvCW,YACwC,CAChB,CAAC,eAClCnB,KAAA,CAAA2B,aAAA,CAACjB,gCAAgC,QAAEW,OAA0C,CACtD,CACX,CACvB,EACD,CACII,eAAe,EACfX,KAAK,EACLC,EAAE,EACFC,QAAQ,EACRC,UAAU,EACVS,OAAO,EACPP,YAAY,EACZC,oBAAoB,EACpBC,OAAO,EACPC,aAAa,EACbC,IAAI,CAEZ,CAAC;AACL,CAAC;AAEDX,YAAY,CAACuB,WAAW,GAAG,cAAc;AAEzC,eAAevB,YAAY","ignoreList":[]}
@@ -78,18 +78,11 @@ export const StyledComboBoxItemContentHeader = styled.div`
78
78
  `;
79
79
  export const StyledComboBoxItemContentHeaderText = styled.div`
80
80
  display: flex;
81
- font-weight: ${_ref8 => {
82
- let {
83
- $shouldShowBoldText
84
- } = _ref8;
85
- return $shouldShowBoldText ? 'bold' : 'normal';
86
- }};
87
81
  gap: 4px;
88
82
  `;
89
83
  export const StyledComboBoxItemContentHeaderRightElement = styled.div``;
90
84
  export const StyledComboBoxItemContentSubtext = styled.div`
91
- font-size: 85%;
85
+ font-size: 90%;
92
86
  margin-top: 2px;
93
- opacity: 0.85;
94
87
  `;
95
88
  //# sourceMappingURL=ComboBoxItem.styles.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ComboBoxItem.styles.js","names":["styled","css","StyledComboBoxItem","div","_ref","theme","$isSelected","_ref2","text","_ref3","$isTouch","StyledComboBoxItemImage","img","_ref4","$shouldShowRoundImage","_ref5","_ref6","$shouldShowBigImage","_ref7","StyledComboBoxItemContent","StyledComboBoxItemContentHeader","StyledComboBoxItemContentHeaderText","_ref8","$shouldShowBoldText","StyledComboBoxItemContentHeaderRightElement","StyledComboBoxItemContentSubtext"],"sources":["../../../../../src/components/combobox/combobox-item/ComboBoxItem.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledComboBoxItemProps = WithTheme<{\n $isTouch: boolean;\n $isSelected: boolean;\n}>;\n\nexport const StyledComboBoxItem = styled.div<StyledComboBoxItemProps>`\n align-items: center;\n background-color: ${({ theme, $isSelected }: StyledComboBoxItemProps) =>\n $isSelected && theme['secondary-103']};\n color: ${({ theme }: StyledComboBoxItemProps) => theme.text};\n display: flex;\n gap: 10px;\n padding: 4px 10px;\n transition: background-color 0.2s ease-in-out;\n\n ${({ $isTouch, theme }: StyledComboBoxItemProps) =>\n !$isTouch &&\n css`\n &:hover {\n background-color: ${theme['secondary-102']};\n }\n\n &:focus {\n background-color: ${theme['secondary-102']};\n }\n `}\n`;\n\ntype StyledComboBoxItemImageProps = WithTheme<{\n $shouldShowBigImage?: boolean;\n $shouldShowRoundImage?: boolean;\n}>;\n\nexport const StyledComboBoxItemImage = styled.img<StyledComboBoxItemImageProps>`\n ${({ $shouldShowRoundImage }) =>\n $shouldShowRoundImage &&\n css`\n border-radius: 50%;\n `}\n\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledComboBoxItemImageProps) => theme['009-rgb']}, 0.15);\n flex: 0 0 auto;\n height: ${({ $shouldShowBigImage }) => ($shouldShowBigImage ? '40px' : '22px')};\n width: ${({ $shouldShowBigImage }) => ($shouldShowBigImage ? '40px' : '22px')};\n`;\n\nexport const StyledComboBoxItemContent = styled.div`\n display: flex;\n flex: 1 1 auto;\n flex-direction: column;\n line-height: normal;\n`;\n\nexport const StyledComboBoxItemContentHeader = styled.div`\n display: flex;\n justify-content: space-between;\n`;\n\ntype StyledComboBoxItemContentHeaderTextProps = WithTheme<{ $shouldShowBoldText?: boolean }>;\n\nexport const StyledComboBoxItemContentHeaderText = styled.div<StyledComboBoxItemContentHeaderTextProps>`\n display: flex;\n font-weight: ${({ $shouldShowBoldText }) => ($shouldShowBoldText ? 'bold' : 'normal')};\n gap: 4px;\n`;\n\nexport const StyledComboBoxItemContentHeaderRightElement = styled.div``;\n\nexport const StyledComboBoxItemContentSubtext = styled.div`\n font-size: 85%;\n margin-top: 2px;\n opacity: 0.85;\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAQ/C,OAAO,MAAMC,kBAAkB,GAAGF,MAAM,CAACG,GAA4B;AACrE;AACA,wBAAwBC,IAAA;EAAA,IAAC;IAAEC,KAAK;IAAEC;EAAqC,CAAC,GAAAF,IAAA;EAAA,OAChEE,WAAW,IAAID,KAAK,CAAC,eAAe,CAAC;AAAA;AAC7C,aAAaE,KAAA;EAAA,IAAC;IAAEF;EAA+B,CAAC,GAAAE,KAAA;EAAA,OAAKF,KAAK,CAACG,IAAI;AAAA;AAC/D;AACA;AACA;AACA;AACA;AACA,MAAMC,KAAA;EAAA,IAAC;IAAEC,QAAQ;IAAEL;EAA+B,CAAC,GAAAI,KAAA;EAAA,OAC3C,CAACC,QAAQ,IACTT,GAAG;AACX;AACA,oCAAoCI,KAAK,CAAC,eAAe,CAAC;AAC1D;AACA;AACA;AACA,oCAAoCA,KAAK,CAAC,eAAe,CAAC;AAC1D;AACA,SAAS;AAAA;AACT,CAAC;AAOD,OAAO,MAAMM,uBAAuB,GAAGX,MAAM,CAACY,GAAiC;AAC/E,MAAMC,KAAA;EAAA,IAAC;IAAEC;EAAsB,CAAC,GAAAD,KAAA;EAAA,OACxBC,qBAAqB,IACrBb,GAAG;AACX;AACA,SAAS;AAAA;AACT;AACA;AACA,eAAec,KAAA;EAAA,IAAC;IAAEV;EAAoC,CAAC,GAAAU,KAAA;EAAA,OAAKV,KAAK,CAAC,SAAS,CAAC;AAAA;AAC5E;AACA,cAAcW,KAAA;EAAA,IAAC;IAAEC;EAAoB,CAAC,GAAAD,KAAA;EAAA,OAAMC,mBAAmB,GAAG,MAAM,GAAG,MAAM;AAAA,CAAC;AAClF,aAAaC,KAAA;EAAA,IAAC;IAAED;EAAoB,CAAC,GAAAC,KAAA;EAAA,OAAMD,mBAAmB,GAAG,MAAM,GAAG,MAAM;AAAA,CAAC;AACjF,CAAC;AAED,OAAO,MAAME,yBAAyB,GAAGnB,MAAM,CAACG,GAAG;AACnD;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMiB,+BAA+B,GAAGpB,MAAM,CAACG,GAAG;AACzD;AACA;AACA,CAAC;AAID,OAAO,MAAMkB,mCAAmC,GAAGrB,MAAM,CAACG,GAA6C;AACvG;AACA,mBAAmBmB,KAAA;EAAA,IAAC;IAAEC;EAAoB,CAAC,GAAAD,KAAA;EAAA,OAAMC,mBAAmB,GAAG,MAAM,GAAG,QAAQ;AAAA,CAAC;AACzF;AACA,CAAC;AAED,OAAO,MAAMC,2CAA2C,GAAGxB,MAAM,CAACG,GAAG,EAAE;AAEvE,OAAO,MAAMsB,gCAAgC,GAAGzB,MAAM,CAACG,GAAG;AAC1D;AACA;AACA;AACA,CAAC","ignoreList":[]}
1
+ {"version":3,"file":"ComboBoxItem.styles.js","names":["styled","css","StyledComboBoxItem","div","_ref","theme","$isSelected","_ref2","text","_ref3","$isTouch","StyledComboBoxItemImage","img","_ref4","$shouldShowRoundImage","_ref5","_ref6","$shouldShowBigImage","_ref7","StyledComboBoxItemContent","StyledComboBoxItemContentHeader","StyledComboBoxItemContentHeaderText","StyledComboBoxItemContentHeaderRightElement","StyledComboBoxItemContentSubtext"],"sources":["../../../../../src/components/combobox/combobox-item/ComboBoxItem.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledComboBoxItemProps = WithTheme<{\n $isTouch: boolean;\n $isSelected: boolean;\n}>;\n\nexport const StyledComboBoxItem = styled.div<StyledComboBoxItemProps>`\n align-items: center;\n background-color: ${({ theme, $isSelected }: StyledComboBoxItemProps) =>\n $isSelected && theme['secondary-103']};\n color: ${({ theme }: StyledComboBoxItemProps) => theme.text};\n display: flex;\n gap: 10px;\n padding: 4px 10px;\n transition: background-color 0.2s ease-in-out;\n\n ${({ $isTouch, theme }: StyledComboBoxItemProps) =>\n !$isTouch &&\n css`\n &:hover {\n background-color: ${theme['secondary-102']};\n }\n\n &:focus {\n background-color: ${theme['secondary-102']};\n }\n `}\n`;\n\ntype StyledComboBoxItemImageProps = WithTheme<{\n $shouldShowBigImage?: boolean;\n $shouldShowRoundImage?: boolean;\n}>;\n\nexport const StyledComboBoxItemImage = styled.img<StyledComboBoxItemImageProps>`\n ${({ $shouldShowRoundImage }) =>\n $shouldShowRoundImage &&\n css`\n border-radius: 50%;\n `}\n\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledComboBoxItemImageProps) => theme['009-rgb']}, 0.15);\n flex: 0 0 auto;\n height: ${({ $shouldShowBigImage }) => ($shouldShowBigImage ? '40px' : '22px')};\n width: ${({ $shouldShowBigImage }) => ($shouldShowBigImage ? '40px' : '22px')};\n`;\n\nexport const StyledComboBoxItemContent = styled.div`\n display: flex;\n flex: 1 1 auto;\n flex-direction: column;\n line-height: normal;\n`;\n\nexport const StyledComboBoxItemContentHeader = styled.div`\n display: flex;\n justify-content: space-between;\n`;\n\nexport const StyledComboBoxItemContentHeaderText = styled.div`\n display: flex;\n gap: 4px;\n`;\n\nexport const StyledComboBoxItemContentHeaderRightElement = styled.div``;\n\nexport const StyledComboBoxItemContentSubtext = styled.div`\n font-size: 90%;\n margin-top: 2px;\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAQ/C,OAAO,MAAMC,kBAAkB,GAAGF,MAAM,CAACG,GAA4B;AACrE;AACA,wBAAwBC,IAAA;EAAA,IAAC;IAAEC,KAAK;IAAEC;EAAqC,CAAC,GAAAF,IAAA;EAAA,OAChEE,WAAW,IAAID,KAAK,CAAC,eAAe,CAAC;AAAA;AAC7C,aAAaE,KAAA;EAAA,IAAC;IAAEF;EAA+B,CAAC,GAAAE,KAAA;EAAA,OAAKF,KAAK,CAACG,IAAI;AAAA;AAC/D;AACA;AACA;AACA;AACA;AACA,MAAMC,KAAA;EAAA,IAAC;IAAEC,QAAQ;IAAEL;EAA+B,CAAC,GAAAI,KAAA;EAAA,OAC3C,CAACC,QAAQ,IACTT,GAAG;AACX;AACA,oCAAoCI,KAAK,CAAC,eAAe,CAAC;AAC1D;AACA;AACA;AACA,oCAAoCA,KAAK,CAAC,eAAe,CAAC;AAC1D;AACA,SAAS;AAAA;AACT,CAAC;AAOD,OAAO,MAAMM,uBAAuB,GAAGX,MAAM,CAACY,GAAiC;AAC/E,MAAMC,KAAA;EAAA,IAAC;IAAEC;EAAsB,CAAC,GAAAD,KAAA;EAAA,OACxBC,qBAAqB,IACrBb,GAAG;AACX;AACA,SAAS;AAAA;AACT;AACA;AACA,eAAec,KAAA;EAAA,IAAC;IAAEV;EAAoC,CAAC,GAAAU,KAAA;EAAA,OAAKV,KAAK,CAAC,SAAS,CAAC;AAAA;AAC5E;AACA,cAAcW,KAAA;EAAA,IAAC;IAAEC;EAAoB,CAAC,GAAAD,KAAA;EAAA,OAAMC,mBAAmB,GAAG,MAAM,GAAG,MAAM;AAAA,CAAC;AAClF,aAAaC,KAAA;EAAA,IAAC;IAAED;EAAoB,CAAC,GAAAC,KAAA;EAAA,OAAMD,mBAAmB,GAAG,MAAM,GAAG,MAAM;AAAA,CAAC;AACjF,CAAC;AAED,OAAO,MAAME,yBAAyB,GAAGnB,MAAM,CAACG,GAAG;AACnD;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMiB,+BAA+B,GAAGpB,MAAM,CAACG,GAAG;AACzD;AACA;AACA,CAAC;AAED,OAAO,MAAMkB,mCAAmC,GAAGrB,MAAM,CAACG,GAAG;AAC7D;AACA;AACA,CAAC;AAED,OAAO,MAAMmB,2CAA2C,GAAGtB,MAAM,CAACG,GAAG,EAAE;AAEvE,OAAO,MAAMoB,gCAAgC,GAAGvB,MAAM,CAACG,GAAG;AAC1D;AACA;AACA,CAAC","ignoreList":[]}
@@ -11,10 +11,7 @@ type StyledComboBoxItemImageProps = WithTheme<{
11
11
  export declare const StyledComboBoxItemImage: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, StyledComboBoxItemImageProps>> & string;
12
12
  export declare const StyledComboBoxItemContent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
13
13
  export declare const StyledComboBoxItemContentHeader: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
14
- type StyledComboBoxItemContentHeaderTextProps = WithTheme<{
15
- $shouldShowBoldText?: boolean;
16
- }>;
17
- export declare const StyledComboBoxItemContentHeaderText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledComboBoxItemContentHeaderTextProps>> & string;
14
+ export declare const StyledComboBoxItemContentHeaderText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
18
15
  export declare const StyledComboBoxItemContentHeaderRightElement: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
19
16
  export declare const StyledComboBoxItemContentSubtext: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
20
17
  export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@chayns-components/core",
3
- "version": "5.0.0-beta.763",
3
+ "version": "5.0.0-beta.766",
4
4
  "description": "A set of beautiful React components for developing your own applications with chayns.",
5
5
  "sideEffects": false,
6
6
  "browserslist": [
@@ -49,12 +49,12 @@
49
49
  "url": "https://github.com/TobitSoftware/chayns-components/issues"
50
50
  },
51
51
  "devDependencies": {
52
- "@babel/cli": "^7.24.8",
52
+ "@babel/cli": "^7.25.6",
53
53
  "@babel/core": "^7.25.2",
54
54
  "@babel/preset-env": "^7.25.4",
55
55
  "@babel/preset-react": "^7.24.7",
56
56
  "@babel/preset-typescript": "^7.24.7",
57
- "@types/react": "^18.3.4",
57
+ "@types/react": "^18.3.5",
58
58
  "@types/react-dom": "^18.3.0",
59
59
  "@types/react-helmet": "^6.1.11",
60
60
  "@types/styled-components": "^5.1.34",
@@ -64,7 +64,7 @@
64
64
  "lerna": "^8.1.8",
65
65
  "react": "^18.3.1",
66
66
  "react-dom": "^18.3.1",
67
- "styled-components": "^6.1.12",
67
+ "styled-components": "^6.1.13",
68
68
  "typescript": "^5.5.4"
69
69
  },
70
70
  "dependencies": {
@@ -85,5 +85,5 @@
85
85
  "publishConfig": {
86
86
  "access": "public"
87
87
  },
88
- "gitHead": "966ccdf13e4096a7b627c2872b32535ff563d3b0"
88
+ "gitHead": "4561cd7fd4da573170e3446ae8f09d8eb269c4e0"
89
89
  }