@chayns-components/core 5.0.0-beta.890 → 5.0.0-beta.891
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.
- package/lib/cjs/components/scroll-view/ScrollView.js.map +1 -1
- package/lib/cjs/components/scroll-view/ScrollView.styles.js +8 -4
- package/lib/cjs/components/scroll-view/ScrollView.styles.js.map +1 -1
- package/lib/esm/components/scroll-view/ScrollView.js.map +1 -1
- package/lib/esm/components/scroll-view/ScrollView.styles.js +8 -4
- package/lib/esm/components/scroll-view/ScrollView.styles.js.map +1 -1
- package/lib/types/components/scroll-view/ScrollView.d.ts +1 -1
- package/lib/types/components/scroll-view/ScrollView.styles.d.ts +1 -1
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScrollView.js","names":["_chaynsApi","require","_react","_interopRequireWildcard","_ScrollView","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ScrollView","forwardRef","maxHeight","height","maxWidth","width","children","overflowX","overflowY","ref","browser","getDevice","useMemo","createElement","StyledScrollView","$browser","name","$maxHeight","$height","$maxWidth","$width","$overflowX","$overflowY","displayName","_default","exports"],"sources":["../../../../src/components/scroll-view/ScrollView.tsx"],"sourcesContent":["import { getDevice } from 'chayns-api';\nimport React, { CSSProperties, forwardRef, ReactNode, useMemo } from 'react';\nimport { StyledScrollView } from './ScrollView.styles';\n\nexport type ScrollViewProps = {\n /**\n * The elements that should be shown inside the scrollview\n */\n children: ReactNode;\n /**\n * The maximum height of the scroll view.\n */\n maxHeight?: CSSProperties['height'];\n /**\n * The height of the scroll view.\n */\n height?: CSSProperties['height'];\n /**\n * The maximum width of the scroll view.\n */\n maxWidth?: CSSProperties['width'];\n /**\n * The width of the scroll view.\n */\n width?: CSSProperties['width'];\n /**\n * The overflow-x style of the scroll view.\n */\n overflowX?: 'scroll' | 'auto';\n /**\n * The overflow-y style of the scroll view.\n */\n overflowY?: 'scroll' | 'auto';\n};\n\nconst ScrollView = forwardRef<HTMLDivElement, ScrollViewProps>(\n ({
|
|
1
|
+
{"version":3,"file":"ScrollView.js","names":["_chaynsApi","require","_react","_interopRequireWildcard","_ScrollView","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ScrollView","forwardRef","maxHeight","height","maxWidth","width","children","overflowX","overflowY","ref","browser","getDevice","useMemo","createElement","StyledScrollView","$browser","name","$maxHeight","$height","$maxWidth","$width","$overflowX","$overflowY","displayName","_default","exports"],"sources":["../../../../src/components/scroll-view/ScrollView.tsx"],"sourcesContent":["import { getDevice } from 'chayns-api';\nimport React, { CSSProperties, forwardRef, ReactNode, useMemo } from 'react';\nimport { StyledScrollView } from './ScrollView.styles';\n\nexport type ScrollViewProps = {\n /**\n * The elements that should be shown inside the scrollview\n */\n children: ReactNode;\n /**\n * The maximum height of the scroll view.\n */\n maxHeight?: CSSProperties['height'] | null;\n /**\n * The height of the scroll view.\n */\n height?: CSSProperties['height'];\n /**\n * The maximum width of the scroll view.\n */\n maxWidth?: CSSProperties['width'];\n /**\n * The width of the scroll view.\n */\n width?: CSSProperties['width'];\n /**\n * The overflow-x style of the scroll view.\n */\n overflowX?: 'scroll' | 'auto';\n /**\n * The overflow-y style of the scroll view.\n */\n overflowY?: 'scroll' | 'auto';\n};\n\nconst ScrollView = forwardRef<HTMLDivElement, ScrollViewProps>(\n (\n {\n maxHeight = 300,\n height,\n maxWidth,\n width,\n children,\n overflowX = 'auto',\n overflowY = 'auto',\n },\n ref,\n ) => {\n const { browser } = getDevice();\n\n return useMemo(\n () => (\n <StyledScrollView\n $browser={browser?.name}\n $maxHeight={maxHeight}\n $height={height}\n $maxWidth={maxWidth}\n $width={width}\n $overflowX={overflowX}\n $overflowY={overflowY}\n ref={ref}\n >\n {children}\n </StyledScrollView>\n ),\n [\n browser?.name,\n children,\n height,\n maxHeight,\n maxWidth,\n overflowX,\n overflowY,\n ref,\n width,\n ],\n );\n },\n);\n\nScrollView.displayName = 'ScrollView';\n\nexport default ScrollView;\n"],"mappings":";;;;;;AAAA,IAAAA,UAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,uBAAA,CAAAF,OAAA;AACA,IAAAG,WAAA,GAAAH,OAAA;AAAuD,SAAAI,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAH,wBAAAG,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAiCvD,MAAMW,UAAU,gBAAG,IAAAC,iBAAU,EACzB,CACI;EACIC,SAAS,GAAG,GAAG;EACfC,MAAM;EACNC,QAAQ;EACRC,KAAK;EACLC,QAAQ;EACRC,SAAS,GAAG,MAAM;EAClBC,SAAS,GAAG;AAChB,CAAC,EACDC,GAAG,KACF;EACD,MAAM;IAAEC;EAAQ,CAAC,GAAG,IAAAC,oBAAS,EAAC,CAAC;EAE/B,OAAO,IAAAC,cAAO,EACV,mBACInC,MAAA,CAAAS,OAAA,CAAA2B,aAAA,CAAClC,WAAA,CAAAmC,gBAAgB;IACbC,QAAQ,EAAEL,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEM,IAAK;IACxBC,UAAU,EAAEf,SAAU;IACtBgB,OAAO,EAAEf,MAAO;IAChBgB,SAAS,EAAEf,QAAS;IACpBgB,MAAM,EAAEf,KAAM;IACdgB,UAAU,EAAEd,SAAU;IACtBe,UAAU,EAAEd,SAAU;IACtBC,GAAG,EAAEA;EAAI,GAERH,QACa,CACrB,EACD,CACII,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEM,IAAI,EACbV,QAAQ,EACRH,MAAM,EACND,SAAS,EACTE,QAAQ,EACRG,SAAS,EACTC,SAAS,EACTC,GAAG,EACHJ,KAAK,CAEb,CAAC;AACL,CACJ,CAAC;AAEDL,UAAU,CAACuB,WAAW,GAAG,YAAY;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAvC,OAAA,GAEvBc,UAAU","ignoreList":[]}
|
|
@@ -30,10 +30,14 @@ const StyledScrollView = exports.StyledScrollView = _styledComponents.default.di
|
|
|
30
30
|
`}
|
|
31
31
|
${({
|
|
32
32
|
$overflowX
|
|
33
|
-
}) => (0, _styledComponents.css)`
|
|
33
|
+
}) => (0, _styledComponents.css)`
|
|
34
|
+
overflow-x: ${$overflowX};
|
|
35
|
+
`}
|
|
34
36
|
${({
|
|
35
37
|
$overflowY
|
|
36
|
-
}) => (0, _styledComponents.css)`
|
|
38
|
+
}) => (0, _styledComponents.css)`
|
|
39
|
+
overflow-y: ${$overflowY};
|
|
40
|
+
`}
|
|
37
41
|
|
|
38
42
|
// Styles for custom scrollbar
|
|
39
43
|
${({
|
|
@@ -45,7 +49,7 @@ const StyledScrollView = exports.StyledScrollView = _styledComponents.default.di
|
|
|
45
49
|
` : (0, _styledComponents.css)`
|
|
46
50
|
&::-webkit-scrollbar {
|
|
47
51
|
width: 10px;
|
|
48
|
-
height: 10px
|
|
52
|
+
height: 10px;
|
|
49
53
|
}
|
|
50
54
|
|
|
51
55
|
&::-webkit-scrollbar-track {
|
|
@@ -64,7 +68,7 @@ const StyledScrollView = exports.StyledScrollView = _styledComponents.default.di
|
|
|
64
68
|
background-clip: padding-box;
|
|
65
69
|
border: solid 3px transparent;
|
|
66
70
|
}
|
|
67
|
-
|
|
71
|
+
|
|
68
72
|
&::-webkit-scrollbar-corner {
|
|
69
73
|
background-color: transparent;
|
|
70
74
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScrollView.styles.js","names":["_styledComponents","_interopRequireWildcard","require","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","StyledScrollView","exports","styled","div","$maxHeight","css","$height","$maxWidth","$width","$overflowX","$overflowY","$browser","theme"],"sources":["../../../../src/components/scroll-view/ScrollView.styles.ts"],"sourcesContent":["import type { Browser } from 'detect-browser';\nimport type { CSSProperties } from 'react';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledScrollViewProps = WithTheme<{\n $maxHeight?: CSSProperties['height'];\n $height?: CSSProperties['height'];\n $maxWidth?: CSSProperties['width'];\n $width?: CSSProperties['width'];\n $overflowX: 'scroll' | 'auto';\n $overflowY: 'scroll' | 'auto';\n $browser: Browser | 'bot' | null | undefined;\n}>;\n\nexport const StyledScrollView = styled.div<StyledScrollViewProps>`\n ${({ $maxHeight }) =>\n $maxHeight &&\n css`\n max-height: ${typeof $maxHeight === 'number' ? `${$maxHeight}px` : $maxHeight};\n `}\n ${({ $height }) =>\n $height &&\n css`\n height: ${typeof $height === 'number' ? `${$height}px` : $height};\n `} \n ${({ $maxWidth }) =>\n $maxWidth &&\n css`\n max-width: ${typeof $maxWidth === 'number' ? `${$maxWidth}px` : $maxWidth};\n `} \n ${({ $width }) =>\n $width &&\n css`\n width: ${typeof $width === 'number' ? `${$width}px` : $width};\n `} \n ${({ $overflowX }) => css
|
|
1
|
+
{"version":3,"file":"ScrollView.styles.js","names":["_styledComponents","_interopRequireWildcard","require","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","StyledScrollView","exports","styled","div","$maxHeight","css","$height","$maxWidth","$width","$overflowX","$overflowY","$browser","theme"],"sources":["../../../../src/components/scroll-view/ScrollView.styles.ts"],"sourcesContent":["import type { Browser } from 'detect-browser';\nimport type { CSSProperties } from 'react';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledScrollViewProps = WithTheme<{\n $maxHeight?: CSSProperties['height'] | null;\n $height?: CSSProperties['height'];\n $maxWidth?: CSSProperties['width'];\n $width?: CSSProperties['width'];\n $overflowX: 'scroll' | 'auto';\n $overflowY: 'scroll' | 'auto';\n $browser: Browser | 'bot' | null | undefined;\n}>;\n\nexport const StyledScrollView = styled.div<StyledScrollViewProps>`\n ${({ $maxHeight }) =>\n $maxHeight &&\n css`\n max-height: ${typeof $maxHeight === 'number' ? `${$maxHeight}px` : $maxHeight};\n `}\n ${({ $height }) =>\n $height &&\n css`\n height: ${typeof $height === 'number' ? `${$height}px` : $height};\n `} \n ${({ $maxWidth }) =>\n $maxWidth &&\n css`\n max-width: ${typeof $maxWidth === 'number' ? `${$maxWidth}px` : $maxWidth};\n `} \n ${({ $width }) =>\n $width &&\n css`\n width: ${typeof $width === 'number' ? `${$width}px` : $width};\n `} \n ${({ $overflowX }) => css`\n overflow-x: ${$overflowX};\n `}\n ${({ $overflowY }) => css`\n overflow-y: ${$overflowY};\n `}\n\n // Styles for custom scrollbar\n ${({ $browser, theme }: StyledScrollViewProps) =>\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: 10px;\n height: 10px;\n }\n\n &::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n &::-webkit-scrollbar-button {\n background-color: transparent;\n height: 5px;\n width: 5px;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: rgba(${theme['text-rgb']}, 0.15);\n border-radius: 20px;\n background-clip: padding-box;\n border: solid 3px transparent;\n }\n\n &::-webkit-scrollbar-corner {\n background-color: transparent;\n }\n `}\n`;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScrollView.js","names":["getDevice","React","forwardRef","useMemo","StyledScrollView","ScrollView","_ref","ref","maxHeight","height","maxWidth","width","children","overflowX","overflowY","browser","createElement","$browser","name","$maxHeight","$height","$maxWidth","$width","$overflowX","$overflowY","displayName"],"sources":["../../../../src/components/scroll-view/ScrollView.tsx"],"sourcesContent":["import { getDevice } from 'chayns-api';\nimport React, { CSSProperties, forwardRef, ReactNode, useMemo } from 'react';\nimport { StyledScrollView } from './ScrollView.styles';\n\nexport type ScrollViewProps = {\n /**\n * The elements that should be shown inside the scrollview\n */\n children: ReactNode;\n /**\n * The maximum height of the scroll view.\n */\n maxHeight?: CSSProperties['height'];\n /**\n * The height of the scroll view.\n */\n height?: CSSProperties['height'];\n /**\n * The maximum width of the scroll view.\n */\n maxWidth?: CSSProperties['width'];\n /**\n * The width of the scroll view.\n */\n width?: CSSProperties['width'];\n /**\n * The overflow-x style of the scroll view.\n */\n overflowX?: 'scroll' | 'auto';\n /**\n * The overflow-y style of the scroll view.\n */\n overflowY?: 'scroll' | 'auto';\n};\n\nconst ScrollView = forwardRef<HTMLDivElement, ScrollViewProps>(\n ({
|
|
1
|
+
{"version":3,"file":"ScrollView.js","names":["getDevice","React","forwardRef","useMemo","StyledScrollView","ScrollView","_ref","ref","maxHeight","height","maxWidth","width","children","overflowX","overflowY","browser","createElement","$browser","name","$maxHeight","$height","$maxWidth","$width","$overflowX","$overflowY","displayName"],"sources":["../../../../src/components/scroll-view/ScrollView.tsx"],"sourcesContent":["import { getDevice } from 'chayns-api';\nimport React, { CSSProperties, forwardRef, ReactNode, useMemo } from 'react';\nimport { StyledScrollView } from './ScrollView.styles';\n\nexport type ScrollViewProps = {\n /**\n * The elements that should be shown inside the scrollview\n */\n children: ReactNode;\n /**\n * The maximum height of the scroll view.\n */\n maxHeight?: CSSProperties['height'] | null;\n /**\n * The height of the scroll view.\n */\n height?: CSSProperties['height'];\n /**\n * The maximum width of the scroll view.\n */\n maxWidth?: CSSProperties['width'];\n /**\n * The width of the scroll view.\n */\n width?: CSSProperties['width'];\n /**\n * The overflow-x style of the scroll view.\n */\n overflowX?: 'scroll' | 'auto';\n /**\n * The overflow-y style of the scroll view.\n */\n overflowY?: 'scroll' | 'auto';\n};\n\nconst ScrollView = forwardRef<HTMLDivElement, ScrollViewProps>(\n (\n {\n maxHeight = 300,\n height,\n maxWidth,\n width,\n children,\n overflowX = 'auto',\n overflowY = 'auto',\n },\n ref,\n ) => {\n const { browser } = getDevice();\n\n return useMemo(\n () => (\n <StyledScrollView\n $browser={browser?.name}\n $maxHeight={maxHeight}\n $height={height}\n $maxWidth={maxWidth}\n $width={width}\n $overflowX={overflowX}\n $overflowY={overflowY}\n ref={ref}\n >\n {children}\n </StyledScrollView>\n ),\n [\n browser?.name,\n children,\n height,\n maxHeight,\n maxWidth,\n overflowX,\n overflowY,\n ref,\n width,\n ],\n );\n },\n);\n\nScrollView.displayName = 'ScrollView';\n\nexport default ScrollView;\n"],"mappings":"AAAA,SAASA,SAAS,QAAQ,YAAY;AACtC,OAAOC,KAAK,IAAmBC,UAAU,EAAaC,OAAO,QAAQ,OAAO;AAC5E,SAASC,gBAAgB,QAAQ,qBAAqB;AAiCtD,MAAMC,UAAU,gBAAGH,UAAU,CACzB,CAAAI,IAAA,EAUIC,GAAG,KACF;EAAA,IAVD;IACIC,SAAS,GAAG,GAAG;IACfC,MAAM;IACNC,QAAQ;IACRC,KAAK;IACLC,QAAQ;IACRC,SAAS,GAAG,MAAM;IAClBC,SAAS,GAAG;EAChB,CAAC,GAAAR,IAAA;EAGD,MAAM;IAAES;EAAQ,CAAC,GAAGf,SAAS,CAAC,CAAC;EAE/B,OAAOG,OAAO,CACV,mBACIF,KAAA,CAAAe,aAAA,CAACZ,gBAAgB;IACba,QAAQ,EAAEF,OAAO,EAAEG,IAAK;IACxBC,UAAU,EAAEX,SAAU;IACtBY,OAAO,EAAEX,MAAO;IAChBY,SAAS,EAAEX,QAAS;IACpBY,MAAM,EAAEX,KAAM;IACdY,UAAU,EAAEV,SAAU;IACtBW,UAAU,EAAEV,SAAU;IACtBP,GAAG,EAAEA;EAAI,GAERK,QACa,CACrB,EACD,CACIG,OAAO,EAAEG,IAAI,EACbN,QAAQ,EACRH,MAAM,EACND,SAAS,EACTE,QAAQ,EACRG,SAAS,EACTC,SAAS,EACTP,GAAG,EACHI,KAAK,CAEb,CAAC;AACL,CACJ,CAAC;AAEDN,UAAU,CAACoB,WAAW,GAAG,YAAY;AAErC,eAAepB,UAAU","ignoreList":[]}
|
|
@@ -36,13 +36,17 @@ export const StyledScrollView = styled.div`
|
|
|
36
36
|
let {
|
|
37
37
|
$overflowX
|
|
38
38
|
} = _ref5;
|
|
39
|
-
return css`
|
|
39
|
+
return css`
|
|
40
|
+
overflow-x: ${$overflowX};
|
|
41
|
+
`;
|
|
40
42
|
}}
|
|
41
43
|
${_ref6 => {
|
|
42
44
|
let {
|
|
43
45
|
$overflowY
|
|
44
46
|
} = _ref6;
|
|
45
|
-
return css`
|
|
47
|
+
return css`
|
|
48
|
+
overflow-y: ${$overflowY};
|
|
49
|
+
`;
|
|
46
50
|
}}
|
|
47
51
|
|
|
48
52
|
// Styles for custom scrollbar
|
|
@@ -57,7 +61,7 @@ export const StyledScrollView = styled.div`
|
|
|
57
61
|
` : css`
|
|
58
62
|
&::-webkit-scrollbar {
|
|
59
63
|
width: 10px;
|
|
60
|
-
height: 10px
|
|
64
|
+
height: 10px;
|
|
61
65
|
}
|
|
62
66
|
|
|
63
67
|
&::-webkit-scrollbar-track {
|
|
@@ -76,7 +80,7 @@ export const StyledScrollView = styled.div`
|
|
|
76
80
|
background-clip: padding-box;
|
|
77
81
|
border: solid 3px transparent;
|
|
78
82
|
}
|
|
79
|
-
|
|
83
|
+
|
|
80
84
|
&::-webkit-scrollbar-corner {
|
|
81
85
|
background-color: transparent;
|
|
82
86
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScrollView.styles.js","names":["styled","css","StyledScrollView","div","_ref","$maxHeight","_ref2","$height","_ref3","$maxWidth","_ref4","$width","_ref5","$overflowX","_ref6","$overflowY","_ref7","$browser","theme"],"sources":["../../../../src/components/scroll-view/ScrollView.styles.ts"],"sourcesContent":["import type { Browser } from 'detect-browser';\nimport type { CSSProperties } from 'react';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledScrollViewProps = WithTheme<{\n $maxHeight?: CSSProperties['height'];\n $height?: CSSProperties['height'];\n $maxWidth?: CSSProperties['width'];\n $width?: CSSProperties['width'];\n $overflowX: 'scroll' | 'auto';\n $overflowY: 'scroll' | 'auto';\n $browser: Browser | 'bot' | null | undefined;\n}>;\n\nexport const StyledScrollView = styled.div<StyledScrollViewProps>`\n ${({ $maxHeight }) =>\n $maxHeight &&\n css`\n max-height: ${typeof $maxHeight === 'number' ? `${$maxHeight}px` : $maxHeight};\n `}\n ${({ $height }) =>\n $height &&\n css`\n height: ${typeof $height === 'number' ? `${$height}px` : $height};\n `} \n ${({ $maxWidth }) =>\n $maxWidth &&\n css`\n max-width: ${typeof $maxWidth === 'number' ? `${$maxWidth}px` : $maxWidth};\n `} \n ${({ $width }) =>\n $width &&\n css`\n width: ${typeof $width === 'number' ? `${$width}px` : $width};\n `} \n ${({ $overflowX }) => css
|
|
1
|
+
{"version":3,"file":"ScrollView.styles.js","names":["styled","css","StyledScrollView","div","_ref","$maxHeight","_ref2","$height","_ref3","$maxWidth","_ref4","$width","_ref5","$overflowX","_ref6","$overflowY","_ref7","$browser","theme"],"sources":["../../../../src/components/scroll-view/ScrollView.styles.ts"],"sourcesContent":["import type { Browser } from 'detect-browser';\nimport type { CSSProperties } from 'react';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledScrollViewProps = WithTheme<{\n $maxHeight?: CSSProperties['height'] | null;\n $height?: CSSProperties['height'];\n $maxWidth?: CSSProperties['width'];\n $width?: CSSProperties['width'];\n $overflowX: 'scroll' | 'auto';\n $overflowY: 'scroll' | 'auto';\n $browser: Browser | 'bot' | null | undefined;\n}>;\n\nexport const StyledScrollView = styled.div<StyledScrollViewProps>`\n ${({ $maxHeight }) =>\n $maxHeight &&\n css`\n max-height: ${typeof $maxHeight === 'number' ? `${$maxHeight}px` : $maxHeight};\n `}\n ${({ $height }) =>\n $height &&\n css`\n height: ${typeof $height === 'number' ? `${$height}px` : $height};\n `} \n ${({ $maxWidth }) =>\n $maxWidth &&\n css`\n max-width: ${typeof $maxWidth === 'number' ? `${$maxWidth}px` : $maxWidth};\n `} \n ${({ $width }) =>\n $width &&\n css`\n width: ${typeof $width === 'number' ? `${$width}px` : $width};\n `} \n ${({ $overflowX }) => css`\n overflow-x: ${$overflowX};\n `}\n ${({ $overflowY }) => css`\n overflow-y: ${$overflowY};\n `}\n\n // Styles for custom scrollbar\n ${({ $browser, theme }: StyledScrollViewProps) =>\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: 10px;\n height: 10px;\n }\n\n &::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n &::-webkit-scrollbar-button {\n background-color: transparent;\n height: 5px;\n width: 5px;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: rgba(${theme['text-rgb']}, 0.15);\n border-radius: 20px;\n background-clip: padding-box;\n border: solid 3px transparent;\n }\n\n &::-webkit-scrollbar-corner {\n background-color: transparent;\n }\n `}\n`;\n"],"mappings":"AAEA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAa/C,OAAO,MAAMC,gBAAgB,GAAGF,MAAM,CAACG,GAA0B;AACjE,MAAMC,IAAA;EAAA,IAAC;IAAEC;EAAW,CAAC,GAAAD,IAAA;EAAA,OACbC,UAAU,IACVJ,GAAG;AACX,0BAA0B,OAAOI,UAAU,KAAK,QAAQ,GAAG,GAAGA,UAAU,IAAI,GAAGA,UAAU;AACzF,SAAS;AAAA;AACT,MAAMC,KAAA;EAAA,IAAC;IAAEC;EAAQ,CAAC,GAAAD,KAAA;EAAA,OACVC,OAAO,IACPN,GAAG;AACX,sBAAsB,OAAOM,OAAO,KAAK,QAAQ,GAAG,GAAGA,OAAO,IAAI,GAAGA,OAAO;AAC5E,SAAS;AAAA;AACT,MAAMC,KAAA;EAAA,IAAC;IAAEC;EAAU,CAAC,GAAAD,KAAA;EAAA,OACZC,SAAS,IACTR,GAAG;AACX,yBAAyB,OAAOQ,SAAS,KAAK,QAAQ,GAAG,GAAGA,SAAS,IAAI,GAAGA,SAAS;AACrF,SAAS;AAAA;AACT,MAAMC,KAAA;EAAA,IAAC;IAAEC;EAAO,CAAC,GAAAD,KAAA;EAAA,OACTC,MAAM,IACNV,GAAG;AACX,qBAAqB,OAAOU,MAAM,KAAK,QAAQ,GAAG,GAAGA,MAAM,IAAI,GAAGA,MAAM;AACxE,SAAS;AAAA;AACT,MAAMC,KAAA;EAAA,IAAC;IAAEC;EAAW,CAAC,GAAAD,KAAA;EAAA,OAAKX,GAAG;AAC7B,sBAAsBY,UAAU;AAChC,KAAK;AAAA;AACL,MAAMC,KAAA;EAAA,IAAC;IAAEC;EAAW,CAAC,GAAAD,KAAA;EAAA,OAAKb,GAAG;AAC7B,sBAAsBc,UAAU;AAChC,KAAK;AAAA;AACL;AACA;AACA,MAAMC,KAAA;EAAA,IAAC;IAAEC,QAAQ;IAAEC;EAA6B,CAAC,GAAAF,KAAA;EAAA,OACzCC,QAAQ,KAAK,SAAS,GAChBhB,GAAG;AACjB,0CAA0CiB,KAAK,CAAC,UAAU,CAAC;AAC3D;AACA,eAAe,GACDjB,GAAG;AACjB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,+CAA+CiB,KAAK,CAAC,UAAU,CAAC;AAChE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe;AAAA;AACf,CAAC","ignoreList":[]}
|
|
@@ -2,7 +2,7 @@ import type { Browser } from 'detect-browser';
|
|
|
2
2
|
import type { CSSProperties } from 'react';
|
|
3
3
|
import type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';
|
|
4
4
|
type StyledScrollViewProps = WithTheme<{
|
|
5
|
-
$maxHeight?: CSSProperties['height'];
|
|
5
|
+
$maxHeight?: CSSProperties['height'] | null;
|
|
6
6
|
$height?: CSSProperties['height'];
|
|
7
7
|
$maxWidth?: CSSProperties['width'];
|
|
8
8
|
$width?: CSSProperties['width'];
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@chayns-components/core",
|
|
3
|
-
"version": "5.0.0-beta.
|
|
3
|
+
"version": "5.0.0-beta.891",
|
|
4
4
|
"description": "A set of beautiful React components for developing your own applications with chayns.",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"browserslist": [
|
|
@@ -87,5 +87,5 @@
|
|
|
87
87
|
"publishConfig": {
|
|
88
88
|
"access": "public"
|
|
89
89
|
},
|
|
90
|
-
"gitHead": "
|
|
90
|
+
"gitHead": "5ca5ca8d5a3a37d2a5c5df8a20b0301abaf756eb"
|
|
91
91
|
}
|