@chayns-components/core 5.0.0-beta.1011 → 5.0.0-beta.1013

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.
Files changed (25) hide show
  1. package/lib/cjs/components/accordion/accordion-head/AccordionHead.js +19 -19
  2. package/lib/cjs/components/accordion/accordion-head/AccordionHead.js.map +1 -1
  3. package/lib/cjs/components/mention-finder/MentionFinder.styles.js +1 -1
  4. package/lib/cjs/components/mention-finder/MentionFinder.styles.js.map +1 -1
  5. package/lib/cjs/components/mention-finder/mention-finder-item/MentionFinderItem.styles.js +0 -6
  6. package/lib/cjs/components/mention-finder/mention-finder-item/MentionFinderItem.styles.js.map +1 -1
  7. package/lib/cjs/components/search-box/SearchBox.styles.js +1 -1
  8. package/lib/cjs/components/search-box/SearchBox.styles.js.map +1 -1
  9. package/lib/cjs/components/search-box/search-box-body/SearchBoxBody.js +1 -1
  10. package/lib/cjs/components/search-box/search-box-body/SearchBoxBody.js.map +1 -1
  11. package/lib/cjs/components/search-box/search-box-body/SearchBoxBody.styles.js +1 -1
  12. package/lib/cjs/components/search-box/search-box-body/SearchBoxBody.styles.js.map +1 -1
  13. package/lib/esm/components/accordion/accordion-head/AccordionHead.js +1 -1
  14. package/lib/esm/components/accordion/accordion-head/AccordionHead.js.map +1 -1
  15. package/lib/esm/components/mention-finder/MentionFinder.styles.js +1 -1
  16. package/lib/esm/components/mention-finder/MentionFinder.styles.js.map +1 -1
  17. package/lib/esm/components/mention-finder/mention-finder-item/MentionFinderItem.styles.js +10 -19
  18. package/lib/esm/components/mention-finder/mention-finder-item/MentionFinderItem.styles.js.map +1 -1
  19. package/lib/esm/components/search-box/SearchBox.styles.js +1 -1
  20. package/lib/esm/components/search-box/SearchBox.styles.js.map +1 -1
  21. package/lib/esm/components/search-box/search-box-body/SearchBoxBody.js +1 -1
  22. package/lib/esm/components/search-box/search-box-body/SearchBoxBody.js.map +1 -1
  23. package/lib/esm/components/search-box/search-box-body/SearchBoxBody.styles.js +1 -1
  24. package/lib/esm/components/search-box/search-box-body/SearchBoxBody.styles.js.map +1 -1
  25. package/package.json +2 -2
@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.default = void 0;
7
7
  var _react = require("motion/react");
8
- var _react2 = require("react");
8
+ var _react2 = _interopRequireWildcard(require("react"));
9
9
  var _styledComponents = require("styled-components");
10
10
  var _useElementSize = require("../../../hooks/useElementSize");
11
11
  var _accordion = require("../../../utils/accordion");
@@ -14,9 +14,9 @@ var _Icon = _interopRequireDefault(require("../../icon/Icon"));
14
14
  var _Input = _interopRequireWildcard(require("../../input/Input"));
15
15
  var _SearchInput = _interopRequireDefault(require("../../search-input/SearchInput"));
16
16
  var _AccordionHead = require("./AccordionHead.styles");
17
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
17
18
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
18
19
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
19
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
20
20
  function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
