@chayns-components/core 5.5.61 → 5.5.62
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.
|
@@ -166,7 +166,7 @@ const StyledComboBoxPrefixAndPlaceholderWrapper = exports.StyledComboBoxPrefixAn
|
|
|
166
166
|
${({
|
|
167
167
|
$size
|
|
168
168
|
}) => $size === _ComboBox.ComboBoxSize.MINI && (0, _styledComponents.css)`
|
|
169
|
-
padding: 2px
|
|
169
|
+
padding: 2px;
|
|
170
170
|
`}
|
|
171
171
|
`;
|
|
172
172
|
const StyledComboBoxPrefix = exports.StyledComboBoxPrefix = _styledComponents.default.div`
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComboBox.styles.js","names":["_styledComponents","_interopRequireWildcard","require","_dropdown","_ComboBox","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","StyledComboBox","exports","styled","div","$shouldUseFullWidth","$minWidth","css","StyledComboBoxHeader","$isDisabled","$size","ComboBoxSize","MINI","SMALL","NORMAL","theme","$shouldShowTransparentBackground","$shouldChangeColor","colorMode","$shouldShowBigImage","$isOpen","$direction","DropdownDirection","BOTTOM","BOTTOM_LEFT","BOTTOM_RIGHT","includes","$isTouch","StyledComboBoxPlaceholder","text","$shouldReduceOpacity","StyledComboBoxPlaceholderText","StyledComboBoxPrefixAndPlaceholderWrapper","StyledComboBoxPrefix","$prefixMinWidth","StyledComboBoxInput","input","StyledComboBoxPlaceholderImage","img","$shouldShowRoundImage","StyledComboBoxClearIconWrapper","StyledComboBoxIconWrapper","$shouldShowBorderLeft","StyledComboBoxBody","$maxHeight","StyledComboBoxTopic"],"sources":["../../../../src/components/combobox/ComboBox.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { Theme, WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport { DropdownDirection } from '../../types/dropdown';\nimport { ComboBoxProps, ComboBoxSize } from './ComboBox.types';\n\ntype StyledComboBoxProps = WithTheme<{\n $minWidth?: number;\n $shouldUseFullWidth: ComboBoxProps['shouldUseFullWidth'];\n}>;\n\nexport const StyledComboBox = styled.div<StyledComboBoxProps>`\n min-width: 0;\n user-select: none;\n position: relative;\n\n ${({ $shouldUseFullWidth, $minWidth }) => {\n if ($shouldUseFullWidth) {\n return css`\n width: 100%;\n max-width: 100%;\n min-width: ${typeof $minWidth === 'number' ? `${$minWidth}px` : '0'};\n `;\n }\n\n if (typeof $minWidth === 'number') {\n return css`\n width: fit-content;\n max-width: 100%;\n min-width: ${$minWidth}px;\n `;\n }\n\n return css`\n width: fit-content;\n max-width: 100%;\n `;\n }}\n`;\n\ntype StyledComboBoxHeaderProps = WithTheme<{\n $isTouch: boolean;\n $isOpen: boolean;\n $direction: DropdownDirection;\n $isDisabled?: boolean;\n $shouldChangeColor: boolean;\n $shouldShowBigImage: ComboBoxProps['shouldShowBigImage'];\n $shouldShowTransparentBackground: boolean;\n $size: ComboBoxSize;\n}>;\n\nexport const StyledComboBoxHeader = styled.div<StyledComboBoxHeaderProps>`\n display: flex;\n min-width: 0;\n border: 1px solid transparent;\n cursor: ${({ $isDisabled }) => (!$isDisabled ? 'pointer' : 'default')};\n justify-content: space-between;\n opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n transition: background-color 0.2s ease-in-out;\n\n ${({ $size }) => {\n switch ($size) {\n case ComboBoxSize.MINI:\n return css`\n box-sizing: border-box;\n height: 28px;\n `;\n case ComboBoxSize.SMALL:\n return css`\n height: 34px;\n `;\n case ComboBoxSize.NORMAL:\n default:\n return css`\n min-height: 42px;\n `;\n }\n }}\n\n ${({ theme, $shouldShowTransparentBackground, $shouldChangeColor }) => {\n if ($shouldShowTransparentBackground) {\n if (theme.colorMode === 'dark') {\n return css`\n border-color: rgba(255, 255, 255, 0.3);\n background-color: transparent;\n `;\n }\n\n return css`\n border-color: rgba(0, 0, 0, 0.3);\n background-color: transparent;\n `;\n }\n\n return css`\n border-color: rgba(160, 160, 160, 0.3);\n background-color: ${\n theme.colorMode === 'classic' || $shouldChangeColor ? theme['000'] : theme['100']\n };\n `;\n }}\n\n ${({ $shouldShowBigImage }) =>\n $shouldShowBigImage &&\n css`\n height: 42px;\n `}\n\n ${({ $isOpen, $direction }) => {\n if ($isOpen) {\n return [\n DropdownDirection.BOTTOM,\n DropdownDirection.BOTTOM_LEFT,\n DropdownDirection.BOTTOM_RIGHT,\n ].includes($direction)\n ? css`\n border-top-left-radius: 3px;\n border-top-right-radius: 3px;\n `\n : css`\n border-bottom-left-radius: 3px;\n border-bottom-right-radius: 3px;\n `;\n }\n\n return css`\n border-radius: 3px;\n `;\n }}\n\n ${({ $isTouch, $isDisabled, theme }: StyledComboBoxHeaderProps) =>\n !$isTouch &&\n !$isDisabled &&\n css`\n &:hover {\n background-color: ${theme['secondary-102']};\n }\n `}\n\n &:focus-visible {\n outline: none;\n }\n`;\n\ntype StyledComboBoxPlaceholderProps = WithTheme<{\n $shouldReduceOpacity: boolean;\n $size: ComboBoxSize;\n}>;\n\nexport const StyledComboBoxPlaceholder = styled.div<StyledComboBoxPlaceholderProps>`\n align-items: center;\n color: ${({ theme }: StyledComboBoxPlaceholderProps) => theme.text};\n display: flex;\n flex: 1 1 auto;\n gap: 10px;\n min-width: 0;\n opacity: ${({ $shouldReduceOpacity }) => ($shouldReduceOpacity ? 0.5 : 1)};\n\n ${({ $size }) =>\n $size === ComboBoxSize.MINI &&\n css`\n font-size: 13px;\n `}\n`;\n\nexport const StyledComboBoxPlaceholderText = styled.div`\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n`;\n\ntype StyledComboBoxPrefixAndPlaceholderWrapperProps = {\n $size: ComboBoxSize;\n};\n\nexport const StyledComboBoxPrefixAndPlaceholderWrapper = styled.div<StyledComboBoxPrefixAndPlaceholderWrapperProps>`\n align-items: center;\n display: flex;\n flex: 1 1 auto;\n min-width: 0;\n padding: 4px 10px;\n\n ${({ $size }) =>\n $size === ComboBoxSize.MINI &&\n css`\n padding: 2px 8px;\n `}\n`;\n\ntype StyledComboBoxPrefixProps = {\n $prefixMinWidth?: number;\n $size: ComboBoxSize;\n};\n\nexport const StyledComboBoxPrefix = styled.div<StyledComboBoxPrefixProps>`\n flex: 0 0 auto;\n min-width: ${({ $prefixMinWidth }) => $prefixMinWidth ?? 0}px;\n padding-right: 5px;\n\n ${({ $size }) =>\n $size === ComboBoxSize.MINI &&\n css`\n font-size: 13px;\n padding-right: 4px;\n `}\n`;\n\nexport const StyledComboBoxInput = styled.input`\n color: ${({ theme }: { theme: Theme }) => theme.text};\n border: none;\n background-color: transparent;\n font: inherit;\n width: 100%;\n min-width: 0;\n`;\n\ntype StyledComboBoxPlaceholderImageProps = WithTheme<{\n $shouldShowBigImage: ComboBoxProps['shouldShowBigImage'];\n $shouldShowRoundImage: ComboBoxProps['shouldShowRoundImage'];\n}>;\n\nexport const StyledComboBoxPlaceholderImage = styled.img<StyledComboBoxPlaceholderImageProps>`\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledComboBoxPlaceholderImageProps) => theme['009-rgb']}, 0.15);\n height: ${({ $shouldShowBigImage }) => ($shouldShowBigImage ? '32px' : '22px')};\n width: ${({ $shouldShowBigImage }) => ($shouldShowBigImage ? '32px' : '22px')};\n\n ${({ $shouldShowRoundImage }) =>\n $shouldShowRoundImage &&\n css`\n border-radius: 50%;\n `}\n`;\n\ntype StyledComboBoxClearIconWrapperProps = {\n $isDisabled: boolean;\n $size: ComboBoxSize;\n};\n\nexport const StyledComboBoxClearIconWrapper = styled.div<StyledComboBoxClearIconWrapperProps>`\n align-items: center;\n cursor: ${({ $isDisabled }) => (!$isDisabled ? 'pointer' : 'default')};\n display: flex;\n flex: 0 0 auto;\n height: 40px;\n justify-content: center;\n width: 40px;\n\n ${({ $size }) =>\n $size === ComboBoxSize.MINI &&\n css`\n height: 26px;\n width: 28px;\n `}\n`;\n\ntype StyledComboBoxIconWrapperProps = {\n $shouldShowBorderLeft: boolean;\n $isDisabled: boolean;\n $size: ComboBoxSize;\n};\n\nexport const StyledComboBoxIconWrapper = styled.div<StyledComboBoxIconWrapperProps>`\n align-items: center;\n border-left: ${({ $shouldShowBorderLeft }) =>\n $shouldShowBorderLeft ? '1px solid rgba(160, 160, 160, 0.3)' : 'none'};\n cursor: ${({ $isDisabled }) => (!$isDisabled ? 'pointer' : 'default')};\n display: flex;\n flex: 0 0 auto;\n justify-content: center;\n width: 40px;\n\n ${({ $size }) => {\n switch ($size) {\n case ComboBoxSize.MINI:\n return css`\n height: 26px;\n width: 28px;\n `;\n case ComboBoxSize.SMALL:\n return css`\n height: 30px;\n `;\n case ComboBoxSize.NORMAL:\n default:\n return css`\n height: 40px;\n `;\n }\n }}\n`;\n\ntype StyledComboBoxBodyProps = WithTheme<{\n $maxHeight: number;\n $minWidth: number;\n}>;\n\nexport const StyledComboBoxBody = styled.div<StyledComboBoxBodyProps>`\n display: flex;\n flex-direction: column;\n cursor: pointer;\n min-width: ${({ $minWidth }) => $minWidth}px;\n\n overflow-x: hidden;\n overflow-y: auto;\n\n max-height: ${({ $maxHeight }) => $maxHeight}px;\n`;\n\ntype StyledComboBoxTopicProps = WithTheme<unknown>;\n\nexport const StyledComboBoxTopic = styled.div`\n align-items: center;\n background-color: ${({ theme }: StyledComboBoxTopicProps) => theme['secondary-102']};\n color: rgba(${({ theme }: StyledComboBoxTopicProps) => theme['text-rgb']}, 0.65);\n cursor: default;\n display: flex;\n flex: 0 0 auto;\n font-weight: bold;\n min-height: 38px;\n line-height: normal;\n padding: 8px 10px;\n position: sticky;\n top: 0;\n z-index: 10;\n`;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"ComboBox.styles.js","names":["_styledComponents","_interopRequireWildcard","require","_dropdown","_ComboBox","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","StyledComboBox","exports","styled","div","$shouldUseFullWidth","$minWidth","css","StyledComboBoxHeader","$isDisabled","$size","ComboBoxSize","MINI","SMALL","NORMAL","theme","$shouldShowTransparentBackground","$shouldChangeColor","colorMode","$shouldShowBigImage","$isOpen","$direction","DropdownDirection","BOTTOM","BOTTOM_LEFT","BOTTOM_RIGHT","includes","$isTouch","StyledComboBoxPlaceholder","text","$shouldReduceOpacity","StyledComboBoxPlaceholderText","StyledComboBoxPrefixAndPlaceholderWrapper","StyledComboBoxPrefix","$prefixMinWidth","StyledComboBoxInput","input","StyledComboBoxPlaceholderImage","img","$shouldShowRoundImage","StyledComboBoxClearIconWrapper","StyledComboBoxIconWrapper","$shouldShowBorderLeft","StyledComboBoxBody","$maxHeight","StyledComboBoxTopic"],"sources":["../../../../src/components/combobox/ComboBox.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { Theme, WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport { DropdownDirection } from '../../types/dropdown';\nimport { ComboBoxProps, ComboBoxSize } from './ComboBox.types';\n\ntype StyledComboBoxProps = WithTheme<{\n $minWidth?: number;\n $shouldUseFullWidth: ComboBoxProps['shouldUseFullWidth'];\n}>;\n\nexport const StyledComboBox = styled.div<StyledComboBoxProps>`\n min-width: 0;\n user-select: none;\n position: relative;\n\n ${({ $shouldUseFullWidth, $minWidth }) => {\n if ($shouldUseFullWidth) {\n return css`\n width: 100%;\n max-width: 100%;\n min-width: ${typeof $minWidth === 'number' ? `${$minWidth}px` : '0'};\n `;\n }\n\n if (typeof $minWidth === 'number') {\n return css`\n width: fit-content;\n max-width: 100%;\n min-width: ${$minWidth}px;\n `;\n }\n\n return css`\n width: fit-content;\n max-width: 100%;\n `;\n }}\n`;\n\ntype StyledComboBoxHeaderProps = WithTheme<{\n $isTouch: boolean;\n $isOpen: boolean;\n $direction: DropdownDirection;\n $isDisabled?: boolean;\n $shouldChangeColor: boolean;\n $shouldShowBigImage: ComboBoxProps['shouldShowBigImage'];\n $shouldShowTransparentBackground: boolean;\n $size: ComboBoxSize;\n}>;\n\nexport const StyledComboBoxHeader = styled.div<StyledComboBoxHeaderProps>`\n display: flex;\n min-width: 0;\n border: 1px solid transparent;\n cursor: ${({ $isDisabled }) => (!$isDisabled ? 'pointer' : 'default')};\n justify-content: space-between;\n opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n transition: background-color 0.2s ease-in-out;\n\n ${({ $size }) => {\n switch ($size) {\n case ComboBoxSize.MINI:\n return css`\n box-sizing: border-box;\n height: 28px;\n `;\n case ComboBoxSize.SMALL:\n return css`\n height: 34px;\n `;\n case ComboBoxSize.NORMAL:\n default:\n return css`\n min-height: 42px;\n `;\n }\n }}\n\n ${({ theme, $shouldShowTransparentBackground, $shouldChangeColor }) => {\n if ($shouldShowTransparentBackground) {\n if (theme.colorMode === 'dark') {\n return css`\n border-color: rgba(255, 255, 255, 0.3);\n background-color: transparent;\n `;\n }\n\n return css`\n border-color: rgba(0, 0, 0, 0.3);\n background-color: transparent;\n `;\n }\n\n return css`\n border-color: rgba(160, 160, 160, 0.3);\n background-color: ${\n theme.colorMode === 'classic' || $shouldChangeColor ? theme['000'] : theme['100']\n };\n `;\n }}\n\n ${({ $shouldShowBigImage }) =>\n $shouldShowBigImage &&\n css`\n height: 42px;\n `}\n\n ${({ $isOpen, $direction }) => {\n if ($isOpen) {\n return [\n DropdownDirection.BOTTOM,\n DropdownDirection.BOTTOM_LEFT,\n DropdownDirection.BOTTOM_RIGHT,\n ].includes($direction)\n ? css`\n border-top-left-radius: 3px;\n border-top-right-radius: 3px;\n `\n : css`\n border-bottom-left-radius: 3px;\n border-bottom-right-radius: 3px;\n `;\n }\n\n return css`\n border-radius: 3px;\n `;\n }}\n\n ${({ $isTouch, $isDisabled, theme }: StyledComboBoxHeaderProps) =>\n !$isTouch &&\n !$isDisabled &&\n css`\n &:hover {\n background-color: ${theme['secondary-102']};\n }\n `}\n\n &:focus-visible {\n outline: none;\n }\n`;\n\ntype StyledComboBoxPlaceholderProps = WithTheme<{\n $shouldReduceOpacity: boolean;\n $size: ComboBoxSize;\n}>;\n\nexport const StyledComboBoxPlaceholder = styled.div<StyledComboBoxPlaceholderProps>`\n align-items: center;\n color: ${({ theme }: StyledComboBoxPlaceholderProps) => theme.text};\n display: flex;\n flex: 1 1 auto;\n gap: 10px;\n min-width: 0;\n opacity: ${({ $shouldReduceOpacity }) => ($shouldReduceOpacity ? 0.5 : 1)};\n\n ${({ $size }) =>\n $size === ComboBoxSize.MINI &&\n css`\n font-size: 13px;\n `}\n`;\n\nexport const StyledComboBoxPlaceholderText = styled.div`\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n`;\n\ntype StyledComboBoxPrefixAndPlaceholderWrapperProps = {\n $size: ComboBoxSize;\n};\n\nexport const StyledComboBoxPrefixAndPlaceholderWrapper = styled.div<StyledComboBoxPrefixAndPlaceholderWrapperProps>`\n align-items: center;\n display: flex;\n flex: 1 1 auto;\n min-width: 0;\n padding: 4px 10px;\n\n ${({ $size }) =>\n $size === ComboBoxSize.MINI &&\n css`\n padding: 2px;\n `}\n`;\n\ntype StyledComboBoxPrefixProps = {\n $prefixMinWidth?: number;\n $size: ComboBoxSize;\n};\n\nexport const StyledComboBoxPrefix = styled.div<StyledComboBoxPrefixProps>`\n flex: 0 0 auto;\n min-width: ${({ $prefixMinWidth }) => $prefixMinWidth ?? 0}px;\n padding-right: 5px;\n\n ${({ $size }) =>\n $size === ComboBoxSize.MINI &&\n css`\n font-size: 13px;\n padding-right: 4px;\n `}\n`;\n\nexport const StyledComboBoxInput = styled.input`\n color: ${({ theme }: { theme: Theme }) => theme.text};\n border: none;\n background-color: transparent;\n font: inherit;\n width: 100%;\n min-width: 0;\n`;\n\ntype StyledComboBoxPlaceholderImageProps = WithTheme<{\n $shouldShowBigImage: ComboBoxProps['shouldShowBigImage'];\n $shouldShowRoundImage: ComboBoxProps['shouldShowRoundImage'];\n}>;\n\nexport const StyledComboBoxPlaceholderImage = styled.img<StyledComboBoxPlaceholderImageProps>`\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledComboBoxPlaceholderImageProps) => theme['009-rgb']}, 0.15);\n height: ${({ $shouldShowBigImage }) => ($shouldShowBigImage ? '32px' : '22px')};\n width: ${({ $shouldShowBigImage }) => ($shouldShowBigImage ? '32px' : '22px')};\n\n ${({ $shouldShowRoundImage }) =>\n $shouldShowRoundImage &&\n css`\n border-radius: 50%;\n `}\n`;\n\ntype StyledComboBoxClearIconWrapperProps = {\n $isDisabled: boolean;\n $size: ComboBoxSize;\n};\n\nexport const StyledComboBoxClearIconWrapper = styled.div<StyledComboBoxClearIconWrapperProps>`\n align-items: center;\n cursor: ${({ $isDisabled }) => (!$isDisabled ? 'pointer' : 'default')};\n display: flex;\n flex: 0 0 auto;\n height: 40px;\n justify-content: center;\n width: 40px;\n\n ${({ $size }) =>\n $size === ComboBoxSize.MINI &&\n css`\n height: 26px;\n width: 28px;\n `}\n`;\n\ntype StyledComboBoxIconWrapperProps = {\n $shouldShowBorderLeft: boolean;\n $isDisabled: boolean;\n $size: ComboBoxSize;\n};\n\nexport const StyledComboBoxIconWrapper = styled.div<StyledComboBoxIconWrapperProps>`\n align-items: center;\n border-left: ${({ $shouldShowBorderLeft }) =>\n $shouldShowBorderLeft ? '1px solid rgba(160, 160, 160, 0.3)' : 'none'};\n cursor: ${({ $isDisabled }) => (!$isDisabled ? 'pointer' : 'default')};\n display: flex;\n flex: 0 0 auto;\n justify-content: center;\n width: 40px;\n\n ${({ $size }) => {\n switch ($size) {\n case ComboBoxSize.MINI:\n return css`\n height: 26px;\n width: 28px;\n `;\n case ComboBoxSize.SMALL:\n return css`\n height: 30px;\n `;\n case ComboBoxSize.NORMAL:\n default:\n return css`\n height: 40px;\n `;\n }\n }}\n`;\n\ntype StyledComboBoxBodyProps = WithTheme<{\n $maxHeight: number;\n $minWidth: number;\n}>;\n\nexport const StyledComboBoxBody = styled.div<StyledComboBoxBodyProps>`\n display: flex;\n flex-direction: column;\n cursor: pointer;\n min-width: ${({ $minWidth }) => $minWidth}px;\n\n overflow-x: hidden;\n overflow-y: auto;\n\n max-height: ${({ $maxHeight }) => $maxHeight}px;\n`;\n\ntype StyledComboBoxTopicProps = WithTheme<unknown>;\n\nexport const StyledComboBoxTopic = styled.div`\n align-items: center;\n background-color: ${({ theme }: StyledComboBoxTopicProps) => theme['secondary-102']};\n color: rgba(${({ theme }: StyledComboBoxTopicProps) => theme['text-rgb']}, 0.65);\n cursor: default;\n display: flex;\n flex: 0 0 auto;\n font-weight: bold;\n min-height: 38px;\n line-height: normal;\n padding: 8px 10px;\n position: sticky;\n top: 0;\n z-index: 10;\n`;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComboBox.styles.js","names":["styled","css","DropdownDirection","ComboBoxSize","StyledComboBox","div","$shouldUseFullWidth","$minWidth","StyledComboBoxHeader","$isDisabled","$size","MINI","SMALL","NORMAL","theme","$shouldShowTransparentBackground","$shouldChangeColor","colorMode","$shouldShowBigImage","$isOpen","$direction","BOTTOM","BOTTOM_LEFT","BOTTOM_RIGHT","includes","$isTouch","StyledComboBoxPlaceholder","text","$shouldReduceOpacity","StyledComboBoxPlaceholderText","StyledComboBoxPrefixAndPlaceholderWrapper","StyledComboBoxPrefix","$prefixMinWidth","StyledComboBoxInput","input","StyledComboBoxPlaceholderImage","img","$shouldShowRoundImage","StyledComboBoxClearIconWrapper","StyledComboBoxIconWrapper","$shouldShowBorderLeft","StyledComboBoxBody","$maxHeight","StyledComboBoxTopic"],"sources":["../../../../src/components/combobox/ComboBox.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { Theme, WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport { DropdownDirection } from '../../types/dropdown';\nimport { ComboBoxProps, ComboBoxSize } from './ComboBox.types';\n\ntype StyledComboBoxProps = WithTheme<{\n $minWidth?: number;\n $shouldUseFullWidth: ComboBoxProps['shouldUseFullWidth'];\n}>;\n\nexport const StyledComboBox = styled.div<StyledComboBoxProps>`\n min-width: 0;\n user-select: none;\n position: relative;\n\n ${({ $shouldUseFullWidth, $minWidth }) => {\n if ($shouldUseFullWidth) {\n return css`\n width: 100%;\n max-width: 100%;\n min-width: ${typeof $minWidth === 'number' ? `${$minWidth}px` : '0'};\n `;\n }\n\n if (typeof $minWidth === 'number') {\n return css`\n width: fit-content;\n max-width: 100%;\n min-width: ${$minWidth}px;\n `;\n }\n\n return css`\n width: fit-content;\n max-width: 100%;\n `;\n }}\n`;\n\ntype StyledComboBoxHeaderProps = WithTheme<{\n $isTouch: boolean;\n $isOpen: boolean;\n $direction: DropdownDirection;\n $isDisabled?: boolean;\n $shouldChangeColor: boolean;\n $shouldShowBigImage: ComboBoxProps['shouldShowBigImage'];\n $shouldShowTransparentBackground: boolean;\n $size: ComboBoxSize;\n}>;\n\nexport const StyledComboBoxHeader = styled.div<StyledComboBoxHeaderProps>`\n display: flex;\n min-width: 0;\n border: 1px solid transparent;\n cursor: ${({ $isDisabled }) => (!$isDisabled ? 'pointer' : 'default')};\n justify-content: space-between;\n opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n transition: background-color 0.2s ease-in-out;\n\n ${({ $size }) => {\n switch ($size) {\n case ComboBoxSize.MINI:\n return css`\n box-sizing: border-box;\n height: 28px;\n `;\n case ComboBoxSize.SMALL:\n return css`\n height: 34px;\n `;\n case ComboBoxSize.NORMAL:\n default:\n return css`\n min-height: 42px;\n `;\n }\n }}\n\n ${({ theme, $shouldShowTransparentBackground, $shouldChangeColor }) => {\n if ($shouldShowTransparentBackground) {\n if (theme.colorMode === 'dark') {\n return css`\n border-color: rgba(255, 255, 255, 0.3);\n background-color: transparent;\n `;\n }\n\n return css`\n border-color: rgba(0, 0, 0, 0.3);\n background-color: transparent;\n `;\n }\n\n return css`\n border-color: rgba(160, 160, 160, 0.3);\n background-color: ${\n theme.colorMode === 'classic' || $shouldChangeColor ? theme['000'] : theme['100']\n };\n `;\n }}\n\n ${({ $shouldShowBigImage }) =>\n $shouldShowBigImage &&\n css`\n height: 42px;\n `}\n\n ${({ $isOpen, $direction }) => {\n if ($isOpen) {\n return [\n DropdownDirection.BOTTOM,\n DropdownDirection.BOTTOM_LEFT,\n DropdownDirection.BOTTOM_RIGHT,\n ].includes($direction)\n ? css`\n border-top-left-radius: 3px;\n border-top-right-radius: 3px;\n `\n : css`\n border-bottom-left-radius: 3px;\n border-bottom-right-radius: 3px;\n `;\n }\n\n return css`\n border-radius: 3px;\n `;\n }}\n\n ${({ $isTouch, $isDisabled, theme }: StyledComboBoxHeaderProps) =>\n !$isTouch &&\n !$isDisabled &&\n css`\n &:hover {\n background-color: ${theme['secondary-102']};\n }\n `}\n\n &:focus-visible {\n outline: none;\n }\n`;\n\ntype StyledComboBoxPlaceholderProps = WithTheme<{\n $shouldReduceOpacity: boolean;\n $size: ComboBoxSize;\n}>;\n\nexport const StyledComboBoxPlaceholder = styled.div<StyledComboBoxPlaceholderProps>`\n align-items: center;\n color: ${({ theme }: StyledComboBoxPlaceholderProps) => theme.text};\n display: flex;\n flex: 1 1 auto;\n gap: 10px;\n min-width: 0;\n opacity: ${({ $shouldReduceOpacity }) => ($shouldReduceOpacity ? 0.5 : 1)};\n\n ${({ $size }) =>\n $size === ComboBoxSize.MINI &&\n css`\n font-size: 13px;\n `}\n`;\n\nexport const StyledComboBoxPlaceholderText = styled.div`\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n`;\n\ntype StyledComboBoxPrefixAndPlaceholderWrapperProps = {\n $size: ComboBoxSize;\n};\n\nexport const StyledComboBoxPrefixAndPlaceholderWrapper = styled.div<StyledComboBoxPrefixAndPlaceholderWrapperProps>`\n align-items: center;\n display: flex;\n flex: 1 1 auto;\n min-width: 0;\n padding: 4px 10px;\n\n ${({ $size }) =>\n $size === ComboBoxSize.MINI &&\n css`\n padding: 2px 8px;\n `}\n`;\n\ntype StyledComboBoxPrefixProps = {\n $prefixMinWidth?: number;\n $size: ComboBoxSize;\n};\n\nexport const StyledComboBoxPrefix = styled.div<StyledComboBoxPrefixProps>`\n flex: 0 0 auto;\n min-width: ${({ $prefixMinWidth }) => $prefixMinWidth ?? 0}px;\n padding-right: 5px;\n\n ${({ $size }) =>\n $size === ComboBoxSize.MINI &&\n css`\n font-size: 13px;\n padding-right: 4px;\n `}\n`;\n\nexport const StyledComboBoxInput = styled.input`\n color: ${({ theme }: { theme: Theme }) => theme.text};\n border: none;\n background-color: transparent;\n font: inherit;\n width: 100%;\n min-width: 0;\n`;\n\ntype StyledComboBoxPlaceholderImageProps = WithTheme<{\n $shouldShowBigImage: ComboBoxProps['shouldShowBigImage'];\n $shouldShowRoundImage: ComboBoxProps['shouldShowRoundImage'];\n}>;\n\nexport const StyledComboBoxPlaceholderImage = styled.img<StyledComboBoxPlaceholderImageProps>`\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledComboBoxPlaceholderImageProps) => theme['009-rgb']}, 0.15);\n height: ${({ $shouldShowBigImage }) => ($shouldShowBigImage ? '32px' : '22px')};\n width: ${({ $shouldShowBigImage }) => ($shouldShowBigImage ? '32px' : '22px')};\n\n ${({ $shouldShowRoundImage }) =>\n $shouldShowRoundImage &&\n css`\n border-radius: 50%;\n `}\n`;\n\ntype StyledComboBoxClearIconWrapperProps = {\n $isDisabled: boolean;\n $size: ComboBoxSize;\n};\n\nexport const StyledComboBoxClearIconWrapper = styled.div<StyledComboBoxClearIconWrapperProps>`\n align-items: center;\n cursor: ${({ $isDisabled }) => (!$isDisabled ? 'pointer' : 'default')};\n display: flex;\n flex: 0 0 auto;\n height: 40px;\n justify-content: center;\n width: 40px;\n\n ${({ $size }) =>\n $size === ComboBoxSize.MINI &&\n css`\n height: 26px;\n width: 28px;\n `}\n`;\n\ntype StyledComboBoxIconWrapperProps = {\n $shouldShowBorderLeft: boolean;\n $isDisabled: boolean;\n $size: ComboBoxSize;\n};\n\nexport const StyledComboBoxIconWrapper = styled.div<StyledComboBoxIconWrapperProps>`\n align-items: center;\n border-left: ${({ $shouldShowBorderLeft }) =>\n $shouldShowBorderLeft ? '1px solid rgba(160, 160, 160, 0.3)' : 'none'};\n cursor: ${({ $isDisabled }) => (!$isDisabled ? 'pointer' : 'default')};\n display: flex;\n flex: 0 0 auto;\n justify-content: center;\n width: 40px;\n\n ${({ $size }) => {\n switch ($size) {\n case ComboBoxSize.MINI:\n return css`\n height: 26px;\n width: 28px;\n `;\n case ComboBoxSize.SMALL:\n return css`\n height: 30px;\n `;\n case ComboBoxSize.NORMAL:\n default:\n return css`\n height: 40px;\n `;\n }\n }}\n`;\n\ntype StyledComboBoxBodyProps = WithTheme<{\n $maxHeight: number;\n $minWidth: number;\n}>;\n\nexport const StyledComboBoxBody = styled.div<StyledComboBoxBodyProps>`\n display: flex;\n flex-direction: column;\n cursor: pointer;\n min-width: ${({ $minWidth }) => $minWidth}px;\n\n overflow-x: hidden;\n overflow-y: auto;\n\n max-height: ${({ $maxHeight }) => $maxHeight}px;\n`;\n\ntype StyledComboBoxTopicProps = WithTheme<unknown>;\n\nexport const StyledComboBoxTopic = styled.div`\n align-items: center;\n background-color: ${({ theme }: StyledComboBoxTopicProps) => theme['secondary-102']};\n color: rgba(${({ theme }: StyledComboBoxTopicProps) => theme['text-rgb']}, 0.65);\n cursor: default;\n display: flex;\n flex: 0 0 auto;\n font-weight: bold;\n min-height: 38px;\n line-height: normal;\n padding: 8px 10px;\n position: sticky;\n top: 0;\n z-index: 10;\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAE/C,SAASC,iBAAiB,QAAQ,sBAAsB;AACxD,SAAwBC,YAAY,QAAQ,kBAAkB;AAO9D,OAAO,MAAMC,cAAc,GAAGJ,MAAM,CAACK,GAAwB;AAC7D;AACA;AACA;AACA;AACA,MAAM,CAAC;EAAEC,mBAAmB;EAAEC;AAAU,CAAC,KAAK;EACtC,IAAID,mBAAmB,EAAE;IACrB,OAAOL,GAAG;AACtB;AACA;AACA,6BAA6B,OAAOM,SAAS,KAAK,QAAQ,GAAG,GAAGA,SAAS,IAAI,GAAG,GAAG;AACnF,aAAa;EACL;EAEA,IAAI,OAAOA,SAAS,KAAK,QAAQ,EAAE;IAC/B,OAAON,GAAG;AACtB;AACA;AACA,6BAA6BM,SAAS;AACtC,aAAa;EACL;EAEA,OAAON,GAAG;AAClB;AACA;AACA,SAAS;AACL,CAAC;AACL,CAAC;AAaD,OAAO,MAAMO,oBAAoB,GAAGR,MAAM,CAACK,GAA8B;AACzE;AACA;AACA;AACA,cAAc,CAAC;EAAEI;AAAY,CAAC,KAAM,CAACA,WAAW,GAAG,SAAS,GAAG,SAAU;AACzE;AACA,eAAe,CAAC;EAAEA;AAAY,CAAC,KAAMA,WAAW,GAAG,GAAG,GAAG,CAAE;AAC3D;AACA;AACA,MAAM,CAAC;EAAEC;AAAM,CAAC,KAAK;EACb,QAAQA,KAAK;IACT,KAAKP,YAAY,CAACQ,IAAI;MAClB,OAAOV,GAAG;AAC1B;AACA;AACA,iBAAiB;IACL,KAAKE,YAAY,CAACS,KAAK;MACnB,OAAOX,GAAG;AAC1B;AACA,iBAAiB;IACL,KAAKE,YAAY,CAACU,MAAM;IACxB;MACI,OAAOZ,GAAG;AAC1B;AACA,iBAAiB;EACT;AACJ,CAAC;AACL;AACA,MAAM,CAAC;EAAEa,KAAK;EAAEC,gCAAgC;EAAEC;AAAmB,CAAC,KAAK;EACnE,IAAID,gCAAgC,EAAE;IAClC,IAAID,KAAK,CAACG,SAAS,KAAK,MAAM,EAAE;MAC5B,OAAOhB,GAAG;AAC1B;AACA;AACA,iBAAiB;IACL;IAEA,OAAOA,GAAG;AACtB;AACA;AACA,aAAa;EACL;EAEA,OAAOA,GAAG;AAClB;AACA,gCACgBa,KAAK,CAACG,SAAS,KAAK,SAAS,IAAID,kBAAkB,GAAGF,KAAK,CAAC,KAAK,CAAC,GAAGA,KAAK,CAAC,KAAK,CAAC;AACjG,SACS;AACL,CAAC;AACL;AACA,MAAM,CAAC;EAAEI;AAAoB,CAAC,KACtBA,mBAAmB,IACnBjB,GAAG;AACX;AACA,SAAS;AACT;AACA,MAAM,CAAC;EAAEkB,OAAO;EAAEC;AAAW,CAAC,KAAK;EAC3B,IAAID,OAAO,EAAE;IACT,OAAO,CACHjB,iBAAiB,CAACmB,MAAM,EACxBnB,iBAAiB,CAACoB,WAAW,EAC7BpB,iBAAiB,CAACqB,YAAY,CACjC,CAACC,QAAQ,CAACJ,UAAU,CAAC,GAChBnB,GAAG;AACrB;AACA;AACA,mBAAmB,GACDA,GAAG;AACrB;AACA;AACA,mBAAmB;EACX;EAEA,OAAOA,GAAG;AAClB;AACA,SAAS;AACL,CAAC;AACL;AACA,MAAM,CAAC;EAAEwB,QAAQ;EAAEhB,WAAW;EAAEK;AAAiC,CAAC,KAC1D,CAACW,QAAQ,IACT,CAAChB,WAAW,IACZR,GAAG;AACX;AACA,oCAAoCa,KAAK,CAAC,eAAe,CAAC;AAC1D;AACA,SAAS;AACT;AACA;AACA;AACA;AACA,CAAC;AAOD,OAAO,MAAMY,yBAAyB,GAAG1B,MAAM,CAACK,GAAmC;AACnF;AACA,aAAa,CAAC;EAAES;AAAsC,CAAC,KAAKA,KAAK,CAACa,IAAI;AACtE;AACA;AACA;AACA;AACA,eAAe,CAAC;EAAEC;AAAqB,CAAC,KAAMA,oBAAoB,GAAG,GAAG,GAAG,CAAE;AAC7E;AACA,MAAM,CAAC;EAAElB;AAAM,CAAC,KACRA,KAAK,KAAKP,YAAY,CAACQ,IAAI,IAC3BV,GAAG;AACX;AACA,SAAS;AACT,CAAC;AAED,OAAO,MAAM4B,6BAA6B,GAAG7B,MAAM,CAACK,GAAG;AACvD;AACA;AACA;AACA,CAAC;AAMD,OAAO,MAAMyB,yCAAyC,GAAG9B,MAAM,CAACK,GAAmD;AACnH;AACA;AACA;AACA;AACA;AACA;AACA,MAAM,CAAC;EAAEK;AAAM,CAAC,KACRA,KAAK,KAAKP,YAAY,CAACQ,IAAI,IAC3BV,GAAG;AACX;AACA,SAAS;AACT,CAAC;AAOD,OAAO,MAAM8B,oBAAoB,GAAG/B,MAAM,CAACK,GAA8B;AACzE;AACA,iBAAiB,CAAC;EAAE2B;AAAgB,CAAC,KAAKA,eAAe,IAAI,CAAC;AAC9D;AACA;AACA,MAAM,CAAC;EAAEtB;AAAM,CAAC,KACRA,KAAK,KAAKP,YAAY,CAACQ,IAAI,IAC3BV,GAAG;AACX;AACA;AACA,SAAS;AACT,CAAC;AAED,OAAO,MAAMgC,mBAAmB,GAAGjC,MAAM,CAACkC,KAAK;AAC/C,aAAa,CAAC;EAAEpB;AAAwB,CAAC,KAAKA,KAAK,CAACa,IAAI;AACxD;AACA;AACA;AACA;AACA;AACA,CAAC;AAOD,OAAO,MAAMQ,8BAA8B,GAAGnC,MAAM,CAACoC,GAAwC;AAC7F;AACA,eAAe,CAAC;EAAEtB;AAA2C,CAAC,KAAKA,KAAK,CAAC,SAAS,CAAC;AACnF,cAAc,CAAC;EAAEI;AAAoB,CAAC,KAAMA,mBAAmB,GAAG,MAAM,GAAG,MAAO;AAClF,aAAa,CAAC;EAAEA;AAAoB,CAAC,KAAMA,mBAAmB,GAAG,MAAM,GAAG,MAAO;AACjF;AACA,MAAM,CAAC;EAAEmB;AAAsB,CAAC,KACxBA,qBAAqB,IACrBpC,GAAG;AACX;AACA,SAAS;AACT,CAAC;AAOD,OAAO,MAAMqC,8BAA8B,GAAGtC,MAAM,CAACK,GAAwC;AAC7F;AACA,cAAc,CAAC;EAAEI;AAAY,CAAC,KAAM,CAACA,WAAW,GAAG,SAAS,GAAG,SAAU;AACzE;AACA;AACA;AACA;AACA;AACA;AACA,MAAM,CAAC;EAAEC;AAAM,CAAC,KACRA,KAAK,KAAKP,YAAY,CAACQ,IAAI,IAC3BV,GAAG;AACX;AACA;AACA,SAAS;AACT,CAAC;AAQD,OAAO,MAAMsC,yBAAyB,GAAGvC,MAAM,CAACK,GAAmC;AACnF;AACA,mBAAmB,CAAC;EAAEmC;AAAsB,CAAC,KACrCA,qBAAqB,GAAG,oCAAoC,GAAG,MAAM;AAC7E,cAAc,CAAC;EAAE/B;AAAY,CAAC,KAAM,CAACA,WAAW,GAAG,SAAS,GAAG,SAAU;AACzE;AACA;AACA;AACA;AACA;AACA,MAAM,CAAC;EAAEC;AAAM,CAAC,KAAK;EACb,QAAQA,KAAK;IACT,KAAKP,YAAY,CAACQ,IAAI;MAClB,OAAOV,GAAG;AAC1B;AACA;AACA,iBAAiB;IACL,KAAKE,YAAY,CAACS,KAAK;MACnB,OAAOX,GAAG;AAC1B;AACA,iBAAiB;IACL,KAAKE,YAAY,CAACU,MAAM;IACxB;MACI,OAAOZ,GAAG;AAC1B;AACA,iBAAiB;EACT;AACJ,CAAC;AACL,CAAC;AAOD,OAAO,MAAMwC,kBAAkB,GAAGzC,MAAM,CAACK,GAA4B;AACrE;AACA;AACA;AACA,iBAAiB,CAAC;EAAEE;AAAU,CAAC,KAAKA,SAAS;AAC7C;AACA;AACA;AACA;AACA,kBAAkB,CAAC;EAAEmC;AAAW,CAAC,KAAKA,UAAU;AAChD,CAAC;AAID,OAAO,MAAMC,mBAAmB,GAAG3C,MAAM,CAACK,GAAG;AAC7C;AACA,wBAAwB,CAAC;EAAES;AAAgC,CAAC,KAAKA,KAAK,CAAC,eAAe,CAAC;AACvF,kBAAkB,CAAC;EAAEA;AAAgC,CAAC,KAAKA,KAAK,CAAC,UAAU,CAAC;AAC5E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"ComboBox.styles.js","names":["styled","css","DropdownDirection","ComboBoxSize","StyledComboBox","div","$shouldUseFullWidth","$minWidth","StyledComboBoxHeader","$isDisabled","$size","MINI","SMALL","NORMAL","theme","$shouldShowTransparentBackground","$shouldChangeColor","colorMode","$shouldShowBigImage","$isOpen","$direction","BOTTOM","BOTTOM_LEFT","BOTTOM_RIGHT","includes","$isTouch","StyledComboBoxPlaceholder","text","$shouldReduceOpacity","StyledComboBoxPlaceholderText","StyledComboBoxPrefixAndPlaceholderWrapper","StyledComboBoxPrefix","$prefixMinWidth","StyledComboBoxInput","input","StyledComboBoxPlaceholderImage","img","$shouldShowRoundImage","StyledComboBoxClearIconWrapper","StyledComboBoxIconWrapper","$shouldShowBorderLeft","StyledComboBoxBody","$maxHeight","StyledComboBoxTopic"],"sources":["../../../../src/components/combobox/ComboBox.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { Theme, WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport { DropdownDirection } from '../../types/dropdown';\nimport { ComboBoxProps, ComboBoxSize } from './ComboBox.types';\n\ntype StyledComboBoxProps = WithTheme<{\n $minWidth?: number;\n $shouldUseFullWidth: ComboBoxProps['shouldUseFullWidth'];\n}>;\n\nexport const StyledComboBox = styled.div<StyledComboBoxProps>`\n min-width: 0;\n user-select: none;\n position: relative;\n\n ${({ $shouldUseFullWidth, $minWidth }) => {\n if ($shouldUseFullWidth) {\n return css`\n width: 100%;\n max-width: 100%;\n min-width: ${typeof $minWidth === 'number' ? `${$minWidth}px` : '0'};\n `;\n }\n\n if (typeof $minWidth === 'number') {\n return css`\n width: fit-content;\n max-width: 100%;\n min-width: ${$minWidth}px;\n `;\n }\n\n return css`\n width: fit-content;\n max-width: 100%;\n `;\n }}\n`;\n\ntype StyledComboBoxHeaderProps = WithTheme<{\n $isTouch: boolean;\n $isOpen: boolean;\n $direction: DropdownDirection;\n $isDisabled?: boolean;\n $shouldChangeColor: boolean;\n $shouldShowBigImage: ComboBoxProps['shouldShowBigImage'];\n $shouldShowTransparentBackground: boolean;\n $size: ComboBoxSize;\n}>;\n\nexport const StyledComboBoxHeader = styled.div<StyledComboBoxHeaderProps>`\n display: flex;\n min-width: 0;\n border: 1px solid transparent;\n cursor: ${({ $isDisabled }) => (!$isDisabled ? 'pointer' : 'default')};\n justify-content: space-between;\n opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n transition: background-color 0.2s ease-in-out;\n\n ${({ $size }) => {\n switch ($size) {\n case ComboBoxSize.MINI:\n return css`\n box-sizing: border-box;\n height: 28px;\n `;\n case ComboBoxSize.SMALL:\n return css`\n height: 34px;\n `;\n case ComboBoxSize.NORMAL:\n default:\n return css`\n min-height: 42px;\n `;\n }\n }}\n\n ${({ theme, $shouldShowTransparentBackground, $shouldChangeColor }) => {\n if ($shouldShowTransparentBackground) {\n if (theme.colorMode === 'dark') {\n return css`\n border-color: rgba(255, 255, 255, 0.3);\n background-color: transparent;\n `;\n }\n\n return css`\n border-color: rgba(0, 0, 0, 0.3);\n background-color: transparent;\n `;\n }\n\n return css`\n border-color: rgba(160, 160, 160, 0.3);\n background-color: ${\n theme.colorMode === 'classic' || $shouldChangeColor ? theme['000'] : theme['100']\n };\n `;\n }}\n\n ${({ $shouldShowBigImage }) =>\n $shouldShowBigImage &&\n css`\n height: 42px;\n `}\n\n ${({ $isOpen, $direction }) => {\n if ($isOpen) {\n return [\n DropdownDirection.BOTTOM,\n DropdownDirection.BOTTOM_LEFT,\n DropdownDirection.BOTTOM_RIGHT,\n ].includes($direction)\n ? css`\n border-top-left-radius: 3px;\n border-top-right-radius: 3px;\n `\n : css`\n border-bottom-left-radius: 3px;\n border-bottom-right-radius: 3px;\n `;\n }\n\n return css`\n border-radius: 3px;\n `;\n }}\n\n ${({ $isTouch, $isDisabled, theme }: StyledComboBoxHeaderProps) =>\n !$isTouch &&\n !$isDisabled &&\n css`\n &:hover {\n background-color: ${theme['secondary-102']};\n }\n `}\n\n &:focus-visible {\n outline: none;\n }\n`;\n\ntype StyledComboBoxPlaceholderProps = WithTheme<{\n $shouldReduceOpacity: boolean;\n $size: ComboBoxSize;\n}>;\n\nexport const StyledComboBoxPlaceholder = styled.div<StyledComboBoxPlaceholderProps>`\n align-items: center;\n color: ${({ theme }: StyledComboBoxPlaceholderProps) => theme.text};\n display: flex;\n flex: 1 1 auto;\n gap: 10px;\n min-width: 0;\n opacity: ${({ $shouldReduceOpacity }) => ($shouldReduceOpacity ? 0.5 : 1)};\n\n ${({ $size }) =>\n $size === ComboBoxSize.MINI &&\n css`\n font-size: 13px;\n `}\n`;\n\nexport const StyledComboBoxPlaceholderText = styled.div`\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n`;\n\ntype StyledComboBoxPrefixAndPlaceholderWrapperProps = {\n $size: ComboBoxSize;\n};\n\nexport const StyledComboBoxPrefixAndPlaceholderWrapper = styled.div<StyledComboBoxPrefixAndPlaceholderWrapperProps>`\n align-items: center;\n display: flex;\n flex: 1 1 auto;\n min-width: 0;\n padding: 4px 10px;\n\n ${({ $size }) =>\n $size === ComboBoxSize.MINI &&\n css`\n padding: 2px;\n `}\n`;\n\ntype StyledComboBoxPrefixProps = {\n $prefixMinWidth?: number;\n $size: ComboBoxSize;\n};\n\nexport const StyledComboBoxPrefix = styled.div<StyledComboBoxPrefixProps>`\n flex: 0 0 auto;\n min-width: ${({ $prefixMinWidth }) => $prefixMinWidth ?? 0}px;\n padding-right: 5px;\n\n ${({ $size }) =>\n $size === ComboBoxSize.MINI &&\n css`\n font-size: 13px;\n padding-right: 4px;\n `}\n`;\n\nexport const StyledComboBoxInput = styled.input`\n color: ${({ theme }: { theme: Theme }) => theme.text};\n border: none;\n background-color: transparent;\n font: inherit;\n width: 100%;\n min-width: 0;\n`;\n\ntype StyledComboBoxPlaceholderImageProps = WithTheme<{\n $shouldShowBigImage: ComboBoxProps['shouldShowBigImage'];\n $shouldShowRoundImage: ComboBoxProps['shouldShowRoundImage'];\n}>;\n\nexport const StyledComboBoxPlaceholderImage = styled.img<StyledComboBoxPlaceholderImageProps>`\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledComboBoxPlaceholderImageProps) => theme['009-rgb']}, 0.15);\n height: ${({ $shouldShowBigImage }) => ($shouldShowBigImage ? '32px' : '22px')};\n width: ${({ $shouldShowBigImage }) => ($shouldShowBigImage ? '32px' : '22px')};\n\n ${({ $shouldShowRoundImage }) =>\n $shouldShowRoundImage &&\n css`\n border-radius: 50%;\n `}\n`;\n\ntype StyledComboBoxClearIconWrapperProps = {\n $isDisabled: boolean;\n $size: ComboBoxSize;\n};\n\nexport const StyledComboBoxClearIconWrapper = styled.div<StyledComboBoxClearIconWrapperProps>`\n align-items: center;\n cursor: ${({ $isDisabled }) => (!$isDisabled ? 'pointer' : 'default')};\n display: flex;\n flex: 0 0 auto;\n height: 40px;\n justify-content: center;\n width: 40px;\n\n ${({ $size }) =>\n $size === ComboBoxSize.MINI &&\n css`\n height: 26px;\n width: 28px;\n `}\n`;\n\ntype StyledComboBoxIconWrapperProps = {\n $shouldShowBorderLeft: boolean;\n $isDisabled: boolean;\n $size: ComboBoxSize;\n};\n\nexport const StyledComboBoxIconWrapper = styled.div<StyledComboBoxIconWrapperProps>`\n align-items: center;\n border-left: ${({ $shouldShowBorderLeft }) =>\n $shouldShowBorderLeft ? '1px solid rgba(160, 160, 160, 0.3)' : 'none'};\n cursor: ${({ $isDisabled }) => (!$isDisabled ? 'pointer' : 'default')};\n display: flex;\n flex: 0 0 auto;\n justify-content: center;\n width: 40px;\n\n ${({ $size }) => {\n switch ($size) {\n case ComboBoxSize.MINI:\n return css`\n height: 26px;\n width: 28px;\n `;\n case ComboBoxSize.SMALL:\n return css`\n height: 30px;\n `;\n case ComboBoxSize.NORMAL:\n default:\n return css`\n height: 40px;\n `;\n }\n }}\n`;\n\ntype StyledComboBoxBodyProps = WithTheme<{\n $maxHeight: number;\n $minWidth: number;\n}>;\n\nexport const StyledComboBoxBody = styled.div<StyledComboBoxBodyProps>`\n display: flex;\n flex-direction: column;\n cursor: pointer;\n min-width: ${({ $minWidth }) => $minWidth}px;\n\n overflow-x: hidden;\n overflow-y: auto;\n\n max-height: ${({ $maxHeight }) => $maxHeight}px;\n`;\n\ntype StyledComboBoxTopicProps = WithTheme<unknown>;\n\nexport const StyledComboBoxTopic = styled.div`\n align-items: center;\n background-color: ${({ theme }: StyledComboBoxTopicProps) => theme['secondary-102']};\n color: rgba(${({ theme }: StyledComboBoxTopicProps) => theme['text-rgb']}, 0.65);\n cursor: default;\n display: flex;\n flex: 0 0 auto;\n font-weight: bold;\n min-height: 38px;\n line-height: normal;\n padding: 8px 10px;\n position: sticky;\n top: 0;\n z-index: 10;\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAE/C,SAASC,iBAAiB,QAAQ,sBAAsB;AACxD,SAAwBC,YAAY,QAAQ,kBAAkB;AAO9D,OAAO,MAAMC,cAAc,GAAGJ,MAAM,CAACK,GAAwB;AAC7D;AACA;AACA;AACA;AACA,MAAM,CAAC;EAAEC,mBAAmB;EAAEC;AAAU,CAAC,KAAK;EACtC,IAAID,mBAAmB,EAAE;IACrB,OAAOL,GAAG;AACtB;AACA;AACA,6BAA6B,OAAOM,SAAS,KAAK,QAAQ,GAAG,GAAGA,SAAS,IAAI,GAAG,GAAG;AACnF,aAAa;EACL;EAEA,IAAI,OAAOA,SAAS,KAAK,QAAQ,EAAE;IAC/B,OAAON,GAAG;AACtB;AACA;AACA,6BAA6BM,SAAS;AACtC,aAAa;EACL;EAEA,OAAON,GAAG;AAClB;AACA;AACA,SAAS;AACL,CAAC;AACL,CAAC;AAaD,OAAO,MAAMO,oBAAoB,GAAGR,MAAM,CAACK,GAA8B;AACzE;AACA;AACA;AACA,cAAc,CAAC;EAAEI;AAAY,CAAC,KAAM,CAACA,WAAW,GAAG,SAAS,GAAG,SAAU;AACzE;AACA,eAAe,CAAC;EAAEA;AAAY,CAAC,KAAMA,WAAW,GAAG,GAAG,GAAG,CAAE;AAC3D;AACA;AACA,MAAM,CAAC;EAAEC;AAAM,CAAC,KAAK;EACb,QAAQA,KAAK;IACT,KAAKP,YAAY,CAACQ,IAAI;MAClB,OAAOV,GAAG;AAC1B;AACA;AACA,iBAAiB;IACL,KAAKE,YAAY,CAACS,KAAK;MACnB,OAAOX,GAAG;AAC1B;AACA,iBAAiB;IACL,KAAKE,YAAY,CAACU,MAAM;IACxB;MACI,OAAOZ,GAAG;AAC1B;AACA,iBAAiB;EACT;AACJ,CAAC;AACL;AACA,MAAM,CAAC;EAAEa,KAAK;EAAEC,gCAAgC;EAAEC;AAAmB,CAAC,KAAK;EACnE,IAAID,gCAAgC,EAAE;IAClC,IAAID,KAAK,CAACG,SAAS,KAAK,MAAM,EAAE;MAC5B,OAAOhB,GAAG;AAC1B;AACA;AACA,iBAAiB;IACL;IAEA,OAAOA,GAAG;AACtB;AACA;AACA,aAAa;EACL;EAEA,OAAOA,GAAG;AAClB;AACA,gCACgBa,KAAK,CAACG,SAAS,KAAK,SAAS,IAAID,kBAAkB,GAAGF,KAAK,CAAC,KAAK,CAAC,GAAGA,KAAK,CAAC,KAAK,CAAC;AACjG,SACS;AACL,CAAC;AACL;AACA,MAAM,CAAC;EAAEI;AAAoB,CAAC,KACtBA,mBAAmB,IACnBjB,GAAG;AACX;AACA,SAAS;AACT;AACA,MAAM,CAAC;EAAEkB,OAAO;EAAEC;AAAW,CAAC,KAAK;EAC3B,IAAID,OAAO,EAAE;IACT,OAAO,CACHjB,iBAAiB,CAACmB,MAAM,EACxBnB,iBAAiB,CAACoB,WAAW,EAC7BpB,iBAAiB,CAACqB,YAAY,CACjC,CAACC,QAAQ,CAACJ,UAAU,CAAC,GAChBnB,GAAG;AACrB;AACA;AACA,mBAAmB,GACDA,GAAG;AACrB;AACA;AACA,mBAAmB;EACX;EAEA,OAAOA,GAAG;AAClB;AACA,SAAS;AACL,CAAC;AACL;AACA,MAAM,CAAC;EAAEwB,QAAQ;EAAEhB,WAAW;EAAEK;AAAiC,CAAC,KAC1D,CAACW,QAAQ,IACT,CAAChB,WAAW,IACZR,GAAG;AACX;AACA,oCAAoCa,KAAK,CAAC,eAAe,CAAC;AAC1D;AACA,SAAS;AACT;AACA;AACA;AACA;AACA,CAAC;AAOD,OAAO,MAAMY,yBAAyB,GAAG1B,MAAM,CAACK,GAAmC;AACnF;AACA,aAAa,CAAC;EAAES;AAAsC,CAAC,KAAKA,KAAK,CAACa,IAAI;AACtE;AACA;AACA;AACA;AACA,eAAe,CAAC;EAAEC;AAAqB,CAAC,KAAMA,oBAAoB,GAAG,GAAG,GAAG,CAAE;AAC7E;AACA,MAAM,CAAC;EAAElB;AAAM,CAAC,KACRA,KAAK,KAAKP,YAAY,CAACQ,IAAI,IAC3BV,GAAG;AACX;AACA,SAAS;AACT,CAAC;AAED,OAAO,MAAM4B,6BAA6B,GAAG7B,MAAM,CAACK,GAAG;AACvD;AACA;AACA;AACA,CAAC;AAMD,OAAO,MAAMyB,yCAAyC,GAAG9B,MAAM,CAACK,GAAmD;AACnH;AACA;AACA;AACA;AACA;AACA;AACA,MAAM,CAAC;EAAEK;AAAM,CAAC,KACRA,KAAK,KAAKP,YAAY,CAACQ,IAAI,IAC3BV,GAAG;AACX;AACA,SAAS;AACT,CAAC;AAOD,OAAO,MAAM8B,oBAAoB,GAAG/B,MAAM,CAACK,GAA8B;AACzE;AACA,iBAAiB,CAAC;EAAE2B;AAAgB,CAAC,KAAKA,eAAe,IAAI,CAAC;AAC9D;AACA;AACA,MAAM,CAAC;EAAEtB;AAAM,CAAC,KACRA,KAAK,KAAKP,YAAY,CAACQ,IAAI,IAC3BV,GAAG;AACX;AACA;AACA,SAAS;AACT,CAAC;AAED,OAAO,MAAMgC,mBAAmB,GAAGjC,MAAM,CAACkC,KAAK;AAC/C,aAAa,CAAC;EAAEpB;AAAwB,CAAC,KAAKA,KAAK,CAACa,IAAI;AACxD;AACA;AACA;AACA;AACA;AACA,CAAC;AAOD,OAAO,MAAMQ,8BAA8B,GAAGnC,MAAM,CAACoC,GAAwC;AAC7F;AACA,eAAe,CAAC;EAAEtB;AAA2C,CAAC,KAAKA,KAAK,CAAC,SAAS,CAAC;AACnF,cAAc,CAAC;EAAEI;AAAoB,CAAC,KAAMA,mBAAmB,GAAG,MAAM,GAAG,MAAO;AAClF,aAAa,CAAC;EAAEA;AAAoB,CAAC,KAAMA,mBAAmB,GAAG,MAAM,GAAG,MAAO;AACjF;AACA,MAAM,CAAC;EAAEmB;AAAsB,CAAC,KACxBA,qBAAqB,IACrBpC,GAAG;AACX;AACA,SAAS;AACT,CAAC;AAOD,OAAO,MAAMqC,8BAA8B,GAAGtC,MAAM,CAACK,GAAwC;AAC7F;AACA,cAAc,CAAC;EAAEI;AAAY,CAAC,KAAM,CAACA,WAAW,GAAG,SAAS,GAAG,SAAU;AACzE;AACA;AACA;AACA;AACA;AACA;AACA,MAAM,CAAC;EAAEC;AAAM,CAAC,KACRA,KAAK,KAAKP,YAAY,CAACQ,IAAI,IAC3BV,GAAG;AACX;AACA;AACA,SAAS;AACT,CAAC;AAQD,OAAO,MAAMsC,yBAAyB,GAAGvC,MAAM,CAACK,GAAmC;AACnF;AACA,mBAAmB,CAAC;EAAEmC;AAAsB,CAAC,KACrCA,qBAAqB,GAAG,oCAAoC,GAAG,MAAM;AAC7E,cAAc,CAAC;EAAE/B;AAAY,CAAC,KAAM,CAACA,WAAW,GAAG,SAAS,GAAG,SAAU;AACzE;AACA;AACA;AACA;AACA;AACA,MAAM,CAAC;EAAEC;AAAM,CAAC,KAAK;EACb,QAAQA,KAAK;IACT,KAAKP,YAAY,CAACQ,IAAI;MAClB,OAAOV,GAAG;AAC1B;AACA;AACA,iBAAiB;IACL,KAAKE,YAAY,CAACS,KAAK;MACnB,OAAOX,GAAG;AAC1B;AACA,iBAAiB;IACL,KAAKE,YAAY,CAACU,MAAM;IACxB;MACI,OAAOZ,GAAG;AAC1B;AACA,iBAAiB;EACT;AACJ,CAAC;AACL,CAAC;AAOD,OAAO,MAAMwC,kBAAkB,GAAGzC,MAAM,CAACK,GAA4B;AACrE;AACA;AACA;AACA,iBAAiB,CAAC;EAAEE;AAAU,CAAC,KAAKA,SAAS;AAC7C;AACA;AACA;AACA;AACA,kBAAkB,CAAC;EAAEmC;AAAW,CAAC,KAAKA,UAAU;AAChD,CAAC;AAID,OAAO,MAAMC,mBAAmB,GAAG3C,MAAM,CAACK,GAAG;AAC7C;AACA,wBAAwB,CAAC;EAAES;AAAgC,CAAC,KAAKA,KAAK,CAAC,eAAe,CAAC;AACvF,kBAAkB,CAAC;EAAEA;AAAgC,CAAC,KAAKA,KAAK,CAAC,UAAU,CAAC;AAC5E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@chayns-components/core",
|
|
3
|
-
"version": "5.5.
|
|
3
|
+
"version": "5.5.62",
|
|
4
4
|
"description": "A set of beautiful React components for developing your own applications with chayns.",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"browserslist": [
|
|
@@ -93,5 +93,5 @@
|
|
|
93
93
|
"publishConfig": {
|
|
94
94
|
"access": "public"
|
|
95
95
|
},
|
|
96
|
-
"gitHead": "
|
|
96
|
+
"gitHead": "f6abf3dafcf964c234dd21babdd5a26ff07e87eb"
|
|
97
97
|
}
|