@chayns-components/core 5.0.0-beta.885 → 5.0.0-beta.889

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 (33) hide show
  1. package/lib/cjs/components/accordion/accordion-content/AccordionContent.js +4 -2
  2. package/lib/cjs/components/accordion/accordion-content/AccordionContent.js.map +1 -1
  3. package/lib/cjs/components/accordion/accordion-content/AccordionContent.styles.js +6 -0
  4. package/lib/cjs/components/accordion/accordion-content/AccordionContent.styles.js.map +1 -1
  5. package/lib/cjs/components/mention-finder/MentionFinder.js.map +1 -1
  6. package/lib/cjs/components/mention-finder/mention-finder-item/MentionFinderItem.js +4 -3
  7. package/lib/cjs/components/mention-finder/mention-finder-item/MentionFinderItem.js.map +1 -1
  8. package/lib/cjs/components/mention-finder/mention-finder-item/MentionFinderItem.styles.js +3 -1
  9. package/lib/cjs/components/mention-finder/mention-finder-item/MentionFinderItem.styles.js.map +1 -1
  10. package/lib/cjs/components/slider/Slider.js +24 -7
  11. package/lib/cjs/components/slider/Slider.js.map +1 -1
  12. package/lib/cjs/components/slider/Slider.styles.js +6 -1
  13. package/lib/cjs/components/slider/Slider.styles.js.map +1 -1
  14. package/lib/esm/components/accordion/accordion-content/AccordionContent.js +4 -2
  15. package/lib/esm/components/accordion/accordion-content/AccordionContent.js.map +1 -1
  16. package/lib/esm/components/accordion/accordion-content/AccordionContent.styles.js +12 -3
  17. package/lib/esm/components/accordion/accordion-content/AccordionContent.styles.js.map +1 -1
  18. package/lib/esm/components/mention-finder/MentionFinder.js.map +1 -1
  19. package/lib/esm/components/mention-finder/mention-finder-item/MentionFinderItem.js +4 -3
  20. package/lib/esm/components/mention-finder/mention-finder-item/MentionFinderItem.js.map +1 -1
  21. package/lib/esm/components/mention-finder/mention-finder-item/MentionFinderItem.styles.js +10 -5
  22. package/lib/esm/components/mention-finder/mention-finder-item/MentionFinderItem.styles.js.map +1 -1
  23. package/lib/esm/components/slider/Slider.js +24 -7
  24. package/lib/esm/components/slider/Slider.js.map +1 -1
  25. package/lib/esm/components/slider/Slider.styles.js +20 -9
  26. package/lib/esm/components/slider/Slider.styles.js.map +1 -1
  27. package/lib/types/components/accordion/accordion-content/AccordionContent.d.ts +4 -0
  28. package/lib/types/components/accordion/accordion-content/AccordionContent.styles.d.ts +1 -0
  29. package/lib/types/components/mention-finder/MentionFinder.d.ts +1 -0
  30. package/lib/types/components/mention-finder/mention-finder-item/MentionFinderItem.styles.d.ts +4 -1
  31. package/lib/types/components/slider/Slider.d.ts +4 -0
  32. package/lib/types/components/slider/Slider.styles.d.ts +4 -1
  33. package/package.json +10 -10
@@ -15,8 +15,17 @@ export const StyledAccordionContent = styled.div`
15
15
 
16
16
  ${_ref3 => {
17
17
  let {
18
- $maxHeight
18
+ $shouldPreventBottomSpace
19
19
  } = _ref3;
20
+ return $shouldPreventBottomSpace && css`
21
+ padding-bottom: 0;
22
+ `;
23
+ }}
24
+
25
+ ${_ref4 => {
26
+ let {
27
+ $maxHeight
28
+ } = _ref4;
20
29
  return typeof $maxHeight === 'number' && css`
21
30
  max-height: ${$maxHeight}px;
22
31
  overflow-y: scroll;
@@ -24,11 +33,11 @@ export const StyledAccordionContent = styled.div`
24
33
  }}
25
34
 
26
35
  // Styles for custom scrollbar
27
- ${_ref4 => {
36
+ ${_ref5 => {
28
37
  let {
29
38
  $browser,
30
39
  theme
31
- } = _ref4;
40
+ } = _ref5;
32
41
  return $browser === 'firefox' ? css`
33
42
  scrollbar-color: rgba(${theme['text-rgb']}, 0.15) transparent;
34
43
  scrollbar-width: thin;