21
21
  const AccordionHead = ({
22
22
  icon,
@@ -79,7 +79,7 @@ const AccordionHead = ({
79
79
  }, [isWrapped, onSearchChange, onTitleInputChange, theme.fontSize, title]);
80
80
  const iconElement = (0, _react2.useMemo)(() => {
81
81
  if (icon || isFixed) {
82
- return /*#__PURE__*/React.createElement(_Icon.default, {
82
+ return /*#__PURE__*/_react2.default.createElement(_Icon.default, {
83
83
  icons: [isFixed ? 'fa fa-horizontal-rule' : icon ?? 'fa fa-chevron-right']
84
84
  });
85
85
  }
@@ -88,7 +88,7 @@ const AccordionHead = ({
88
88
  internalIcon = theme.accordionIcon.toString(16);
89
89
  }
90
90
  const internalIconStyle = theme !== null && theme !== void 0 && theme.iconStyle ? theme.iconStyle : 'fa-regular';
91
- return /*#__PURE__*/React.createElement(_AccordionHead.StyledAccordionIcon, {
91
+ return /*#__PURE__*/_react2.default.createElement(_AccordionHead.StyledAccordionIcon, {
92
92
  className: internalIconStyle,
93
93
  $icon: internalIcon
94
94
  });
@@ -99,21 +99,21 @@ const AccordionHead = ({
99
99
  // The height of the titleElement is increased by 8px because of the padding of the accordion head element.
100
100
  accordionHeadHeight = titleElementChildrenSize.height + 8;
101
101
  }
102
- return /*#__PURE__*/React.createElement(_AccordionHead.StyledMotionAccordionHead, {
102
+ return /*#__PURE__*/_react2.default.createElement(_AccordionHead.StyledMotionAccordionHead, {
103
103
  animate: {
104
104
  height: accordionHeadHeight
105
105
  },
106
106
  className: "beta-chayns-accordion-head",
107
107
  initial: false,
108
108
  key: `accordionHead--${uuid}`
109
- }, /*#__PURE__*/React.createElement(_AccordionHead.StyledMotionIconWrapper, {
109
+ }, /*#__PURE__*/_react2.default.createElement(_AccordionHead.StyledMotionIconWrapper, {
110
110
  animate: {
111
111
  rotate: (isOpen || isFixed) && shouldRotateIcon ? 90 : 0
112
112
  },
113
113
  initial: false,
114
114
  onClick: !isFixed ? onClick : undefined,
115
115
  key: `accordionHeadIcon--${uuid}`
116
- }, iconElement), /*#__PURE__*/React.createElement(_AccordionHead.StyledMotionContentWrapper, {
116
+ }, iconElement), /*#__PURE__*/_react2.default.createElement(_AccordionHead.StyledMotionContentWrapper, {
117
117
  animate: {
118
118
  opacity: isTitleGreyed ? 0.5 : 1
119
119
  },
@@ -125,21 +125,21 @@ const AccordionHead = ({
125
125
  }, typeof onTitleInputChange === 'function' ?
126
126
  /*#__PURE__*/
127
127
  // eslint-disable-next-line react/jsx-no-constructed-context-values
128
- React.createElement(_AreaContextProvider.AreaContext.Provider, {
128
+ _react2.default.createElement(_AreaContextProvider.AreaContext.Provider, {
129
129
  value: {
130
130
  shouldChangeColor: true
131
131
  }
132
- }, /*#__PURE__*/React.createElement(_Input.default, _extends({}, titleInputProps, {
132
+ }, /*#__PURE__*/_react2.default.createElement(_Input.default, _extends({}, titleInputProps, {
133
133
  value: title,
134
134
  onChange: onTitleInputChange
135
- }))) : /*#__PURE__*/React.createElement(_react.LayoutGroup, {
135
+ }))) : /*#__PURE__*/_react2.default.createElement(_react.LayoutGroup, {
136
136
  key: `accordionHeadLayoutGroup--${uuid}`
137
- }, /*#__PURE__*/React.createElement(_AccordionHead.StyledMotionTitleWrapper, {
137
+ }, /*#__PURE__*/_react2.default.createElement(_AccordionHead.StyledMotionTitleWrapper, {
138
138
  key: `accordionHeadTitleWrapperWrapper--${uuid}`
139
- }, /*#__PURE__*/React.createElement(_react.AnimatePresence, {
139
+ }, /*#__PURE__*/_react2.default.createElement(_react.AnimatePresence, {
140
140
  initial: false,
141
141
  key: `accordionHeadTitleWrapper--${uuid}`
142
- }, /*#__PURE__*/React.createElement(_AccordionHead.StyledMotionTitle, {
142
+ }, /*#__PURE__*/_react2.default.createElement(_AccordionHead.StyledMotionTitle, {
143
143
  animate: {
144
144
  scale: 1
145
145
  },
@@ -159,16 +159,16 @@ const AccordionHead = ({
159
159
  }
160
160
  },
161
161
  key: isOpen && !isWrapped ? `accordionHeadTitleBig--${uuid}` : `accordionHeadTitle--${uuid}`
162
- }, title))), titleElement && /*#__PURE__*/React.createElement(_AccordionHead.StyledMotionTitleElementWrapper, {
162
+ }, title))), titleElement && /*#__PURE__*/_react2.default.createElement(_AccordionHead.StyledMotionTitleElementWrapper, {
163
163
  layout: true,
164
164
  key: `accordionTitleElement--${uuid}`,
165
165
  ref: titleElementWrapperRef
166
- }, titleElement))), (typeof onSearchChange === 'function' || rightElement) && /*#__PURE__*/React.createElement(_AccordionHead.StyledRightWrapper, {
166
+ }, titleElement))), (typeof onSearchChange === 'function' || rightElement) && /*#__PURE__*/_react2.default.createElement(_AccordionHead.StyledRightWrapper, {
167
167
  $isSearchActive: isSearchActive
168
- }, /*#__PURE__*/React.createElement(_react.AnimatePresence, {
168
+ }, /*#__PURE__*/_react2.default.createElement(_react.AnimatePresence, {
169
169
  initial: false,
170
170
  key: `accordionRightWrapper--${uuid}`
171
- }, typeof onSearchChange === 'function' && isOpen && /*#__PURE__*/React.createElement(_AccordionHead.StyledMotionSearchWrapper, {
171
+ }, typeof onSearchChange === 'function' && isOpen && /*#__PURE__*/_react2.default.createElement(_AccordionHead.StyledMotionSearchWrapper, {
172
172
  animate: {
173
173
  opacity: 1
174
174
  },
@@ -179,13 +179,13 @@ const AccordionHead = ({
179
179
  opacity: 0
180
180
  },
181
181
  key: `searchWrapper--${uuid}`
182
- }, /*#__PURE__*/React.createElement(_SearchInput.default, {
182
+ }, /*#__PURE__*/_react2.default.createElement(_SearchInput.default, {
183
183
  onChange: handleOnSearchChance,
184
184
  onActiveChange: isActive => setIsSearchActive(isActive),
185
185
  placeholder: searchPlaceholder,
186
186
  size: _Input.InputSize.Small,
187
187
  value: internalSearchValue
188
- })), rightElement && /*#__PURE__*/React.createElement(_AccordionHead.StyledMotionRightElementWrapper, {
188
+ })), rightElement && /*#__PURE__*/_react2.default.createElement(_AccordionHead.StyledMotionRightElementWrapper, {
189
189
  animate: {
190
190
  opacity: 1
191
191
  },
@@ -1 +1 @@
1
- {"version":3,"file":"AccordionHead.js","names":["_react","require","_react2","_styledComponents","_useElementSize","_accordion","_AreaContextProvider","_Icon","_interopRequireDefault","_Input","_interopRequireWildcard","_SearchInput","_AccordionHead","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","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","isSearchActive","setIsSearchActive","theme","useTheme","titleElementWrapperRef","useRef","titleWrapperRef","internalSearchValue","setInternalSearchValue","useEffect","handleOnSearchChance","event","target","value","titleElementChildrenSize","useElementSize","shouldUseChildElement","shouldPreventRightElementClick","useMemo","getElementClickEvent","_titleWrapperRef$curr","getAccordionHeadHeight","width","current","clientWidth","hasSearch","fontSize","iconElement","React","createElement","icons","internalIcon","accordionIcon","toString","internalIconStyle","iconStyle","StyledAccordionIcon","className","$icon","accordionHeadHeight","height","StyledMotionAccordionHead","animate","initial","key","StyledMotionIconWrapper","rotate","undefined","StyledMotionContentWrapper","opacity","ref","$isWrapped","AreaContext","Provider","shouldChangeColor","onChange","LayoutGroup","StyledMotionTitleWrapper","AnimatePresence","StyledMotionTitle","scale","exit","$isOpen","$color","$hasSearch","transition","duration","StyledMotionTitleElementWrapper","layout","StyledRightWrapper","$isSearchActive","StyledMotionSearchWrapper","onActiveChange","isActive","placeholder","size","InputSize","Small","StyledMotionRightElementWrapper","displayName","_default","exports"],"sources":["../../../../../src/components/accordion/accordion-head/AccordionHead.tsx"],"sourcesContent":["import { AnimatePresence, LayoutGroup } from 'motion/react';\nimport {\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, getElementClickEvent } 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 [isSearchActive, setIsSearchActive] = useState(false);\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\n const shouldPreventRightElementClick = useMemo(\n () => getElementClickEvent(rightElement),\n [rightElement],\n );\n\n useEffect(() => {\n if (typeof onTitleInputChange === 'function') {\n setHeadHeight({ closed: 50, open: 50 });\n } else {\n setHeadHeight(\n getAccordionHeadHeight({\n isWrapped,\n title,\n width: (titleWrapperRef.current?.clientWidth ?? 0) - 10,\n hasSearch: typeof onSearchChange === 'function',\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, onSearchChange, onTitleInputChange, theme.fontSize, title]);\n\n const iconElement = useMemo(() => {\n if (icon || isFixed) {\n return (\n <Icon\n icons={[isFixed ? 'fa fa-horizontal-rule' : (icon ?? 'fa fa-chevron-right')]}\n />\n );\n }\n\n let internalIcon = 'f105';\n\n if (\n theme?.accordionIcon &&\n theme.accordionIcon !== 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 return (\n <StyledMotionAccordionHead\n animate={{ height: accordionHeadHeight }}\n className=\"beta-chayns-accordion-head\"\n initial={false}\n key={`accordionHead--${uuid}`}\n >\n <StyledMotionIconWrapper\n animate={{ rotate: (isOpen || isFixed) && shouldRotateIcon ? 90 : 0 }}\n initial={false}\n onClick={!isFixed ? onClick : undefined}\n key={`accordionHeadIcon--${uuid}`}\n >\n {iconElement}\n </StyledMotionIconWrapper>\n <StyledMotionContentWrapper\n animate={{ opacity: isTitleGreyed ? 0.5 : 1 }}\n initial={false}\n onClick={!isFixed ? onClick : undefined}\n ref={titleWrapperRef}\n $isWrapped={isWrapped}\n key={`accordionHeadContentWrapper--${uuid}`}\n >\n {typeof onTitleInputChange === 'function' ? (\n // eslint-disable-next-line react/jsx-no-constructed-context-values\n <AreaContext.Provider value={{ shouldChangeColor: true }}>\n <Input {...titleInputProps} value={title} onChange={onTitleInputChange} />\n </AreaContext.Provider>\n ) : (\n <LayoutGroup key={`accordionHeadLayoutGroup--${uuid}`}>\n <StyledMotionTitleWrapper key={`accordionHeadTitleWrapperWrapper--${uuid}`}>\n <AnimatePresence\n initial={false}\n key={`accordionHeadTitleWrapper--${uuid}`}\n >\n <StyledMotionTitle\n animate={{ scale: 1 }}\n initial={{ scale: isOpen && !isWrapped ? 1 / 1.3 : 1.3 }}\n exit={{ opacity: 0 }}\n $isOpen={isOpen}\n $isWrapped={isWrapped}\n $color={titleColor}\n $hasSearch={typeof onSearchChange === 'function'}\n transition={{\n opacity: {\n duration: 0,\n },\n }}\n key={\n isOpen && !isWrapped\n ? `accordionHeadTitleBig--${uuid}`\n : `accordionHeadTitle--${uuid}`\n }\n >\n {title}\n </StyledMotionTitle>\n </AnimatePresence>\n </StyledMotionTitleWrapper>\n {titleElement && (\n <StyledMotionTitleElementWrapper\n layout\n key={`accordionTitleElement--${uuid}`}\n ref={titleElementWrapperRef}\n >\n {titleElement}\n </StyledMotionTitleElementWrapper>\n )}\n </LayoutGroup>\n )}\n </StyledMotionContentWrapper>\n {(typeof onSearchChange === 'function' || rightElement) && (\n <StyledRightWrapper $isSearchActive={isSearchActive}>\n <AnimatePresence initial={false} key={`accordionRightWrapper--${uuid}`}>\n {typeof onSearchChange === 'function' && isOpen && (\n <StyledMotionSearchWrapper\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n key={`searchWrapper--${uuid}`}\n >\n <SearchInput\n onChange={handleOnSearchChance}\n onActiveChange={(isActive) => setIsSearchActive(isActive)}\n placeholder={searchPlaceholder}\n size={InputSize.Small}\n value={internalSearchValue}\n />\n </StyledMotionSearchWrapper>\n )}\n {rightElement && (\n <StyledMotionRightElementWrapper\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n key={`rightElementWrapper--${uuid}`}\n onClick={\n !isFixed && !shouldPreventRightElementClick\n ? onClick\n : undefined\n }\n >\n {rightElement}\n </StyledMotionRightElementWrapper>\n )}\n </AnimatePresence>\n </StyledRightWrapper>\n )}\n </StyledMotionAccordionHead>\n );\n};\n\nAccordionHead.displayName = 'AccordionHead';\n\nexport default AccordionHead;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"AccordionHead.js","names":["_react","require","_react2","_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","isSearchActive","setIsSearchActive","theme","useTheme","titleElementWrapperRef","useRef","titleWrapperRef","internalSearchValue","setInternalSearchValue","useEffect","handleOnSearchChance","event","target","value","titleElementChildrenSize","useElementSize","shouldUseChildElement","shouldPreventRightElementClick","useMemo","getElementClickEvent","_titleWrapperRef$curr","getAccordionHeadHeight","width","current","clientWidth","hasSearch","fontSize","iconElement","createElement","icons","internalIcon","accordionIcon","toString","internalIconStyle","iconStyle","StyledAccordionIcon","className","$icon","accordionHeadHeight","height","StyledMotionAccordionHead","animate","initial","key","StyledMotionIconWrapper","rotate","undefined","StyledMotionContentWrapper","opacity","ref","$isWrapped","AreaContext","Provider","shouldChangeColor","onChange","LayoutGroup","StyledMotionTitleWrapper","AnimatePresence","StyledMotionTitle","scale","exit","$isOpen","$color","$hasSearch","transition","duration","StyledMotionTitleElementWrapper","layout","StyledRightWrapper","$isSearchActive","StyledMotionSearchWrapper","onActiveChange","isActive","placeholder","size","InputSize","Small","StyledMotionRightElementWrapper","displayName","_default","exports"],"sources":["../../../../../src/components/accordion/accordion-head/AccordionHead.tsx"],"sourcesContent":["import { AnimatePresence, LayoutGroup } from 'motion/react';\nimport React, {\n ChangeEvent,\n ChangeEventHandler,\n FC,\n MouseEventHandler,\n ReactNode,\n useEffect,\n useMemo,\n useRef,\n useState,\n type CSSProperties,\n} from 'react';\nimport { useTheme } from 'styled-components';\nimport { useElementSize } from '../../../hooks/useElementSize';\nimport { getAccordionHeadHeight, getElementClickEvent } 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 [isSearchActive, setIsSearchActive] = useState(false);\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\n const shouldPreventRightElementClick = useMemo(\n () => getElementClickEvent(rightElement),\n [rightElement],\n );\n\n useEffect(() => {\n if (typeof onTitleInputChange === 'function') {\n setHeadHeight({ closed: 50, open: 50 });\n } else {\n setHeadHeight(\n getAccordionHeadHeight({\n isWrapped,\n title,\n width: (titleWrapperRef.current?.clientWidth ?? 0) - 10,\n hasSearch: typeof onSearchChange === 'function',\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, onSearchChange, onTitleInputChange, theme.fontSize, title]);\n\n const iconElement = useMemo(() => {\n if (icon || isFixed) {\n return (\n <Icon\n icons={[isFixed ? 'fa fa-horizontal-rule' : (icon ?? 'fa fa-chevron-right')]}\n />\n );\n }\n\n let internalIcon = 'f105';\n\n if (\n theme?.accordionIcon &&\n theme.accordionIcon !== 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 return (\n <StyledMotionAccordionHead\n animate={{ height: accordionHeadHeight }}\n className=\"beta-chayns-accordion-head\"\n initial={false}\n key={`accordionHead--${uuid}`}\n >\n <StyledMotionIconWrapper\n animate={{ rotate: (isOpen || isFixed) && shouldRotateIcon ? 90 : 0 }}\n initial={false}\n onClick={!isFixed ? onClick : undefined}\n key={`accordionHeadIcon--${uuid}`}\n >\n {iconElement}\n </StyledMotionIconWrapper>\n <StyledMotionContentWrapper\n animate={{ opacity: isTitleGreyed ? 0.5 : 1 }}\n initial={false}\n onClick={!isFixed ? onClick : undefined}\n ref={titleWrapperRef}\n $isWrapped={isWrapped}\n key={`accordionHeadContentWrapper--${uuid}`}\n >\n {typeof onTitleInputChange === 'function' ? (\n // eslint-disable-next-line react/jsx-no-constructed-context-values\n <AreaContext.Provider value={{ shouldChangeColor: true }}>\n <Input {...titleInputProps} value={title} onChange={onTitleInputChange} />\n </AreaContext.Provider>\n ) : (\n <LayoutGroup key={`accordionHeadLayoutGroup--${uuid}`}>\n <StyledMotionTitleWrapper key={`accordionHeadTitleWrapperWrapper--${uuid}`}>\n <AnimatePresence\n initial={false}\n key={`accordionHeadTitleWrapper--${uuid}`}\n >\n <StyledMotionTitle\n animate={{ scale: 1 }}\n initial={{ scale: isOpen && !isWrapped ? 1 / 1.3 : 1.3 }}\n exit={{ opacity: 0 }}\n $isOpen={isOpen}\n $isWrapped={isWrapped}\n $color={titleColor}\n $hasSearch={typeof onSearchChange === 'function'}\n transition={{\n opacity: {\n duration: 0,\n },\n }}\n key={\n isOpen && !isWrapped\n ? `accordionHeadTitleBig--${uuid}`\n : `accordionHeadTitle--${uuid}`\n }\n >\n {title}\n </StyledMotionTitle>\n </AnimatePresence>\n </StyledMotionTitleWrapper>\n {titleElement && (\n <StyledMotionTitleElementWrapper\n layout\n key={`accordionTitleElement--${uuid}`}\n ref={titleElementWrapperRef}\n >\n {titleElement}\n </StyledMotionTitleElementWrapper>\n )}\n </LayoutGroup>\n )}\n </StyledMotionContentWrapper>\n {(typeof onSearchChange === 'function' || rightElement) && (\n <StyledRightWrapper $isSearchActive={isSearchActive}>\n <AnimatePresence initial={false} key={`accordionRightWrapper--${uuid}`}>\n {typeof onSearchChange === 'function' && isOpen && (\n <StyledMotionSearchWrapper\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n key={`searchWrapper--${uuid}`}\n >\n <SearchInput\n onChange={handleOnSearchChance}\n onActiveChange={(isActive) => setIsSearchActive(isActive)}\n placeholder={searchPlaceholder}\n size={InputSize.Small}\n value={internalSearchValue}\n />\n </StyledMotionSearchWrapper>\n )}\n {rightElement && (\n <StyledMotionRightElementWrapper\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n key={`rightElementWrapper--${uuid}`}\n onClick={\n !isFixed && !shouldPreventRightElementClick\n ? onClick\n : undefined\n }\n >\n {rightElement}\n </StyledMotionRightElementWrapper>\n )}\n </AnimatePresence>\n </StyledRightWrapper>\n )}\n </StyledMotionAccordionHead>\n );\n};\n\nAccordionHead.displayName = 'AccordionHead';\n\nexport default AccordionHead;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,OAAA,GAAAC,uBAAA,CAAAF,OAAA;AAYA,IAAAG,iBAAA,GAAAH,OAAA;AACA,IAAAI,eAAA,GAAAJ,OAAA;AACA,IAAAK,UAAA,GAAAL,OAAA;AACA,IAAAM,oBAAA,GAAAN,OAAA;AACA,IAAAO,KAAA,GAAAC,sBAAA,CAAAR,OAAA;AACA,IAAAS,MAAA,GAAAP,uBAAA,CAAAF,OAAA;AACA,IAAAU,YAAA,GAAAF,sBAAA,CAAAR,OAAA;AACA,IAAAW,cAAA,GAAAX,OAAA;AAWgC,SAAAQ,uBAAAI,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAAA,SAAAG,yBAAAH,CAAA,6BAAAI,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAD,wBAAA,YAAAA,CAAAH,CAAA,WAAAA,CAAA,GAAAM,CAAA,GAAAD,CAAA,KAAAL,CAAA;AAAA,SAAAV,wBAAAU,CAAA,EAAAK,CAAA,SAAAA,CAAA,IAAAL,CAAA,IAAAA,CAAA,CAAAC,UAAA,SAAAD,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAE,OAAA,EAAAF,CAAA,QAAAM,CAAA,GAAAH,wBAAA,CAAAE,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAC,GAAA,CAAAP,CAAA,UAAAM,CAAA,CAAAE,GAAA,CAAAR,CAAA,OAAAS,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAf,CAAA,oBAAAe,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAjB,CAAA,EAAAe,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAd,CAAA,EAAAe,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,IAAAf,CAAA,CAAAe,CAAA,YAAAN,CAAA,CAAAP,OAAA,GAAAF,CAAA,EAAAM,CAAA,IAAAA,CAAA,CAAAa,GAAA,CAAAnB,CAAA,EAAAS,CAAA,GAAAA,CAAA;AAAA,SAAAW,SAAA,WAAAA,QAAA,GAAAR,MAAA,CAAAS,MAAA,GAAAT,MAAA,CAAAS,MAAA,CAAAC,IAAA,eAAAb,CAAA,aAAAT,CAAA,MAAAA,CAAA,GAAAuB,SAAA,CAAAC,MAAA,EAAAxB,CAAA,UAAAM,CAAA,GAAAiB,SAAA,CAAAvB,CAAA,YAAAK,CAAA,IAAAC,CAAA,OAAAU,cAAA,CAAAC,IAAA,CAAAX,CAAA,EAAAD,CAAA,MAAAI,CAAA,CAAAJ,CAAA,IAAAC,CAAA,CAAAD,CAAA,aAAAI,CAAA,KAAAW,QAAA,CAAAK,KAAA,OAAAF,SAAA;AA2BhC,MAAMG,aAAqC,GAAGA,CAAC;EAC3CC,IAAI;EACJC,MAAM;EACNC,OAAO;EACPC,aAAa;EACbC,SAAS;EACTC,OAAO;EACPC,cAAc;EACdC,YAAY;EACZC,iBAAiB;EACjBC,WAAW;EACXC,gBAAgB;EAChBC,KAAK;EACLC,YAAY;EACZC,IAAI;EACJC,eAAe;EACfC,kBAAkB;EAClBC;AACJ,CAAC,KAAK;EACF,MAAM,CAACC,UAAU,EAAEC,aAAa,CAAC,GAAG,IAAAC,gBAAQ,EAAa;IACrDC,MAAM,EAAEhB,SAAS,GAAG,EAAE,GAAG,EAAE;IAC3BiB,IAAI,EAAEjB,SAAS,GAAG,EAAE,GAAG;EAC3B,CAAC,CAAC;EAEF,MAAM,CAACkB,cAAc,EAAEC,iBAAiB,CAAC,GAAG,IAAAJ,gBAAQ,EAAC,KAAK,CAAC;EAE3D,MAAMK,KAAK,GAAG,IAAAC,0BAAQ,EAAC,CAAC;EAExB,MAAMC,sBAAsB,GAAG,IAAAC,cAAM,EAAiB,IAAI,CAAC;EAC3D,MAAMC,eAAe,GAAG,IAAAD,cAAM,EAAiB,IAAI,CAAC;EAEpD,MAAM,CAACE,mBAAmB,EAAEC,sBAAsB,CAAC,GAAG,IAAAX,gBAAQ,EAAS,CAAC;EAExE,IAAAY,iBAAS,EAAC,MAAM;IACZD,sBAAsB,CAACrB,WAAW,CAAC;EACvC,CAAC,EAAE,CAACA,WAAW,CAAC,CAAC;EAEjB,MAAMuB,oBAAoB,GAAIC,KAAoC,IAAK;IACnEH,sBAAsB,CAACG,KAAK,CAACC,MAAM,CAACC,KAAK,CAAC;IAC1C,IAAI,OAAO7B,cAAc,KAAK,UAAU,EAAE;MACtCA,cAAc,CAAC2B,KAAK,CAAC;IACzB;EACJ,CAAC;EAED,MAAMG,wBAAwB,GAAG,IAAAC,8BAAc,EAACX,sBAAsB,EAAE;IACpEY,qBAAqB,EAAE;EAC3B,CAAC,CAAC;EAEF,MAAMC,8BAA8B,GAAG,IAAAC,eAAO,EAC1C,MAAM,IAAAC,+BAAoB,EAAClC,YAAY,CAAC,EACxC,CAACA,YAAY,CACjB,CAAC;EAED,IAAAwB,iBAAS,EAAC,MAAM;IACZ,IAAI,OAAOhB,kBAAkB,KAAK,UAAU,EAAE;MAC1CG,aAAa,CAAC;QAAEE,MAAM,EAAE,EAAE;QAAEC,IAAI,EAAE;MAAG,CAAC,CAAC;IAC3C,CAAC,MAAM;MAAA,IAAAqB,qBAAA;MACHxB,aAAa,CACT,IAAAyB,iCAAsB,EAAC;QACnBvC,SAAS;QACTO,KAAK;QACLiC,KAAK,EAAE,CAAC,EAAAF,qBAAA,GAAAd,eAAe,CAACiB,OAAO,cAAAH,qBAAA,uBAAvBA,qBAAA,CAAyBI,WAAW,KAAI,CAAC,IAAI,EAAE;QACvDC,SAAS,EAAE,OAAOzC,cAAc,KAAK;MACzC,CAAC,CACL,CAAC;IACL;IACA;IACA;EACJ,CAAC,EAAE,CAACF,SAAS,EAAEE,cAAc,EAAES,kBAAkB,EAAES,KAAK,CAACwB,QAAQ,EAAErC,KAAK,CAAC,CAAC;EAE1E,MAAMsC,WAAW,GAAG,IAAAT,eAAO,EAAC,MAAM;IAC9B,IAAIxC,IAAI,IAAIE,OAAO,EAAE;MACjB,oBACIxC,OAAA,CAAAa,OAAA,CAAA2E,aAAA,CAAClF,KAAA,CAAAO,OAAI;QACD4E,KAAK,EAAE,CAACjD,OAAO,GAAG,uBAAuB,GAAIF,IAAI,IAAI,qBAAsB;MAAE,CAChF,CAAC;IAEV;IAEA,IAAIoD,YAAY,GAAG,MAAM;IAEzB,IACI5B,KAAK,aAALA,KAAK,eAALA,KAAK,CAAE6B,aAAa,IACpB7B,KAAK,CAAC6B,aAAa,KAAK,GAAG,IAC3B7B,KAAK,CAAC6B,aAAa,KAAK,OAAO,EACjC;MACED,YAAY,GAAI5B,KAAK,CAAC6B,aAAa,CAAYC,QAAQ,CAAC,EAAE,CAAC;IAC/D;IAEA,MAAMC,iBAAiB,GAAG/B,KAAK,aAALA,KAAK,eAALA,KAAK,CAAEgC,SAAS,GAAIhC,KAAK,CAACgC,SAAS,GAAc,YAAY;IAEvF,oBAAO9F,OAAA,CAAAa,OAAA,CAAA2E,aAAA,CAAC9E,cAAA,CAAAqF,mBAAmB;MAACC,SAAS,EAAEH,iBAAkB;MAACI,KAAK,EAAEP;IAAa,CAAE,CAAC;EACrF,CAAC,EAAE,CAACpD,IAAI,EAAEwB,KAAK,EAAEtB,OAAO,CAAC,CAAC;EAE1B,IAAI0D,mBAAmB,GAAG3D,MAAM,GAAGgB,UAAU,CAACI,IAAI,GAAGJ,UAAU,CAACG,MAAM;EAEtE,IAAIgB,wBAAwB,IAAIA,wBAAwB,CAACyB,MAAM,GAAGD,mBAAmB,EAAE;IACnF;IACA;IACAA,mBAAmB,GAAGxB,wBAAwB,CAACyB,MAAM,GAAG,CAAC;EAC7D;EAEA,oBACInG,OAAA,CAAAa,OAAA,CAAA2E,aAAA,CAAC9E,cAAA,CAAA0F,yBAAyB;IACtBC,OAAO,EAAE;MAAEF,MAAM,EAAED;IAAoB,CAAE;IACzCF,SAAS,EAAC,4BAA4B;IACtCM,OAAO,EAAE,KAAM;IACfC,GAAG,EAAE,kBAAkBpD,IAAI;EAAG,gBAE9BnD,OAAA,CAAAa,OAAA,CAAA2E,aAAA,CAAC9E,cAAA,CAAA8F,uBAAuB;IACpBH,OAAO,EAAE;MAAEI,MAAM,EAAE,CAAClE,MAAM,IAAIC,OAAO,KAAKQ,gBAAgB,GAAG,EAAE,GAAG;IAAE,CAAE;IACtEsD,OAAO,EAAE,KAAM;IACf3D,OAAO,EAAE,CAACH,OAAO,GAAGG,OAAO,GAAG+D,SAAU;IACxCH,GAAG,EAAE,sBAAsBpD,IAAI;EAAG,GAEjCoC,WACoB,CAAC,eAC1BvF,OAAA,CAAAa,OAAA,CAAA2E,aAAA,CAAC9E,cAAA,CAAAiG,0BAA0B;IACvBN,OAAO,EAAE;MAAEO,OAAO,EAAEnE,aAAa,GAAG,GAAG,GAAG;IAAE,CAAE;IAC9C6D,OAAO,EAAE,KAAM;IACf3D,OAAO,EAAE,CAACH,OAAO,GAAGG,OAAO,GAAG+D,SAAU;IACxCG,GAAG,EAAE3C,eAAgB;IACrB4C,UAAU,EAAEpE,SAAU;IACtB6D,GAAG,EAAE,gCAAgCpD,IAAI;EAAG,GAE3C,OAAOE,kBAAkB,KAAK,UAAU;EAAA;EACrC;EACArD,OAAA,CAAAa,OAAA,CAAA2E,aAAA,CAACnF,oBAAA,CAAA0G,WAAW,CAACC,QAAQ;IAACvC,KAAK,EAAE;MAAEwC,iBAAiB,EAAE;IAAK;EAAE,gBACrDjH,OAAA,CAAAa,OAAA,CAAA2E,aAAA,CAAChF,MAAA,CAAAK,OAAK,EAAAkB,QAAA,KAAKqB,eAAe;IAAEqB,KAAK,EAAExB,KAAM;IAACiE,QAAQ,EAAE7D;EAAmB,EAAE,CACvD,CAAC,gBAEvBrD,OAAA,CAAAa,OAAA,CAAA2E,aAAA,CAAC1F,MAAA,CAAAqH,WAAW;IAACZ,GAAG,EAAE,6BAA6BpD,IAAI;EAAG,gBAClDnD,OAAA,CAAAa,OAAA,CAAA2E,aAAA,CAAC9E,cAAA,CAAA0G,wBAAwB;IAACb,GAAG,EAAE,qCAAqCpD,IAAI;EAAG,gBACvEnD,OAAA,CAAAa,OAAA,CAAA2E,aAAA,CAAC1F,MAAA,CAAAuH,eAAe;IACZf,OAAO,EAAE,KAAM;IACfC,GAAG,EAAE,8BAA8BpD,IAAI;EAAG,gBAE1CnD,OAAA,CAAAa,OAAA,CAAA2E,aAAA,CAAC9E,cAAA,CAAA4G,iBAAiB;IACdjB,OAAO,EAAE;MAAEkB,KAAK,EAAE;IAAE,CAAE;IACtBjB,OAAO,EAAE;MAAEiB,KAAK,EAAEhF,MAAM,IAAI,CAACG,SAAS,GAAG,CAAC,GAAG,GAAG,GAAG;IAAI,CAAE;IACzD8E,IAAI,EAAE;MAAEZ,OAAO,EAAE;IAAE,CAAE;IACrBa,OAAO,EAAElF,MAAO;IAChBuE,UAAU,EAAEpE,SAAU;IACtBgF,MAAM,EAAEpE,UAAW;IACnBqE,UAAU,EAAE,OAAO/E,cAAc,KAAK,UAAW;IACjDgF,UAAU,EAAE;MACRhB,OAAO,EAAE;QACLiB,QAAQ,EAAE;MACd;IACJ,CAAE;IACFtB,GAAG,EACChE,MAAM,IAAI,CAACG,SAAS,GACd,0BAA0BS,IAAI,EAAE,GAChC,uBAAuBA,IAAI;EACpC,GAEAF,KACc,CACN,CACK,CAAC,EAC1BC,YAAY,iBACTlD,OAAA,CAAAa,OAAA,CAAA2E,aAAA,CAAC9E,cAAA,CAAAoH,+BAA+B;IAC5BC,MAAM;IACNxB,GAAG,EAAE,0BAA0BpD,IAAI,EAAG;IACtC0D,GAAG,EAAE7C;EAAuB,GAE3Bd,YAC4B,CAE5B,CAEO,CAAC,EAC5B,CAAC,OAAON,cAAc,KAAK,UAAU,IAAIC,YAAY,kBAClD7C,OAAA,CAAAa,OAAA,CAAA2E,aAAA,CAAC9E,cAAA,CAAAsH,kBAAkB;IAACC,eAAe,EAAErE;EAAe,gBAChD5D,OAAA,CAAAa,OAAA,CAAA2E,aAAA,CAAC1F,MAAA,CAAAuH,eAAe;IAACf,OAAO,EAAE,KAAM;IAACC,GAAG,EAAE,0BAA0BpD,IAAI;EAAG,GAClE,OAAOP,cAAc,KAAK,UAAU,IAAIL,MAAM,iBAC3CvC,OAAA,CAAAa,OAAA,CAAA2E,aAAA,CAAC9E,cAAA,CAAAwH,yBAAyB;IACtB7B,OAAO,EAAE;MAAEO,OAAO,EAAE;IAAE,CAAE;IACxBY,IAAI,EAAE;MAAEZ,OAAO,EAAE;IAAE,CAAE;IACrBN,OAAO,EAAE;MAAEM,OAAO,EAAE;IAAE,CAAE;IACxBL,GAAG,EAAE,kBAAkBpD,IAAI;EAAG,gBAE9BnD,OAAA,CAAAa,OAAA,CAAA2E,aAAA,CAAC/E,YAAA,CAAAI,OAAW;IACRqG,QAAQ,EAAE5C,oBAAqB;IAC/B6D,cAAc,EAAGC,QAAQ,IAAKvE,iBAAiB,CAACuE,QAAQ,CAAE;IAC1DC,WAAW,EAAEvF,iBAAkB;IAC/BwF,IAAI,EAAEC,gBAAS,CAACC,KAAM;IACtB/D,KAAK,EAAEN;EAAoB,CAC9B,CACsB,CAC9B,EACAtB,YAAY,iBACT7C,OAAA,CAAAa,OAAA,CAAA2E,aAAA,CAAC9E,cAAA,CAAA+H,+BAA+B;IAC5BpC,OAAO,EAAE;MAAEO,OAAO,EAAE;IAAE,CAAE;IACxBY,IAAI,EAAE;MAAEZ,OAAO,EAAE;IAAE,CAAE;IACrBN,OAAO,EAAE;MAAEM,OAAO,EAAE;IAAE,CAAE;IACxBL,GAAG,EAAE,wBAAwBpD,IAAI,EAAG;IACpCR,OAAO,EACH,CAACH,OAAO,IAAI,CAACqC,8BAA8B,GACrClC,OAAO,GACP+D;EACT,GAEA7D,YAC4B,CAExB,CACD,CAED,CAAC;AAEpC,CAAC;AAEDR,aAAa,CAACqG,WAAW,GAAG,eAAe;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAA/H,OAAA,GAE7BwB,aAAa","ignoreList":[]}
@@ -15,7 +15,7 @@ const StyledMentionFinder = exports.StyledMentionFinder = _styledComponents.defa
15
15
  const StyledMotionMentionFinderPopup = exports.StyledMotionMentionFinderPopup = (0, _styledComponents.default)(_react.motion.div)`
16
16
  background-color: ${({
17
17
  theme
18
- }) => theme['001']};
18
+ }) => theme['100']};
19
19
  border: 1px solid rgba(0, 0, 0, 0.1);
20
20
  border-radius: 3px;
21
21
  box-shadow: 1px 3px 8px rgba(0, 0, 0, 0.1);
@@ -1 +1 @@
1
- {"version":3,"file":"MentionFinder.styles.js","names":["_react","require","_styledComponents","_interopRequireWildcard","_mentionFinder","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","StyledMentionFinder","exports","styled","div","StyledMotionMentionFinderPopup","motion","theme","$popupAlignment","MentionFinderPopupAlignment","Bottom","css","Top","undefined"],"sources":["../../../../src/components/mention-finder/MentionFinder.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport { MentionFinderPopupAlignment } from '../../constants/mentionFinder';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\nexport const StyledMentionFinder = styled.div`\n position: relative;\n`;\n\ntype StyledMentionFinderPopupProps = WithTheme<{ $popupAlignment: MentionFinderPopupAlignment }>;\n\nexport const StyledMotionMentionFinderPopup = styled(motion.div)<StyledMentionFinderPopupProps>`\n background-color: ${({ theme }: StyledMentionFinderPopupProps) => theme['001']};\n border: 1px solid rgba(0, 0, 0, 0.1);\n border-radius: 3px;\n box-shadow: 1px 3px 8px rgba(0, 0, 0, 0.1);\n left: 0;\n max-height: 275px;\n overflow-y: scroll;\n position: absolute;\n width: 100%;\n\n ${({ $popupAlignment }) => {\n switch ($popupAlignment) {\n case MentionFinderPopupAlignment.Bottom:\n return css`\n top: 0;\n `;\n case MentionFinderPopupAlignment.Top:\n return css`\n bottom: 0;\n `;\n default:\n return undefined;\n }\n }}\n\n // Styles for custom scrollbar\n &::-webkit-scrollbar {\n width: 5px;\n }\n\n &::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n &::-webkit-scrollbar-button {\n background-color: transparent;\n height: 5px;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: rgba(\n ${({ theme }: StyledMentionFinderPopupProps) => theme['text-rgb']},\n 0.15\n );\n border-radius: 20px;\n }\n\n // Scrollbar styles for Firefox. The above styles are not supported in Firefox, these styles are\n // only supported in Firefox:\n * {\n scrollbar-color: rgba(\n ${({ theme }: StyledMentionFinderPopupProps) => theme['text-rgb']},\n 0.15\n )\n transparent;\n scrollbar-width: thin;\n }\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,uBAAA,CAAAF,OAAA;AACA,IAAAG,cAAA,GAAAH,OAAA;AAA4E,SAAAI,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;AAGrE,MAAMW,mBAAmB,GAAAC,OAAA,CAAAD,mBAAA,GAAGE,yBAAM,CAACC,GAAG;AAC7C;AACA,CAAC;AAIM,MAAMC,8BAA8B,GAAAH,OAAA,CAAAG,8BAAA,GAAG,IAAAF,yBAAM,EAACG,aAAM,CAACF,GAAG,CAAgC;AAC/F,wBAAwB,CAAC;EAAEG;AAAqC,CAAC,KAAKA,KAAK,CAAC,KAAK,CAAC;AAClF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAM,CAAC;EAAEC;AAAgB,CAAC,KAAK;EACvB,QAAQA,eAAe;IACnB,KAAKC,0CAA2B,CAACC,MAAM;MACnC,OAAO,IAAAC,qBAAG;AAC1B;AACA,iBAAiB;IACL,KAAKF,0CAA2B,CAACG,GAAG;MAChC,OAAO,IAAAD,qBAAG;AAC1B;AACA,iBAAiB;IACL;MACI,OAAOE,SAAS;EACxB;AACJ,CAAC;AACL;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,cAAc,CAAC;EAAEN;AAAqC,CAAC,KAAKA,KAAK,CAAC,UAAU,CAAC;AAC7E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,kBAAkB,CAAC;EAAEA;AAAqC,CAAC,KAAKA,KAAK,CAAC,UAAU,CAAC;AACjF;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}
1
+ {"version":3,"file":"MentionFinder.styles.js","names":["_react","require","_styledComponents","_interopRequireWildcard","_mentionFinder","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","StyledMentionFinder","exports","styled","div","StyledMotionMentionFinderPopup","motion","theme","$popupAlignment","MentionFinderPopupAlignment","Bottom","css","Top","undefined"],"sources":["../../../../src/components/mention-finder/MentionFinder.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport { MentionFinderPopupAlignment } from '../../constants/mentionFinder';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\nexport const StyledMentionFinder = styled.div`\n position: relative;\n`;\n\ntype StyledMentionFinderPopupProps = WithTheme<{ $popupAlignment: MentionFinderPopupAlignment }>;\n\nexport const StyledMotionMentionFinderPopup = styled(motion.div)<StyledMentionFinderPopupProps>`\n background-color: ${({ theme }: StyledMentionFinderPopupProps) => theme['100']};\n border: 1px solid rgba(0, 0, 0, 0.1);\n border-radius: 3px;\n box-shadow: 1px 3px 8px rgba(0, 0, 0, 0.1);\n left: 0;\n max-height: 275px;\n overflow-y: scroll;\n position: absolute;\n width: 100%;\n\n ${({ $popupAlignment }) => {\n switch ($popupAlignment) {\n case MentionFinderPopupAlignment.Bottom:\n return css`\n top: 0;\n `;\n case MentionFinderPopupAlignment.Top:\n return css`\n bottom: 0;\n `;\n default:\n return undefined;\n }\n }}\n\n // Styles for custom scrollbar\n &::-webkit-scrollbar {\n width: 5px;\n }\n\n &::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n &::-webkit-scrollbar-button {\n background-color: transparent;\n height: 5px;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: rgba(\n ${({ theme }: StyledMentionFinderPopupProps) => theme['text-rgb']},\n 0.15\n );\n border-radius: 20px;\n }\n\n // Scrollbar styles for Firefox. The above styles are not supported in Firefox, these styles are\n // only supported in Firefox:\n * {\n scrollbar-color: rgba(\n ${({ theme }: StyledMentionFinderPopupProps) => theme['text-rgb']},\n 0.15\n )\n transparent;\n scrollbar-width: thin;\n }\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,uBAAA,CAAAF,OAAA;AACA,IAAAG,cAAA,GAAAH,OAAA;AAA4E,SAAAI,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;AAGrE,MAAMW,mBAAmB,GAAAC,OAAA,CAAAD,mBAAA,GAAGE,yBAAM,CAACC,GAAG;AAC7C;AACA,CAAC;AAIM,MAAMC,8BAA8B,GAAAH,OAAA,CAAAG,8BAAA,GAAG,IAAAF,yBAAM,EAACG,aAAM,CAACF,GAAG,CAAgC;AAC/F,wBAAwB,CAAC;EAAEG;AAAqC,CAAC,KAAKA,KAAK,CAAC,KAAK,CAAC;AAClF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAM,CAAC;EAAEC;AAAgB,CAAC,KAAK;EACvB,QAAQA,eAAe;IACnB,KAAKC,0CAA2B,CAACC,MAAM;MACnC,OAAO,IAAAC,qBAAG;AAC1B;AACA,iBAAiB;IACL,KAAKF,0CAA2B,CAACG,GAAG;MAChC,OAAO,IAAAD,qBAAG;AAC1B;AACA,iBAAiB;IACL;MACI,OAAOE,SAAS;EACxB;AACJ,CAAC;AACL;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,cAAc,CAAC;EAAEN;AAAqC,CAAC,KAAKA,KAAK,CAAC,UAAU,CAAC;AAC7E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,kBAAkB,CAAC;EAAEA;AAAqC,CAAC,KAAKA,KAAK,CAAC,UAAU,CAAC;AACjF;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}
@@ -20,12 +20,6 @@ const StyledMentionFinderItem = exports.StyledMentionFinderItem = _styledCompone
20
20
  }) => theme['text-rgb']}, 0.15);
21
21
  }
22
22
 
23
- &:nth-child(even) {
24
- background-color: ${({
25
- theme
26
- }) => theme['101']};
27
- }
28
-
29
23
  ${({
30
24
  $isActive,
31
25
  theme
@@ -1 +1 @@
1
- {"version":3,"file":"MentionFinderItem.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","StyledMentionFinderItem","exports","styled","div","theme","$isActive","css","StyledMentionFinderItemImage","img","$shouldShowRoundImage","StyledMentionFinderItemContent","text","StyledMentionFinderItemContentName","StyledMentionFinderItemContentInfo"],"sources":["../../../../../src/components/mention-finder/mention-finder-item/MentionFinderItem.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledMentionFinderItemProps = WithTheme<{ $isActive: boolean }>;\n\nexport const StyledMentionFinderItem = styled.div<StyledMentionFinderItemProps>`\n align-items: center;\n cursor: pointer;\n display: flex;\n padding: 10px 8px;\n\n &:not(:last-child) {\n border-bottom: 1px solid\n rgba(${({ theme }: StyledMentionFinderItemProps) => theme['text-rgb']}, 0.15);\n }\n\n &:nth-child(even) {\n background-color: ${({ theme }: StyledMentionFinderItemProps) => theme['101']};\n }\n\n ${({ $isActive, theme }) =>\n $isActive &&\n css`\n background-color: ${theme['102']} !important;\n `}\n`;\n\ntype StyledMentionFinderItemImageProps = WithTheme<{\n $shouldShowRoundImage?: boolean;\n}>;\n\nexport const StyledMentionFinderItemImage = styled.img<StyledMentionFinderItemImageProps>`\n background-color: rgba(\n ${({ theme }: StyledMentionFinderItemImageProps) => theme['text-rgb']},\n 0.1\n );\n border-radius: ${({ $shouldShowRoundImage }) => ($shouldShowRoundImage ? '50%' : 'initial')};\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledMentionFinderItemImageProps) => theme['009-rgb']}, 0.08) inset;\n flex: 0 0 auto;\n height: 40px;\n overflow: hidden;\n transition: border-radius 0.3s ease;\n width: 40px;\n`;\n\ntype StyledMentionFinderItemContentProps = WithTheme<unknown>;\n\nexport const StyledMentionFinderItemContent = styled.div`\n color: ${({ theme }: StyledMentionFinderItemContentProps) => theme.text};\n display: flex;\n flex: 1 1 auto;\n flex-direction: column;\n justify-content: center;\n line-height: normal;\n margin-left: 10px;\n min-width: 0;\n`;\n\nexport const StyledMentionFinderItemContentName = styled.div``;\n\nexport const StyledMentionFinderItemContentInfo = styled.div`\n font-size: 85%;\n margin-top: 2px;\n opacity: 0.75;\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;AAKzC,MAAMW,uBAAuB,GAAAC,OAAA,CAAAD,uBAAA,GAAGE,yBAAM,CAACC,GAAiC;AAC/E;AACA;AACA;AACA;AACA;AACA;AACA;AACA,mBAAmB,CAAC;EAAEC;AAAoC,CAAC,KAAKA,KAAK,CAAC,UAAU,CAAC;AACjF;AACA;AACA;AACA,4BAA4B,CAAC;EAAEA;AAAoC,CAAC,KAAKA,KAAK,CAAC,KAAK,CAAC;AACrF;AACA;AACA,MAAM,CAAC;EAAEC,SAAS;EAAED;AAAM,CAAC,KACnBC,SAAS,IACT,IAAAC,qBAAG;AACX,gCAAgCF,KAAK,CAAC,KAAK,CAAC;AAC5C,SAAS;AACT,CAAC;AAMM,MAAMG,4BAA4B,GAAAN,OAAA,CAAAM,4BAAA,GAAGL,yBAAM,CAACM,GAAsC;AACzF;AACA,UAAU,CAAC;EAAEJ;AAAyC,CAAC,KAAKA,KAAK,CAAC,UAAU,CAAC;AAC7E;AACA;AACA,qBAAqB,CAAC;EAAEK;AAAsB,CAAC,KAAMA,qBAAqB,GAAG,KAAK,GAAG,SAAU;AAC/F;AACA,eAAe,CAAC;EAAEL;AAAyC,CAAC,KAAKA,KAAK,CAAC,SAAS,CAAC;AACjF;AACA;AACA;AACA;AACA;AACA,CAAC;AAIM,MAAMM,8BAA8B,GAAAT,OAAA,CAAAS,8BAAA,GAAGR,yBAAM,CAACC,GAAG;AACxD,aAAa,CAAC;EAAEC;AAA2C,CAAC,KAAKA,KAAK,CAACO,IAAI;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAEM,MAAMC,kCAAkC,GAAAX,OAAA,CAAAW,kCAAA,GAAGV,yBAAM,CAACC,GAAG,EAAE;AAEvD,MAAMU,kCAAkC,GAAAZ,OAAA,CAAAY,kCAAA,GAAGX,yBAAM,CAACC,GAAG;AAC5D;AACA;AACA;AACA,CAAC","ignoreList":[]}
1
+ {"version":3,"file":"MentionFinderItem.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","StyledMentionFinderItem","exports","styled","div","theme","$isActive","css","StyledMentionFinderItemImage","img","$shouldShowRoundImage","StyledMentionFinderItemContent","text","StyledMentionFinderItemContentName","StyledMentionFinderItemContentInfo"],"sources":["../../../../../src/components/mention-finder/mention-finder-item/MentionFinderItem.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledMentionFinderItemProps = WithTheme<{ $isActive: boolean }>;\n\nexport const StyledMentionFinderItem = styled.div<StyledMentionFinderItemProps>`\n align-items: center;\n cursor: pointer;\n display: flex;\n padding: 10px 8px;\n\n &:not(:last-child) {\n border-bottom: 1px solid\n rgba(${({ theme }: StyledMentionFinderItemProps) => theme['text-rgb']}, 0.15);\n }\n\n ${({ $isActive, theme }) =>\n $isActive &&\n css`\n background-color: ${theme['102']} !important;\n `}\n`;\n\ntype StyledMentionFinderItemImageProps = WithTheme<{\n $shouldShowRoundImage?: boolean;\n}>;\n\nexport const StyledMentionFinderItemImage = styled.img<StyledMentionFinderItemImageProps>`\n background-color: rgba(\n ${({ theme }: StyledMentionFinderItemImageProps) => theme['text-rgb']},\n 0.1\n );\n border-radius: ${({ $shouldShowRoundImage }) => ($shouldShowRoundImage ? '50%' : 'initial')};\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledMentionFinderItemImageProps) => theme['009-rgb']}, 0.08) inset;\n flex: 0 0 auto;\n height: 40px;\n overflow: hidden;\n transition: border-radius 0.3s ease;\n width: 40px;\n`;\n\ntype StyledMentionFinderItemContentProps = WithTheme<unknown>;\n\nexport const StyledMentionFinderItemContent = styled.div`\n color: ${({ theme }: StyledMentionFinderItemContentProps) => theme.text};\n display: flex;\n flex: 1 1 auto;\n flex-direction: column;\n justify-content: center;\n line-height: normal;\n margin-left: 10px;\n min-width: 0;\n`;\n\nexport const StyledMentionFinderItemContentName = styled.div``;\n\nexport const StyledMentionFinderItemContentInfo = styled.div`\n font-size: 85%;\n margin-top: 2px;\n opacity: 0.75;\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;AAKzC,MAAMW,uBAAuB,GAAAC,OAAA,CAAAD,uBAAA,GAAGE,yBAAM,CAACC,GAAiC;AAC/E;AACA;AACA;AACA;AACA;AACA;AACA;AACA,mBAAmB,CAAC;EAAEC;AAAoC,CAAC,KAAKA,KAAK,CAAC,UAAU,CAAC;AACjF;AACA;AACA,MAAM,CAAC;EAAEC,SAAS;EAAED;AAAM,CAAC,KACnBC,SAAS,IACT,IAAAC,qBAAG;AACX,gCAAgCF,KAAK,CAAC,KAAK,CAAC;AAC5C,SAAS;AACT,CAAC;AAMM,MAAMG,4BAA4B,GAAAN,OAAA,CAAAM,4BAAA,GAAGL,yBAAM,CAACM,GAAsC;AACzF;AACA,UAAU,CAAC;EAAEJ;AAAyC,CAAC,KAAKA,KAAK,CAAC,UAAU,CAAC;AAC7E;AACA;AACA,qBAAqB,CAAC;EAAEK;AAAsB,CAAC,KAAMA,qBAAqB,GAAG,KAAK,GAAG,SAAU;AAC/F;AACA,eAAe,CAAC;EAAEL;AAAyC,CAAC,KAAKA,KAAK,CAAC,SAAS,CAAC;AACjF;AACA;AACA;AACA;AACA;AACA,CAAC;AAIM,MAAMM,8BAA8B,GAAAT,OAAA,CAAAS,8BAAA,GAAGR,yBAAM,CAACC,GAAG;AACxD,aAAa,CAAC;EAAEC;AAA2C,CAAC,KAAKA,KAAK,CAACO,IAAI;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAEM,MAAMC,kCAAkC,GAAAX,OAAA,CAAAW,kCAAA,GAAGV,yBAAM,CAACC,GAAG,EAAE;AAEvD,MAAMU,kCAAkC,GAAAZ,OAAA,CAAAY,kCAAA,GAAGX,yBAAM,CAACC,GAAG;AAC5D;AACA;AACA;AACA,CAAC","ignoreList":[]}
@@ -12,7 +12,7 @@ const StyledSearchBox = exports.StyledSearchBox = _styledComponents.default.div`
12
12
  const StyledMotionSearchBoxBody = exports.StyledMotionSearchBoxBody = (0, _styledComponents.default)(_react.motion.div)`
13
13
  background: ${({
14
14
  theme
15
- }) => theme['101']};
15
+ }) => theme['100']};
16
16
  position: absolute;
17
17
  z-index: 4;
18
18
  display: flex;
@@ -1 +1 @@
1
- {"version":3,"file":"SearchBox.styles.js","names":["_react","require","_styledComponents","_interopRequireWildcard","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","StyledSearchBox","exports","styled","div","StyledMotionSearchBoxBody","motion","theme","$width","$height","$browser","css","StyledSearchBoxIcon","StyledSearchBoxLeftWrapper"],"sources":["../../../../src/components/search-box/SearchBox.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport { BrowserName } from '../../types/chayns';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\nexport const StyledSearchBox = styled.div``;\n\ntype StyledMotionSearchBoxBodyProps = WithTheme<{\n $height: number;\n $width: number;\n $browser: BrowserName;\n}>;\n\nexport const StyledMotionSearchBoxBody = styled(motion.div)<StyledMotionSearchBoxBodyProps>`\n background: ${({ theme }: StyledMotionSearchBoxBodyProps) => theme['101']};\n position: absolute;\n z-index: 4;\n display: flex;\n flex-direction: column;\n border: 1px solid rgba(160, 160, 160, 0.3);\n border-bottom-left-radius: 3px;\n border-bottom-right-radius: 3px;\n border-top: none;\n cursor: pointer;\n width: ${({ $width }) => $width}px;\n max-height: 300px;\n overflow-y: ${({ $height }) => ($height <= 300 ? 'hidden' : 'auto')};\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledMotionSearchBoxBodyProps) => theme['009-rgb']}, 0.08) inset;\n\n // Styles for custom scrollbar\n ${({ $browser, theme }: StyledMotionSearchBoxBodyProps) =>\n $browser === 'firefox'\n ? css`\n scrollbar-color: rgba(${theme['text-rgb']}, 0.15) transparent;\n scrollbar-width: thin;\n `\n : css`\n &::-webkit-scrollbar {\n width: 5px;\n }\n\n &::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n &::-webkit-scrollbar-button {\n background-color: transparent;\n height: 5px;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: rgba(${theme['text-rgb']}, 0.15);\n border-radius: 20px;\n }\n `}\n`;\n\nexport const StyledSearchBoxIcon = styled.div`\n cursor: pointer;\n padding: 0 10px;\n`;\n\nexport const StyledSearchBoxLeftWrapper = styled.div`\n display: flex;\n align-items: center;\n gap: 8px;\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,uBAAA,CAAAF,OAAA;AAAgD,SAAAG,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,SAAAF,wBAAAE,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;AAIzC,MAAMW,eAAe,GAAAC,OAAA,CAAAD,eAAA,GAAGE,yBAAM,CAACC,GAAG,EAAE;AAQpC,MAAMC,yBAAyB,GAAAH,OAAA,CAAAG,yBAAA,GAAG,IAAAF,yBAAM,EAACG,aAAM,CAACF,GAAG,CAAiC;AAC3F,kBAAkB,CAAC;EAAEG;AAAsC,CAAC,KAAKA,KAAK,CAAC,KAAK,CAAC;AAC7E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAa,CAAC;EAAEC;AAAO,CAAC,KAAKA,MAAM;AACnC;AACA,kBAAkB,CAAC;EAAEC;AAAQ,CAAC,KAAMA,OAAO,IAAI,GAAG,GAAG,QAAQ,GAAG,MAAO;AACvE;AACA,eAAe,CAAC;EAAEF;AAAsC,CAAC,KAAKA,KAAK,CAAC,SAAS,CAAC;AAC9E;AACA;AACA,MAAM,CAAC;EAAEG,QAAQ;EAAEH;AAAsC,CAAC,KAClDG,QAAQ,KAAK,SAAS,GAChB,IAAAC,qBAAG;AACjB,0CAA0CJ,KAAK,CAAC,UAAU,CAAC;AAC3D;AACA,eAAe,GACD,IAAAI,qBAAG;AACjB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,+CAA+CJ,KAAK,CAAC,UAAU,CAAC;AAChE;AACA;AACA,eAAe;AACf,CAAC;AAEM,MAAMK,mBAAmB,GAAAV,OAAA,CAAAU,mBAAA,GAAGT,yBAAM,CAACC,GAAG;AAC7C;AACA;AACA,CAAC;AAEM,MAAMS,0BAA0B,GAAAX,OAAA,CAAAW,0BAAA,GAAGV,yBAAM,CAACC,GAAG;AACpD;AACA;AACA;AACA,CAAC","ignoreList":[]}
1
+ {"version":3,"file":"SearchBox.styles.js","names":["_react","require","_styledComponents","_interopRequireWildcard","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","StyledSearchBox","exports","styled","div","StyledMotionSearchBoxBody","motion","theme","$width","$height","$browser","css","StyledSearchBoxIcon","StyledSearchBoxLeftWrapper"],"sources":["../../../../src/components/search-box/SearchBox.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport { BrowserName } from '../../types/chayns';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\nexport const StyledSearchBox = styled.div``;\n\ntype StyledMotionSearchBoxBodyProps = WithTheme<{\n $height: number;\n $width: number;\n $browser: BrowserName;\n}>;\n\nexport const StyledMotionSearchBoxBody = styled(motion.div)<StyledMotionSearchBoxBodyProps>`\n background: ${({ theme }: StyledMotionSearchBoxBodyProps) => theme['100']};\n position: absolute;\n z-index: 4;\n display: flex;\n flex-direction: column;\n border: 1px solid rgba(160, 160, 160, 0.3);\n border-bottom-left-radius: 3px;\n border-bottom-right-radius: 3px;\n border-top: none;\n cursor: pointer;\n width: ${({ $width }) => $width}px;\n max-height: 300px;\n overflow-y: ${({ $height }) => ($height <= 300 ? 'hidden' : 'auto')};\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledMotionSearchBoxBodyProps) => theme['009-rgb']}, 0.08) inset;\n\n // Styles for custom scrollbar\n ${({ $browser, theme }: StyledMotionSearchBoxBodyProps) =>\n $browser === 'firefox'\n ? css`\n scrollbar-color: rgba(${theme['text-rgb']}, 0.15) transparent;\n scrollbar-width: thin;\n `\n : css`\n &::-webkit-scrollbar {\n width: 5px;\n }\n\n &::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n &::-webkit-scrollbar-button {\n background-color: transparent;\n height: 5px;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: rgba(${theme['text-rgb']}, 0.15);\n border-radius: 20px;\n }\n `}\n`;\n\nexport const StyledSearchBoxIcon = styled.div`\n cursor: pointer;\n padding: 0 10px;\n`;\n\nexport const StyledSearchBoxLeftWrapper = styled.div`\n display: flex;\n align-items: center;\n gap: 8px;\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,uBAAA,CAAAF,OAAA;AAAgD,SAAAG,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,SAAAF,wBAAAE,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;AAIzC,MAAMW,eAAe,GAAAC,OAAA,CAAAD,eAAA,GAAGE,yBAAM,CAACC,GAAG,EAAE;AAQpC,MAAMC,yBAAyB,GAAAH,OAAA,CAAAG,yBAAA,GAAG,IAAAF,yBAAM,EAACG,aAAM,CAACF,GAAG,CAAiC;AAC3F,kBAAkB,CAAC;EAAEG;AAAsC,CAAC,KAAKA,KAAK,CAAC,KAAK,CAAC;AAC7E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAa,CAAC;EAAEC;AAAO,CAAC,KAAKA,MAAM;AACnC;AACA,kBAAkB,CAAC;EAAEC;AAAQ,CAAC,KAAMA,OAAO,IAAI,GAAG,GAAG,QAAQ,GAAG,MAAO;AACvE;AACA,eAAe,CAAC;EAAEF;AAAsC,CAAC,KAAKA,KAAK,CAAC,SAAS,CAAC;AAC9E;AACA;AACA,MAAM,CAAC;EAAEG,QAAQ;EAAEH;AAAsC,CAAC,KAClDG,QAAQ,KAAK,SAAS,GAChB,IAAAC,qBAAG;AACjB,0CAA0CJ,KAAK,CAAC,UAAU,CAAC;AAC3D;AACA,eAAe,GACD,IAAAI,qBAAG;AACjB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,+CAA+CJ,KAAK,CAAC,UAAU,CAAC;AAChE;AACA;AACA,eAAe;AACf,CAAC;AAEM,MAAMK,mBAAmB,GAAAV,OAAA,CAAAU,mBAAA,GAAGT,yBAAM,CAACC,GAAG;AAC7C;AACA;AACA,CAAC;AAEM,MAAMS,0BAA0B,GAAAX,OAAA,CAAAW,0BAAA,GAAGV,yBAAM,CAACC,GAAG;AACpD;AACA;AACA;AACA,CAAC","ignoreList":[]}
@@ -79,7 +79,7 @@ const SearchBoxBody = /*#__PURE__*/(0, _react.forwardRef)(({
79
79
  size: 0,
80
80
  onSelect: onGroupSelect,
81
81
  selectedItemIds: selectedGroups
82
- }), /*#__PURE__*/_react.default.createElement(_SearchBoxBody.StyledSearchBoxBodyHeadGroupName, null, currentGroupName)), /*#__PURE__*/_react.default.createElement(_SearchBoxBody.StyledSearchBoxBodyContent, {
82
+ }), /*#__PURE__*/_react.default.createElement(_SearchBoxBody.StyledSearchBoxBodyHeadGroupName, null, currentGroupName.replace('_', ''))), /*#__PURE__*/_react.default.createElement(_SearchBoxBody.StyledSearchBoxBodyContent, {
83
83
  $height: height,
84
84
  $headHeight: headHeight,
85
85
  key: "content",
@@ -1 +1 @@
1
- {"version":3,"file":"SearchBoxBody.js","names":["_react","_interopRequireWildcard","require","_useElementSize","_uuid","_searchBox","_FilterButtons","_interopRequireDefault","_SearchBoxBody","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","SearchBoxBody","forwardRef","filterButtons","coordinates","selectedGroups","width","browser","height","children","onGroupSelect","shouldHideFilterButtons","ref","hasScrolled","setHasScrolled","useState","currentGroupName","setCurrentGroupName","headRef","useRef","headSize","useElementSize","uuid","useUuid","headHeight","useMemo","useEffect","element","document","getElementById","length","getCurrentGroupName","handleScroll","useCallback","event","scrollTop","target","createElement","StyledMotionSearchBoxBody","$width","style","left","x","top","y","initial","opacity","exit","animate","transition","duration","type","StyledSearchBoxBodyHead","$hasScrolled","$hasGroupName","items","size","onSelect","selectedItemIds","StyledSearchBoxBodyHeadGroupName","StyledSearchBoxBodyContent","$height","$headHeight","key","id","$browser","tabIndex","onScroll","displayName","_default","exports"],"sources":["../../../../../src/components/search-box/search-box-body/SearchBoxBody.tsx"],"sourcesContent":["import React, {\n forwardRef,\n UIEvent,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n type ReactNode,\n} from 'react';\nimport { useElementSize } from '../../../hooks/useElementSize';\nimport { useUuid } from '../../../hooks/uuid';\nimport { BrowserName } from '../../../types/chayns';\nimport type { IFilterButtonItem } from '../../../types/filterButtons';\nimport { getCurrentGroupName } from '../../../utils/searchBox';\nimport FilterButtons from '../../filter-buttons/FilterButtons';\nimport {\n StyledMotionSearchBoxBody,\n StyledSearchBoxBodyContent,\n StyledSearchBoxBodyHead,\n StyledSearchBoxBodyHeadGroupName,\n} from './SearchBoxBody.styles';\n\nexport type SearchBoxBodyProps = {\n children: ReactNode;\n filterButtons?: IFilterButtonItem[];\n selectedGroups?: string[];\n height: number;\n width: number;\n browser: BrowserName;\n onGroupSelect?: (keys: string[]) => void;\n coordinates: { x: number; y: number };\n shouldHideFilterButtons?: boolean;\n};\n\nconst SearchBoxBody = forwardRef<HTMLDivElement, SearchBoxBodyProps>(\n (\n {\n filterButtons,\n coordinates,\n selectedGroups,\n width,\n browser,\n height,\n children,\n onGroupSelect,\n shouldHideFilterButtons,\n },\n ref,\n ) => {\n const [hasScrolled, setHasScrolled] = useState(false);\n const [currentGroupName, setCurrentGroupName] = useState('');\n\n const headRef = useRef<HTMLDivElement>(null);\n\n const headSize = useElementSize(headRef);\n\n const uuid = useUuid();\n\n const headHeight = useMemo(\n () => (headSize?.height ? headSize.height + 15 : 0),\n [headSize?.height],\n );\n\n useEffect(() => {\n const element = document.getElementById(`searchbox-content__${uuid}`);\n\n if (\n element &&\n ((selectedGroups?.length === 1 && selectedGroups[0] === 'all') ||\n selectedGroups?.length !== 1)\n ) {\n setCurrentGroupName(getCurrentGroupName(element));\n } else {\n setCurrentGroupName('');\n }\n }, [uuid, children, selectedGroups]);\n\n const handleScroll = useCallback(\n (event: UIEvent) => {\n const { scrollTop } = event.target as HTMLDivElement;\n\n setHasScrolled(scrollTop > 1);\n\n if (\n (selectedGroups?.length === 1 && selectedGroups[0] === 'all') ||\n selectedGroups?.length !== 1\n ) {\n setCurrentGroupName(getCurrentGroupName(event.target as HTMLDivElement));\n }\n },\n [selectedGroups],\n );\n\n return useMemo(\n () => (\n <StyledMotionSearchBoxBody\n ref={ref}\n $width={width}\n style={{ left: coordinates.x, top: coordinates.y }}\n initial={{ height: 0, opacity: 0 }}\n exit={{ height: 0, opacity: 0 }}\n animate={{ height: 'fit-content', opacity: 1 }}\n transition={{\n duration: 0.2,\n type: 'tween',\n }}\n >\n {filterButtons && filterButtons?.length > 1 && (\n <StyledSearchBoxBodyHead\n ref={headRef}\n $hasScrolled={hasScrolled}\n $hasGroupName={!!currentGroupName}\n >\n {!shouldHideFilterButtons && (\n <FilterButtons\n items={filterButtons}\n size={0}\n onSelect={onGroupSelect}\n selectedItemIds={selectedGroups}\n />\n )}\n <StyledSearchBoxBodyHeadGroupName>\n {currentGroupName}\n </StyledSearchBoxBodyHeadGroupName>\n </StyledSearchBoxBodyHead>\n )}\n <StyledSearchBoxBodyContent\n $height={height}\n $headHeight={headHeight}\n key=\"content\"\n id={`searchbox-content__${uuid}`}\n $browser={browser}\n tabIndex={0}\n onScroll={handleScroll}\n >\n {children}\n </StyledSearchBoxBodyContent>\n </StyledMotionSearchBoxBody>\n ),\n [\n browser,\n children,\n coordinates.x,\n coordinates.y,\n currentGroupName,\n filterButtons,\n handleScroll,\n hasScrolled,\n headHeight,\n height,\n onGroupSelect,\n ref,\n selectedGroups,\n shouldHideFilterButtons,\n uuid,\n width,\n ],\n );\n },\n);\n\nSearchBoxBody.displayName = 'SearchBoxBody';\n\nexport default SearchBoxBody;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"SearchBoxBody.js","names":["_react","_interopRequireWildcard","require","_useElementSize","_uuid","_searchBox","_FilterButtons","_interopRequireDefault","_SearchBoxBody","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","SearchBoxBody","forwardRef","filterButtons","coordinates","selectedGroups","width","browser","height","children","onGroupSelect","shouldHideFilterButtons","ref","hasScrolled","setHasScrolled","useState","currentGroupName","setCurrentGroupName","headRef","useRef","headSize","useElementSize","uuid","useUuid","headHeight","useMemo","useEffect","element","document","getElementById","length","getCurrentGroupName","handleScroll","useCallback","event","scrollTop","target","createElement","StyledMotionSearchBoxBody","$width","style","left","x","top","y","initial","opacity","exit","animate","transition","duration","type","StyledSearchBoxBodyHead","$hasScrolled","$hasGroupName","items","size","onSelect","selectedItemIds","StyledSearchBoxBodyHeadGroupName","replace","StyledSearchBoxBodyContent","$height","$headHeight","key","id","$browser","tabIndex","onScroll","displayName","_default","exports"],"sources":["../../../../../src/components/search-box/search-box-body/SearchBoxBody.tsx"],"sourcesContent":["import React, {\n forwardRef,\n UIEvent,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n type ReactNode,\n} from 'react';\nimport { useElementSize } from '../../../hooks/useElementSize';\nimport { useUuid } from '../../../hooks/uuid';\nimport { BrowserName } from '../../../types/chayns';\nimport type { IFilterButtonItem } from '../../../types/filterButtons';\nimport { getCurrentGroupName } from '../../../utils/searchBox';\nimport FilterButtons from '../../filter-buttons/FilterButtons';\nimport {\n StyledMotionSearchBoxBody,\n StyledSearchBoxBodyContent,\n StyledSearchBoxBodyHead,\n StyledSearchBoxBodyHeadGroupName,\n} from './SearchBoxBody.styles';\n\nexport type SearchBoxBodyProps = {\n children: ReactNode;\n filterButtons?: IFilterButtonItem[];\n selectedGroups?: string[];\n height: number;\n width: number;\n browser: BrowserName;\n onGroupSelect?: (keys: string[]) => void;\n coordinates: { x: number; y: number };\n shouldHideFilterButtons?: boolean;\n};\n\nconst SearchBoxBody = forwardRef<HTMLDivElement, SearchBoxBodyProps>(\n (\n {\n filterButtons,\n coordinates,\n selectedGroups,\n width,\n browser,\n height,\n children,\n onGroupSelect,\n shouldHideFilterButtons,\n },\n ref,\n ) => {\n const [hasScrolled, setHasScrolled] = useState(false);\n const [currentGroupName, setCurrentGroupName] = useState('');\n\n const headRef = useRef<HTMLDivElement>(null);\n\n const headSize = useElementSize(headRef);\n\n const uuid = useUuid();\n\n const headHeight = useMemo(\n () => (headSize?.height ? headSize.height + 15 : 0),\n [headSize?.height],\n );\n\n useEffect(() => {\n const element = document.getElementById(`searchbox-content__${uuid}`);\n\n if (\n element &&\n ((selectedGroups?.length === 1 && selectedGroups[0] === 'all') ||\n selectedGroups?.length !== 1)\n ) {\n setCurrentGroupName(getCurrentGroupName(element));\n } else {\n setCurrentGroupName('');\n }\n }, [uuid, children, selectedGroups]);\n\n const handleScroll = useCallback(\n (event: UIEvent) => {\n const { scrollTop } = event.target as HTMLDivElement;\n\n setHasScrolled(scrollTop > 1);\n\n if (\n (selectedGroups?.length === 1 && selectedGroups[0] === 'all') ||\n selectedGroups?.length !== 1\n ) {\n setCurrentGroupName(getCurrentGroupName(event.target as HTMLDivElement));\n }\n },\n [selectedGroups],\n );\n\n return useMemo(\n () => (\n <StyledMotionSearchBoxBody\n ref={ref}\n $width={width}\n style={{ left: coordinates.x, top: coordinates.y }}\n initial={{ height: 0, opacity: 0 }}\n exit={{ height: 0, opacity: 0 }}\n animate={{ height: 'fit-content', opacity: 1 }}\n transition={{\n duration: 0.2,\n type: 'tween',\n }}\n >\n {filterButtons && filterButtons?.length > 1 && (\n <StyledSearchBoxBodyHead\n ref={headRef}\n $hasScrolled={hasScrolled}\n $hasGroupName={!!currentGroupName}\n >\n {!shouldHideFilterButtons && (\n <FilterButtons\n items={filterButtons}\n size={0}\n onSelect={onGroupSelect}\n selectedItemIds={selectedGroups}\n />\n )}\n <StyledSearchBoxBodyHeadGroupName>\n {currentGroupName.replace('_', '')}\n </StyledSearchBoxBodyHeadGroupName>\n </StyledSearchBoxBodyHead>\n )}\n <StyledSearchBoxBodyContent\n $height={height}\n $headHeight={headHeight}\n key=\"content\"\n id={`searchbox-content__${uuid}`}\n $browser={browser}\n tabIndex={0}\n onScroll={handleScroll}\n >\n {children}\n </StyledSearchBoxBodyContent>\n </StyledMotionSearchBoxBody>\n ),\n [\n browser,\n children,\n coordinates.x,\n coordinates.y,\n currentGroupName,\n filterButtons,\n handleScroll,\n hasScrolled,\n headHeight,\n height,\n onGroupSelect,\n ref,\n selectedGroups,\n shouldHideFilterButtons,\n uuid,\n width,\n ],\n );\n },\n);\n\nSearchBoxBody.displayName = 'SearchBoxBody';\n\nexport default SearchBoxBody;\n"],"mappings":"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","ignoreList":[]}
@@ -11,7 +11,7 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
11
11
  const StyledMotionSearchBoxBody = exports.StyledMotionSearchBoxBody = (0, _styledComponents.default)(_react.motion.div)`
12
12
  background: ${({
13
13
  theme
14
- }) => theme['101']};
14
+ }) => theme['100']};
15
15
  position: absolute;
16
16
  z-index: 4;
17
17
  display: flex;
@@ -1 +1 @@
1
- {"version":3,"file":"SearchBoxBody.styles.js","names":["_react","require","_styledComponents","_interopRequireWildcard","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","StyledMotionSearchBoxBody","exports","styled","motion","div","theme","$width","StyledSearchBoxBodyHead","$hasGroupName","css","$hasScrolled","StyledSearchBoxBodyHeadGroupName","text","StyledSearchBoxBodyContent","$headHeight","$height","$browser"],"sources":["../../../../../src/components/search-box/search-box-body/SearchBoxBody.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport { BrowserName } from '../../../types/chayns';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledMotionSearchBoxBodyProps = WithTheme<{\n $width: number;\n}>;\n\nexport const StyledMotionSearchBoxBody = styled(motion.div)<StyledMotionSearchBoxBodyProps>`\n background: ${({ theme }: StyledMotionSearchBoxBodyProps) => theme['101']};\n position: absolute;\n z-index: 4;\n display: flex;\n flex-direction: column;\n border: 1px solid rgba(160, 160, 160, 0.3);\n border-bottom-left-radius: 3px;\n border-bottom-right-radius: 3px;\n border-top: none;\n width: ${({ $width }) => $width - 2}px;\n max-height: 300px;\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledMotionSearchBoxBodyProps) => theme['009-rgb']}, 0.08) inset;\n`;\n\nexport const StyledSearchBoxBodyHead = styled.div<StyledSearchBoxHeadProps>`\n padding: 10px 10px 5px;\n display: flex;\n flex-direction: column;\n\n ${({ $hasGroupName }) =>\n $hasGroupName &&\n css`\n gap: 15px;\n `}\n\n ${({ $hasScrolled }) =>\n $hasScrolled &&\n css`\n box-shadow: 0 1px 4px #0000001a;\n `}\n`;\n\ntype StyledSearchBoxHeadProps = WithTheme<{ $hasScrolled: boolean; $hasGroupName: boolean }>;\n\ntype StyledSearchBoxBodyHeadGroupNameNameProps = WithTheme<unknown>;\n\nexport const StyledSearchBoxBodyHeadGroupName = styled.div<StyledSearchBoxBodyHeadGroupNameNameProps>`\n color: ${({ theme }: StyledSearchBoxBodyHeadGroupNameNameProps) => theme.text};\n font-weight: bold;\n`;\n\ntype StyledSearchBoxBodyContentProps = WithTheme<{\n $height: number;\n $headHeight: number;\n $browser: BrowserName;\n}>;\n\nexport const StyledSearchBoxBodyContent = styled.div<StyledSearchBoxBodyContentProps>`\n display: flex;\n flex-direction: column;\n cursor: pointer;\n width: 100%;\n max-height: ${({ $headHeight }) => 300 - $headHeight}px;\n overflow-y: ${({ $height, $headHeight }) => ($height + $headHeight <= 300 ? 'hidden' : 'auto')};\n\n // Styles for custom scrollbar\n ${({ $browser, theme }: StyledSearchBoxBodyContentProps) =>\n $browser === 'firefox'\n ? css`\n scrollbar-color: rgba(${theme['text-rgb']}, 0.15) transparent;\n scrollbar-width: thin;\n `\n : css`\n &::-webkit-scrollbar {\n width: 5px;\n }\n\n &::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n &::-webkit-scrollbar-button {\n background-color: transparent;\n height: 5px;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: rgba(${theme['text-rgb']}, 0.15);\n border-radius: 20px;\n }\n `}\n`;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"SearchBoxBody.styles.js","names":["_react","require","_styledComponents","_interopRequireWildcard","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","StyledMotionSearchBoxBody","exports","styled","motion","div","theme","$width","StyledSearchBoxBodyHead","$hasGroupName","css","$hasScrolled","StyledSearchBoxBodyHeadGroupName","text","StyledSearchBoxBodyContent","$headHeight","$height","$browser"],"sources":["../../../../../src/components/search-box/search-box-body/SearchBoxBody.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport { BrowserName } from '../../../types/chayns';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledMotionSearchBoxBodyProps = WithTheme<{\n $width: number;\n}>;\n\nexport const StyledMotionSearchBoxBody = styled(motion.div)<StyledMotionSearchBoxBodyProps>`\n background: ${({ theme }: StyledMotionSearchBoxBodyProps) => theme['100']};\n position: absolute;\n z-index: 4;\n display: flex;\n flex-direction: column;\n border: 1px solid rgba(160, 160, 160, 0.3);\n border-bottom-left-radius: 3px;\n border-bottom-right-radius: 3px;\n border-top: none;\n width: ${({ $width }) => $width - 2}px;\n max-height: 300px;\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledMotionSearchBoxBodyProps) => theme['009-rgb']}, 0.08) inset;\n`;\n\nexport const StyledSearchBoxBodyHead = styled.div<StyledSearchBoxHeadProps>`\n padding: 10px 10px 5px;\n display: flex;\n flex-direction: column;\n\n ${({ $hasGroupName }) =>\n $hasGroupName &&\n css`\n gap: 15px;\n `}\n\n ${({ $hasScrolled }) =>\n $hasScrolled &&\n css`\n box-shadow: 0 1px 4px #0000001a;\n `}\n`;\n\ntype StyledSearchBoxHeadProps = WithTheme<{ $hasScrolled: boolean; $hasGroupName: boolean }>;\n\ntype StyledSearchBoxBodyHeadGroupNameNameProps = WithTheme<unknown>;\n\nexport const StyledSearchBoxBodyHeadGroupName = styled.div<StyledSearchBoxBodyHeadGroupNameNameProps>`\n color: ${({ theme }: StyledSearchBoxBodyHeadGroupNameNameProps) => theme.text};\n font-weight: bold;\n`;\n\ntype StyledSearchBoxBodyContentProps = WithTheme<{\n $height: number;\n $headHeight: number;\n $browser: BrowserName;\n}>;\n\nexport const StyledSearchBoxBodyContent = styled.div<StyledSearchBoxBodyContentProps>`\n display: flex;\n flex-direction: column;\n cursor: pointer;\n width: 100%;\n max-height: ${({ $headHeight }) => 300 - $headHeight}px;\n overflow-y: ${({ $height, $headHeight }) => ($height + $headHeight <= 300 ? 'hidden' : 'auto')};\n\n // Styles for custom scrollbar\n ${({ $browser, theme }: StyledSearchBoxBodyContentProps) =>\n $browser === 'firefox'\n ? css`\n scrollbar-color: rgba(${theme['text-rgb']}, 0.15) transparent;\n scrollbar-width: thin;\n `\n : css`\n &::-webkit-scrollbar {\n width: 5px;\n }\n\n &::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n &::-webkit-scrollbar-button {\n background-color: transparent;\n height: 5px;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: rgba(${theme['text-rgb']}, 0.15);\n border-radius: 20px;\n }\n `}\n`;\n"],"mappings":"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","ignoreList":[]}
@@ -1,6 +1,6 @@
1
1
  function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
2
2
  import { AnimatePresence, LayoutGroup } from 'motion/react';
3
- import { useEffect, useMemo, useRef, useState } from 'react';
3
+ import React, { useEffect, useMemo, useRef, useState } from 'react';
4
4
  import { useTheme } from 'styled-components';
5
5
  import { useElementSize } from '../../../hooks/useElementSize';
6
6
  import { getAccordionHeadHeight, getElementClickEvent } from '../../../utils/accordion';
@@ -1 +1 @@
1
- {"version":3,"file":"AccordionHead.js","names":["AnimatePresence","LayoutGroup","useEffect","useMemo","useRef","useState","useTheme","useElementSize","getAccordionHeadHeight","getElementClickEvent","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","isSearchActive","setIsSearchActive","theme","titleElementWrapperRef","titleWrapperRef","internalSearchValue","setInternalSearchValue","handleOnSearchChance","event","target","value","titleElementChildrenSize","shouldUseChildElement","shouldPreventRightElementClick","width","current","clientWidth","hasSearch","fontSize","iconElement","React","createElement","icons","internalIcon","accordionIcon","toString","internalIconStyle","iconStyle","className","$icon","accordionHeadHeight","height","animate","initial","key","rotate","undefined","opacity","ref","$isWrapped","Provider","shouldChangeColor","_extends","onChange","scale","exit","$isOpen","$color","$hasSearch","transition","duration","layout","$isSearchActive","onActiveChange","isActive","placeholder","size","Small","displayName"],"sources":["../../../../../src/components/accordion/accordion-head/AccordionHead.tsx"],"sourcesContent":["import { AnimatePresence, LayoutGroup } from 'motion/react';\nimport {\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, getElementClickEvent } 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 [isSearchActive, setIsSearchActive] = useState(false);\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\n const shouldPreventRightElementClick = useMemo(\n () => getElementClickEvent(rightElement),\n [rightElement],\n );\n\n useEffect(() => {\n if (typeof onTitleInputChange === 'function') {\n setHeadHeight({ closed: 50, open: 50 });\n } else {\n setHeadHeight(\n getAccordionHeadHeight({\n isWrapped,\n title,\n width: (titleWrapperRef.current?.clientWidth ?? 0) - 10,\n hasSearch: typeof onSearchChange === 'function',\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, onSearchChange, onTitleInputChange, theme.fontSize, title]);\n\n const iconElement = useMemo(() => {\n if (icon || isFixed) {\n return (\n <Icon\n icons={[isFixed ? 'fa fa-horizontal-rule' : (icon ?? 'fa fa-chevron-right')]}\n />\n );\n }\n\n let internalIcon = 'f105';\n\n if (\n theme?.accordionIcon &&\n theme.accordionIcon !== 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 return (\n <StyledMotionAccordionHead\n animate={{ height: accordionHeadHeight }}\n className=\"beta-chayns-accordion-head\"\n initial={false}\n key={`accordionHead--${uuid}`}\n >\n <StyledMotionIconWrapper\n animate={{ rotate: (isOpen || isFixed) && shouldRotateIcon ? 90 : 0 }}\n initial={false}\n onClick={!isFixed ? onClick : undefined}\n key={`accordionHeadIcon--${uuid}`}\n >\n {iconElement}\n </StyledMotionIconWrapper>\n <StyledMotionContentWrapper\n animate={{ opacity: isTitleGreyed ? 0.5 : 1 }}\n initial={false}\n onClick={!isFixed ? onClick : undefined}\n ref={titleWrapperRef}\n $isWrapped={isWrapped}\n key={`accordionHeadContentWrapper--${uuid}`}\n >\n {typeof onTitleInputChange === 'function' ? (\n // eslint-disable-next-line react/jsx-no-constructed-context-values\n <AreaContext.Provider value={{ shouldChangeColor: true }}>\n <Input {...titleInputProps} value={title} onChange={onTitleInputChange} />\n </AreaContext.Provider>\n ) : (\n <LayoutGroup key={`accordionHeadLayoutGroup--${uuid}`}>\n <StyledMotionTitleWrapper key={`accordionHeadTitleWrapperWrapper--${uuid}`}>\n <AnimatePresence\n initial={false}\n key={`accordionHeadTitleWrapper--${uuid}`}\n >\n <StyledMotionTitle\n animate={{ scale: 1 }}\n initial={{ scale: isOpen && !isWrapped ? 1 / 1.3 : 1.3 }}\n exit={{ opacity: 0 }}\n $isOpen={isOpen}\n $isWrapped={isWrapped}\n $color={titleColor}\n $hasSearch={typeof onSearchChange === 'function'}\n transition={{\n opacity: {\n duration: 0,\n },\n }}\n key={\n isOpen && !isWrapped\n ? `accordionHeadTitleBig--${uuid}`\n : `accordionHeadTitle--${uuid}`\n }\n >\n {title}\n </StyledMotionTitle>\n </AnimatePresence>\n </StyledMotionTitleWrapper>\n {titleElement && (\n <StyledMotionTitleElementWrapper\n layout\n key={`accordionTitleElement--${uuid}`}\n ref={titleElementWrapperRef}\n >\n {titleElement}\n </StyledMotionTitleElementWrapper>\n )}\n </LayoutGroup>\n )}\n </StyledMotionContentWrapper>\n {(typeof onSearchChange === 'function' || rightElement) && (\n <StyledRightWrapper $isSearchActive={isSearchActive}>\n <AnimatePresence initial={false} key={`accordionRightWrapper--${uuid}`}>\n {typeof onSearchChange === 'function' && isOpen && (\n <StyledMotionSearchWrapper\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n key={`searchWrapper--${uuid}`}\n >\n <SearchInput\n onChange={handleOnSearchChance}\n onActiveChange={(isActive) => setIsSearchActive(isActive)}\n placeholder={searchPlaceholder}\n size={InputSize.Small}\n value={internalSearchValue}\n />\n </StyledMotionSearchWrapper>\n )}\n {rightElement && (\n <StyledMotionRightElementWrapper\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n key={`rightElementWrapper--${uuid}`}\n onClick={\n !isFixed && !shouldPreventRightElementClick\n ? onClick\n : undefined\n }\n >\n {rightElement}\n </StyledMotionRightElementWrapper>\n )}\n </AnimatePresence>\n </StyledRightWrapper>\n )}\n </StyledMotionAccordionHead>\n );\n};\n\nAccordionHead.displayName = 'AccordionHead';\n\nexport default AccordionHead;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"AccordionHead.js","names":["AnimatePresence","LayoutGroup","React","useEffect","useMemo","useRef","useState","useTheme","useElementSize","getAccordionHeadHeight","getElementClickEvent","AreaContext","Icon","Input","InputSize","SearchInput","StyledAccordionIcon","StyledMotionAccordionHead","StyledMotionContentWrapper","StyledMotionIconWrapper","StyledMotionRightElementWrapper","StyledMotionSearchWrapper","StyledMotionTitle","StyledMotionTitleElementWrapper","StyledMotionTitleWrapper","StyledRightWrapper","AccordionHead","_ref","icon","isOpen","isFixed","isTitleGreyed","isWrapped","onClick","onSearchChange","rightElement","searchPlaceholder","searchValue","shouldRotateIcon","title","titleElement","uuid","titleInputProps","onTitleInputChange","titleColor","headHeight","setHeadHeight","closed","open","isSearchActive","setIsSearchActive","theme","titleElementWrapperRef","titleWrapperRef","internalSearchValue","setInternalSearchValue","handleOnSearchChance","event","target","value","titleElementChildrenSize","shouldUseChildElement","shouldPreventRightElementClick","width","current","clientWidth","hasSearch","fontSize","iconElement","createElement","icons","internalIcon","accordionIcon","toString","internalIconStyle","iconStyle","className","$icon","accordionHeadHeight","height","animate","initial","key","rotate","undefined","opacity","ref","$isWrapped","Provider","shouldChangeColor","_extends","onChange","scale","exit","$isOpen","$color","$hasSearch","transition","duration","layout","$isSearchActive","onActiveChange","isActive","placeholder","size","Small","displayName"],"sources":["../../../../../src/components/accordion/accordion-head/AccordionHead.tsx"],"sourcesContent":["import { AnimatePresence, LayoutGroup } from 'motion/react';\nimport React, {\n ChangeEvent,\n ChangeEventHandler,\n FC,\n MouseEventHandler,\n ReactNode,\n useEffect,\n useMemo,\n useRef,\n useState,\n type CSSProperties,\n} from 'react';\nimport { useTheme } from 'styled-components';\nimport { useElementSize } from '../../../hooks/useElementSize';\nimport { getAccordionHeadHeight, getElementClickEvent } 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 [isSearchActive, setIsSearchActive] = useState(false);\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\n const shouldPreventRightElementClick = useMemo(\n () => getElementClickEvent(rightElement),\n [rightElement],\n );\n\n useEffect(() => {\n if (typeof onTitleInputChange === 'function') {\n setHeadHeight({ closed: 50, open: 50 });\n } else {\n setHeadHeight(\n getAccordionHeadHeight({\n isWrapped,\n title,\n width: (titleWrapperRef.current?.clientWidth ?? 0) - 10,\n hasSearch: typeof onSearchChange === 'function',\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, onSearchChange, onTitleInputChange, theme.fontSize, title]);\n\n const iconElement = useMemo(() => {\n if (icon || isFixed) {\n return (\n <Icon\n icons={[isFixed ? 'fa fa-horizontal-rule' : (icon ?? 'fa fa-chevron-right')]}\n />\n );\n }\n\n let internalIcon = 'f105';\n\n if (\n theme?.accordionIcon &&\n theme.accordionIcon !== 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 return (\n <StyledMotionAccordionHead\n animate={{ height: accordionHeadHeight }}\n className=\"beta-chayns-accordion-head\"\n initial={false}\n key={`accordionHead--${uuid}`}\n >\n <StyledMotionIconWrapper\n animate={{ rotate: (isOpen || isFixed) && shouldRotateIcon ? 90 : 0 }}\n initial={false}\n onClick={!isFixed ? onClick : undefined}\n key={`accordionHeadIcon--${uuid}`}\n >\n {iconElement}\n </StyledMotionIconWrapper>\n <StyledMotionContentWrapper\n animate={{ opacity: isTitleGreyed ? 0.5 : 1 }}\n initial={false}\n onClick={!isFixed ? onClick : undefined}\n ref={titleWrapperRef}\n $isWrapped={isWrapped}\n key={`accordionHeadContentWrapper--${uuid}`}\n >\n {typeof onTitleInputChange === 'function' ? (\n // eslint-disable-next-line react/jsx-no-constructed-context-values\n <AreaContext.Provider value={{ shouldChangeColor: true }}>\n <Input {...titleInputProps} value={title} onChange={onTitleInputChange} />\n </AreaContext.Provider>\n ) : (\n <LayoutGroup key={`accordionHeadLayoutGroup--${uuid}`}>\n <StyledMotionTitleWrapper key={`accordionHeadTitleWrapperWrapper--${uuid}`}>\n <AnimatePresence\n initial={false}\n key={`accordionHeadTitleWrapper--${uuid}`}\n >\n <StyledMotionTitle\n animate={{ scale: 1 }}\n initial={{ scale: isOpen && !isWrapped ? 1 / 1.3 : 1.3 }}\n exit={{ opacity: 0 }}\n $isOpen={isOpen}\n $isWrapped={isWrapped}\n $color={titleColor}\n $hasSearch={typeof onSearchChange === 'function'}\n transition={{\n opacity: {\n duration: 0,\n },\n }}\n key={\n isOpen && !isWrapped\n ? `accordionHeadTitleBig--${uuid}`\n : `accordionHeadTitle--${uuid}`\n }\n >\n {title}\n </StyledMotionTitle>\n </AnimatePresence>\n </StyledMotionTitleWrapper>\n {titleElement && (\n <StyledMotionTitleElementWrapper\n layout\n key={`accordionTitleElement--${uuid}`}\n ref={titleElementWrapperRef}\n >\n {titleElement}\n </StyledMotionTitleElementWrapper>\n )}\n </LayoutGroup>\n )}\n </StyledMotionContentWrapper>\n {(typeof onSearchChange === 'function' || rightElement) && (\n <StyledRightWrapper $isSearchActive={isSearchActive}>\n <AnimatePresence initial={false} key={`accordionRightWrapper--${uuid}`}>\n {typeof onSearchChange === 'function' && isOpen && (\n <StyledMotionSearchWrapper\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n key={`searchWrapper--${uuid}`}\n >\n <SearchInput\n onChange={handleOnSearchChance}\n onActiveChange={(isActive) => setIsSearchActive(isActive)}\n placeholder={searchPlaceholder}\n size={InputSize.Small}\n value={internalSearchValue}\n />\n </StyledMotionSearchWrapper>\n )}\n {rightElement && (\n <StyledMotionRightElementWrapper\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n initial={{ opacity: 0 }}\n key={`rightElementWrapper--${uuid}`}\n onClick={\n !isFixed && !shouldPreventRightElementClick\n ? onClick\n : undefined\n }\n >\n {rightElement}\n </StyledMotionRightElementWrapper>\n )}\n </AnimatePresence>\n </StyledRightWrapper>\n )}\n </StyledMotionAccordionHead>\n );\n};\n\nAccordionHead.displayName = 'AccordionHead';\n\nexport default AccordionHead;\n"],"mappings":"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","ignoreList":[]}
@@ -9,7 +9,7 @@ export const StyledMotionMentionFinderPopup = styled(motion.div)`
9
9
  let {
10
10
  theme
11
11
  } = _ref;
12
- return theme['001'];
12
+ return theme['100'];
13
13
  }};
14
14
  border: 1px solid rgba(0, 0, 0, 0.1);
15
15
  border-radius: 3px;
@@ -1 +1 @@
1
- {"version":3,"file":"MentionFinder.styles.js","names":["motion","styled","css","MentionFinderPopupAlignment","StyledMentionFinder","div","StyledMotionMentionFinderPopup","_ref","theme","_ref2","$popupAlignment","Bottom","Top","undefined","_ref3","_ref4"],"sources":["../../../../src/components/mention-finder/MentionFinder.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport { MentionFinderPopupAlignment } from '../../constants/mentionFinder';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\nexport const StyledMentionFinder = styled.div`\n position: relative;\n`;\n\ntype StyledMentionFinderPopupProps = WithTheme<{ $popupAlignment: MentionFinderPopupAlignment }>;\n\nexport const StyledMotionMentionFinderPopup = styled(motion.div)<StyledMentionFinderPopupProps>`\n background-color: ${({ theme }: StyledMentionFinderPopupProps) => theme['001']};\n border: 1px solid rgba(0, 0, 0, 0.1);\n border-radius: 3px;\n box-shadow: 1px 3px 8px rgba(0, 0, 0, 0.1);\n left: 0;\n max-height: 275px;\n overflow-y: scroll;\n position: absolute;\n width: 100%;\n\n ${({ $popupAlignment }) => {\n switch ($popupAlignment) {\n case MentionFinderPopupAlignment.Bottom:\n return css`\n top: 0;\n `;\n case MentionFinderPopupAlignment.Top:\n return css`\n bottom: 0;\n `;\n default:\n return undefined;\n }\n }}\n\n // Styles for custom scrollbar\n &::-webkit-scrollbar {\n width: 5px;\n }\n\n &::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n &::-webkit-scrollbar-button {\n background-color: transparent;\n height: 5px;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: rgba(\n ${({ theme }: StyledMentionFinderPopupProps) => theme['text-rgb']},\n 0.15\n );\n border-radius: 20px;\n }\n\n // Scrollbar styles for Firefox. The above styles are not supported in Firefox, these styles are\n // only supported in Firefox:\n * {\n scrollbar-color: rgba(\n ${({ theme }: StyledMentionFinderPopupProps) => theme['text-rgb']},\n 0.15\n )\n transparent;\n scrollbar-width: thin;\n }\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,cAAc;AACrC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAC/C,SAASC,2BAA2B,QAAQ,+BAA+B;AAG3E,OAAO,MAAMC,mBAAmB,GAAGH,MAAM,CAACI,GAAG;AAC7C;AACA,CAAC;AAID,OAAO,MAAMC,8BAA8B,GAAGL,MAAM,CAACD,MAAM,CAACK,GAAG,CAAgC;AAC/F,wBAAwBE,IAAA;EAAA,IAAC;IAAEC;EAAqC,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAAC,KAAK,CAAC;AAAA;AAClF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,KAAA,IAAyB;EAAA,IAAxB;IAAEC;EAAgB,CAAC,GAAAD,KAAA;EAClB,QAAQC,eAAe;IACnB,KAAKP,2BAA2B,CAACQ,MAAM;MACnC,OAAOT,GAAG;AAC1B;AACA,iBAAiB;IACL,KAAKC,2BAA2B,CAACS,GAAG;MAChC,OAAOV,GAAG;AAC1B;AACA,iBAAiB;IACL;MACI,OAAOW,SAAS;EACxB;AACJ,CAAC;AACL;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,cAAcC,KAAA;EAAA,IAAC;IAAEN;EAAqC,CAAC,GAAAM,KAAA;EAAA,OAAKN,KAAK,CAAC,UAAU,CAAC;AAAA;AAC7E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,kBAAkBO,KAAA;EAAA,IAAC;IAAEP;EAAqC,CAAC,GAAAO,KAAA;EAAA,OAAKP,KAAK,CAAC,UAAU,CAAC;AAAA;AACjF;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}
1
+ {"version":3,"file":"MentionFinder.styles.js","names":["motion","styled","css","MentionFinderPopupAlignment","StyledMentionFinder","div","StyledMotionMentionFinderPopup","_ref","theme","_ref2","$popupAlignment","Bottom","Top","undefined","_ref3","_ref4"],"sources":["../../../../src/components/mention-finder/MentionFinder.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport { MentionFinderPopupAlignment } from '../../constants/mentionFinder';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\nexport const StyledMentionFinder = styled.div`\n position: relative;\n`;\n\ntype StyledMentionFinderPopupProps = WithTheme<{ $popupAlignment: MentionFinderPopupAlignment }>;\n\nexport const StyledMotionMentionFinderPopup = styled(motion.div)<StyledMentionFinderPopupProps>`\n background-color: ${({ theme }: StyledMentionFinderPopupProps) => theme['100']};\n border: 1px solid rgba(0, 0, 0, 0.1);\n border-radius: 3px;\n box-shadow: 1px 3px 8px rgba(0, 0, 0, 0.1);\n left: 0;\n max-height: 275px;\n overflow-y: scroll;\n position: absolute;\n width: 100%;\n\n ${({ $popupAlignment }) => {\n switch ($popupAlignment) {\n case MentionFinderPopupAlignment.Bottom:\n return css`\n top: 0;\n `;\n case MentionFinderPopupAlignment.Top:\n return css`\n bottom: 0;\n `;\n default:\n return undefined;\n }\n }}\n\n // Styles for custom scrollbar\n &::-webkit-scrollbar {\n width: 5px;\n }\n\n &::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n &::-webkit-scrollbar-button {\n background-color: transparent;\n height: 5px;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: rgba(\n ${({ theme }: StyledMentionFinderPopupProps) => theme['text-rgb']},\n 0.15\n );\n border-radius: 20px;\n }\n\n // Scrollbar styles for Firefox. The above styles are not supported in Firefox, these styles are\n // only supported in Firefox:\n * {\n scrollbar-color: rgba(\n ${({ theme }: StyledMentionFinderPopupProps) => theme['text-rgb']},\n 0.15\n )\n transparent;\n scrollbar-width: thin;\n }\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,cAAc;AACrC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAC/C,SAASC,2BAA2B,QAAQ,+BAA+B;AAG3E,OAAO,MAAMC,mBAAmB,GAAGH,MAAM,CAACI,GAAG;AAC7C;AACA,CAAC;AAID,OAAO,MAAMC,8BAA8B,GAAGL,MAAM,CAACD,MAAM,CAACK,GAAG,CAAgC;AAC/F,wBAAwBE,IAAA;EAAA,IAAC;IAAEC;EAAqC,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAAC,KAAK,CAAC;AAAA;AAClF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,KAAA,IAAyB;EAAA,IAAxB;IAAEC;EAAgB,CAAC,GAAAD,KAAA;EAClB,QAAQC,eAAe;IACnB,KAAKP,2BAA2B,CAACQ,MAAM;MACnC,OAAOT,GAAG;AAC1B;AACA,iBAAiB;IACL,KAAKC,2BAA2B,CAACS,GAAG;MAChC,OAAOV,GAAG;AAC1B;AACA,iBAAiB;IACL;MACI,OAAOW,SAAS;EACxB;AACJ,CAAC;AACL;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,cAAcC,KAAA;EAAA,IAAC;IAAEN;EAAqC,CAAC,GAAAM,KAAA;EAAA,OAAKN,KAAK,CAAC,UAAU,CAAC;AAAA;AAC7E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,kBAAkBO,KAAA;EAAA,IAAC;IAAEP;EAAqC,CAAC,GAAAO,KAAA;EAAA,OAAKP,KAAK,CAAC,UAAU,CAAC;AAAA;AACjF;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}
@@ -15,20 +15,11 @@ export const StyledMentionFinderItem = styled.div`
15
15
  }}, 0.15);
16
16
  }
17
17
 
18
- &:nth-child(even) {
19
- background-color: ${_ref2 => {
20
- let {
21
- theme
22
- } = _ref2;
23
- return theme['101'];
24
- }};
25
- }
26
-
27
- ${_ref3 => {
18
+ ${_ref2 => {
28
19
  let {
29
20
  $isActive,
30
21
  theme
31
- } = _ref3;
22
+ } = _ref2;
32
23
  return $isActive && css`
33
24
  background-color: ${theme['102']} !important;
34
25
  `;
@@ -36,25 +27,25 @@ export const StyledMentionFinderItem = styled.div`
36
27
  `;
37
28
  export const StyledMentionFinderItemImage = styled.img`
38
29
  background-color: rgba(
39
- ${_ref4 => {
30
+ ${_ref3 => {
40
31
  let {
41
32
  theme
42
- } = _ref4;
33
+ } = _ref3;
43
34
  return theme['text-rgb'];
44
35
  }},
45
36
  0.1
46
37
  );
47
- border-radius: ${_ref5 => {
38
+ border-radius: ${_ref4 => {
48
39
  let {
49
40
  $shouldShowRoundImage
50
- } = _ref5;
41
+ } = _ref4;
51
42
  return $shouldShowRoundImage ? '50%' : 'initial';
52
43
  }};
53
44
  box-shadow: 0 0 0 1px
54
- rgba(${_ref6 => {
45
+ rgba(${_ref5 => {
55
46
  let {
56
47
  theme
57
- } = _ref6;
48
+ } = _ref5;
58
49
  return theme['009-rgb'];
59
50
  }}, 0.08) inset;
60
51
  flex: 0 0 auto;
@@ -64,10 +55,10 @@ export const StyledMentionFinderItemImage = styled.img`
64
55
  width: 40px;
65
56
  `;
66
57
  export const StyledMentionFinderItemContent = styled.div`
67
- color: ${_ref7 => {
58
+ color: ${_ref6 => {
68
59
  let {
69
60
  theme
70
- } = _ref7;
61
+ } = _ref6;
71
62
  return theme.text;
72
63
  }};
73
64
  display: flex;
@@ -1 +1 @@
1
- {"version":3,"file":"MentionFinderItem.styles.js","names":["styled","css","StyledMentionFinderItem","div","_ref","theme","_ref2","_ref3","$isActive","StyledMentionFinderItemImage","img","_ref4","_ref5","$shouldShowRoundImage","_ref6","StyledMentionFinderItemContent","_ref7","text","StyledMentionFinderItemContentName","StyledMentionFinderItemContentInfo"],"sources":["../../../../../src/components/mention-finder/mention-finder-item/MentionFinderItem.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledMentionFinderItemProps = WithTheme<{ $isActive: boolean }>;\n\nexport const StyledMentionFinderItem = styled.div<StyledMentionFinderItemProps>`\n align-items: center;\n cursor: pointer;\n display: flex;\n padding: 10px 8px;\n\n &:not(:last-child) {\n border-bottom: 1px solid\n rgba(${({ theme }: StyledMentionFinderItemProps) => theme['text-rgb']}, 0.15);\n }\n\n &:nth-child(even) {\n background-color: ${({ theme }: StyledMentionFinderItemProps) => theme['101']};\n }\n\n ${({ $isActive, theme }) =>\n $isActive &&\n css`\n background-color: ${theme['102']} !important;\n `}\n`;\n\ntype StyledMentionFinderItemImageProps = WithTheme<{\n $shouldShowRoundImage?: boolean;\n}>;\n\nexport const StyledMentionFinderItemImage = styled.img<StyledMentionFinderItemImageProps>`\n background-color: rgba(\n ${({ theme }: StyledMentionFinderItemImageProps) => theme['text-rgb']},\n 0.1\n );\n border-radius: ${({ $shouldShowRoundImage }) => ($shouldShowRoundImage ? '50%' : 'initial')};\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledMentionFinderItemImageProps) => theme['009-rgb']}, 0.08) inset;\n flex: 0 0 auto;\n height: 40px;\n overflow: hidden;\n transition: border-radius 0.3s ease;\n width: 40px;\n`;\n\ntype StyledMentionFinderItemContentProps = WithTheme<unknown>;\n\nexport const StyledMentionFinderItemContent = styled.div`\n color: ${({ theme }: StyledMentionFinderItemContentProps) => theme.text};\n display: flex;\n flex: 1 1 auto;\n flex-direction: column;\n justify-content: center;\n line-height: normal;\n margin-left: 10px;\n min-width: 0;\n`;\n\nexport const StyledMentionFinderItemContentName = styled.div``;\n\nexport const StyledMentionFinderItemContentInfo = styled.div`\n font-size: 85%;\n margin-top: 2px;\n opacity: 0.75;\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAK/C,OAAO,MAAMC,uBAAuB,GAAGF,MAAM,CAACG,GAAiC;AAC/E;AACA;AACA;AACA;AACA;AACA;AACA;AACA,mBAAmBC,IAAA;EAAA,IAAC;IAAEC;EAAoC,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAAC,UAAU,CAAC;AAAA;AACjF;AACA;AACA;AACA,4BAA4BC,KAAA;EAAA,IAAC;IAAED;EAAoC,CAAC,GAAAC,KAAA;EAAA,OAAKD,KAAK,CAAC,KAAK,CAAC;AAAA;AACrF;AACA;AACA,MAAME,KAAA;EAAA,IAAC;IAAEC,SAAS;IAAEH;EAAM,CAAC,GAAAE,KAAA;EAAA,OACnBC,SAAS,IACTP,GAAG;AACX,gCAAgCI,KAAK,CAAC,KAAK,CAAC;AAC5C,SAAS;AAAA;AACT,CAAC;AAMD,OAAO,MAAMI,4BAA4B,GAAGT,MAAM,CAACU,GAAsC;AACzF;AACA,UAAUC,KAAA;EAAA,IAAC;IAAEN;EAAyC,CAAC,GAAAM,KAAA;EAAA,OAAKN,KAAK,CAAC,UAAU,CAAC;AAAA;AAC7E;AACA;AACA,qBAAqBO,KAAA;EAAA,IAAC;IAAEC;EAAsB,CAAC,GAAAD,KAAA;EAAA,OAAMC,qBAAqB,GAAG,KAAK,GAAG,SAAS;AAAA,CAAC;AAC/F;AACA,eAAeC,KAAA;EAAA,IAAC;IAAET;EAAyC,CAAC,GAAAS,KAAA;EAAA,OAAKT,KAAK,CAAC,SAAS,CAAC;AAAA;AACjF;AACA;AACA;AACA;AACA;AACA,CAAC;AAID,OAAO,MAAMU,8BAA8B,GAAGf,MAAM,CAACG,GAAG;AACxD,aAAaa,KAAA;EAAA,IAAC;IAAEX;EAA2C,CAAC,GAAAW,KAAA;EAAA,OAAKX,KAAK,CAACY,IAAI;AAAA;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMC,kCAAkC,GAAGlB,MAAM,CAACG,GAAG,EAAE;AAE9D,OAAO,MAAMgB,kCAAkC,GAAGnB,MAAM,CAACG,GAAG;AAC5D;AACA;AACA;AACA,CAAC","ignoreList":[]}
1
+ {"version":3,"file":"MentionFinderItem.styles.js","names":["styled","css","StyledMentionFinderItem","div","_ref","theme","_ref2","$isActive","StyledMentionFinderItemImage","img","_ref3","_ref4","$shouldShowRoundImage","_ref5","StyledMentionFinderItemContent","_ref6","text","StyledMentionFinderItemContentName","StyledMentionFinderItemContentInfo"],"sources":["../../../../../src/components/mention-finder/mention-finder-item/MentionFinderItem.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledMentionFinderItemProps = WithTheme<{ $isActive: boolean }>;\n\nexport const StyledMentionFinderItem = styled.div<StyledMentionFinderItemProps>`\n align-items: center;\n cursor: pointer;\n display: flex;\n padding: 10px 8px;\n\n &:not(:last-child) {\n border-bottom: 1px solid\n rgba(${({ theme }: StyledMentionFinderItemProps) => theme['text-rgb']}, 0.15);\n }\n\n ${({ $isActive, theme }) =>\n $isActive &&\n css`\n background-color: ${theme['102']} !important;\n `}\n`;\n\ntype StyledMentionFinderItemImageProps = WithTheme<{\n $shouldShowRoundImage?: boolean;\n}>;\n\nexport const StyledMentionFinderItemImage = styled.img<StyledMentionFinderItemImageProps>`\n background-color: rgba(\n ${({ theme }: StyledMentionFinderItemImageProps) => theme['text-rgb']},\n 0.1\n );\n border-radius: ${({ $shouldShowRoundImage }) => ($shouldShowRoundImage ? '50%' : 'initial')};\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledMentionFinderItemImageProps) => theme['009-rgb']}, 0.08) inset;\n flex: 0 0 auto;\n height: 40px;\n overflow: hidden;\n transition: border-radius 0.3s ease;\n width: 40px;\n`;\n\ntype StyledMentionFinderItemContentProps = WithTheme<unknown>;\n\nexport const StyledMentionFinderItemContent = styled.div`\n color: ${({ theme }: StyledMentionFinderItemContentProps) => theme.text};\n display: flex;\n flex: 1 1 auto;\n flex-direction: column;\n justify-content: center;\n line-height: normal;\n margin-left: 10px;\n min-width: 0;\n`;\n\nexport const StyledMentionFinderItemContentName = styled.div``;\n\nexport const StyledMentionFinderItemContentInfo = styled.div`\n font-size: 85%;\n margin-top: 2px;\n opacity: 0.75;\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAK/C,OAAO,MAAMC,uBAAuB,GAAGF,MAAM,CAACG,GAAiC;AAC/E;AACA;AACA;AACA;AACA;AACA;AACA;AACA,mBAAmBC,IAAA;EAAA,IAAC;IAAEC;EAAoC,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAAC,UAAU,CAAC;AAAA;AACjF;AACA;AACA,MAAMC,KAAA;EAAA,IAAC;IAAEC,SAAS;IAAEF;EAAM,CAAC,GAAAC,KAAA;EAAA,OACnBC,SAAS,IACTN,GAAG;AACX,gCAAgCI,KAAK,CAAC,KAAK,CAAC;AAC5C,SAAS;AAAA;AACT,CAAC;AAMD,OAAO,MAAMG,4BAA4B,GAAGR,MAAM,CAACS,GAAsC;AACzF;AACA,UAAUC,KAAA;EAAA,IAAC;IAAEL;EAAyC,CAAC,GAAAK,KAAA;EAAA,OAAKL,KAAK,CAAC,UAAU,CAAC;AAAA;AAC7E;AACA;AACA,qBAAqBM,KAAA;EAAA,IAAC;IAAEC;EAAsB,CAAC,GAAAD,KAAA;EAAA,OAAMC,qBAAqB,GAAG,KAAK,GAAG,SAAS;AAAA,CAAC;AAC/F;AACA,eAAeC,KAAA;EAAA,IAAC;IAAER;EAAyC,CAAC,GAAAQ,KAAA;EAAA,OAAKR,KAAK,CAAC,SAAS,CAAC;AAAA;AACjF;AACA;AACA;AACA;AACA;AACA,CAAC;AAID,OAAO,MAAMS,8BAA8B,GAAGd,MAAM,CAACG,GAAG;AACxD,aAAaY,KAAA;EAAA,IAAC;IAAEV;EAA2C,CAAC,GAAAU,KAAA;EAAA,OAAKV,KAAK,CAACW,IAAI;AAAA;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMC,kCAAkC,GAAGjB,MAAM,CAACG,GAAG,EAAE;AAE9D,OAAO,MAAMe,kCAAkC,GAAGlB,MAAM,CAACG,GAAG;AAC5D;AACA;AACA;AACA,CAAC","ignoreList":[]}
@@ -6,7 +6,7 @@ export const StyledMotionSearchBoxBody = styled(motion.div)`
6
6
  let {
7
7
  theme
8
8
  } = _ref;
9
- return theme['101'];
9
+ return theme['100'];
10
10
  }};
11
11
  position: absolute;
12
12
  z-index: 4;
@@ -1 +1 @@
1
- {"version":3,"file":"SearchBox.styles.js","names":["motion","styled","css","StyledSearchBox","div","StyledMotionSearchBoxBody","_ref","theme","_ref2","$width","_ref3","$height","_ref4","_ref5","$browser","StyledSearchBoxIcon","StyledSearchBoxLeftWrapper"],"sources":["../../../../src/components/search-box/SearchBox.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport { BrowserName } from '../../types/chayns';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\nexport const StyledSearchBox = styled.div``;\n\ntype StyledMotionSearchBoxBodyProps = WithTheme<{\n $height: number;\n $width: number;\n $browser: BrowserName;\n}>;\n\nexport const StyledMotionSearchBoxBody = styled(motion.div)<StyledMotionSearchBoxBodyProps>`\n background: ${({ theme }: StyledMotionSearchBoxBodyProps) => theme['101']};\n position: absolute;\n z-index: 4;\n display: flex;\n flex-direction: column;\n border: 1px solid rgba(160, 160, 160, 0.3);\n border-bottom-left-radius: 3px;\n border-bottom-right-radius: 3px;\n border-top: none;\n cursor: pointer;\n width: ${({ $width }) => $width}px;\n max-height: 300px;\n overflow-y: ${({ $height }) => ($height <= 300 ? 'hidden' : 'auto')};\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledMotionSearchBoxBodyProps) => theme['009-rgb']}, 0.08) inset;\n\n // Styles for custom scrollbar\n ${({ $browser, theme }: StyledMotionSearchBoxBodyProps) =>\n $browser === 'firefox'\n ? css`\n scrollbar-color: rgba(${theme['text-rgb']}, 0.15) transparent;\n scrollbar-width: thin;\n `\n : css`\n &::-webkit-scrollbar {\n width: 5px;\n }\n\n &::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n &::-webkit-scrollbar-button {\n background-color: transparent;\n height: 5px;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: rgba(${theme['text-rgb']}, 0.15);\n border-radius: 20px;\n }\n `}\n`;\n\nexport const StyledSearchBoxIcon = styled.div`\n cursor: pointer;\n padding: 0 10px;\n`;\n\nexport const StyledSearchBoxLeftWrapper = styled.div`\n display: flex;\n align-items: center;\n gap: 8px;\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,cAAc;AACrC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAI/C,OAAO,MAAMC,eAAe,GAAGF,MAAM,CAACG,GAAG,EAAE;AAQ3C,OAAO,MAAMC,yBAAyB,GAAGJ,MAAM,CAACD,MAAM,CAACI,GAAG,CAAiC;AAC3F,kBAAkBE,IAAA;EAAA,IAAC;IAAEC;EAAsC,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAAC,KAAK,CAAC;AAAA;AAC7E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAaC,KAAA;EAAA,IAAC;IAAEC;EAAO,CAAC,GAAAD,KAAA;EAAA,OAAKC,MAAM;AAAA;AACnC;AACA,kBAAkBC,KAAA;EAAA,IAAC;IAAEC;EAAQ,CAAC,GAAAD,KAAA;EAAA,OAAMC,OAAO,IAAI,GAAG,GAAG,QAAQ,GAAG,MAAM;AAAA,CAAC;AACvE;AACA,eAAeC,KAAA;EAAA,IAAC;IAAEL;EAAsC,CAAC,GAAAK,KAAA;EAAA,OAAKL,KAAK,CAAC,SAAS,CAAC;AAAA;AAC9E;AACA;AACA,MAAMM,KAAA;EAAA,IAAC;IAAEC,QAAQ;IAAEP;EAAsC,CAAC,GAAAM,KAAA;EAAA,OAClDC,QAAQ,KAAK,SAAS,GAChBZ,GAAG;AACjB,0CAA0CK,KAAK,CAAC,UAAU,CAAC;AAC3D;AACA,eAAe,GACDL,GAAG;AACjB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,+CAA+CK,KAAK,CAAC,UAAU,CAAC;AAChE;AACA;AACA,eAAe;AAAA;AACf,CAAC;AAED,OAAO,MAAMQ,mBAAmB,GAAGd,MAAM,CAACG,GAAG;AAC7C;AACA;AACA,CAAC;AAED,OAAO,MAAMY,0BAA0B,GAAGf,MAAM,CAACG,GAAG;AACpD;AACA;AACA;AACA,CAAC","ignoreList":[]}
1
+ {"version":3,"file":"SearchBox.styles.js","names":["motion","styled","css","StyledSearchBox","div","StyledMotionSearchBoxBody","_ref","theme","_ref2","$width","_ref3","$height","_ref4","_ref5","$browser","StyledSearchBoxIcon","StyledSearchBoxLeftWrapper"],"sources":["../../../../src/components/search-box/SearchBox.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport { BrowserName } from '../../types/chayns';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\nexport const StyledSearchBox = styled.div``;\n\ntype StyledMotionSearchBoxBodyProps = WithTheme<{\n $height: number;\n $width: number;\n $browser: BrowserName;\n}>;\n\nexport const StyledMotionSearchBoxBody = styled(motion.div)<StyledMotionSearchBoxBodyProps>`\n background: ${({ theme }: StyledMotionSearchBoxBodyProps) => theme['100']};\n position: absolute;\n z-index: 4;\n display: flex;\n flex-direction: column;\n border: 1px solid rgba(160, 160, 160, 0.3);\n border-bottom-left-radius: 3px;\n border-bottom-right-radius: 3px;\n border-top: none;\n cursor: pointer;\n width: ${({ $width }) => $width}px;\n max-height: 300px;\n overflow-y: ${({ $height }) => ($height <= 300 ? 'hidden' : 'auto')};\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledMotionSearchBoxBodyProps) => theme['009-rgb']}, 0.08) inset;\n\n // Styles for custom scrollbar\n ${({ $browser, theme }: StyledMotionSearchBoxBodyProps) =>\n $browser === 'firefox'\n ? css`\n scrollbar-color: rgba(${theme['text-rgb']}, 0.15) transparent;\n scrollbar-width: thin;\n `\n : css`\n &::-webkit-scrollbar {\n width: 5px;\n }\n\n &::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n &::-webkit-scrollbar-button {\n background-color: transparent;\n height: 5px;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: rgba(${theme['text-rgb']}, 0.15);\n border-radius: 20px;\n }\n `}\n`;\n\nexport const StyledSearchBoxIcon = styled.div`\n cursor: pointer;\n padding: 0 10px;\n`;\n\nexport const StyledSearchBoxLeftWrapper = styled.div`\n display: flex;\n align-items: center;\n gap: 8px;\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,cAAc;AACrC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAI/C,OAAO,MAAMC,eAAe,GAAGF,MAAM,CAACG,GAAG,EAAE;AAQ3C,OAAO,MAAMC,yBAAyB,GAAGJ,MAAM,CAACD,MAAM,CAACI,GAAG,CAAiC;AAC3F,kBAAkBE,IAAA;EAAA,IAAC;IAAEC;EAAsC,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAAC,KAAK,CAAC;AAAA;AAC7E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAaC,KAAA;EAAA,IAAC;IAAEC;EAAO,CAAC,GAAAD,KAAA;EAAA,OAAKC,MAAM;AAAA;AACnC;AACA,kBAAkBC,KAAA;EAAA,IAAC;IAAEC;EAAQ,CAAC,GAAAD,KAAA;EAAA,OAAMC,OAAO,IAAI,GAAG,GAAG,QAAQ,GAAG,MAAM;AAAA,CAAC;AACvE;AACA,eAAeC,KAAA;EAAA,IAAC;IAAEL;EAAsC,CAAC,GAAAK,KAAA;EAAA,OAAKL,KAAK,CAAC,SAAS,CAAC;AAAA;AAC9E;AACA;AACA,MAAMM,KAAA;EAAA,IAAC;IAAEC,QAAQ;IAAEP;EAAsC,CAAC,GAAAM,KAAA;EAAA,OAClDC,QAAQ,KAAK,SAAS,GAChBZ,GAAG;AACjB,0CAA0CK,KAAK,CAAC,UAAU,CAAC;AAC3D;AACA,eAAe,GACDL,GAAG;AACjB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,+CAA+CK,KAAK,CAAC,UAAU,CAAC;AAChE;AACA;AACA,eAAe;AAAA;AACf,CAAC;AAED,OAAO,MAAMQ,mBAAmB,GAAGd,MAAM,CAACG,GAAG;AAC7C;AACA;AACA,CAAC;AAED,OAAO,MAAMY,0BAA0B,GAAGf,MAAM,CAACG,GAAG;AACpD;AACA;AACA;AACA,CAAC","ignoreList":[]}
@@ -71,7 +71,7 @@ const SearchBoxBody = /*#__PURE__*/forwardRef((_ref, ref) => {
71
71
  size: 0,
72
72
  onSelect: onGroupSelect,
73
73
  selectedItemIds: selectedGroups
74
- }), /*#__PURE__*/React.createElement(StyledSearchBoxBodyHeadGroupName, null, currentGroupName)), /*#__PURE__*/React.createElement(StyledSearchBoxBodyContent, {
74
+ }), /*#__PURE__*/React.createElement(StyledSearchBoxBodyHeadGroupName, null, currentGroupName.replace('_', ''))), /*#__PURE__*/React.createElement(StyledSearchBoxBodyContent, {
75
75
  $height: height,
76
76
  $headHeight: headHeight,
77
77
  key: "content",
@@ -1 +1 @@
1
- {"version":3,"file":"SearchBoxBody.js","names":["React","forwardRef","useCallback","useEffect","useMemo","useRef","useState","useElementSize","useUuid","getCurrentGroupName","FilterButtons","StyledMotionSearchBoxBody","StyledSearchBoxBodyContent","StyledSearchBoxBodyHead","StyledSearchBoxBodyHeadGroupName","SearchBoxBody","_ref","ref","filterButtons","coordinates","selectedGroups","width","browser","height","children","onGroupSelect","shouldHideFilterButtons","hasScrolled","setHasScrolled","currentGroupName","setCurrentGroupName","headRef","headSize","uuid","headHeight","element","document","getElementById","length","handleScroll","event","scrollTop","target","createElement","$width","style","left","x","top","y","initial","opacity","exit","animate","transition","duration","type","$hasScrolled","$hasGroupName","items","size","onSelect","selectedItemIds","$height","$headHeight","key","id","$browser","tabIndex","onScroll","displayName"],"sources":["../../../../../src/components/search-box/search-box-body/SearchBoxBody.tsx"],"sourcesContent":["import React, {\n forwardRef,\n UIEvent,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n type ReactNode,\n} from 'react';\nimport { useElementSize } from '../../../hooks/useElementSize';\nimport { useUuid } from '../../../hooks/uuid';\nimport { BrowserName } from '../../../types/chayns';\nimport type { IFilterButtonItem } from '../../../types/filterButtons';\nimport { getCurrentGroupName } from '../../../utils/searchBox';\nimport FilterButtons from '../../filter-buttons/FilterButtons';\nimport {\n StyledMotionSearchBoxBody,\n StyledSearchBoxBodyContent,\n StyledSearchBoxBodyHead,\n StyledSearchBoxBodyHeadGroupName,\n} from './SearchBoxBody.styles';\n\nexport type SearchBoxBodyProps = {\n children: ReactNode;\n filterButtons?: IFilterButtonItem[];\n selectedGroups?: string[];\n height: number;\n width: number;\n browser: BrowserName;\n onGroupSelect?: (keys: string[]) => void;\n coordinates: { x: number; y: number };\n shouldHideFilterButtons?: boolean;\n};\n\nconst SearchBoxBody = forwardRef<HTMLDivElement, SearchBoxBodyProps>(\n (\n {\n filterButtons,\n coordinates,\n selectedGroups,\n width,\n browser,\n height,\n children,\n onGroupSelect,\n shouldHideFilterButtons,\n },\n ref,\n ) => {\n const [hasScrolled, setHasScrolled] = useState(false);\n const [currentGroupName, setCurrentGroupName] = useState('');\n\n const headRef = useRef<HTMLDivElement>(null);\n\n const headSize = useElementSize(headRef);\n\n const uuid = useUuid();\n\n const headHeight = useMemo(\n () => (headSize?.height ? headSize.height + 15 : 0),\n [headSize?.height],\n );\n\n useEffect(() => {\n const element = document.getElementById(`searchbox-content__${uuid}`);\n\n if (\n element &&\n ((selectedGroups?.length === 1 && selectedGroups[0] === 'all') ||\n selectedGroups?.length !== 1)\n ) {\n setCurrentGroupName(getCurrentGroupName(element));\n } else {\n setCurrentGroupName('');\n }\n }, [uuid, children, selectedGroups]);\n\n const handleScroll = useCallback(\n (event: UIEvent) => {\n const { scrollTop } = event.target as HTMLDivElement;\n\n setHasScrolled(scrollTop > 1);\n\n if (\n (selectedGroups?.length === 1 && selectedGroups[0] === 'all') ||\n selectedGroups?.length !== 1\n ) {\n setCurrentGroupName(getCurrentGroupName(event.target as HTMLDivElement));\n }\n },\n [selectedGroups],\n );\n\n return useMemo(\n () => (\n <StyledMotionSearchBoxBody\n ref={ref}\n $width={width}\n style={{ left: coordinates.x, top: coordinates.y }}\n initial={{ height: 0, opacity: 0 }}\n exit={{ height: 0, opacity: 0 }}\n animate={{ height: 'fit-content', opacity: 1 }}\n transition={{\n duration: 0.2,\n type: 'tween',\n }}\n >\n {filterButtons && filterButtons?.length > 1 && (\n <StyledSearchBoxBodyHead\n ref={headRef}\n $hasScrolled={hasScrolled}\n $hasGroupName={!!currentGroupName}\n >\n {!shouldHideFilterButtons && (\n <FilterButtons\n items={filterButtons}\n size={0}\n onSelect={onGroupSelect}\n selectedItemIds={selectedGroups}\n />\n )}\n <StyledSearchBoxBodyHeadGroupName>\n {currentGroupName}\n </StyledSearchBoxBodyHeadGroupName>\n </StyledSearchBoxBodyHead>\n )}\n <StyledSearchBoxBodyContent\n $height={height}\n $headHeight={headHeight}\n key=\"content\"\n id={`searchbox-content__${uuid}`}\n $browser={browser}\n tabIndex={0}\n onScroll={handleScroll}\n >\n {children}\n </StyledSearchBoxBodyContent>\n </StyledMotionSearchBoxBody>\n ),\n [\n browser,\n children,\n coordinates.x,\n coordinates.y,\n currentGroupName,\n filterButtons,\n handleScroll,\n hasScrolled,\n headHeight,\n height,\n onGroupSelect,\n ref,\n selectedGroups,\n shouldHideFilterButtons,\n uuid,\n width,\n ],\n );\n },\n);\n\nSearchBoxBody.displayName = 'SearchBoxBody';\n\nexport default SearchBoxBody;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"SearchBoxBody.js","names":["React","forwardRef","useCallback","useEffect","useMemo","useRef","useState","useElementSize","useUuid","getCurrentGroupName","FilterButtons","StyledMotionSearchBoxBody","StyledSearchBoxBodyContent","StyledSearchBoxBodyHead","StyledSearchBoxBodyHeadGroupName","SearchBoxBody","_ref","ref","filterButtons","coordinates","selectedGroups","width","browser","height","children","onGroupSelect","shouldHideFilterButtons","hasScrolled","setHasScrolled","currentGroupName","setCurrentGroupName","headRef","headSize","uuid","headHeight","element","document","getElementById","length","handleScroll","event","scrollTop","target","createElement","$width","style","left","x","top","y","initial","opacity","exit","animate","transition","duration","type","$hasScrolled","$hasGroupName","items","size","onSelect","selectedItemIds","replace","$height","$headHeight","key","id","$browser","tabIndex","onScroll","displayName"],"sources":["../../../../../src/components/search-box/search-box-body/SearchBoxBody.tsx"],"sourcesContent":["import React, {\n forwardRef,\n UIEvent,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n type ReactNode,\n} from 'react';\nimport { useElementSize } from '../../../hooks/useElementSize';\nimport { useUuid } from '../../../hooks/uuid';\nimport { BrowserName } from '../../../types/chayns';\nimport type { IFilterButtonItem } from '../../../types/filterButtons';\nimport { getCurrentGroupName } from '../../../utils/searchBox';\nimport FilterButtons from '../../filter-buttons/FilterButtons';\nimport {\n StyledMotionSearchBoxBody,\n StyledSearchBoxBodyContent,\n StyledSearchBoxBodyHead,\n StyledSearchBoxBodyHeadGroupName,\n} from './SearchBoxBody.styles';\n\nexport type SearchBoxBodyProps = {\n children: ReactNode;\n filterButtons?: IFilterButtonItem[];\n selectedGroups?: string[];\n height: number;\n width: number;\n browser: BrowserName;\n onGroupSelect?: (keys: string[]) => void;\n coordinates: { x: number; y: number };\n shouldHideFilterButtons?: boolean;\n};\n\nconst SearchBoxBody = forwardRef<HTMLDivElement, SearchBoxBodyProps>(\n (\n {\n filterButtons,\n coordinates,\n selectedGroups,\n width,\n browser,\n height,\n children,\n onGroupSelect,\n shouldHideFilterButtons,\n },\n ref,\n ) => {\n const [hasScrolled, setHasScrolled] = useState(false);\n const [currentGroupName, setCurrentGroupName] = useState('');\n\n const headRef = useRef<HTMLDivElement>(null);\n\n const headSize = useElementSize(headRef);\n\n const uuid = useUuid();\n\n const headHeight = useMemo(\n () => (headSize?.height ? headSize.height + 15 : 0),\n [headSize?.height],\n );\n\n useEffect(() => {\n const element = document.getElementById(`searchbox-content__${uuid}`);\n\n if (\n element &&\n ((selectedGroups?.length === 1 && selectedGroups[0] === 'all') ||\n selectedGroups?.length !== 1)\n ) {\n setCurrentGroupName(getCurrentGroupName(element));\n } else {\n setCurrentGroupName('');\n }\n }, [uuid, children, selectedGroups]);\n\n const handleScroll = useCallback(\n (event: UIEvent) => {\n const { scrollTop } = event.target as HTMLDivElement;\n\n setHasScrolled(scrollTop > 1);\n\n if (\n (selectedGroups?.length === 1 && selectedGroups[0] === 'all') ||\n selectedGroups?.length !== 1\n ) {\n setCurrentGroupName(getCurrentGroupName(event.target as HTMLDivElement));\n }\n },\n [selectedGroups],\n );\n\n return useMemo(\n () => (\n <StyledMotionSearchBoxBody\n ref={ref}\n $width={width}\n style={{ left: coordinates.x, top: coordinates.y }}\n initial={{ height: 0, opacity: 0 }}\n exit={{ height: 0, opacity: 0 }}\n animate={{ height: 'fit-content', opacity: 1 }}\n transition={{\n duration: 0.2,\n type: 'tween',\n }}\n >\n {filterButtons && filterButtons?.length > 1 && (\n <StyledSearchBoxBodyHead\n ref={headRef}\n $hasScrolled={hasScrolled}\n $hasGroupName={!!currentGroupName}\n >\n {!shouldHideFilterButtons && (\n <FilterButtons\n items={filterButtons}\n size={0}\n onSelect={onGroupSelect}\n selectedItemIds={selectedGroups}\n />\n )}\n <StyledSearchBoxBodyHeadGroupName>\n {currentGroupName.replace('_', '')}\n </StyledSearchBoxBodyHeadGroupName>\n </StyledSearchBoxBodyHead>\n )}\n <StyledSearchBoxBodyContent\n $height={height}\n $headHeight={headHeight}\n key=\"content\"\n id={`searchbox-content__${uuid}`}\n $browser={browser}\n tabIndex={0}\n onScroll={handleScroll}\n >\n {children}\n </StyledSearchBoxBodyContent>\n </StyledMotionSearchBoxBody>\n ),\n [\n browser,\n children,\n coordinates.x,\n coordinates.y,\n currentGroupName,\n filterButtons,\n handleScroll,\n hasScrolled,\n headHeight,\n height,\n onGroupSelect,\n ref,\n selectedGroups,\n shouldHideFilterButtons,\n uuid,\n width,\n ],\n );\n },\n);\n\nSearchBoxBody.displayName = 'SearchBoxBody';\n\nexport default SearchBoxBody;\n"],"mappings":"AAAA,OAAOA,KAAK,IACRC,UAAU,EAEVC,WAAW,EACXC,SAAS,EACTC,OAAO,EACPC,MAAM,EACNC,QAAQ,QAEL,OAAO;AACd,SAASC,cAAc,QAAQ,+BAA+B;AAC9D,SAASC,OAAO,QAAQ,qBAAqB;AAG7C,SAASC,mBAAmB,QAAQ,0BAA0B;AAC9D,OAAOC,aAAa,MAAM,oCAAoC;AAC9D,SACIC,yBAAyB,EACzBC,0BAA0B,EAC1BC,uBAAuB,EACvBC,gCAAgC,QAC7B,wBAAwB;AAc/B,MAAMC,aAAa,gBAAGd,UAAU,CAC5B,CAAAe,IAAA,EAYIC,GAAG,KACF;EAAA,IAZD;IACIC,aAAa;IACbC,WAAW;IACXC,cAAc;IACdC,KAAK;IACLC,OAAO;IACPC,MAAM;IACNC,QAAQ;IACRC,aAAa;IACbC;EACJ,CAAC,GAAAV,IAAA;EAGD,MAAM,CAACW,WAAW,EAAEC,cAAc,CAAC,GAAGtB,QAAQ,CAAC,KAAK,CAAC;EACrD,MAAM,CAACuB,gBAAgB,EAAEC,mBAAmB,CAAC,GAAGxB,QAAQ,CAAC,EAAE,CAAC;EAE5D,MAAMyB,OAAO,GAAG1B,MAAM,CAAiB,IAAI,CAAC;EAE5C,MAAM2B,QAAQ,GAAGzB,cAAc,CAACwB,OAAO,CAAC;EAExC,MAAME,IAAI,GAAGzB,OAAO,CAAC,CAAC;EAEtB,MAAM0B,UAAU,GAAG9B,OAAO,CACtB,MAAO4B,QAAQ,EAAET,MAAM,GAAGS,QAAQ,CAACT,MAAM,GAAG,EAAE,GAAG,CAAE,EACnD,CAACS,QAAQ,EAAET,MAAM,CACrB,CAAC;EAEDpB,SAAS,CAAC,MAAM;IACZ,MAAMgC,OAAO,GAAGC,QAAQ,CAACC,cAAc,CAAC,sBAAsBJ,IAAI,EAAE,CAAC;IAErE,IACIE,OAAO,KACLf,cAAc,EAAEkB,MAAM,KAAK,CAAC,IAAIlB,cAAc,CAAC,CAAC,CAAC,KAAK,KAAK,IACzDA,cAAc,EAAEkB,MAAM,KAAK,CAAC,CAAC,EACnC;MACER,mBAAmB,CAACrB,mBAAmB,CAAC0B,OAAO,CAAC,CAAC;IACrD,CAAC,MAAM;MACHL,mBAAmB,CAAC,EAAE,CAAC;IAC3B;EACJ,CAAC,EAAE,CAACG,IAAI,EAAET,QAAQ,EAAEJ,cAAc,CAAC,CAAC;EAEpC,MAAMmB,YAAY,GAAGrC,WAAW,CAC3BsC,KAAc,IAAK;IAChB,MAAM;MAAEC;IAAU,CAAC,GAAGD,KAAK,CAACE,MAAwB;IAEpDd,cAAc,CAACa,SAAS,GAAG,CAAC,CAAC;IAE7B,IACKrB,cAAc,EAAEkB,MAAM,KAAK,CAAC,IAAIlB,cAAc,CAAC,CAAC,CAAC,KAAK,KAAK,IAC5DA,cAAc,EAAEkB,MAAM,KAAK,CAAC,EAC9B;MACER,mBAAmB,CAACrB,mBAAmB,CAAC+B,KAAK,CAACE,MAAwB,CAAC,CAAC;IAC5E;EACJ,CAAC,EACD,CAACtB,cAAc,CACnB,CAAC;EAED,OAAOhB,OAAO,CACV,mBACIJ,KAAA,CAAA2C,aAAA,CAAChC,yBAAyB;IACtBM,GAAG,EAAEA,GAAI;IACT2B,MAAM,EAAEvB,KAAM;IACdwB,KAAK,EAAE;MAAEC,IAAI,EAAE3B,WAAW,CAAC4B,CAAC;MAAEC,GAAG,EAAE7B,WAAW,CAAC8B;IAAE,CAAE;IACnDC,OAAO,EAAE;MAAE3B,MAAM,EAAE,CAAC;MAAE4B,OAAO,EAAE;IAAE,CAAE;IACnCC,IAAI,EAAE;MAAE7B,MAAM,EAAE,CAAC;MAAE4B,OAAO,EAAE;IAAE,CAAE;IAChCE,OAAO,EAAE;MAAE9B,MAAM,EAAE,aAAa;MAAE4B,OAAO,EAAE;IAAE,CAAE;IAC/CG,UAAU,EAAE;MACRC,QAAQ,EAAE,GAAG;MACbC,IAAI,EAAE;IACV;EAAE,GAEDtC,aAAa,IAAIA,aAAa,EAAEoB,MAAM,GAAG,CAAC,iBACvCtC,KAAA,CAAA2C,aAAA,CAAC9B,uBAAuB;IACpBI,GAAG,EAAEc,OAAQ;IACb0B,YAAY,EAAE9B,WAAY;IAC1B+B,aAAa,EAAE,CAAC,CAAC7B;EAAiB,GAEjC,CAACH,uBAAuB,iBACrB1B,KAAA,CAAA2C,aAAA,CAACjC,aAAa;IACViD,KAAK,EAAEzC,aAAc;IACrB0C,IAAI,EAAE,CAAE;IACRC,QAAQ,EAAEpC,aAAc;IACxBqC,eAAe,EAAE1C;EAAe,CACnC,CACJ,eACDpB,KAAA,CAAA2C,aAAA,CAAC7B,gCAAgC,QAC5Be,gBAAgB,CAACkC,OAAO,CAAC,GAAG,EAAE,EAAE,CACH,CACb,CAC5B,eACD/D,KAAA,CAAA2C,aAAA,CAAC/B,0BAA0B;IACvBoD,OAAO,EAAEzC,MAAO;IAChB0C,WAAW,EAAE/B,UAAW;IACxBgC,GAAG,EAAC,SAAS;IACbC,EAAE,EAAE,sBAAsBlC,IAAI,EAAG;IACjCmC,QAAQ,EAAE9C,OAAQ;IAClB+C,QAAQ,EAAE,CAAE;IACZC,QAAQ,EAAE/B;EAAa,GAEtBf,QACuB,CACL,CAC9B,EACD,CACIF,OAAO,EACPE,QAAQ,EACRL,WAAW,CAAC4B,CAAC,EACb5B,WAAW,CAAC8B,CAAC,EACbpB,gBAAgB,EAChBX,aAAa,EACbqB,YAAY,EACZZ,WAAW,EACXO,UAAU,EACVX,MAAM,EACNE,aAAa,EACbR,GAAG,EACHG,cAAc,EACdM,uBAAuB,EACvBO,IAAI,EACJZ,KAAK,CAEb,CAAC;AACL,CACJ,CAAC;AAEDN,aAAa,CAACwD,WAAW,GAAG,eAAe;AAE3C,eAAexD,aAAa","ignoreList":[]}
@@ -5,7 +5,7 @@ export const StyledMotionSearchBoxBody = styled(motion.div)`
5
5
  let {
6
6
  theme
7
7
  } = _ref;
8
- return theme['101'];
8
+ return theme['100'];
9
9
  }};
10
10
  position: absolute;
11
11
  z-index: 4;
@@ -1 +1 @@
1
- {"version":3,"file":"SearchBoxBody.styles.js","names":["motion","styled","css","StyledMotionSearchBoxBody","div","_ref","theme","_ref2","$width","_ref3","StyledSearchBoxBodyHead","_ref4","$hasGroupName","_ref5","$hasScrolled","StyledSearchBoxBodyHeadGroupName","_ref6","text","StyledSearchBoxBodyContent","_ref7","$headHeight","_ref8","$height","_ref9","$browser"],"sources":["../../../../../src/components/search-box/search-box-body/SearchBoxBody.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport { BrowserName } from '../../../types/chayns';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledMotionSearchBoxBodyProps = WithTheme<{\n $width: number;\n}>;\n\nexport const StyledMotionSearchBoxBody = styled(motion.div)<StyledMotionSearchBoxBodyProps>`\n background: ${({ theme }: StyledMotionSearchBoxBodyProps) => theme['101']};\n position: absolute;\n z-index: 4;\n display: flex;\n flex-direction: column;\n border: 1px solid rgba(160, 160, 160, 0.3);\n border-bottom-left-radius: 3px;\n border-bottom-right-radius: 3px;\n border-top: none;\n width: ${({ $width }) => $width - 2}px;\n max-height: 300px;\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledMotionSearchBoxBodyProps) => theme['009-rgb']}, 0.08) inset;\n`;\n\nexport const StyledSearchBoxBodyHead = styled.div<StyledSearchBoxHeadProps>`\n padding: 10px 10px 5px;\n display: flex;\n flex-direction: column;\n\n ${({ $hasGroupName }) =>\n $hasGroupName &&\n css`\n gap: 15px;\n `}\n\n ${({ $hasScrolled }) =>\n $hasScrolled &&\n css`\n box-shadow: 0 1px 4px #0000001a;\n `}\n`;\n\ntype StyledSearchBoxHeadProps = WithTheme<{ $hasScrolled: boolean; $hasGroupName: boolean }>;\n\ntype StyledSearchBoxBodyHeadGroupNameNameProps = WithTheme<unknown>;\n\nexport const StyledSearchBoxBodyHeadGroupName = styled.div<StyledSearchBoxBodyHeadGroupNameNameProps>`\n color: ${({ theme }: StyledSearchBoxBodyHeadGroupNameNameProps) => theme.text};\n font-weight: bold;\n`;\n\ntype StyledSearchBoxBodyContentProps = WithTheme<{\n $height: number;\n $headHeight: number;\n $browser: BrowserName;\n}>;\n\nexport const StyledSearchBoxBodyContent = styled.div<StyledSearchBoxBodyContentProps>`\n display: flex;\n flex-direction: column;\n cursor: pointer;\n width: 100%;\n max-height: ${({ $headHeight }) => 300 - $headHeight}px;\n overflow-y: ${({ $height, $headHeight }) => ($height + $headHeight <= 300 ? 'hidden' : 'auto')};\n\n // Styles for custom scrollbar\n ${({ $browser, theme }: StyledSearchBoxBodyContentProps) =>\n $browser === 'firefox'\n ? css`\n scrollbar-color: rgba(${theme['text-rgb']}, 0.15) transparent;\n scrollbar-width: thin;\n `\n : css`\n &::-webkit-scrollbar {\n width: 5px;\n }\n\n &::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n &::-webkit-scrollbar-button {\n background-color: transparent;\n height: 5px;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: rgba(${theme['text-rgb']}, 0.15);\n border-radius: 20px;\n }\n `}\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,cAAc;AACrC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAQ/C,OAAO,MAAMC,yBAAyB,GAAGF,MAAM,CAACD,MAAM,CAACI,GAAG,CAAiC;AAC3F,kBAAkBC,IAAA;EAAA,IAAC;IAAEC;EAAsC,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAAC,KAAK,CAAC;AAAA;AAC7E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAaC,KAAA;EAAA,IAAC;IAAEC;EAAO,CAAC,GAAAD,KAAA;EAAA,OAAKC,MAAM,GAAG,CAAC;AAAA;AACvC;AACA;AACA,eAAeC,KAAA;EAAA,IAAC;IAAEH;EAAsC,CAAC,GAAAG,KAAA;EAAA,OAAKH,KAAK,CAAC,SAAS,CAAC;AAAA;AAC9E,CAAC;AAED,OAAO,MAAMI,uBAAuB,GAAGT,MAAM,CAACG,GAA6B;AAC3E;AACA;AACA;AACA;AACA,MAAMO,KAAA;EAAA,IAAC;IAAEC;EAAc,CAAC,GAAAD,KAAA;EAAA,OAChBC,aAAa,IACbV,GAAG;AACX;AACA,SAAS;AAAA;AACT;AACA,MAAMW,KAAA;EAAA,IAAC;IAAEC;EAAa,CAAC,GAAAD,KAAA;EAAA,OACfC,YAAY,IACZZ,GAAG;AACX;AACA,SAAS;AAAA;AACT,CAAC;AAMD,OAAO,MAAMa,gCAAgC,GAAGd,MAAM,CAACG,GAA8C;AACrG,aAAaY,KAAA;EAAA,IAAC;IAAEV;EAAiD,CAAC,GAAAU,KAAA;EAAA,OAAKV,KAAK,CAACW,IAAI;AAAA;AACjF;AACA,CAAC;AAQD,OAAO,MAAMC,0BAA0B,GAAGjB,MAAM,CAACG,GAAoC;AACrF;AACA;AACA;AACA;AACA,kBAAkBe,KAAA;EAAA,IAAC;IAAEC;EAAY,CAAC,GAAAD,KAAA;EAAA,OAAK,GAAG,GAAGC,WAAW;AAAA;AACxD,kBAAkBC,KAAA;EAAA,IAAC;IAAEC,OAAO;IAAEF;EAAY,CAAC,GAAAC,KAAA;EAAA,OAAMC,OAAO,GAAGF,WAAW,IAAI,GAAG,GAAG,QAAQ,GAAG,MAAM;AAAA,CAAC;AAClG;AACA;AACA,MAAMG,KAAA;EAAA,IAAC;IAAEC,QAAQ;IAAElB;EAAuC,CAAC,GAAAiB,KAAA;EAAA,OACnDC,QAAQ,KAAK,SAAS,GAChBtB,GAAG;AACjB,0CAA0CI,KAAK,CAAC,UAAU,CAAC;AAC3D;AACA,eAAe,GACDJ,GAAG;AACjB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,+CAA+CI,KAAK,CAAC,UAAU,CAAC;AAChE;AACA;AACA,eAAe;AAAA;AACf,CAAC","ignoreList":[]}
1
+ {"version":3,"file":"SearchBoxBody.styles.js","names":["motion","styled","css","StyledMotionSearchBoxBody","div","_ref","theme","_ref2","$width","_ref3","StyledSearchBoxBodyHead","_ref4","$hasGroupName","_ref5","$hasScrolled","StyledSearchBoxBodyHeadGroupName","_ref6","text","StyledSearchBoxBodyContent","_ref7","$headHeight","_ref8","$height","_ref9","$browser"],"sources":["../../../../../src/components/search-box/search-box-body/SearchBoxBody.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport { BrowserName } from '../../../types/chayns';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledMotionSearchBoxBodyProps = WithTheme<{\n $width: number;\n}>;\n\nexport const StyledMotionSearchBoxBody = styled(motion.div)<StyledMotionSearchBoxBodyProps>`\n background: ${({ theme }: StyledMotionSearchBoxBodyProps) => theme['100']};\n position: absolute;\n z-index: 4;\n display: flex;\n flex-direction: column;\n border: 1px solid rgba(160, 160, 160, 0.3);\n border-bottom-left-radius: 3px;\n border-bottom-right-radius: 3px;\n border-top: none;\n width: ${({ $width }) => $width - 2}px;\n max-height: 300px;\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledMotionSearchBoxBodyProps) => theme['009-rgb']}, 0.08) inset;\n`;\n\nexport const StyledSearchBoxBodyHead = styled.div<StyledSearchBoxHeadProps>`\n padding: 10px 10px 5px;\n display: flex;\n flex-direction: column;\n\n ${({ $hasGroupName }) =>\n $hasGroupName &&\n css`\n gap: 15px;\n `}\n\n ${({ $hasScrolled }) =>\n $hasScrolled &&\n css`\n box-shadow: 0 1px 4px #0000001a;\n `}\n`;\n\ntype StyledSearchBoxHeadProps = WithTheme<{ $hasScrolled: boolean; $hasGroupName: boolean }>;\n\ntype StyledSearchBoxBodyHeadGroupNameNameProps = WithTheme<unknown>;\n\nexport const StyledSearchBoxBodyHeadGroupName = styled.div<StyledSearchBoxBodyHeadGroupNameNameProps>`\n color: ${({ theme }: StyledSearchBoxBodyHeadGroupNameNameProps) => theme.text};\n font-weight: bold;\n`;\n\ntype StyledSearchBoxBodyContentProps = WithTheme<{\n $height: number;\n $headHeight: number;\n $browser: BrowserName;\n}>;\n\nexport const StyledSearchBoxBodyContent = styled.div<StyledSearchBoxBodyContentProps>`\n display: flex;\n flex-direction: column;\n cursor: pointer;\n width: 100%;\n max-height: ${({ $headHeight }) => 300 - $headHeight}px;\n overflow-y: ${({ $height, $headHeight }) => ($height + $headHeight <= 300 ? 'hidden' : 'auto')};\n\n // Styles for custom scrollbar\n ${({ $browser, theme }: StyledSearchBoxBodyContentProps) =>\n $browser === 'firefox'\n ? css`\n scrollbar-color: rgba(${theme['text-rgb']}, 0.15) transparent;\n scrollbar-width: thin;\n `\n : css`\n &::-webkit-scrollbar {\n width: 5px;\n }\n\n &::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n &::-webkit-scrollbar-button {\n background-color: transparent;\n height: 5px;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: rgba(${theme['text-rgb']}, 0.15);\n border-radius: 20px;\n }\n `}\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,cAAc;AACrC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAQ/C,OAAO,MAAMC,yBAAyB,GAAGF,MAAM,CAACD,MAAM,CAACI,GAAG,CAAiC;AAC3F,kBAAkBC,IAAA;EAAA,IAAC;IAAEC;EAAsC,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAAC,KAAK,CAAC;AAAA;AAC7E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAaC,KAAA;EAAA,IAAC;IAAEC;EAAO,CAAC,GAAAD,KAAA;EAAA,OAAKC,MAAM,GAAG,CAAC;AAAA;AACvC;AACA;AACA,eAAeC,KAAA;EAAA,IAAC;IAAEH;EAAsC,CAAC,GAAAG,KAAA;EAAA,OAAKH,KAAK,CAAC,SAAS,CAAC;AAAA;AAC9E,CAAC;AAED,OAAO,MAAMI,uBAAuB,GAAGT,MAAM,CAACG,GAA6B;AAC3E;AACA;AACA;AACA;AACA,MAAMO,KAAA;EAAA,IAAC;IAAEC;EAAc,CAAC,GAAAD,KAAA;EAAA,OAChBC,aAAa,IACbV,GAAG;AACX;AACA,SAAS;AAAA;AACT;AACA,MAAMW,KAAA;EAAA,IAAC;IAAEC;EAAa,CAAC,GAAAD,KAAA;EAAA,OACfC,YAAY,IACZZ,GAAG;AACX;AACA,SAAS;AAAA;AACT,CAAC;AAMD,OAAO,MAAMa,gCAAgC,GAAGd,MAAM,CAACG,GAA8C;AACrG,aAAaY,KAAA;EAAA,IAAC;IAAEV;EAAiD,CAAC,GAAAU,KAAA;EAAA,OAAKV,KAAK,CAACW,IAAI;AAAA;AACjF;AACA,CAAC;AAQD,OAAO,MAAMC,0BAA0B,GAAGjB,MAAM,CAACG,GAAoC;AACrF;AACA;AACA;AACA;AACA,kBAAkBe,KAAA;EAAA,IAAC;IAAEC;EAAY,CAAC,GAAAD,KAAA;EAAA,OAAK,GAAG,GAAGC,WAAW;AAAA;AACxD,kBAAkBC,KAAA;EAAA,IAAC;IAAEC,OAAO;IAAEF;EAAY,CAAC,GAAAC,KAAA;EAAA,OAAMC,OAAO,GAAGF,WAAW,IAAI,GAAG,GAAG,QAAQ,GAAG,MAAM;AAAA,CAAC;AAClG;AACA;AACA,MAAMG,KAAA;EAAA,IAAC;IAAEC,QAAQ;IAAElB;EAAuC,CAAC,GAAAiB,KAAA;EAAA,OACnDC,QAAQ,KAAK,SAAS,GAChBtB,GAAG;AACjB,0CAA0CI,KAAK,CAAC,UAAU,CAAC;AAC3D;AACA,eAAe,GACDJ,GAAG;AACjB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,+CAA+CI,KAAK,CAAC,UAAU,CAAC;AAChE;AACA;AACA,eAAe;AAAA;AACf,CAAC","ignoreList":[]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@chayns-components/core",
3
- "version": "5.0.0-beta.1011",
3
+ "version": "5.0.0-beta.1013",
4
4
  "description": "A set of beautiful React components for developing your own applications with chayns.",
5
5
  "sideEffects": false,
6
6
  "browserslist": [
@@ -88,5 +88,5 @@
88
88
  "publishConfig": {
89
89
  "access": "public"
90
90
  },
91
- "gitHead": "b7e6643330a3494caf033be596e68c030e8610ad"
91
+ "gitHead": "8d1e3303db8d9eeeacb6858cf19fa6e38785ad7e"
92
92
  }