@@ -1 +1 @@
1
- {"version":3,"file":"AccordionContent.styles.js","names":["styled","css","StyledAccordionContent","div","_ref","theme","text","_ref2","$isWrapped","_ref3","$maxHeight","_ref4","$browser"],"sources":["../../../../../src/components/accordion/accordion-content/AccordionContent.styles.ts"],"sourcesContent":["import type { Browser } from 'detect-browser';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledAccordionContentProps = WithTheme<{\n $isWrapped?: boolean;\n $maxHeight?: number;\n $browser: Browser | 'bot' | null | undefined;\n}>;\n\nexport const StyledAccordionContent = styled.div<StyledAccordionContentProps>`\n color: ${({ theme }: StyledAccordionContentProps) => theme.text};\n padding: ${({ $isWrapped }) => ($isWrapped ? '0 9px 18px 26px' : '0 9px 9px 10px')};\n\n ${({ $maxHeight }) =>\n typeof $maxHeight === 'number' &&\n css`\n max-height: ${$maxHeight}px;\n overflow-y: scroll;\n `}\n\n // Styles for custom scrollbar\n ${({ $browser, theme }: StyledAccordionContentProps) =>\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":"AACA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAS/C,OAAO,MAAMC,sBAAsB,GAAGF,MAAM,CAACG,GAAgC;AAC7E,aAAaC,IAAA;EAAA,IAAC;IAAEC;EAAmC,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAACC,IAAI;AAAA;AACnE,eAAeC,KAAA;EAAA,IAAC;IAAEC;EAAW,CAAC,GAAAD,KAAA;EAAA,OAAMC,UAAU,GAAG,iBAAiB,GAAG,gBAAgB;AAAA,CAAC;AACtF;AACA,MAAMC,KAAA;EAAA,IAAC;IAAEC;EAAW,CAAC,GAAAD,KAAA;EAAA,OACb,OAAOC,UAAU,KAAK,QAAQ,IAC9BT,GAAG;AACX,0BAA0BS,UAAU;AACpC;AACA,SAAS;AAAA;AACT;AACA;AACA,MAAMC,KAAA;EAAA,IAAC;IAAEC,QAAQ;IAAEP;EAAmC,CAAC,GAAAM,KAAA;EAAA,OAC/CC,QAAQ,KAAK,SAAS,GAChBX,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":"AccordionContent.styles.js","names":["styled","css","StyledAccordionContent","div","_ref","theme","text","_ref2","$isWrapped","_ref3","$shouldPreventBottomSpace","_ref4","$maxHeight","_ref5","$browser"],"sources":["../../../../../src/components/accordion/accordion-content/AccordionContent.styles.ts"],"sourcesContent":["import type { Browser } from 'detect-browser';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledAccordionContentProps = WithTheme<{\n $isWrapped?: boolean;\n $maxHeight?: number;\n $browser: Browser | 'bot' | null | undefined;\n $shouldPreventBottomSpace: boolean;\n}>;\n\nexport const StyledAccordionContent = styled.div<StyledAccordionContentProps>`\n color: ${({ theme }: StyledAccordionContentProps) => theme.text};\n padding: ${({ $isWrapped }) => ($isWrapped ? '0 9px 18px 26px' : '0 9px 9px 10px')};\n\n ${({ $shouldPreventBottomSpace }) =>\n $shouldPreventBottomSpace &&\n css`\n padding-bottom: 0;\n `}\n\n ${({ $maxHeight }) =>\n typeof $maxHeight === 'number' &&\n css`\n max-height: ${$maxHeight}px;\n overflow-y: scroll;\n `}\n\n // Styles for custom scrollbar\n ${({ $browser, theme }: StyledAccordionContentProps) =>\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":"AACA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAU/C,OAAO,MAAMC,sBAAsB,GAAGF,MAAM,CAACG,GAAgC;AAC7E,aAAaC,IAAA;EAAA,IAAC;IAAEC;EAAmC,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAACC,IAAI;AAAA;AACnE,eAAeC,KAAA;EAAA,IAAC;IAAEC;EAAW,CAAC,GAAAD,KAAA;EAAA,OAAMC,UAAU,GAAG,iBAAiB,GAAG,gBAAgB;AAAA,CAAC;AACtF;AACA,MAAMC,KAAA;EAAA,IAAC;IAAEC;EAA0B,CAAC,GAAAD,KAAA;EAAA,OAC5BC,yBAAyB,IACzBT,GAAG;AACX;AACA,SAAS;AAAA;AACT;AACA,MAAMU,KAAA;EAAA,IAAC;IAAEC;EAAW,CAAC,GAAAD,KAAA;EAAA,OACb,OAAOC,UAAU,KAAK,QAAQ,IAC9BX,GAAG;AACX,0BAA0BW,UAAU;AACpC;AACA,SAAS;AAAA;AACT;AACA;AACA,MAAMC,KAAA;EAAA,IAAC;IAAEC,QAAQ;IAAET;EAAmC,CAAC,GAAAQ,KAAA;EAAA,OAC/CC,QAAQ,KAAK,SAAS,GAChBb,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 +1 @@
1
- {"version":3,"file":"MentionFinder.js","names":["AnimatePresence","React","useCallback","useEffect","useMemo","useRef","useState","MentionFinderItem","StyledMentionFinder","StyledMotionMentionFinderPopup","MentionFinder","_ref","inputValue","members","onSelect","popupAlignment","activeMember","setActiveMember","focusedIndex","setFocusedIndex","ref","fullMatch","searchString","regExpMatchArray","match","toLowerCase","filteredMembers","filter","_ref2","id","info","name","includes","replace","handleKeyDown","event","key","preventDefault","children","current","length","newIndex","prevElement","tabIndex","member","newElement","focus","stopPropagation","handleMemberClick","handleMemberHover","isActiveMemberShown","some","_ref3","items","map","createElement","isActive","onClick","onHover","shouldShowPopup","window","addEventListener","removeEventListener","className","initial","animate","height","opacity","exit","$popupAlignment","transition","duration","displayName"],"sources":["../../../../src/components/mention-finder/MentionFinder.tsx"],"sourcesContent":["import { AnimatePresence } from 'framer-motion';\nimport React, { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport type { MentionFinderPopupAlignment } from '../../constants/mentionFinder';\nimport MentionFinderItem from './mention-finder-item/MentionFinderItem';\nimport { StyledMentionFinder, StyledMotionMentionFinderPopup } from './MentionFinder.styles';\n\nexport type MentionMember = {\n id: string;\n info: string;\n imageUrl: string;\n name: string;\n};\n\nexport type MentionFinderProps = {\n /**\n * The text from the input field\n */\n inputValue: string;\n /**\n * Members that can be selected\n */\n members: MentionMember[];\n /**\n * Function to be executed when a member is selected\n */\n onSelect: ({ fullMatch, member }: { fullMatch: string; member: MentionMember }) => void;\n /**\n * Alignment of the popup\n */\n popupAlignment: MentionFinderPopupAlignment;\n};\n\nconst MentionFinder: FC<MentionFinderProps> = ({\n inputValue,\n members,\n onSelect,\n popupAlignment,\n}) => {\n const [activeMember, setActiveMember] = useState(members[0]);\n const [focusedIndex, setFocusedIndex] = useState(0);\n\n const ref = useRef<HTMLDivElement>(null);\n\n const [fullMatch, searchString] = useMemo(() => {\n // eslint-disable-next-line no-irregular-whitespace\n const regExpMatchArray = inputValue.match(/@([^\\s​]*)/);\n\n return [regExpMatchArray?.[0], regExpMatchArray?.[1]?.toLowerCase() ?? ''];\n }, [inputValue]);\n\n const filteredMembers = useMemo(\n () =>\n searchString !== ''\n ? members.filter(\n ({ id, info, name }) =>\n id.toLowerCase().includes(searchString) ||\n info.replace('chayns', '').toLowerCase().includes(searchString) ||\n name.toLowerCase().includes(searchString),\n )\n : members,\n [members, searchString],\n );\n\n const handleKeyDown = useCallback(\n (event: KeyboardEvent) => {\n if (event.key === 'ArrowUp' || event.key === 'ArrowDown') {\n event.preventDefault();\n\n const children = ref.current?.children;\n\n if (children && children.length > 0) {\n const newIndex =\n focusedIndex !== null\n ? (focusedIndex +\n (event.key === 'ArrowUp' ? -1 : 1) +\n children.length) %\n children.length\n : 0;\n\n if (focusedIndex !== null) {\n const prevElement = children[focusedIndex] as HTMLDivElement;\n prevElement.tabIndex = -1;\n }\n\n setFocusedIndex(newIndex);\n\n const member = filteredMembers[newIndex];\n\n setActiveMember(member);\n\n const newElement = children[newIndex] as HTMLDivElement;\n newElement.tabIndex = 0;\n newElement.focus();\n }\n } else if (event.key === 'Enter') {\n event.preventDefault();\n event.stopPropagation();\n\n if (fullMatch && activeMember) {\n onSelect({ fullMatch, member: activeMember });\n }\n }\n },\n [activeMember, filteredMembers, focusedIndex, fullMatch, onSelect],\n );\n\n const handleMemberClick = useCallback(\n (member: MentionMember) => {\n if (fullMatch) {\n onSelect({ fullMatch, member });\n }\n },\n [fullMatch, onSelect],\n );\n\n const handleMemberHover = useCallback((member: MentionMember) => {\n setActiveMember(member);\n }, []);\n\n useEffect(() => {\n if (filteredMembers.length > 0) {\n const isActiveMemberShown = filteredMembers.some(({ id }) => id === activeMember?.id);\n\n if (!isActiveMemberShown) {\n setActiveMember(filteredMembers[0]);\n }\n }\n }, [activeMember?.id, filteredMembers]);\n\n const items = useMemo(\n () =>\n filteredMembers.map((member) => (\n <MentionFinderItem\n isActive={member.id === activeMember?.id}\n key={member.id}\n member={member}\n onClick={handleMemberClick}\n onHover={handleMemberHover}\n />\n )),\n [activeMember, filteredMembers, handleMemberClick, handleMemberHover],\n );\n\n const shouldShowPopup = useMemo(() => fullMatch && items.length > 0, [fullMatch, items.length]);\n\n useEffect(() => {\n if (shouldShowPopup) {\n window.addEventListener('keydown', handleKeyDown, true);\n }\n\n return () => {\n window.removeEventListener('keydown', handleKeyDown, true);\n };\n }, [handleKeyDown, shouldShowPopup]);\n\n return (\n <StyledMentionFinder className=\"beta-chayns-mention-finder\">\n <AnimatePresence initial={false}>\n {shouldShowPopup && (\n <StyledMotionMentionFinderPopup\n ref={ref}\n animate={{ height: 'auto', opacity: 1 }}\n className=\"prevent-lose-focus\"\n exit={{ height: 0, opacity: 0 }}\n initial={{ height: 0, opacity: 0 }}\n $popupAlignment={popupAlignment}\n transition={{ duration: 0.15 }}\n tabIndex={0}\n >\n {items}\n </StyledMotionMentionFinderPopup>\n )}\n </AnimatePresence>\n </StyledMentionFinder>\n );\n};\n\nMentionFinder.displayName = 'MentionFinder';\n\nexport default MentionFinder;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"MentionFinder.js","names":["AnimatePresence","React","useCallback","useEffect","useMemo","useRef","useState","MentionFinderItem","StyledMentionFinder","StyledMotionMentionFinderPopup","MentionFinder","_ref","inputValue","members","onSelect","popupAlignment","activeMember","setActiveMember","focusedIndex","setFocusedIndex","ref","fullMatch","searchString","regExpMatchArray","match","toLowerCase","filteredMembers","filter","_ref2","id","info","name","includes","replace","handleKeyDown","event","key","preventDefault","children","current","length","newIndex","prevElement","tabIndex","member","newElement","focus","stopPropagation","handleMemberClick","handleMemberHover","isActiveMemberShown","some","_ref3","items","map","createElement","isActive","onClick","onHover","shouldShowPopup","window","addEventListener","removeEventListener","className","initial","animate","height","opacity","exit","$popupAlignment","transition","duration","displayName"],"sources":["../../../../src/components/mention-finder/MentionFinder.tsx"],"sourcesContent":["import { AnimatePresence } from 'framer-motion';\nimport React, { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport type { MentionFinderPopupAlignment } from '../../constants/mentionFinder';\nimport MentionFinderItem from './mention-finder-item/MentionFinderItem';\nimport { StyledMentionFinder, StyledMotionMentionFinderPopup } from './MentionFinder.styles';\n\nexport type MentionMember = {\n id: string;\n info: string;\n imageUrl: string;\n name: string;\n shouldShowRoundImage?: boolean;\n};\n\nexport type MentionFinderProps = {\n /**\n * The text from the input field\n */\n inputValue: string;\n /**\n * Members that can be selected\n */\n members: MentionMember[];\n /**\n * Function to be executed when a member is selected\n */\n onSelect: ({ fullMatch, member }: { fullMatch: string; member: MentionMember }) => void;\n /**\n * Alignment of the popup\n */\n popupAlignment: MentionFinderPopupAlignment;\n};\n\nconst MentionFinder: FC<MentionFinderProps> = ({\n inputValue,\n members,\n onSelect,\n popupAlignment,\n}) => {\n const [activeMember, setActiveMember] = useState(members[0]);\n const [focusedIndex, setFocusedIndex] = useState(0);\n\n const ref = useRef<HTMLDivElement>(null);\n\n const [fullMatch, searchString] = useMemo(() => {\n // eslint-disable-next-line no-irregular-whitespace\n const regExpMatchArray = inputValue.match(/@([^\\s​]*)/);\n\n return [regExpMatchArray?.[0], regExpMatchArray?.[1]?.toLowerCase() ?? ''];\n }, [inputValue]);\n\n const filteredMembers = useMemo(\n () =>\n searchString !== ''\n ? members.filter(\n ({ id, info, name }) =>\n id.toLowerCase().includes(searchString) ||\n info.replace('chayns', '').toLowerCase().includes(searchString) ||\n name.toLowerCase().includes(searchString),\n )\n : members,\n [members, searchString],\n );\n\n const handleKeyDown = useCallback(\n (event: KeyboardEvent) => {\n if (event.key === 'ArrowUp' || event.key === 'ArrowDown') {\n event.preventDefault();\n\n const children = ref.current?.children;\n\n if (children && children.length > 0) {\n const newIndex =\n focusedIndex !== null\n ? (focusedIndex +\n (event.key === 'ArrowUp' ? -1 : 1) +\n children.length) %\n children.length\n : 0;\n\n if (focusedIndex !== null) {\n const prevElement = children[focusedIndex] as HTMLDivElement;\n prevElement.tabIndex = -1;\n }\n\n setFocusedIndex(newIndex);\n\n const member = filteredMembers[newIndex];\n\n setActiveMember(member);\n\n const newElement = children[newIndex] as HTMLDivElement;\n newElement.tabIndex = 0;\n newElement.focus();\n }\n } else if (event.key === 'Enter') {\n event.preventDefault();\n event.stopPropagation();\n\n if (fullMatch && activeMember) {\n onSelect({ fullMatch, member: activeMember });\n }\n }\n },\n [activeMember, filteredMembers, focusedIndex, fullMatch, onSelect],\n );\n\n const handleMemberClick = useCallback(\n (member: MentionMember) => {\n if (fullMatch) {\n onSelect({ fullMatch, member });\n }\n },\n [fullMatch, onSelect],\n );\n\n const handleMemberHover = useCallback((member: MentionMember) => {\n setActiveMember(member);\n }, []);\n\n useEffect(() => {\n if (filteredMembers.length > 0) {\n const isActiveMemberShown = filteredMembers.some(({ id }) => id === activeMember?.id);\n\n if (!isActiveMemberShown) {\n setActiveMember(filteredMembers[0]);\n }\n }\n }, [activeMember?.id, filteredMembers]);\n\n const items = useMemo(\n () =>\n filteredMembers.map((member) => (\n <MentionFinderItem\n isActive={member.id === activeMember?.id}\n key={member.id}\n member={member}\n onClick={handleMemberClick}\n onHover={handleMemberHover}\n />\n )),\n [activeMember, filteredMembers, handleMemberClick, handleMemberHover],\n );\n\n const shouldShowPopup = useMemo(() => fullMatch && items.length > 0, [fullMatch, items.length]);\n\n useEffect(() => {\n if (shouldShowPopup) {\n window.addEventListener('keydown', handleKeyDown, true);\n }\n\n return () => {\n window.removeEventListener('keydown', handleKeyDown, true);\n };\n }, [handleKeyDown, shouldShowPopup]);\n\n return (\n <StyledMentionFinder className=\"beta-chayns-mention-finder\">\n <AnimatePresence initial={false}>\n {shouldShowPopup && (\n <StyledMotionMentionFinderPopup\n ref={ref}\n animate={{ height: 'auto', opacity: 1 }}\n className=\"prevent-lose-focus\"\n exit={{ height: 0, opacity: 0 }}\n initial={{ height: 0, opacity: 0 }}\n $popupAlignment={popupAlignment}\n transition={{ duration: 0.15 }}\n tabIndex={0}\n >\n {items}\n </StyledMotionMentionFinderPopup>\n )}\n </AnimatePresence>\n </StyledMentionFinder>\n );\n};\n\nMentionFinder.displayName = 'MentionFinder';\n\nexport default MentionFinder;\n"],"mappings":"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","ignoreList":[]}
@@ -11,11 +11,12 @@ const MentionFinderItem = _ref => {
11
11
  const handleItemMouseEnter = useCallback(() => onHover(member), [member, onHover]);
12
12
  return /*#__PURE__*/React.createElement(StyledMentionFinderItem, {
13
13
  className: "prevent-lose-focus",
14
- $isActive: isActive,
15
14
  onClick: handleItemClick,
16
- onMouseEnter: handleItemMouseEnter
15
+ onMouseEnter: handleItemMouseEnter,
16
+ $isActive: isActive
17
17
  }, /*#__PURE__*/React.createElement(StyledMentionFinderItemImage, {
18
- src: member.imageUrl
18
+ src: member.imageUrl,
19
+ $shouldShowRoundImage: member.shouldShowRoundImage
19
20
  }), /*#__PURE__*/React.createElement(StyledMentionFinderItemContent, null, /*#__PURE__*/React.createElement(StyledMentionFinderItemContentName, null, member.name), /*#__PURE__*/React.createElement(StyledMentionFinderItemContentInfo, null, member.info)));
20
21
  };
21
22
  MentionFinderItem.displayName = 'MentionFinderItem';
@@ -1 +1 @@
1
- {"version":3,"file":"MentionFinderItem.js","names":["React","useCallback","StyledMentionFinderItem","StyledMentionFinderItemContent","StyledMentionFinderItemContentInfo","StyledMentionFinderItemContentName","StyledMentionFinderItemImage","MentionFinderItem","_ref","isActive","member","onClick","onHover","handleItemClick","handleItemMouseEnter","createElement","className","$isActive","onMouseEnter","src","imageUrl","name","info","displayName"],"sources":["../../../../../src/components/mention-finder/mention-finder-item/MentionFinderItem.tsx"],"sourcesContent":["import React, { FC, useCallback } from 'react';\nimport type { MentionMember } from '../MentionFinder';\nimport {\n StyledMentionFinderItem,\n StyledMentionFinderItemContent,\n StyledMentionFinderItemContentInfo,\n StyledMentionFinderItemContentName,\n StyledMentionFinderItemImage,\n} from './MentionFinderItem.styles';\n\nexport type MentionFinderItemProps = {\n isActive: boolean;\n member: MentionMember;\n onClick: (member: MentionMember) => void;\n onHover: (member: MentionMember) => void;\n};\n\nconst MentionFinderItem: FC<MentionFinderItemProps> = ({ isActive, member, onClick, onHover }) => {\n const handleItemClick = useCallback(() => onClick(member), [member, onClick]);\n\n const handleItemMouseEnter = useCallback(() => onHover(member), [member, onHover]);\n\n return (\n <StyledMentionFinderItem\n className=\"prevent-lose-focus\"\n $isActive={isActive}\n onClick={handleItemClick}\n onMouseEnter={handleItemMouseEnter}\n >\n <StyledMentionFinderItemImage src={member.imageUrl} />\n <StyledMentionFinderItemContent>\n <StyledMentionFinderItemContentName>\n {member.name}\n </StyledMentionFinderItemContentName>\n <StyledMentionFinderItemContentInfo>\n {member.info}\n </StyledMentionFinderItemContentInfo>\n </StyledMentionFinderItemContent>\n </StyledMentionFinderItem>\n );\n};\n\nMentionFinderItem.displayName = 'MentionFinderItem';\n\nexport default MentionFinderItem;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAQC,WAAW,QAAQ,OAAO;AAE9C,SACIC,uBAAuB,EACvBC,8BAA8B,EAC9BC,kCAAkC,EAClCC,kCAAkC,EAClCC,4BAA4B,QACzB,4BAA4B;AASnC,MAAMC,iBAA6C,GAAGC,IAAA,IAA4C;EAAA,IAA3C;IAAEC,QAAQ;IAAEC,MAAM;IAAEC,OAAO;IAAEC;EAAQ,CAAC,GAAAJ,IAAA;EACzF,MAAMK,eAAe,GAAGZ,WAAW,CAAC,MAAMU,OAAO,CAACD,MAAM,CAAC,EAAE,CAACA,MAAM,EAAEC,OAAO,CAAC,CAAC;EAE7E,MAAMG,oBAAoB,GAAGb,WAAW,CAAC,MAAMW,OAAO,CAACF,MAAM,CAAC,EAAE,CAACA,MAAM,EAAEE,OAAO,CAAC,CAAC;EAElF,oBACIZ,KAAA,CAAAe,aAAA,CAACb,uBAAuB;IACpBc,SAAS,EAAC,oBAAoB;IAC9BC,SAAS,EAAER,QAAS;IACpBE,OAAO,EAAEE,eAAgB;IACzBK,YAAY,EAAEJ;EAAqB,gBAEnCd,KAAA,CAAAe,aAAA,CAACT,4BAA4B;IAACa,GAAG,EAAET,MAAM,CAACU;EAAS,CAAE,CAAC,eACtDpB,KAAA,CAAAe,aAAA,CAACZ,8BAA8B,qBAC3BH,KAAA,CAAAe,aAAA,CAACV,kCAAkC,QAC9BK,MAAM,CAACW,IACwB,CAAC,eACrCrB,KAAA,CAAAe,aAAA,CAACX,kCAAkC,QAC9BM,MAAM,CAACY,IACwB,CACR,CACX,CAAC;AAElC,CAAC;AAEDf,iBAAiB,CAACgB,WAAW,GAAG,mBAAmB;AAEnD,eAAehB,iBAAiB","ignoreList":[]}
1
+ {"version":3,"file":"MentionFinderItem.js","names":["React","useCallback","StyledMentionFinderItem","StyledMentionFinderItemContent","StyledMentionFinderItemContentInfo","StyledMentionFinderItemContentName","StyledMentionFinderItemImage","MentionFinderItem","_ref","isActive","member","onClick","onHover","handleItemClick","handleItemMouseEnter","createElement","className","onMouseEnter","$isActive","src","imageUrl","$shouldShowRoundImage","shouldShowRoundImage","name","info","displayName"],"sources":["../../../../../src/components/mention-finder/mention-finder-item/MentionFinderItem.tsx"],"sourcesContent":["import React, { FC, useCallback } from 'react';\nimport type { MentionMember } from '../MentionFinder';\nimport {\n StyledMentionFinderItem,\n StyledMentionFinderItemContent,\n StyledMentionFinderItemContentInfo,\n StyledMentionFinderItemContentName,\n StyledMentionFinderItemImage,\n} from './MentionFinderItem.styles';\n\nexport type MentionFinderItemProps = {\n isActive: boolean;\n member: MentionMember;\n onClick: (member: MentionMember) => void;\n onHover: (member: MentionMember) => void;\n};\n\nconst MentionFinderItem: FC<MentionFinderItemProps> = ({ isActive, member, onClick, onHover }) => {\n const handleItemClick = useCallback(() => onClick(member), [member, onClick]);\n\n const handleItemMouseEnter = useCallback(() => onHover(member), [member, onHover]);\n\n return (\n <StyledMentionFinderItem\n className=\"prevent-lose-focus\"\n onClick={handleItemClick}\n onMouseEnter={handleItemMouseEnter}\n $isActive={isActive}\n >\n <StyledMentionFinderItemImage\n src={member.imageUrl}\n $shouldShowRoundImage={member.shouldShowRoundImage}\n />\n <StyledMentionFinderItemContent>\n <StyledMentionFinderItemContentName>\n {member.name}\n </StyledMentionFinderItemContentName>\n <StyledMentionFinderItemContentInfo>\n {member.info}\n </StyledMentionFinderItemContentInfo>\n </StyledMentionFinderItemContent>\n </StyledMentionFinderItem>\n );\n};\n\nMentionFinderItem.displayName = 'MentionFinderItem';\n\nexport default MentionFinderItem;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAQC,WAAW,QAAQ,OAAO;AAE9C,SACIC,uBAAuB,EACvBC,8BAA8B,EAC9BC,kCAAkC,EAClCC,kCAAkC,EAClCC,4BAA4B,QACzB,4BAA4B;AASnC,MAAMC,iBAA6C,GAAGC,IAAA,IAA4C;EAAA,IAA3C;IAAEC,QAAQ;IAAEC,MAAM;IAAEC,OAAO;IAAEC;EAAQ,CAAC,GAAAJ,IAAA;EACzF,MAAMK,eAAe,GAAGZ,WAAW,CAAC,MAAMU,OAAO,CAACD,MAAM,CAAC,EAAE,CAACA,MAAM,EAAEC,OAAO,CAAC,CAAC;EAE7E,MAAMG,oBAAoB,GAAGb,WAAW,CAAC,MAAMW,OAAO,CAACF,MAAM,CAAC,EAAE,CAACA,MAAM,EAAEE,OAAO,CAAC,CAAC;EAElF,oBACIZ,KAAA,CAAAe,aAAA,CAACb,uBAAuB;IACpBc,SAAS,EAAC,oBAAoB;IAC9BL,OAAO,EAAEE,eAAgB;IACzBI,YAAY,EAAEH,oBAAqB;IACnCI,SAAS,EAAET;EAAS,gBAEpBT,KAAA,CAAAe,aAAA,CAACT,4BAA4B;IACzBa,GAAG,EAAET,MAAM,CAACU,QAAS;IACrBC,qBAAqB,EAAEX,MAAM,CAACY;EAAqB,CACtD,CAAC,eACFtB,KAAA,CAAAe,aAAA,CAACZ,8BAA8B,qBAC3BH,KAAA,CAAAe,aAAA,CAACV,kCAAkC,QAC9BK,MAAM,CAACa,IACwB,CAAC,eACrCvB,KAAA,CAAAe,aAAA,CAACX,kCAAkC,QAC9BM,MAAM,CAACc,IACwB,CACR,CACX,CAAC;AAElC,CAAC;AAEDjB,iBAAiB,CAACkB,WAAW,GAAG,mBAAmB;AAEnD,eAAelB,iBAAiB","ignoreList":[]}
@@ -44,12 +44,17 @@ export const StyledMentionFinderItemImage = styled.img`
44
44
  }},
45
45
  0.1
46
46
  );
47
- border-radius: 50%;
47
+ border-radius: ${_ref5 => {
48
+ let {
49
+ $shouldShowRoundImage
50
+ } = _ref5;
51
+ return $shouldShowRoundImage ? '50%' : 'initial';
52
+ }};
48
53
  box-shadow: 0 0 0 1px
49
- rgba(${_ref5 => {
54
+ rgba(${_ref6 => {
50
55
  let {
51
56
  theme
52
- } = _ref5;
57
+ } = _ref6;
53
58
  return theme['009-rgb'];
54
59
  }}, 0.08) inset;
55
60
  flex: 0 0 auto;
@@ -59,10 +64,10 @@ export const StyledMentionFinderItemImage = styled.img`
59
64
  width: 40px;
60
65
  `;
61
66
  export const StyledMentionFinderItemContent = styled.div`
62
- color: ${_ref6 => {
67
+ color: ${_ref7 => {
63
68
  let {
64
69
  theme
65
- } = _ref6;
70
+ } = _ref7;
66
71
  return theme.text;
67
72
  }};
68
73
  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","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 &: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<unknown>;\n\nexport const StyledMentionFinderItemImage = styled.img`\n background-color: rgba(\n ${({ theme }: StyledMentionFinderItemImageProps) => theme['text-rgb']},\n 0.1\n );\n border-radius: 50%;\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;AAID,OAAO,MAAMI,4BAA4B,GAAGT,MAAM,CAACU,GAAG;AACtD;AACA,UAAUC,KAAA;EAAA,IAAC;IAAEN;EAAyC,CAAC,GAAAM,KAAA;EAAA,OAAKN,KAAK,CAAC,UAAU,CAAC;AAAA;AAC7E;AACA;AACA;AACA;AACA,eAAeO,KAAA;EAAA,IAAC;IAAEP;EAAyC,CAAC,GAAAO,KAAA;EAAA,OAAKP,KAAK,CAAC,SAAS,CAAC;AAAA;AACjF;AACA;AACA;AACA;AACA;AACA,CAAC;AAID,OAAO,MAAMQ,8BAA8B,GAAGb,MAAM,CAACG,GAAG;AACxD,aAAaW,KAAA;EAAA,IAAC;IAAET;EAA2C,CAAC,GAAAS,KAAA;EAAA,OAAKT,KAAK,CAACU,IAAI;AAAA;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMC,kCAAkC,GAAGhB,MAAM,CAACG,GAAG,EAAE;AAE9D,OAAO,MAAMc,kCAAkC,GAAGjB,MAAM,CAACG,GAAG;AAC5D;AACA;AACA;AACA,CAAC","ignoreList":[]}
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":[]}
@@ -12,6 +12,7 @@ const Slider = _ref => {
12
12
  onSelect,
13
13
  onChange,
14
14
  interval,
15
+ isDisabled,
15
16
  thumbLabelFormatter,
16
17
  shouldShowThumbLabel = false,
17
18
  steps = 1
@@ -58,6 +59,9 @@ const Slider = _ref => {
58
59
  }
59
60
  }, [fromValue, toValue]);
60
61
  const handleMouseUp = useCallback(() => {
62
+ if (isDisabled) {
63
+ return;
64
+ }
61
65
  void setRefreshScrollEnabled(true);
62
66
  const from = Number(fromSliderRef.current?.value);
63
67
  const to = Number(toSliderRef.current?.value);
@@ -67,7 +71,7 @@ const Slider = _ref => {
67
71
  minValue: from
68
72
  } : undefined);
69
73
  }
70
- }, [interval, onSelect]);
74
+ }, [interval, isDisabled, onSelect]);
71
75
  const handleControlFromSlider = useCallback(event => {
72
76
  if (!fromSliderRef.current || !toSliderRef.current) {
73
77
  return;
@@ -101,6 +105,9 @@ const Slider = _ref => {
101
105
  }
102
106
  }, [maxValue, minValue, onChange, steps, theme]);
103
107
  const handleControlToSlider = useCallback(event => {
108
+ if (isDisabled) {
109
+ return;
110
+ }
104
111
  void setRefreshScrollEnabled(false);
105
112
  if (!fromSliderRef.current || !toSliderRef.current) {
106
113
  return;
@@ -132,7 +139,7 @@ const Slider = _ref => {
132
139
  } else {
133
140
  toSliderRef.current.value = String(from);
134
141
  }
135
- }, [maxValue, minValue, onChange, steps, theme]);
142
+ }, [isDisabled, maxValue, minValue, onChange, steps, theme]);
136
143
  useEffect(() => {
137
144
  if (!fromSliderRef.current || !toSliderRef.current || !interval) {
138
145
  return;
@@ -154,6 +161,9 @@ const Slider = _ref => {
154
161
  * This function updates the value
155
162
  */
156
163
  const handleInputChange = useCallback(event => {
164
+ if (isDisabled) {
165
+ return;
166
+ }
157
167
  void setRefreshScrollEnabled(false);
158
168
  let newValue = Number(event.target.value);
159
169
  if (newValue > maxValue || newValue > maxValue - maxValue % steps) {
@@ -171,7 +181,7 @@ const Slider = _ref => {
171
181
  if (onChange) {
172
182
  onChange(newValue);
173
183
  }
174
- }, [handleControlFromSlider, interval, maxValue, minValue, onChange, steps]);
184
+ }, [handleControlFromSlider, interval, isDisabled, maxValue, minValue, onChange, steps]);
175
185
  const fromSliderThumbPosition = useMemo(() => {
176
186
  if (fromSliderRef.current && fromSliderThumbRef.current && sliderWrapperSize) {
177
187
  return calculateGradientOffset({
@@ -209,11 +219,17 @@ const Slider = _ref => {
209
219
  popupWidth: thumbWidth
210
220
  }), [fromValue, maxValue, minValue, thumbWidth]);
211
221
  const handleTouchStart = useCallback(() => {
222
+ if (isDisabled) {
223
+ return;
224
+ }
212
225
  if (shouldShowThumbLabel) {
213
226
  setIsBigSlider(true);
214
227
  }
215
- }, [shouldShowThumbLabel]);
228
+ }, [isDisabled, shouldShowThumbLabel]);
216
229
  const handleTouchEnd = useCallback(() => {
230
+ if (isDisabled) {
231
+ return;
232
+ }
217
233
  const from = Number(fromSliderRef.current?.value);
218
234
  const to = Number(toSliderRef.current?.value);
219
235
  if (typeof onSelect === 'function') {
@@ -225,9 +241,10 @@ const Slider = _ref => {
225
241
  if (shouldShowThumbLabel) {
226
242
  setIsBigSlider(false);
227
243
  }
228
- }, [interval, onSelect, shouldShowThumbLabel]);
244
+ }, [interval, isDisabled, onSelect, shouldShowThumbLabel]);
229
245
  return useMemo(() => /*#__PURE__*/React.createElement(StyledSlider, {
230
- ref: sliderWrapperRef
246
+ ref: sliderWrapperRef,
247
+ $isDisabled: isDisabled
231
248
  }, /*#__PURE__*/React.createElement(StyledSliderInput, {
232
249
  animate: {
233
250
  height: isBigSlider ? 30 : 10
@@ -296,7 +313,7 @@ const Slider = _ref => {
296
313
  onTouchEnd: handleTouchEnd,
297
314
  onChange: handleControlToSlider,
298
315
  onMouseUp: handleMouseUp
299
- })), [isBigSlider, interval, fromValue, maxValue, minValue, handleTouchStart, handleTouchEnd, handleInputChange, handleMouseUp, fromSliderThumbPosition, shouldShowThumbLabel, thumbWidth, fromSliderThumbContentPosition, thumbLabelFormatter, toSliderThumbPosition, toSliderThumbContentPosition, toValue, handleControlToSlider]);
316
+ })), [isDisabled, isBigSlider, interval, fromValue, maxValue, minValue, handleTouchStart, handleTouchEnd, handleInputChange, handleMouseUp, fromSliderThumbPosition, shouldShowThumbLabel, thumbWidth, fromSliderThumbContentPosition, thumbLabelFormatter, toSliderThumbPosition, toSliderThumbContentPosition, toValue, handleControlToSlider]);
300
317
  };
301
318
  Slider.displayName = 'Slider';
302
319
  export default Slider;
@@ -1 +1 @@
1
- {"version":3,"file":"Slider.js","names":["setRefreshScrollEnabled","React","useCallback","useEffect","useMemo","useRef","useState","useTheme","useElementSize","calculateGradientOffset","calculatePopupPosition","fillSlider","getThumbMaxWidth","StyledSlider","StyledSliderInput","StyledSliderThumb","StyledSliderThumbLabel","Slider","_ref","maxValue","minValue","value","onSelect","onChange","interval","thumbLabelFormatter","shouldShowThumbLabel","steps","fromValue","setFromValue","toValue","setToValue","thumbWidth","setThumbWidth","isBigSlider","setIsBigSlider","fromSliderRef","toSliderRef","fromSliderThumbRef","toSliderThumbRef","fromSliderThumbContentRef","toSliderThumbContentRef","sliderWrapperRef","sliderWrapperSize","theme","maxNumber","handleMouseUp","from","Number","current","to","undefined","handleControlFromSlider","event","newValue","target","Math","round","toSlider","fromSlider","String","handleControlToSlider","handleInputChange","fromSliderThumbPosition","max","min","containerWidth","offsetWidth","toSliderThumbPosition","toSliderThumbContentPosition","sliderValue","popupWidth","fromSliderThumbContentPosition","handleTouchStart","handleTouchEnd","createElement","ref","animate","height","initial","exit","$thumbWidth","$isInterval","type","step","onTouchStart","onTouchEnd","onMouseUp","$max","$min","$value","$position","$isBigSlider","$width","displayName"],"sources":["../../../../src/components/slider/Slider.tsx"],"sourcesContent":["import { setRefreshScrollEnabled } from 'chayns-api';\nimport React, { ChangeEvent, FC, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { useTheme } from 'styled-components';\nimport { useElementSize } from '../../hooks/useElementSize';\nimport {\n calculateGradientOffset,\n calculatePopupPosition,\n fillSlider,\n getThumbMaxWidth,\n} from '../../utils/slider';\nimport {\n StyledSlider,\n StyledSliderInput,\n StyledSliderThumb,\n StyledSliderThumbLabel,\n} from './Slider.styles';\n\nexport interface SliderInterval {\n maxValue: number;\n minValue: number;\n}\n\nexport type SliderProps = {\n /**\n * The range that can be selected with two thumbs..\n */\n interval?: SliderInterval;\n /**\n * The maximum value of the slider.\n */\n maxValue: number;\n /**\n * The minimum value of the slider.\n */\n minValue: number;\n /**\n * Function that will be executed when the value is selected.\n */\n onSelect?: (value?: number, interval?: SliderInterval) => void;\n /**\n * Function that will be executed when the value is changed.\n */\n onChange?: (value?: number, interval?: SliderInterval) => void;\n /**\n * Whether the current value should be displayed inside the slider thumb.\n */\n shouldShowThumbLabel?: boolean;\n /**\n * The steps of the slider.\n */\n steps?: number;\n /**\n * A function to format the thumb label.\n */\n thumbLabelFormatter?: (value: number) => string;\n /**\n * the Value that the slider should have.\n */\n value?: number;\n};\n\nconst Slider: FC<SliderProps> = ({\n maxValue,\n minValue,\n value,\n onSelect,\n onChange,\n interval,\n thumbLabelFormatter,\n shouldShowThumbLabel = false,\n steps = 1,\n}) => {\n const [fromValue, setFromValue] = useState(0);\n const [toValue, setToValue] = useState(maxValue);\n const [thumbWidth, setThumbWidth] = useState(20);\n const [isBigSlider, setIsBigSlider] = useState(false);\n\n const fromSliderRef = useRef<HTMLInputElement>(null);\n const toSliderRef = useRef<HTMLInputElement>(null);\n const fromSliderThumbRef = useRef<HTMLDivElement>(null);\n const toSliderThumbRef = useRef<HTMLDivElement>(null);\n const fromSliderThumbContentRef = useRef<HTMLDivElement>(null);\n const toSliderThumbContentRef = useRef<HTMLDivElement>(null);\n const sliderWrapperRef = useRef<HTMLDivElement>(null);\n\n const sliderWrapperSize = useElementSize(sliderWrapperRef);\n\n const theme = useTheme();\n\n useEffect(() => {\n if (shouldShowThumbLabel) {\n setThumbWidth(getThumbMaxWidth({ maxNumber: maxValue, thumbLabelFormatter }));\n }\n }, [maxValue, shouldShowThumbLabel, thumbLabelFormatter]);\n\n /**\n * This function sets the value\n */\n useEffect(() => {\n if (typeof value !== 'number') {\n return;\n }\n\n if (value >= minValue && value <= maxValue) {\n setFromValue(value);\n }\n }, [maxValue, minValue, value]);\n\n useEffect(() => {\n if (fromValue > toValue) {\n setFromValue(toValue);\n }\n\n if (toValue < fromValue) {\n setToValue(fromValue);\n }\n }, [fromValue, toValue]);\n\n const handleMouseUp = useCallback(() => {\n void setRefreshScrollEnabled(true);\n\n const from = Number(fromSliderRef.current?.value);\n const to = Number(toSliderRef.current?.value);\n\n if (typeof onSelect === 'function') {\n onSelect(\n interval ? undefined : from,\n interval ? { maxValue: to, minValue: from } : undefined,\n );\n }\n }, [interval, onSelect]);\n\n const handleControlFromSlider = useCallback(\n (event: ChangeEvent<HTMLInputElement>) => {\n if (!fromSliderRef.current || !toSliderRef.current) {\n return;\n }\n\n let newValue = Number(event.target.value);\n\n if (newValue > maxValue || newValue > maxValue - (maxValue % steps)) {\n newValue = maxValue;\n } else if (newValue < minValue) {\n newValue = minValue;\n } else {\n newValue = Math.round(newValue / steps) * steps;\n }\n\n setFromValue(newValue);\n\n const to = Number(toSliderRef.current.value);\n\n if (typeof onChange === 'function') {\n onChange(undefined, { maxValue: to, minValue: newValue });\n }\n\n fillSlider({\n toSlider: toSliderRef.current,\n fromSlider: fromSliderRef.current,\n fromValue: newValue,\n theme,\n });\n\n if (newValue > to) {\n fromSliderRef.current.value = String(to);\n } else {\n fromSliderRef.current.value = String(newValue);\n }\n },\n [maxValue, minValue, onChange, steps, theme],\n );\n\n const handleControlToSlider = useCallback(\n (event: ChangeEvent<HTMLInputElement>) => {\n void setRefreshScrollEnabled(false);\n\n if (!fromSliderRef.current || !toSliderRef.current) {\n return;\n }\n\n let newValue = Number(event.target.value);\n\n if (newValue > maxValue || newValue > maxValue - (maxValue % steps)) {\n newValue = maxValue;\n } else if (newValue < minValue) {\n newValue = minValue;\n } else {\n newValue = Math.round(newValue / steps) * steps;\n }\n\n setToValue(newValue);\n\n const from = Number(fromSliderRef.current.value);\n\n if (typeof onChange === 'function') {\n onChange(undefined, { maxValue: newValue, minValue: from });\n }\n\n fillSlider({\n toSlider: toSliderRef.current,\n fromSlider: fromSliderRef.current,\n toValue: newValue,\n theme,\n });\n\n if (from <= newValue) {\n toSliderRef.current.value = String(newValue);\n } else {\n toSliderRef.current.value = String(from);\n }\n },\n [maxValue, minValue, onChange, steps, theme],\n );\n\n useEffect(() => {\n if (!fromSliderRef.current || !toSliderRef.current || !interval) {\n return;\n }\n\n setFromValue(interval.minValue);\n setToValue(interval.maxValue);\n\n fromSliderRef.current.value = String(interval.minValue);\n toSliderRef.current.value = String(interval.maxValue);\n\n fillSlider({\n fromSlider: fromSliderRef.current,\n toSlider: toSliderRef.current,\n theme,\n });\n // Note: interval can´t be in the deps because of rerender\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [theme]);\n\n /**\n * This function updates the value\n */\n const handleInputChange = useCallback(\n (event: ChangeEvent<HTMLInputElement>) => {\n void setRefreshScrollEnabled(false);\n\n let newValue = Number(event.target.value);\n\n if (newValue > maxValue || newValue > maxValue - (maxValue % steps)) {\n newValue = maxValue;\n } else if (newValue < minValue) {\n newValue = minValue;\n } else {\n newValue = Math.round(newValue / steps) * steps;\n }\n\n if (interval) {\n handleControlFromSlider(event);\n\n return;\n }\n\n setFromValue(newValue);\n\n if (onChange) {\n onChange(newValue);\n }\n },\n [handleControlFromSlider, interval, maxValue, minValue, onChange, steps],\n );\n\n const fromSliderThumbPosition = useMemo(() => {\n if (fromSliderRef.current && fromSliderThumbRef.current && sliderWrapperSize) {\n return calculateGradientOffset({\n max: maxValue,\n min: minValue,\n value: fromValue,\n thumbWidth: 20,\n containerWidth: fromSliderRef.current.offsetWidth,\n });\n }\n\n return 0;\n }, [fromValue, maxValue, minValue, sliderWrapperSize]);\n\n const toSliderThumbPosition = useMemo(() => {\n if (toSliderRef.current && toSliderThumbRef.current && sliderWrapperSize) {\n return calculateGradientOffset({\n max: maxValue,\n min: minValue,\n value: toValue,\n thumbWidth: 20,\n containerWidth: toSliderRef.current.offsetWidth,\n });\n }\n return 0;\n }, [toValue, minValue, maxValue, sliderWrapperSize]);\n\n const toSliderThumbContentPosition = useMemo(\n () =>\n calculatePopupPosition({\n min: minValue,\n max: maxValue,\n sliderValue: toValue,\n popupWidth: thumbWidth,\n }),\n [maxValue, minValue, thumbWidth, toValue],\n );\n\n const fromSliderThumbContentPosition = useMemo(\n () =>\n calculatePopupPosition({\n min: minValue,\n max: maxValue,\n sliderValue: fromValue,\n popupWidth: thumbWidth,\n }),\n [fromValue, maxValue, minValue, thumbWidth],\n );\n\n const handleTouchStart = useCallback(() => {\n if (shouldShowThumbLabel) {\n setIsBigSlider(true);\n }\n }, [shouldShowThumbLabel]);\n\n const handleTouchEnd = useCallback(() => {\n const from = Number(fromSliderRef.current?.value);\n const to = Number(toSliderRef.current?.value);\n\n if (typeof onSelect === 'function') {\n onSelect(\n interval ? undefined : from,\n interval ? { maxValue: to, minValue: from } : undefined,\n );\n }\n\n if (shouldShowThumbLabel) {\n setIsBigSlider(false);\n }\n }, [interval, onSelect, shouldShowThumbLabel]);\n\n return useMemo(\n () => (\n <StyledSlider ref={sliderWrapperRef}>\n <StyledSliderInput\n animate={{ height: isBigSlider ? 30 : 10 }}\n initial={{ height: 10 }}\n exit={{ height: 10 }}\n $thumbWidth={40}\n ref={fromSliderRef}\n $isInterval={!!interval}\n type=\"range\"\n value={fromValue}\n step={0.01}\n max={maxValue}\n min={minValue}\n onTouchStart={handleTouchStart}\n onTouchEnd={handleTouchEnd}\n onChange={handleInputChange}\n onMouseUp={handleMouseUp}\n $max={maxValue}\n $min={minValue}\n $value={fromValue}\n />\n <StyledSliderThumb\n ref={fromSliderThumbRef}\n $position={fromSliderThumbPosition}\n $isBigSlider={isBigSlider}\n >\n {shouldShowThumbLabel && (\n <StyledSliderThumbLabel\n $width={thumbWidth}\n $isBigSlider={isBigSlider}\n $position={fromSliderThumbContentPosition}\n ref={fromSliderThumbContentRef}\n >\n {typeof thumbLabelFormatter === 'function'\n ? thumbLabelFormatter(fromValue)\n : fromValue}\n </StyledSliderThumbLabel>\n )}\n </StyledSliderThumb>\n {interval && (\n <StyledSliderThumb\n ref={toSliderThumbRef}\n $position={toSliderThumbPosition}\n $isBigSlider={isBigSlider}\n >\n {shouldShowThumbLabel && (\n <StyledSliderThumbLabel\n $width={thumbWidth}\n $isBigSlider={isBigSlider}\n $position={toSliderThumbContentPosition}\n ref={toSliderThumbContentRef}\n >\n {typeof thumbLabelFormatter === 'function'\n ? thumbLabelFormatter(toValue)\n : toValue}\n </StyledSliderThumbLabel>\n )}\n </StyledSliderThumb>\n )}\n {interval && (\n <StyledSliderInput\n animate={{ height: isBigSlider ? 30 : 10 }}\n initial={{ height: 10 }}\n exit={{ height: 10 }}\n $thumbWidth={40}\n $max={maxValue}\n $min={minValue}\n $value={toValue}\n ref={toSliderRef}\n $isInterval={!!interval}\n type=\"range\"\n value={toValue}\n step={0.01}\n max={maxValue}\n min={minValue}\n onTouchStart={handleTouchStart}\n onTouchEnd={handleTouchEnd}\n onChange={handleControlToSlider}\n onMouseUp={handleMouseUp}\n />\n )}\n </StyledSlider>\n ),\n [\n isBigSlider,\n interval,\n fromValue,\n maxValue,\n minValue,\n handleTouchStart,\n handleTouchEnd,\n handleInputChange,\n handleMouseUp,\n fromSliderThumbPosition,\n shouldShowThumbLabel,\n thumbWidth,\n fromSliderThumbContentPosition,\n thumbLabelFormatter,\n toSliderThumbPosition,\n toSliderThumbContentPosition,\n toValue,\n handleControlToSlider,\n ],\n );\n};\n\nSlider.displayName = 'Slider';\n\nexport default Slider;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"Slider.js","names":["setRefreshScrollEnabled","React","useCallback","useEffect","useMemo","useRef","useState","useTheme","useElementSize","calculateGradientOffset","calculatePopupPosition","fillSlider","getThumbMaxWidth","StyledSlider","StyledSliderInput","StyledSliderThumb","StyledSliderThumbLabel","Slider","_ref","maxValue","minValue","value","onSelect","onChange","interval","isDisabled","thumbLabelFormatter","shouldShowThumbLabel","steps","fromValue","setFromValue","toValue","setToValue","thumbWidth","setThumbWidth","isBigSlider","setIsBigSlider","fromSliderRef","toSliderRef","fromSliderThumbRef","toSliderThumbRef","fromSliderThumbContentRef","toSliderThumbContentRef","sliderWrapperRef","sliderWrapperSize","theme","maxNumber","handleMouseUp","from","Number","current","to","undefined","handleControlFromSlider","event","newValue","target","Math","round","toSlider","fromSlider","String","handleControlToSlider","handleInputChange","fromSliderThumbPosition","max","min","containerWidth","offsetWidth","toSliderThumbPosition","toSliderThumbContentPosition","sliderValue","popupWidth","fromSliderThumbContentPosition","handleTouchStart","handleTouchEnd","createElement","ref","$isDisabled","animate","height","initial","exit","$thumbWidth","$isInterval","type","step","onTouchStart","onTouchEnd","onMouseUp","$max","$min","$value","$position","$isBigSlider","$width","displayName"],"sources":["../../../../src/components/slider/Slider.tsx"],"sourcesContent":["import { setRefreshScrollEnabled } from 'chayns-api';\nimport React, { ChangeEvent, FC, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { useTheme } from 'styled-components';\nimport { useElementSize } from '../../hooks/useElementSize';\nimport {\n calculateGradientOffset,\n calculatePopupPosition,\n fillSlider,\n getThumbMaxWidth,\n} from '../../utils/slider';\nimport {\n StyledSlider,\n StyledSliderInput,\n StyledSliderThumb,\n StyledSliderThumbLabel,\n} from './Slider.styles';\n\nexport interface SliderInterval {\n maxValue: number;\n minValue: number;\n}\n\nexport type SliderProps = {\n /**\n * The range that can be selected with two thumbs..\n */\n interval?: SliderInterval;\n /**\n * Whether the slider is disabled.\n */\n isDisabled?: boolean;\n /**\n * The maximum value of the slider.\n */\n maxValue: number;\n /**\n * The minimum value of the slider.\n */\n minValue: number;\n /**\n * Function that will be executed when the value is selected.\n */\n onSelect?: (value?: number, interval?: SliderInterval) => void;\n /**\n * Function that will be executed when the value is changed.\n */\n onChange?: (value?: number, interval?: SliderInterval) => void;\n /**\n * Whether the current value should be displayed inside the slider thumb.\n */\n shouldShowThumbLabel?: boolean;\n /**\n * The steps of the slider.\n */\n steps?: number;\n /**\n * A function to format the thumb label.\n */\n thumbLabelFormatter?: (value: number) => string;\n /**\n * the Value that the slider should have.\n */\n value?: number;\n};\n\nconst Slider: FC<SliderProps> = ({\n maxValue,\n minValue,\n value,\n onSelect,\n onChange,\n interval,\n isDisabled,\n thumbLabelFormatter,\n shouldShowThumbLabel = false,\n steps = 1,\n}) => {\n const [fromValue, setFromValue] = useState(0);\n const [toValue, setToValue] = useState(maxValue);\n const [thumbWidth, setThumbWidth] = useState(20);\n const [isBigSlider, setIsBigSlider] = useState(false);\n\n const fromSliderRef = useRef<HTMLInputElement>(null);\n const toSliderRef = useRef<HTMLInputElement>(null);\n const fromSliderThumbRef = useRef<HTMLDivElement>(null);\n const toSliderThumbRef = useRef<HTMLDivElement>(null);\n const fromSliderThumbContentRef = useRef<HTMLDivElement>(null);\n const toSliderThumbContentRef = useRef<HTMLDivElement>(null);\n const sliderWrapperRef = useRef<HTMLDivElement>(null);\n\n const sliderWrapperSize = useElementSize(sliderWrapperRef);\n\n const theme = useTheme();\n\n useEffect(() => {\n if (shouldShowThumbLabel) {\n setThumbWidth(getThumbMaxWidth({ maxNumber: maxValue, thumbLabelFormatter }));\n }\n }, [maxValue, shouldShowThumbLabel, thumbLabelFormatter]);\n\n /**\n * This function sets the value\n */\n useEffect(() => {\n if (typeof value !== 'number') {\n return;\n }\n\n if (value >= minValue && value <= maxValue) {\n setFromValue(value);\n }\n }, [maxValue, minValue, value]);\n\n useEffect(() => {\n if (fromValue > toValue) {\n setFromValue(toValue);\n }\n\n if (toValue < fromValue) {\n setToValue(fromValue);\n }\n }, [fromValue, toValue]);\n\n const handleMouseUp = useCallback(() => {\n if (isDisabled) {\n return;\n }\n\n void setRefreshScrollEnabled(true);\n\n const from = Number(fromSliderRef.current?.value);\n const to = Number(toSliderRef.current?.value);\n\n if (typeof onSelect === 'function') {\n onSelect(\n interval ? undefined : from,\n interval ? { maxValue: to, minValue: from } : undefined,\n );\n }\n }, [interval, isDisabled, onSelect]);\n\n const handleControlFromSlider = useCallback(\n (event: ChangeEvent<HTMLInputElement>) => {\n if (!fromSliderRef.current || !toSliderRef.current) {\n return;\n }\n\n let newValue = Number(event.target.value);\n\n if (newValue > maxValue || newValue > maxValue - (maxValue % steps)) {\n newValue = maxValue;\n } else if (newValue < minValue) {\n newValue = minValue;\n } else {\n newValue = Math.round(newValue / steps) * steps;\n }\n\n setFromValue(newValue);\n\n const to = Number(toSliderRef.current.value);\n\n if (typeof onChange === 'function') {\n onChange(undefined, { maxValue: to, minValue: newValue });\n }\n\n fillSlider({\n toSlider: toSliderRef.current,\n fromSlider: fromSliderRef.current,\n fromValue: newValue,\n theme,\n });\n\n if (newValue > to) {\n fromSliderRef.current.value = String(to);\n } else {\n fromSliderRef.current.value = String(newValue);\n }\n },\n [maxValue, minValue, onChange, steps, theme],\n );\n\n const handleControlToSlider = useCallback(\n (event: ChangeEvent<HTMLInputElement>) => {\n if (isDisabled) {\n return;\n }\n\n void setRefreshScrollEnabled(false);\n\n if (!fromSliderRef.current || !toSliderRef.current) {\n return;\n }\n\n let newValue = Number(event.target.value);\n\n if (newValue > maxValue || newValue > maxValue - (maxValue % steps)) {\n newValue = maxValue;\n } else if (newValue < minValue) {\n newValue = minValue;\n } else {\n newValue = Math.round(newValue / steps) * steps;\n }\n\n setToValue(newValue);\n\n const from = Number(fromSliderRef.current.value);\n\n if (typeof onChange === 'function') {\n onChange(undefined, { maxValue: newValue, minValue: from });\n }\n\n fillSlider({\n toSlider: toSliderRef.current,\n fromSlider: fromSliderRef.current,\n toValue: newValue,\n theme,\n });\n\n if (from <= newValue) {\n toSliderRef.current.value = String(newValue);\n } else {\n toSliderRef.current.value = String(from);\n }\n },\n [isDisabled, maxValue, minValue, onChange, steps, theme],\n );\n\n useEffect(() => {\n if (!fromSliderRef.current || !toSliderRef.current || !interval) {\n return;\n }\n\n setFromValue(interval.minValue);\n setToValue(interval.maxValue);\n\n fromSliderRef.current.value = String(interval.minValue);\n toSliderRef.current.value = String(interval.maxValue);\n\n fillSlider({\n fromSlider: fromSliderRef.current,\n toSlider: toSliderRef.current,\n theme,\n });\n // Note: interval can´t be in the deps because of rerender\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [theme]);\n\n /**\n * This function updates the value\n */\n const handleInputChange = useCallback(\n (event: ChangeEvent<HTMLInputElement>) => {\n if (isDisabled) {\n return;\n }\n\n void setRefreshScrollEnabled(false);\n\n let newValue = Number(event.target.value);\n\n if (newValue > maxValue || newValue > maxValue - (maxValue % steps)) {\n newValue = maxValue;\n } else if (newValue < minValue) {\n newValue = minValue;\n } else {\n newValue = Math.round(newValue / steps) * steps;\n }\n\n if (interval) {\n handleControlFromSlider(event);\n\n return;\n }\n\n setFromValue(newValue);\n\n if (onChange) {\n onChange(newValue);\n }\n },\n [handleControlFromSlider, interval, isDisabled, maxValue, minValue, onChange, steps],\n );\n\n const fromSliderThumbPosition = useMemo(() => {\n if (fromSliderRef.current && fromSliderThumbRef.current && sliderWrapperSize) {\n return calculateGradientOffset({\n max: maxValue,\n min: minValue,\n value: fromValue,\n thumbWidth: 20,\n containerWidth: fromSliderRef.current.offsetWidth,\n });\n }\n\n return 0;\n }, [fromValue, maxValue, minValue, sliderWrapperSize]);\n\n const toSliderThumbPosition = useMemo(() => {\n if (toSliderRef.current && toSliderThumbRef.current && sliderWrapperSize) {\n return calculateGradientOffset({\n max: maxValue,\n min: minValue,\n value: toValue,\n thumbWidth: 20,\n containerWidth: toSliderRef.current.offsetWidth,\n });\n }\n return 0;\n }, [toValue, minValue, maxValue, sliderWrapperSize]);\n\n const toSliderThumbContentPosition = useMemo(\n () =>\n calculatePopupPosition({\n min: minValue,\n max: maxValue,\n sliderValue: toValue,\n popupWidth: thumbWidth,\n }),\n [maxValue, minValue, thumbWidth, toValue],\n );\n\n const fromSliderThumbContentPosition = useMemo(\n () =>\n calculatePopupPosition({\n min: minValue,\n max: maxValue,\n sliderValue: fromValue,\n popupWidth: thumbWidth,\n }),\n [fromValue, maxValue, minValue, thumbWidth],\n );\n\n const handleTouchStart = useCallback(() => {\n if (isDisabled) {\n return;\n }\n\n if (shouldShowThumbLabel) {\n setIsBigSlider(true);\n }\n }, [isDisabled, shouldShowThumbLabel]);\n\n const handleTouchEnd = useCallback(() => {\n if (isDisabled) {\n return;\n }\n\n const from = Number(fromSliderRef.current?.value);\n const to = Number(toSliderRef.current?.value);\n\n if (typeof onSelect === 'function') {\n onSelect(\n interval ? undefined : from,\n interval ? { maxValue: to, minValue: from } : undefined,\n );\n }\n\n if (shouldShowThumbLabel) {\n setIsBigSlider(false);\n }\n }, [interval, isDisabled, onSelect, shouldShowThumbLabel]);\n\n return useMemo(\n () => (\n <StyledSlider ref={sliderWrapperRef} $isDisabled={isDisabled}>\n <StyledSliderInput\n animate={{ height: isBigSlider ? 30 : 10 }}\n initial={{ height: 10 }}\n exit={{ height: 10 }}\n $thumbWidth={40}\n ref={fromSliderRef}\n $isInterval={!!interval}\n type=\"range\"\n value={fromValue}\n step={0.01}\n max={maxValue}\n min={minValue}\n onTouchStart={handleTouchStart}\n onTouchEnd={handleTouchEnd}\n onChange={handleInputChange}\n onMouseUp={handleMouseUp}\n $max={maxValue}\n $min={minValue}\n $value={fromValue}\n />\n <StyledSliderThumb\n ref={fromSliderThumbRef}\n $position={fromSliderThumbPosition}\n $isBigSlider={isBigSlider}\n >\n {shouldShowThumbLabel && (\n <StyledSliderThumbLabel\n $width={thumbWidth}\n $isBigSlider={isBigSlider}\n $position={fromSliderThumbContentPosition}\n ref={fromSliderThumbContentRef}\n >\n {typeof thumbLabelFormatter === 'function'\n ? thumbLabelFormatter(fromValue)\n : fromValue}\n </StyledSliderThumbLabel>\n )}\n </StyledSliderThumb>\n {interval && (\n <StyledSliderThumb\n ref={toSliderThumbRef}\n $position={toSliderThumbPosition}\n $isBigSlider={isBigSlider}\n >\n {shouldShowThumbLabel && (\n <StyledSliderThumbLabel\n $width={thumbWidth}\n $isBigSlider={isBigSlider}\n $position={toSliderThumbContentPosition}\n ref={toSliderThumbContentRef}\n >\n {typeof thumbLabelFormatter === 'function'\n ? thumbLabelFormatter(toValue)\n : toValue}\n </StyledSliderThumbLabel>\n )}\n </StyledSliderThumb>\n )}\n {interval && (\n <StyledSliderInput\n animate={{ height: isBigSlider ? 30 : 10 }}\n initial={{ height: 10 }}\n exit={{ height: 10 }}\n $thumbWidth={40}\n $max={maxValue}\n $min={minValue}\n $value={toValue}\n ref={toSliderRef}\n $isInterval={!!interval}\n type=\"range\"\n value={toValue}\n step={0.01}\n max={maxValue}\n min={minValue}\n onTouchStart={handleTouchStart}\n onTouchEnd={handleTouchEnd}\n onChange={handleControlToSlider}\n onMouseUp={handleMouseUp}\n />\n )}\n </StyledSlider>\n ),\n [\n isDisabled,\n isBigSlider,\n interval,\n fromValue,\n maxValue,\n minValue,\n handleTouchStart,\n handleTouchEnd,\n handleInputChange,\n handleMouseUp,\n fromSliderThumbPosition,\n shouldShowThumbLabel,\n thumbWidth,\n fromSliderThumbContentPosition,\n thumbLabelFormatter,\n toSliderThumbPosition,\n toSliderThumbContentPosition,\n toValue,\n handleControlToSlider,\n ],\n );\n};\n\nSlider.displayName = 'Slider';\n\nexport default Slider;\n"],"mappings":"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","ignoreList":[]}
@@ -3,15 +3,26 @@ import styled from 'styled-components';
3
3
  export const StyledSlider = styled.div`
4
4
  width: 100%;
5
5
  height: 30px;
6
- cursor: pointer;
6
+ cursor: ${_ref => {
7
+ let {
8
+ $isDisabled
9
+ } = _ref;
10
+ return $isDisabled ? 'default' : 'pointer';
11
+ }} !important;
7
12
  position: relative;
8
13
  display: flex;
9
14
  align-items: center;
10
15
  justify-content: center;
11
16
  touch-action: none;
12
17
  user-select: none;
18
+ opacity: ${_ref2 => {
19
+ let {
20
+ $isDisabled
21
+ } = _ref2;
22
+ return $isDisabled ? 0.5 : 1;
23
+ }};
13
24
  `;
14
- export const StyledSliderInput = styled(motion.input).attrs(_ref => {
25
+ export const StyledSliderInput = styled(motion.input).attrs(_ref3 => {
15
26
  let {
16
27
  $isInterval,
17
28
  $value,
@@ -19,7 +30,7 @@ export const StyledSliderInput = styled(motion.input).attrs(_ref => {
19
30
  $min,
20
31
  $max,
21
32
  theme
22
- } = _ref;
33
+ } = _ref3;
23
34
  return {
24
35
  style: {
25
36
  pointerEvents: $isInterval ? 'none' : 'all',
@@ -68,11 +79,11 @@ export const StyledSliderInput = styled(motion.input).attrs(_ref => {
68
79
  position: relative;
69
80
  }
70
81
  `;
71
- export const StyledSliderThumb = styled.div.attrs(_ref2 => {
82
+ export const StyledSliderThumb = styled.div.attrs(_ref4 => {
72
83
  let {
73
84
  $position,
74
85
  $isBigSlider
75
- } = _ref2;
86
+ } = _ref4;
76
87
  return {
77
88
  style: {
78
89
  left: `${$position}px`,
@@ -98,12 +109,12 @@ export const StyledSliderThumb = styled.div.attrs(_ref2 => {
98
109
 
99
110
  transition: top 0.2s ease 0s;
100
111
  `;
101
- export const StyledSliderThumbLabel = styled.span.attrs(_ref3 => {
112
+ export const StyledSliderThumbLabel = styled.span.attrs(_ref5 => {
102
113
  let {
103
114
  $position,
104
115
  $isBigSlider,
105
116
  $width
106
- } = _ref3;
117
+ } = _ref5;
107
118
  return {
108
119
  style: {
109
120
  minWidth: `${$width}px`,
@@ -140,10 +151,10 @@ export const StyledSliderThumbLabel = styled.span.attrs(_ref3 => {
140
151
  position: absolute;
141
152
  width: 14px;
142
153
  z-index: -2;
143
- left: ${_ref4 => {
154
+ left: ${_ref6 => {
144
155
  let {
145
156
  $position
146
- } = _ref4;
157
+ } = _ref6;
147
158
  return $position * -1;
148
159
  }}px;
149
160
  transform: rotate(225deg);
@@ -1 +1 @@
1
- {"version":3,"file":"Slider.styles.js","names":["motion","styled","StyledSlider","div","StyledSliderInput","input","attrs","_ref","$isInterval","$value","$thumbWidth","$min","$max","theme","style","pointerEvents","width","background","undefined","StyledSliderThumb","_ref2","$position","$isBigSlider","left","height","StyledSliderThumbLabel","span","_ref3","$width","minWidth","top","_ref4"],"sources":["../../../../src/components/slider/Slider.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled from 'styled-components';\nimport type { Theme, WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\nexport const StyledSlider = styled.div`\n width: 100%;\n height: 30px;\n cursor: pointer;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n touch-action: none;\n user-select: none;\n`;\n\ntype StyledSliderInputProps = WithTheme<{\n $min: number;\n $max: number;\n $value: number;\n $isInterval: boolean;\n $thumbWidth: number;\n}>;\n\nexport const StyledSliderInput = styled(motion.input).attrs<StyledSliderInputProps>(\n ({ $isInterval, $value, $thumbWidth, $min, $max, theme }) => ({\n style: {\n pointerEvents: $isInterval ? 'none' : 'all',\n width: `calc(100% - ${$thumbWidth}px)`,\n background: !$isInterval\n ? `linear-gradient(\n to right,\n ${(theme as Theme)['409'] ?? ''} 0%,\n ${(theme as Theme)['409'] ?? ''}\n ${(($value - $min) / ($max - $min)) * 100}%,\n ${(theme as Theme)['403'] ?? ''}\n ${(($value - $min) / ($max - $min)) * 100}%,\n ${(theme as Theme)['403'] ?? ''}\n )`\n : undefined,\n },\n }),\n)`\n position: absolute;\n border-radius: 100px;\n -webkit-appearance: none;\n\n outline: none;\n cursor: pointer !important;\n z-index: 2;\n appearance: none;\n\n // Slider thumb for chrome\n &::-webkit-slider-thumb {\n -webkit-appearance: none;\n appearance: none;\n width: 50px;\n height: 20px;\n cursor: pointer;\n opacity: 0;\n pointer-events: all;\n position: relative;\n }\n\n // slider thumb for firefox\n\n &::-moz-range-thumb {\n width: 50px;\n height: 20px;\n cursor: pointer;\n opacity: 0;\n pointer-events: all;\n position: relative;\n }\n`;\n\ntype StyledSliderThumbProps = WithTheme<{\n $position: number;\n $isBigSlider: boolean;\n}>;\n\nexport const StyledSliderThumb = styled.div.attrs<StyledSliderThumbProps>(\n ({ $position, $isBigSlider }) => ({\n style: {\n left: `${$position}px`,\n height: `${$isBigSlider ? 0 : 20}px`,\n },\n }),\n)`\n width: 20px;\n height: 20px;\n cursor: pointer;\n border-radius: 100px;\n background-color: white;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);\n pointer-events: none;\n z-index: 3;\n position: absolute;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0 8px;\n white-space: nowrap;\n top: 5px;\n\n transition: top 0.2s ease 0s;\n`;\n\ntype StyledSliderThumbLabelProps = WithTheme<{\n $position: number;\n $width: number;\n $isBigSlider: boolean;\n}>;\n\nexport const StyledSliderThumbLabel = styled.span.attrs<StyledSliderThumbLabelProps>(\n ({ $position, $isBigSlider, $width }) => ({\n style: {\n minWidth: `${$width}px`,\n top: `-${$isBigSlider ? 56 : 48}px`,\n left: `${$position}px`,\n },\n }),\n)`\n pointer-events: none;\n color: #222;\n\n height: 20px;\n cursor: pointer;\n border-radius: 3px;\n background-color: white;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);\n z-index: 3;\n position: absolute;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 16px;\n white-space: nowrap;\n\n transition: top 0.2s ease 0s;\n\n &::after {\n background-color: inherit;\n border-bottom: 1px solid rgba(0, 0, 0, 0.1);\n border-right: 1px solid rgba(0, 0, 0, 0.1);\n box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.4);\n content: '';\n height: 14px;\n position: absolute;\n width: 14px;\n z-index: -2;\n left: ${({ $position }) => $position * -1}px;\n transform: rotate(225deg);\n bottom: -7px;\n }\n\n &::before {\n background-color: inherit;\n bottom: 0;\n content: '';\n left: 0;\n position: absolute;\n right: 0;\n border-radius: 3px;\n top: 0;\n z-index: -1;\n }\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,eAAe;AACtC,OAAOC,MAAM,MAAM,mBAAmB;AAGtC,OAAO,MAAMC,YAAY,GAAGD,MAAM,CAACE,GAAG;AACtC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAUD,OAAO,MAAMC,iBAAiB,GAAGH,MAAM,CAACD,MAAM,CAACK,KAAK,CAAC,CAACC,KAAK,CACvDC,IAAA;EAAA,IAAC;IAAEC,WAAW;IAAEC,MAAM;IAAEC,WAAW;IAAEC,IAAI;IAAEC,IAAI;IAAEC;EAAM,CAAC,GAAAN,IAAA;EAAA,OAAM;IAC1DO,KAAK,EAAE;MACHC,aAAa,EAAEP,WAAW,GAAG,MAAM,GAAG,KAAK;MAC3CQ,KAAK,EAAE,eAAeN,WAAW,KAAK;MACtCO,UAAU,EAAE,CAACT,WAAW,GAClB;AAClB;AACA,cAAeK,KAAK,CAAW,KAAK,CAAC,IAAI,EAAE;AAC3C,cAAeA,KAAK,CAAW,KAAK,CAAC,IAAI,EAAE;AAC3C,cAAe,CAACJ,MAAM,GAAGE,IAAI,KAAKC,IAAI,GAAGD,IAAI,CAAC,GAAI,GAAG;AACrD,cAAeE,KAAK,CAAW,KAAK,CAAC,IAAI,EAAE;AAC3C,cAAe,CAACJ,MAAM,GAAGE,IAAI,KAAKC,IAAI,GAAGD,IAAI,CAAC,GAAI,GAAG;AACrD,cAAeE,KAAK,CAAW,KAAK,CAAC,IAAI,EAAE;AAC3C,UAAU,GACQK;IACV;EACJ,CAAC;AAAA,CACL,CAAC;AACD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAOD,OAAO,MAAMC,iBAAiB,GAAGlB,MAAM,CAACE,GAAG,CAACG,KAAK,CAC7Cc,KAAA;EAAA,IAAC;IAAEC,SAAS;IAAEC;EAAa,CAAC,GAAAF,KAAA;EAAA,OAAM;IAC9BN,KAAK,EAAE;MACHS,IAAI,EAAE,GAAGF,SAAS,IAAI;MACtBG,MAAM,EAAE,GAAGF,YAAY,GAAG,CAAC,GAAG,EAAE;IACpC;EACJ,CAAC;AAAA,CACL,CAAC;AACD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAQD,OAAO,MAAMG,sBAAsB,GAAGxB,MAAM,CAACyB,IAAI,CAACpB,KAAK,CACnDqB,KAAA;EAAA,IAAC;IAAEN,SAAS;IAAEC,YAAY;IAAEM;EAAO,CAAC,GAAAD,KAAA;EAAA,OAAM;IACtCb,KAAK,EAAE;MACHe,QAAQ,EAAE,GAAGD,MAAM,IAAI;MACvBE,GAAG,EAAE,IAAIR,YAAY,GAAG,EAAE,GAAG,EAAE,IAAI;MACnCC,IAAI,EAAE,GAAGF,SAAS;IACtB;EACJ,CAAC;AAAA,CACL,CAAC;AACD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,gBAAgBU,KAAA;EAAA,IAAC;IAAEV;EAAU,CAAC,GAAAU,KAAA;EAAA,OAAKV,SAAS,GAAG,CAAC,CAAC;AAAA;AACjD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}
1
+ {"version":3,"file":"Slider.styles.js","names":["motion","styled","StyledSlider","div","_ref","$isDisabled","_ref2","StyledSliderInput","input","attrs","_ref3","$isInterval","$value","$thumbWidth","$min","$max","theme","style","pointerEvents","width","background","undefined","StyledSliderThumb","_ref4","$position","$isBigSlider","left","height","StyledSliderThumbLabel","span","_ref5","$width","minWidth","top","_ref6"],"sources":["../../../../src/components/slider/Slider.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled from 'styled-components';\nimport type { Theme, WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledSliderProps = WithTheme<{ $isDisabled?: boolean }>;\n\nexport const StyledSlider = styled.div<StyledSliderProps>`\n width: 100%;\n height: 30px;\n cursor: ${({ $isDisabled }) => ($isDisabled ? 'default' : 'pointer')} !important;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n touch-action: none;\n user-select: none;\n opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n`;\n\ntype StyledSliderInputProps = WithTheme<{\n $min: number;\n $max: number;\n $value: number;\n $isInterval: boolean;\n $thumbWidth: number;\n}>;\n\nexport const StyledSliderInput = styled(motion.input).attrs<StyledSliderInputProps>(\n ({ $isInterval, $value, $thumbWidth, $min, $max, theme }) => ({\n style: {\n pointerEvents: $isInterval ? 'none' : 'all',\n width: `calc(100% - ${$thumbWidth}px)`,\n background: !$isInterval\n ? `linear-gradient(\n to right,\n ${(theme as Theme)['409'] ?? ''} 0%,\n ${(theme as Theme)['409'] ?? ''}\n ${(($value - $min) / ($max - $min)) * 100}%,\n ${(theme as Theme)['403'] ?? ''}\n ${(($value - $min) / ($max - $min)) * 100}%,\n ${(theme as Theme)['403'] ?? ''}\n )`\n : undefined,\n },\n }),\n)`\n position: absolute;\n border-radius: 100px;\n -webkit-appearance: none;\n\n outline: none;\n cursor: pointer !important;\n z-index: 2;\n appearance: none;\n\n // Slider thumb for chrome\n &::-webkit-slider-thumb {\n -webkit-appearance: none;\n appearance: none;\n width: 50px;\n height: 20px;\n cursor: pointer;\n opacity: 0;\n pointer-events: all;\n position: relative;\n }\n\n // slider thumb for firefox\n\n &::-moz-range-thumb {\n width: 50px;\n height: 20px;\n cursor: pointer;\n opacity: 0;\n pointer-events: all;\n position: relative;\n }\n`;\n\ntype StyledSliderThumbProps = WithTheme<{\n $position: number;\n $isBigSlider: boolean;\n}>;\n\nexport const StyledSliderThumb = styled.div.attrs<StyledSliderThumbProps>(\n ({ $position, $isBigSlider }) => ({\n style: {\n left: `${$position}px`,\n height: `${$isBigSlider ? 0 : 20}px`,\n },\n }),\n)`\n width: 20px;\n height: 20px;\n cursor: pointer;\n border-radius: 100px;\n background-color: white;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);\n pointer-events: none;\n z-index: 3;\n position: absolute;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0 8px;\n white-space: nowrap;\n top: 5px;\n\n transition: top 0.2s ease 0s;\n`;\n\ntype StyledSliderThumbLabelProps = WithTheme<{\n $position: number;\n $width: number;\n $isBigSlider: boolean;\n}>;\n\nexport const StyledSliderThumbLabel = styled.span.attrs<StyledSliderThumbLabelProps>(\n ({ $position, $isBigSlider, $width }) => ({\n style: {\n minWidth: `${$width}px`,\n top: `-${$isBigSlider ? 56 : 48}px`,\n left: `${$position}px`,\n },\n }),\n)`\n pointer-events: none;\n color: #222;\n\n height: 20px;\n cursor: pointer;\n border-radius: 3px;\n background-color: white;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);\n z-index: 3;\n position: absolute;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 16px;\n white-space: nowrap;\n\n transition: top 0.2s ease 0s;\n\n &::after {\n background-color: inherit;\n border-bottom: 1px solid rgba(0, 0, 0, 0.1);\n border-right: 1px solid rgba(0, 0, 0, 0.1);\n box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.4);\n content: '';\n height: 14px;\n position: absolute;\n width: 14px;\n z-index: -2;\n left: ${({ $position }) => $position * -1}px;\n transform: rotate(225deg);\n bottom: -7px;\n }\n\n &::before {\n background-color: inherit;\n bottom: 0;\n content: '';\n left: 0;\n position: absolute;\n right: 0;\n border-radius: 3px;\n top: 0;\n z-index: -1;\n }\n`;\n"],"mappings":"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","ignoreList":[]}
@@ -12,6 +12,10 @@ export type AccordionContentProps = {
12
12
  * Function that is executed when the element will be scrolled
13
13
  */
14
14
  onScroll?: (event: UIEvent<HTMLDivElement>) => void;
15
+ /**
16
+ * Whether the bottom space should be removed.
17
+ */
18
+ shouldPreventBottomSpace?: boolean;
15
19
  };
16
20
  declare const AccordionContent: FC<AccordionContentProps>;
17
21
  export default AccordionContent;
@@ -4,6 +4,7 @@ type StyledAccordionContentProps = WithTheme<{
4
4
  $isWrapped?: boolean;
5
5
  $maxHeight?: number;
6
6
  $browser: Browser | 'bot' | null | undefined;
7
+ $shouldPreventBottomSpace: boolean;
7
8
  }>;
8
9
  export declare const StyledAccordionContent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledAccordionContentProps>> & string;
9
10
  export {};
@@ -5,6 +5,7 @@ export type MentionMember = {
5
5
  info: string;
6
6
  imageUrl: string;
7
7
  name: string;
8
+ shouldShowRoundImage?: boolean;
8
9
  };
9
10
  export type MentionFinderProps = {
10
11
  /**
@@ -3,7 +3,10 @@ type StyledMentionFinderItemProps = WithTheme<{
3
3
  $isActive: boolean;
4
4
  }>;
5
5
  export declare const StyledMentionFinderItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledMentionFinderItemProps>> & string;
6
- export declare const StyledMentionFinderItemImage: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, never>> & string;
6
+ type StyledMentionFinderItemImageProps = WithTheme<{
7
+ $shouldShowRoundImage?: boolean;
8
+ }>;
9
+ export declare const StyledMentionFinderItemImage: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, StyledMentionFinderItemImageProps>> & string;
7
10
  export declare const StyledMentionFinderItemContent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
8
11
  export declare const StyledMentionFinderItemContentName: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
9
12
  export declare const StyledMentionFinderItemContentInfo: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
@@ -8,6 +8,10 @@ export type SliderProps = {
8
8
  * The range that can be selected with two thumbs..
9
9
  */
10
10
  interval?: SliderInterval;
11
+ /**
12
+ * Whether the slider is disabled.
13
+ */
14
+ isDisabled?: boolean;
11
15
  /**
12
16
  * The maximum value of the slider.
13
17
  */