@veeqo/ui 12.1.1 → 12.2.0
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/dist/components/Flex/FlexCol/FlexCol.cjs +5 -3
- package/dist/components/Flex/FlexCol/FlexCol.cjs.map +1 -1
- package/dist/components/Flex/FlexCol/FlexCol.d.ts +8 -2
- package/dist/components/Flex/FlexCol/FlexCol.js +5 -3
- package/dist/components/Flex/FlexCol/FlexCol.js.map +1 -1
- package/dist/components/Flex/FlexRow/FlexRow.cjs +3 -2
- package/dist/components/Flex/FlexRow/FlexRow.cjs.map +1 -1
- package/dist/components/Flex/FlexRow/FlexRow.d.ts +1 -0
- package/dist/components/Flex/FlexRow/FlexRow.js +3 -2
- package/dist/components/Flex/FlexRow/FlexRow.js.map +1 -1
- package/dist/components/Flex/types.d.ts +2 -1
- package/dist/components/Pagination/styled.d.ts +1 -0
- package/dist/components/SelectDropdown/ListItem/components/ListItemContent.cjs +2 -2
- package/dist/components/SelectDropdown/ListItem/components/ListItemContent.cjs.map +1 -1
- package/dist/components/SelectDropdown/ListItem/components/ListItemContent.js +2 -2
- package/dist/components/SelectDropdown/ListItem/components/ListItemContent.js.map +1 -1
- package/package.json +1 -1
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
var React = require('react');
|
|
4
4
|
var buildClassnames = require('../../../utils/buildClassnames.cjs');
|
|
5
|
+
require('uid/secure');
|
|
5
6
|
var FlexCol_module = require('./FlexCol.module.scss.cjs');
|
|
6
7
|
var Flex_module = require('../Flex.module.scss.cjs');
|
|
7
8
|
|
|
@@ -14,8 +15,9 @@ const FLEX_COL_DEFAULT_PROPS = {
|
|
|
14
15
|
justifyContent: 'flex-start',
|
|
15
16
|
gap: 'sm',
|
|
16
17
|
flexWrap: 'wrap',
|
|
18
|
+
flexGrow: 0,
|
|
17
19
|
};
|
|
18
|
-
const FlexCol = ({ alignItems = FLEX_COL_DEFAULT_PROPS.alignItems, justifyContent = FLEX_COL_DEFAULT_PROPS.justifyContent, gap = FLEX_COL_DEFAULT_PROPS.gap, flexWrap = FLEX_COL_DEFAULT_PROPS.flexWrap, className, style, children, ...rest }) => {
|
|
20
|
+
const FlexCol = React__default.default.forwardRef(({ alignItems = FLEX_COL_DEFAULT_PROPS.alignItems, justifyContent = FLEX_COL_DEFAULT_PROPS.justifyContent, gap = FLEX_COL_DEFAULT_PROPS.gap, flexWrap = FLEX_COL_DEFAULT_PROPS.flexWrap, flexGrow = FLEX_COL_DEFAULT_PROPS.flexGrow, className, style, children, ...rest }, ref) => {
|
|
19
21
|
const cssClasses = [
|
|
20
22
|
FlexCol_module.flexCol,
|
|
21
23
|
Flex_module[`alignItems-${alignItems}`],
|
|
@@ -24,8 +26,8 @@ const FlexCol = ({ alignItems = FLEX_COL_DEFAULT_PROPS.alignItems, justifyConten
|
|
|
24
26
|
Flex_module[`flexWrap-${flexWrap}`],
|
|
25
27
|
className,
|
|
26
28
|
];
|
|
27
|
-
return (React__default.default.createElement("div", { className: buildClassnames.buildClassnames(cssClasses), style: style, ...rest }, children));
|
|
28
|
-
};
|
|
29
|
+
return (React__default.default.createElement("div", { className: buildClassnames.buildClassnames(cssClasses), style: { flexGrow, ...style }, ref: ref, ...rest }, children));
|
|
30
|
+
});
|
|
29
31
|
|
|
30
32
|
exports.FLEX_COL_DEFAULT_PROPS = FLEX_COL_DEFAULT_PROPS;
|
|
31
33
|
exports.FlexCol = FlexCol;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FlexCol.cjs","sources":["../../../../src/components/Flex/FlexCol/FlexCol.tsx"],"sourcesContent":["import React from 'react';\nimport { buildClassnames } from '../../../utils
|
|
1
|
+
{"version":3,"file":"FlexCol.cjs","sources":["../../../../src/components/Flex/FlexCol/FlexCol.tsx"],"sourcesContent":["import React from 'react';\nimport { buildClassnames } from '../../../utils';\nimport { FlexDefaultProps, FlexProps } from '../types';\nimport flexColStyles from './FlexCol.module.scss';\nimport flexStyles from '../Flex.module.scss';\n\nexport const FLEX_COL_DEFAULT_PROPS: FlexDefaultProps = {\n alignItems: 'stretch',\n justifyContent: 'flex-start',\n gap: 'sm',\n flexWrap: 'wrap',\n flexGrow: 0,\n};\n\nexport const FlexCol = React.forwardRef<HTMLDivElement, FlexProps>(\n (\n {\n alignItems = FLEX_COL_DEFAULT_PROPS.alignItems,\n justifyContent = FLEX_COL_DEFAULT_PROPS.justifyContent,\n gap = FLEX_COL_DEFAULT_PROPS.gap,\n flexWrap = FLEX_COL_DEFAULT_PROPS.flexWrap,\n flexGrow = FLEX_COL_DEFAULT_PROPS.flexGrow,\n className,\n style,\n children,\n ...rest\n },\n ref,\n ) => {\n const cssClasses = [\n flexColStyles.flexCol,\n flexStyles[`alignItems-${alignItems}`],\n flexStyles[`justifyContent-${justifyContent}`],\n flexStyles[`gap-${gap}`],\n flexStyles[`flexWrap-${flexWrap}`],\n className,\n ];\n\n return (\n <div\n className={buildClassnames(cssClasses)}\n style={{ flexGrow, ...style }}\n ref={ref}\n {...rest}\n >\n {children}\n </div>\n );\n },\n);\n"],"names":["React","flexColStyles","flexStyles","buildClassnames"],"mappings":";;;;;;;;;;;;AAMa,MAAA,sBAAsB,GAAqB;AACtD,IAAA,UAAU,EAAE,SAAS;AACrB,IAAA,cAAc,EAAE,YAAY;AAC5B,IAAA,GAAG,EAAE,IAAI;AACT,IAAA,QAAQ,EAAE,MAAM;AAChB,IAAA,QAAQ,EAAE,CAAC;;AAGA,MAAA,OAAO,GAAGA,sBAAK,CAAC,UAAU,CACrC,CACE,EACE,UAAU,GAAG,sBAAsB,CAAC,UAAU,EAC9C,cAAc,GAAG,sBAAsB,CAAC,cAAc,EACtD,GAAG,GAAG,sBAAsB,CAAC,GAAG,EAChC,QAAQ,GAAG,sBAAsB,CAAC,QAAQ,EAC1C,QAAQ,GAAG,sBAAsB,CAAC,QAAQ,EAC1C,SAAS,EACT,KAAK,EACL,QAAQ,EACR,GAAG,IAAI,EACR,EACD,GAAG,KACD;AACF,IAAA,MAAM,UAAU,GAAG;AACjB,QAAAC,cAAa,CAAC,OAAO;AACrB,QAAAC,WAAU,CAAC,CAAA,WAAA,EAAc,UAAU,CAAA,CAAE,CAAC;AACtC,QAAAA,WAAU,CAAC,CAAA,eAAA,EAAkB,cAAc,CAAA,CAAE,CAAC;AAC9C,QAAAA,WAAU,CAAC,CAAA,IAAA,EAAO,GAAG,CAAA,CAAE,CAAC;AACxB,QAAAA,WAAU,CAAC,CAAA,SAAA,EAAY,QAAQ,CAAA,CAAE,CAAC;QAClC,SAAS;KACV;IAED,QACEF,sBACE,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAEG,+BAAe,CAAC,UAAU,CAAC,EACtC,KAAK,EAAE,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAC7B,GAAG,EAAE,GAAG,EACJ,GAAA,IAAI,EAEP,EAAA,QAAQ,CACL;AAEV,CAAC;;;;;"}
|
|
@@ -1,4 +1,10 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { FlexDefaultProps
|
|
2
|
+
import { FlexDefaultProps } from '../types';
|
|
3
3
|
export declare const FLEX_COL_DEFAULT_PROPS: FlexDefaultProps;
|
|
4
|
-
export declare const FlexCol: React.
|
|
4
|
+
export declare const FlexCol: React.ForwardRefExoticComponent<{
|
|
5
|
+
alignItems?: import("csstype").Property.AlignItems | undefined;
|
|
6
|
+
justifyContent?: import("csstype").Property.JustifyContent | undefined;
|
|
7
|
+
gap?: keyof import("../../../theme/modules/sizes").SizeScale | undefined;
|
|
8
|
+
flexWrap?: import("csstype").Property.FlexWrap | undefined;
|
|
9
|
+
flexGrow?: import("csstype").Property.FlexGrow | undefined;
|
|
10
|
+
} & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import React__default from 'react';
|
|
2
2
|
import { buildClassnames } from '../../../utils/buildClassnames.js';
|
|
3
|
+
import 'uid/secure';
|
|
3
4
|
import flexColStyles from './FlexCol.module.scss.js';
|
|
4
5
|
import flexStyles from '../Flex.module.scss.js';
|
|
5
6
|
|
|
@@ -8,8 +9,9 @@ const FLEX_COL_DEFAULT_PROPS = {
|
|
|
8
9
|
justifyContent: 'flex-start',
|
|
9
10
|
gap: 'sm',
|
|
10
11
|
flexWrap: 'wrap',
|
|
12
|
+
flexGrow: 0,
|
|
11
13
|
};
|
|
12
|
-
const FlexCol = ({ alignItems = FLEX_COL_DEFAULT_PROPS.alignItems, justifyContent = FLEX_COL_DEFAULT_PROPS.justifyContent, gap = FLEX_COL_DEFAULT_PROPS.gap, flexWrap = FLEX_COL_DEFAULT_PROPS.flexWrap, className, style, children, ...rest }) => {
|
|
14
|
+
const FlexCol = React__default.forwardRef(({ alignItems = FLEX_COL_DEFAULT_PROPS.alignItems, justifyContent = FLEX_COL_DEFAULT_PROPS.justifyContent, gap = FLEX_COL_DEFAULT_PROPS.gap, flexWrap = FLEX_COL_DEFAULT_PROPS.flexWrap, flexGrow = FLEX_COL_DEFAULT_PROPS.flexGrow, className, style, children, ...rest }, ref) => {
|
|
13
15
|
const cssClasses = [
|
|
14
16
|
flexColStyles.flexCol,
|
|
15
17
|
flexStyles[`alignItems-${alignItems}`],
|
|
@@ -18,8 +20,8 @@ const FlexCol = ({ alignItems = FLEX_COL_DEFAULT_PROPS.alignItems, justifyConten
|
|
|
18
20
|
flexStyles[`flexWrap-${flexWrap}`],
|
|
19
21
|
className,
|
|
20
22
|
];
|
|
21
|
-
return (React__default.createElement("div", { className: buildClassnames(cssClasses), style: style, ...rest }, children));
|
|
22
|
-
};
|
|
23
|
+
return (React__default.createElement("div", { className: buildClassnames(cssClasses), style: { flexGrow, ...style }, ref: ref, ...rest }, children));
|
|
24
|
+
});
|
|
23
25
|
|
|
24
26
|
export { FLEX_COL_DEFAULT_PROPS, FlexCol };
|
|
25
27
|
//# sourceMappingURL=FlexCol.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FlexCol.js","sources":["../../../../src/components/Flex/FlexCol/FlexCol.tsx"],"sourcesContent":["import React from 'react';\nimport { buildClassnames } from '../../../utils
|
|
1
|
+
{"version":3,"file":"FlexCol.js","sources":["../../../../src/components/Flex/FlexCol/FlexCol.tsx"],"sourcesContent":["import React from 'react';\nimport { buildClassnames } from '../../../utils';\nimport { FlexDefaultProps, FlexProps } from '../types';\nimport flexColStyles from './FlexCol.module.scss';\nimport flexStyles from '../Flex.module.scss';\n\nexport const FLEX_COL_DEFAULT_PROPS: FlexDefaultProps = {\n alignItems: 'stretch',\n justifyContent: 'flex-start',\n gap: 'sm',\n flexWrap: 'wrap',\n flexGrow: 0,\n};\n\nexport const FlexCol = React.forwardRef<HTMLDivElement, FlexProps>(\n (\n {\n alignItems = FLEX_COL_DEFAULT_PROPS.alignItems,\n justifyContent = FLEX_COL_DEFAULT_PROPS.justifyContent,\n gap = FLEX_COL_DEFAULT_PROPS.gap,\n flexWrap = FLEX_COL_DEFAULT_PROPS.flexWrap,\n flexGrow = FLEX_COL_DEFAULT_PROPS.flexGrow,\n className,\n style,\n children,\n ...rest\n },\n ref,\n ) => {\n const cssClasses = [\n flexColStyles.flexCol,\n flexStyles[`alignItems-${alignItems}`],\n flexStyles[`justifyContent-${justifyContent}`],\n flexStyles[`gap-${gap}`],\n flexStyles[`flexWrap-${flexWrap}`],\n className,\n ];\n\n return (\n <div\n className={buildClassnames(cssClasses)}\n style={{ flexGrow, ...style }}\n ref={ref}\n {...rest}\n >\n {children}\n </div>\n );\n },\n);\n"],"names":["React"],"mappings":";;;;;;AAMa,MAAA,sBAAsB,GAAqB;AACtD,IAAA,UAAU,EAAE,SAAS;AACrB,IAAA,cAAc,EAAE,YAAY;AAC5B,IAAA,GAAG,EAAE,IAAI;AACT,IAAA,QAAQ,EAAE,MAAM;AAChB,IAAA,QAAQ,EAAE,CAAC;;AAGA,MAAA,OAAO,GAAGA,cAAK,CAAC,UAAU,CACrC,CACE,EACE,UAAU,GAAG,sBAAsB,CAAC,UAAU,EAC9C,cAAc,GAAG,sBAAsB,CAAC,cAAc,EACtD,GAAG,GAAG,sBAAsB,CAAC,GAAG,EAChC,QAAQ,GAAG,sBAAsB,CAAC,QAAQ,EAC1C,QAAQ,GAAG,sBAAsB,CAAC,QAAQ,EAC1C,SAAS,EACT,KAAK,EACL,QAAQ,EACR,GAAG,IAAI,EACR,EACD,GAAG,KACD;AACF,IAAA,MAAM,UAAU,GAAG;AACjB,QAAA,aAAa,CAAC,OAAO;AACrB,QAAA,UAAU,CAAC,CAAA,WAAA,EAAc,UAAU,CAAA,CAAE,CAAC;AACtC,QAAA,UAAU,CAAC,CAAA,eAAA,EAAkB,cAAc,CAAA,CAAE,CAAC;AAC9C,QAAA,UAAU,CAAC,CAAA,IAAA,EAAO,GAAG,CAAA,CAAE,CAAC;AACxB,QAAA,UAAU,CAAC,CAAA,SAAA,EAAY,QAAQ,CAAA,CAAE,CAAC;QAClC,SAAS;KACV;IAED,QACEA,cACE,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,eAAe,CAAC,UAAU,CAAC,EACtC,KAAK,EAAE,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAC7B,GAAG,EAAE,GAAG,EACJ,GAAA,IAAI,EAEP,EAAA,QAAQ,CACL;AAEV,CAAC;;;;"}
|
|
@@ -15,8 +15,9 @@ const FLEX_ROW_DEFAULT_PROPS = {
|
|
|
15
15
|
justifyContent: 'flex-start',
|
|
16
16
|
gap: 'sm',
|
|
17
17
|
flexWrap: 'wrap',
|
|
18
|
+
flexGrow: 0,
|
|
18
19
|
};
|
|
19
|
-
const FlexRow = React__default.default.forwardRef(({ alignItems = FLEX_ROW_DEFAULT_PROPS.alignItems, justifyContent = FLEX_ROW_DEFAULT_PROPS.justifyContent, gap = FLEX_ROW_DEFAULT_PROPS.gap, flexWrap = FLEX_ROW_DEFAULT_PROPS.flexWrap, className, style, children, ...rest }, ref) => {
|
|
20
|
+
const FlexRow = React__default.default.forwardRef(({ alignItems = FLEX_ROW_DEFAULT_PROPS.alignItems, justifyContent = FLEX_ROW_DEFAULT_PROPS.justifyContent, gap = FLEX_ROW_DEFAULT_PROPS.gap, flexWrap = FLEX_ROW_DEFAULT_PROPS.flexWrap, flexGrow = FLEX_ROW_DEFAULT_PROPS.flexGrow, className, style, children, ...rest }, ref) => {
|
|
20
21
|
const cssClasses = [
|
|
21
22
|
FlexRow_module.flexRow,
|
|
22
23
|
Flex_module[`alignItems-${alignItems}`],
|
|
@@ -25,7 +26,7 @@ const FlexRow = React__default.default.forwardRef(({ alignItems = FLEX_ROW_DEFAU
|
|
|
25
26
|
Flex_module[`flexWrap-${flexWrap}`],
|
|
26
27
|
className,
|
|
27
28
|
];
|
|
28
|
-
return (React__default.default.createElement("div", { className: buildClassnames.buildClassnames(cssClasses), style: style, ref: ref, ...rest }, children));
|
|
29
|
+
return (React__default.default.createElement("div", { className: buildClassnames.buildClassnames(cssClasses), style: { flexGrow, ...style }, ref: ref, ...rest }, children));
|
|
29
30
|
});
|
|
30
31
|
|
|
31
32
|
exports.FLEX_ROW_DEFAULT_PROPS = FLEX_ROW_DEFAULT_PROPS;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FlexRow.cjs","sources":["../../../../src/components/Flex/FlexRow/FlexRow.tsx"],"sourcesContent":["import React from 'react';\nimport { buildClassnames } from '../../../utils';\nimport { FlexDefaultProps, FlexProps } from '../types';\nimport flexRowStyles from './FlexRow.module.scss';\nimport flexStyles from '../Flex.module.scss';\n\nexport const FLEX_ROW_DEFAULT_PROPS: FlexDefaultProps = {\n alignItems: 'center',\n justifyContent: 'flex-start',\n gap: 'sm',\n flexWrap: 'wrap',\n};\n\nexport const FlexRow = React.forwardRef<HTMLDivElement, FlexProps>(\n (\n {\n alignItems = FLEX_ROW_DEFAULT_PROPS.alignItems,\n justifyContent = FLEX_ROW_DEFAULT_PROPS.justifyContent,\n gap = FLEX_ROW_DEFAULT_PROPS.gap,\n flexWrap = FLEX_ROW_DEFAULT_PROPS.flexWrap,\n className,\n style,\n children,\n ...rest\n },\n ref,\n ) => {\n const cssClasses = [\n flexRowStyles.flexRow,\n flexStyles[`alignItems-${alignItems}`],\n flexStyles[`justifyContent-${justifyContent}`],\n flexStyles[`gap-${gap}`],\n flexStyles[`flexWrap-${flexWrap}`],\n className,\n ];\n\n return (\n <div
|
|
1
|
+
{"version":3,"file":"FlexRow.cjs","sources":["../../../../src/components/Flex/FlexRow/FlexRow.tsx"],"sourcesContent":["import React from 'react';\nimport { buildClassnames } from '../../../utils';\nimport { FlexDefaultProps, FlexProps } from '../types';\nimport flexRowStyles from './FlexRow.module.scss';\nimport flexStyles from '../Flex.module.scss';\n\nexport const FLEX_ROW_DEFAULT_PROPS: FlexDefaultProps = {\n alignItems: 'center',\n justifyContent: 'flex-start',\n gap: 'sm',\n flexWrap: 'wrap',\n flexGrow: 0,\n};\n\nexport const FlexRow = React.forwardRef<HTMLDivElement, FlexProps>(\n (\n {\n alignItems = FLEX_ROW_DEFAULT_PROPS.alignItems,\n justifyContent = FLEX_ROW_DEFAULT_PROPS.justifyContent,\n gap = FLEX_ROW_DEFAULT_PROPS.gap,\n flexWrap = FLEX_ROW_DEFAULT_PROPS.flexWrap,\n flexGrow = FLEX_ROW_DEFAULT_PROPS.flexGrow,\n className,\n style,\n children,\n ...rest\n },\n ref,\n ) => {\n const cssClasses = [\n flexRowStyles.flexRow,\n flexStyles[`alignItems-${alignItems}`],\n flexStyles[`justifyContent-${justifyContent}`],\n flexStyles[`gap-${gap}`],\n flexStyles[`flexWrap-${flexWrap}`],\n className,\n ];\n\n return (\n <div\n className={buildClassnames(cssClasses)}\n style={{ flexGrow, ...style }}\n ref={ref}\n {...rest}\n >\n {children}\n </div>\n );\n },\n);\n"],"names":["React","flexRowStyles","flexStyles","buildClassnames"],"mappings":";;;;;;;;;;;;AAMa,MAAA,sBAAsB,GAAqB;AACtD,IAAA,UAAU,EAAE,QAAQ;AACpB,IAAA,cAAc,EAAE,YAAY;AAC5B,IAAA,GAAG,EAAE,IAAI;AACT,IAAA,QAAQ,EAAE,MAAM;AAChB,IAAA,QAAQ,EAAE,CAAC;;AAGA,MAAA,OAAO,GAAGA,sBAAK,CAAC,UAAU,CACrC,CACE,EACE,UAAU,GAAG,sBAAsB,CAAC,UAAU,EAC9C,cAAc,GAAG,sBAAsB,CAAC,cAAc,EACtD,GAAG,GAAG,sBAAsB,CAAC,GAAG,EAChC,QAAQ,GAAG,sBAAsB,CAAC,QAAQ,EAC1C,QAAQ,GAAG,sBAAsB,CAAC,QAAQ,EAC1C,SAAS,EACT,KAAK,EACL,QAAQ,EACR,GAAG,IAAI,EACR,EACD,GAAG,KACD;AACF,IAAA,MAAM,UAAU,GAAG;AACjB,QAAAC,cAAa,CAAC,OAAO;AACrB,QAAAC,WAAU,CAAC,CAAA,WAAA,EAAc,UAAU,CAAA,CAAE,CAAC;AACtC,QAAAA,WAAU,CAAC,CAAA,eAAA,EAAkB,cAAc,CAAA,CAAE,CAAC;AAC9C,QAAAA,WAAU,CAAC,CAAA,IAAA,EAAO,GAAG,CAAA,CAAE,CAAC;AACxB,QAAAA,WAAU,CAAC,CAAA,SAAA,EAAY,QAAQ,CAAA,CAAE,CAAC;QAClC,SAAS;KACV;IAED,QACEF,sBACE,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAEG,+BAAe,CAAC,UAAU,CAAC,EACtC,KAAK,EAAE,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAC7B,GAAG,EAAE,GAAG,EACJ,GAAA,IAAI,EAEP,EAAA,QAAQ,CACL;AAEV,CAAC;;;;;"}
|
|
@@ -6,4 +6,5 @@ export declare const FlexRow: React.ForwardRefExoticComponent<{
|
|
|
6
6
|
justifyContent?: import("csstype").Property.JustifyContent | undefined;
|
|
7
7
|
gap?: keyof import("../../../theme/modules/sizes").SizeScale | undefined;
|
|
8
8
|
flexWrap?: import("csstype").Property.FlexWrap | undefined;
|
|
9
|
+
flexGrow?: import("csstype").Property.FlexGrow | undefined;
|
|
9
10
|
} & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -9,8 +9,9 @@ const FLEX_ROW_DEFAULT_PROPS = {
|
|
|
9
9
|
justifyContent: 'flex-start',
|
|
10
10
|
gap: 'sm',
|
|
11
11
|
flexWrap: 'wrap',
|
|
12
|
+
flexGrow: 0,
|
|
12
13
|
};
|
|
13
|
-
const FlexRow = React__default.forwardRef(({ alignItems = FLEX_ROW_DEFAULT_PROPS.alignItems, justifyContent = FLEX_ROW_DEFAULT_PROPS.justifyContent, gap = FLEX_ROW_DEFAULT_PROPS.gap, flexWrap = FLEX_ROW_DEFAULT_PROPS.flexWrap, className, style, children, ...rest }, ref) => {
|
|
14
|
+
const FlexRow = React__default.forwardRef(({ alignItems = FLEX_ROW_DEFAULT_PROPS.alignItems, justifyContent = FLEX_ROW_DEFAULT_PROPS.justifyContent, gap = FLEX_ROW_DEFAULT_PROPS.gap, flexWrap = FLEX_ROW_DEFAULT_PROPS.flexWrap, flexGrow = FLEX_ROW_DEFAULT_PROPS.flexGrow, className, style, children, ...rest }, ref) => {
|
|
14
15
|
const cssClasses = [
|
|
15
16
|
flexRowStyles.flexRow,
|
|
16
17
|
flexStyles[`alignItems-${alignItems}`],
|
|
@@ -19,7 +20,7 @@ const FlexRow = React__default.forwardRef(({ alignItems = FLEX_ROW_DEFAULT_PROPS
|
|
|
19
20
|
flexStyles[`flexWrap-${flexWrap}`],
|
|
20
21
|
className,
|
|
21
22
|
];
|
|
22
|
-
return (React__default.createElement("div", { className: buildClassnames(cssClasses), style: style, ref: ref, ...rest }, children));
|
|
23
|
+
return (React__default.createElement("div", { className: buildClassnames(cssClasses), style: { flexGrow, ...style }, ref: ref, ...rest }, children));
|
|
23
24
|
});
|
|
24
25
|
|
|
25
26
|
export { FLEX_ROW_DEFAULT_PROPS, FlexRow };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FlexRow.js","sources":["../../../../src/components/Flex/FlexRow/FlexRow.tsx"],"sourcesContent":["import React from 'react';\nimport { buildClassnames } from '../../../utils';\nimport { FlexDefaultProps, FlexProps } from '../types';\nimport flexRowStyles from './FlexRow.module.scss';\nimport flexStyles from '../Flex.module.scss';\n\nexport const FLEX_ROW_DEFAULT_PROPS: FlexDefaultProps = {\n alignItems: 'center',\n justifyContent: 'flex-start',\n gap: 'sm',\n flexWrap: 'wrap',\n};\n\nexport const FlexRow = React.forwardRef<HTMLDivElement, FlexProps>(\n (\n {\n alignItems = FLEX_ROW_DEFAULT_PROPS.alignItems,\n justifyContent = FLEX_ROW_DEFAULT_PROPS.justifyContent,\n gap = FLEX_ROW_DEFAULT_PROPS.gap,\n flexWrap = FLEX_ROW_DEFAULT_PROPS.flexWrap,\n className,\n style,\n children,\n ...rest\n },\n ref,\n ) => {\n const cssClasses = [\n flexRowStyles.flexRow,\n flexStyles[`alignItems-${alignItems}`],\n flexStyles[`justifyContent-${justifyContent}`],\n flexStyles[`gap-${gap}`],\n flexStyles[`flexWrap-${flexWrap}`],\n className,\n ];\n\n return (\n <div
|
|
1
|
+
{"version":3,"file":"FlexRow.js","sources":["../../../../src/components/Flex/FlexRow/FlexRow.tsx"],"sourcesContent":["import React from 'react';\nimport { buildClassnames } from '../../../utils';\nimport { FlexDefaultProps, FlexProps } from '../types';\nimport flexRowStyles from './FlexRow.module.scss';\nimport flexStyles from '../Flex.module.scss';\n\nexport const FLEX_ROW_DEFAULT_PROPS: FlexDefaultProps = {\n alignItems: 'center',\n justifyContent: 'flex-start',\n gap: 'sm',\n flexWrap: 'wrap',\n flexGrow: 0,\n};\n\nexport const FlexRow = React.forwardRef<HTMLDivElement, FlexProps>(\n (\n {\n alignItems = FLEX_ROW_DEFAULT_PROPS.alignItems,\n justifyContent = FLEX_ROW_DEFAULT_PROPS.justifyContent,\n gap = FLEX_ROW_DEFAULT_PROPS.gap,\n flexWrap = FLEX_ROW_DEFAULT_PROPS.flexWrap,\n flexGrow = FLEX_ROW_DEFAULT_PROPS.flexGrow,\n className,\n style,\n children,\n ...rest\n },\n ref,\n ) => {\n const cssClasses = [\n flexRowStyles.flexRow,\n flexStyles[`alignItems-${alignItems}`],\n flexStyles[`justifyContent-${justifyContent}`],\n flexStyles[`gap-${gap}`],\n flexStyles[`flexWrap-${flexWrap}`],\n className,\n ];\n\n return (\n <div\n className={buildClassnames(cssClasses)}\n style={{ flexGrow, ...style }}\n ref={ref}\n {...rest}\n >\n {children}\n </div>\n );\n },\n);\n"],"names":["React"],"mappings":";;;;;;AAMa,MAAA,sBAAsB,GAAqB;AACtD,IAAA,UAAU,EAAE,QAAQ;AACpB,IAAA,cAAc,EAAE,YAAY;AAC5B,IAAA,GAAG,EAAE,IAAI;AACT,IAAA,QAAQ,EAAE,MAAM;AAChB,IAAA,QAAQ,EAAE,CAAC;;AAGA,MAAA,OAAO,GAAGA,cAAK,CAAC,UAAU,CACrC,CACE,EACE,UAAU,GAAG,sBAAsB,CAAC,UAAU,EAC9C,cAAc,GAAG,sBAAsB,CAAC,cAAc,EACtD,GAAG,GAAG,sBAAsB,CAAC,GAAG,EAChC,QAAQ,GAAG,sBAAsB,CAAC,QAAQ,EAC1C,QAAQ,GAAG,sBAAsB,CAAC,QAAQ,EAC1C,SAAS,EACT,KAAK,EACL,QAAQ,EACR,GAAG,IAAI,EACR,EACD,GAAG,KACD;AACF,IAAA,MAAM,UAAU,GAAG;AACjB,QAAA,aAAa,CAAC,OAAO;AACrB,QAAA,UAAU,CAAC,CAAA,WAAA,EAAc,UAAU,CAAA,CAAE,CAAC;AACtC,QAAA,UAAU,CAAC,CAAA,eAAA,EAAkB,cAAc,CAAA,CAAE,CAAC;AAC9C,QAAA,UAAU,CAAC,CAAA,IAAA,EAAO,GAAG,CAAA,CAAE,CAAC;AACxB,QAAA,UAAU,CAAC,CAAA,SAAA,EAAY,QAAQ,CAAA,CAAE,CAAC;QAClC,SAAS;KACV;IAED,QACEA,cACE,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,eAAe,CAAC,UAAU,CAAC,EACtC,KAAK,EAAE,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAC7B,GAAG,EAAE,GAAG,EACJ,GAAA,IAAI,EAEP,EAAA,QAAQ,CACL;AAEV,CAAC;;;;"}
|
|
@@ -5,6 +5,7 @@ export type FlexProps = {
|
|
|
5
5
|
justifyContent?: CSSProperties['justifyContent'];
|
|
6
6
|
gap?: keyof typeof sizes;
|
|
7
7
|
flexWrap?: CSSProperties['flexWrap'];
|
|
8
|
+
flexGrow?: CSSProperties['flexGrow'];
|
|
8
9
|
} & HTMLAttributes<HTMLDivElement>;
|
|
9
|
-
export type FlexDefaultProps = Pick<CSSProperties, 'alignItems' | 'justifyContent' | 'gap' | 'flexWrap'>;
|
|
10
|
+
export type FlexDefaultProps = Pick<CSSProperties, 'alignItems' | 'justifyContent' | 'gap' | 'flexWrap' | 'flexGrow'>;
|
|
10
11
|
export {};
|
|
@@ -4,6 +4,7 @@ export declare const PageLimitContainer: import("styled-components").StyledCompo
|
|
|
4
4
|
justifyContent?: import("csstype").Property.JustifyContent | undefined;
|
|
5
5
|
gap?: keyof import("../../theme/modules/sizes").SizeScale | undefined;
|
|
6
6
|
flexWrap?: import("csstype").Property.FlexWrap | undefined;
|
|
7
|
+
flexGrow?: import("csstype").Property.FlexGrow | undefined;
|
|
7
8
|
} & import("react").HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>, any, {}, never>;
|
|
8
9
|
export declare const PaginationButton: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("react").ButtonHTMLAttributes<HTMLButtonElement> & {
|
|
9
10
|
children?: import("react").ReactNode;
|
|
@@ -32,11 +32,11 @@ const ListItemContent = ({ label, hint, itemInfoSlot, endInfoSlot, alert, mediaS
|
|
|
32
32
|
return buildClassnames.buildClassnames([base]);
|
|
33
33
|
}, [endInfoSlot, itemInfoSlot]);
|
|
34
34
|
return (React__default.default.createElement(FlexRow.FlexRow, { flexWrap: "nowrap", justifyContent: "space-between", alignItems: "center", gap: "base" },
|
|
35
|
-
React__default.default.createElement(FlexRow.FlexRow, { flexWrap: "nowrap", gap: "base",
|
|
35
|
+
React__default.default.createElement(FlexRow.FlexRow, { flexWrap: "nowrap", gap: "base", flexGrow: "1" },
|
|
36
36
|
allowsDragging && React__default.default.createElement(DragIndicatorIcon.ReactComponent, { "data-testid": "drag-icon" }),
|
|
37
37
|
React__default.default.createElement(SelectionType.SelectionType, { selectionMode: selectionMode, isSelected: isSelected, isLink: isLink }),
|
|
38
38
|
mediaSlot,
|
|
39
|
-
React__default.default.createElement(FlexCol.FlexCol, { gap: "xs",
|
|
39
|
+
React__default.default.createElement(FlexCol.FlexCol, { gap: "xs", flexGrow: "1" },
|
|
40
40
|
React__default.default.createElement("div", { className: getInfoContainerClassNames, "data-testid": "info-container" },
|
|
41
41
|
React__default.default.createElement(reactAriaComponents.Text, { slot: "label" },
|
|
42
42
|
React__default.default.createElement(Text.Text, { variant: "body" }, label)),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItemContent.cjs","sources":["../../../../../src/components/SelectDropdown/ListItem/components/ListItemContent.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport { Text } from 'react-aria-components';\nimport { buildClassnames } from '../../../../utils';\nimport { FlexCol } from '../../../Flex/FlexCol';\nimport { ArrowRightIcon, DragIndicatorIcon } from '../../../../icons';\nimport { ListItemContentProps } from './types';\nimport { Text as VeeqoText } from '../../../Text';\nimport { MiniAlert } from '../../../Alerts/MiniAlert';\nimport { SelectionType } from './SelectionType';\nimport styles from '../ListItem.module.scss';\nimport { FlexRow } from '../../../Flex/FlexRow';\n\nexport const ListItemContent = ({\n label,\n hint,\n itemInfoSlot,\n endInfoSlot,\n alert,\n mediaSlot,\n allowsDragging = false,\n selectionMode = 'single',\n isLink,\n isSelected = false,\n}: ListItemContentProps) => {\n const getInfoContainerClassNames = useMemo(() => {\n const base = styles.infoContainer;\n\n if (itemInfoSlot && endInfoSlot) {\n return buildClassnames([base, styles.hasItemInfoAndEndInfo]);\n }\n\n if (itemInfoSlot) {\n return buildClassnames([base, styles.hasItemInfoOnly]);\n }\n\n if (endInfoSlot) {\n return buildClassnames([base, styles.hasEndInfoOnly]);\n }\n\n return buildClassnames([base]);\n }, [endInfoSlot, itemInfoSlot]);\n\n return (\n <FlexRow flexWrap=\"nowrap\" justifyContent=\"space-between\" alignItems=\"center\" gap=\"base\">\n <FlexRow flexWrap=\"nowrap\" gap=\"base\"
|
|
1
|
+
{"version":3,"file":"ListItemContent.cjs","sources":["../../../../../src/components/SelectDropdown/ListItem/components/ListItemContent.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport { Text } from 'react-aria-components';\nimport { buildClassnames } from '../../../../utils';\nimport { FlexCol } from '../../../Flex/FlexCol';\nimport { ArrowRightIcon, DragIndicatorIcon } from '../../../../icons';\nimport { ListItemContentProps } from './types';\nimport { Text as VeeqoText } from '../../../Text';\nimport { MiniAlert } from '../../../Alerts/MiniAlert';\nimport { SelectionType } from './SelectionType';\nimport styles from '../ListItem.module.scss';\nimport { FlexRow } from '../../../Flex/FlexRow';\n\nexport const ListItemContent = ({\n label,\n hint,\n itemInfoSlot,\n endInfoSlot,\n alert,\n mediaSlot,\n allowsDragging = false,\n selectionMode = 'single',\n isLink,\n isSelected = false,\n}: ListItemContentProps) => {\n const getInfoContainerClassNames = useMemo(() => {\n const base = styles.infoContainer;\n\n if (itemInfoSlot && endInfoSlot) {\n return buildClassnames([base, styles.hasItemInfoAndEndInfo]);\n }\n\n if (itemInfoSlot) {\n return buildClassnames([base, styles.hasItemInfoOnly]);\n }\n\n if (endInfoSlot) {\n return buildClassnames([base, styles.hasEndInfoOnly]);\n }\n\n return buildClassnames([base]);\n }, [endInfoSlot, itemInfoSlot]);\n\n return (\n <FlexRow flexWrap=\"nowrap\" justifyContent=\"space-between\" alignItems=\"center\" gap=\"base\">\n <FlexRow flexWrap=\"nowrap\" gap=\"base\" flexGrow=\"1\">\n {allowsDragging && <DragIndicatorIcon data-testid=\"drag-icon\" />}\n <SelectionType selectionMode={selectionMode} isSelected={isSelected} isLink={isLink} />\n {mediaSlot}\n <FlexCol gap=\"xs\" flexGrow=\"1\">\n <div className={getInfoContainerClassNames} data-testid=\"info-container\">\n <Text slot=\"label\">\n <VeeqoText variant=\"body\">{label}</VeeqoText>\n </Text>\n {itemInfoSlot}\n {endInfoSlot && (\n <div className={endInfoSlot ? styles.justifyEnd : styles.justifyStart}>\n {endInfoSlot}\n </div>\n )}\n </div>\n\n {hint && (\n <Text slot=\"description\">\n <VeeqoText variant=\"hintText\">{hint}</VeeqoText>\n </Text>\n )}\n {alert && <MiniAlert title={alert.title} variant={alert.variant} />}\n </FlexCol>\n </FlexRow>\n {isLink && <ArrowRightIcon className={styles.linkIcon} data-testid=\"link-icon\" />}\n </FlexRow>\n );\n};\n"],"names":["useMemo","styles","buildClassnames","React","FlexRow","DragIndicatorIcon","SelectionType","FlexCol","Text","VeeqoText","MiniAlert","ArrowRightIcon"],"mappings":";;;;;;;;;;;;;;;;;;;AAYO,MAAM,eAAe,GAAG,CAAC,EAC9B,KAAK,EACL,IAAI,EACJ,YAAY,EACZ,WAAW,EACX,KAAK,EACL,SAAS,EACT,cAAc,GAAG,KAAK,EACtB,aAAa,GAAG,QAAQ,EACxB,MAAM,EACN,UAAU,GAAG,KAAK,GACG,KAAI;AACzB,IAAA,MAAM,0BAA0B,GAAGA,aAAO,CAAC,MAAK;AAC9C,QAAA,MAAM,IAAI,GAAGC,eAAM,CAAC,aAAa;QAEjC,IAAI,YAAY,IAAI,WAAW,EAAE;YAC/B,OAAOC,+BAAe,CAAC,CAAC,IAAI,EAAED,eAAM,CAAC,qBAAqB,CAAC,CAAC;AAC7D;AAED,QAAA,IAAI,YAAY,EAAE;YAChB,OAAOC,+BAAe,CAAC,CAAC,IAAI,EAAED,eAAM,CAAC,eAAe,CAAC,CAAC;AACvD;AAED,QAAA,IAAI,WAAW,EAAE;YACf,OAAOC,+BAAe,CAAC,CAAC,IAAI,EAAED,eAAM,CAAC,cAAc,CAAC,CAAC;AACtD;AAED,QAAA,OAAOC,+BAAe,CAAC,CAAC,IAAI,CAAC,CAAC;AAChC,KAAC,EAAE,CAAC,WAAW,EAAE,YAAY,CAAC,CAAC;AAE/B,IAAA,QACEC,sBAAC,CAAA,aAAA,CAAAC,eAAO,IAAC,QAAQ,EAAC,QAAQ,EAAC,cAAc,EAAC,eAAe,EAAC,UAAU,EAAC,QAAQ,EAAC,GAAG,EAAC,MAAM,EAAA;AACtF,QAAAD,sBAAA,CAAA,aAAA,CAACC,eAAO,EAAA,EAAC,QAAQ,EAAC,QAAQ,EAAC,GAAG,EAAC,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAA;AAC/C,YAAA,cAAc,IAAID,sBAAA,CAAA,aAAA,CAACE,gCAAiB,EAAA,EAAA,aAAA,EAAa,WAAW,EAAG,CAAA;AAChE,YAAAF,sBAAA,CAAA,aAAA,CAACG,2BAAa,EAAA,EAAC,aAAa,EAAE,aAAa,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,EAAI,CAAA;YACtF,SAAS;YACVH,sBAAC,CAAA,aAAA,CAAAI,eAAO,IAAC,GAAG,EAAC,IAAI,EAAC,QAAQ,EAAC,GAAG,EAAA;AAC5B,gBAAAJ,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,0BAA0B,EAAA,aAAA,EAAc,gBAAgB,EAAA;AACtE,oBAAAA,sBAAA,CAAA,aAAA,CAACK,wBAAI,EAAA,EAAC,IAAI,EAAC,OAAO,EAAA;wBAChBL,sBAAC,CAAA,aAAA,CAAAM,SAAS,IAAC,OAAO,EAAC,MAAM,EAAE,EAAA,KAAK,CAAa,CACxC;oBACN,YAAY;oBACZ,WAAW,KACVN,sBAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,WAAW,GAAGF,eAAM,CAAC,UAAU,GAAGA,eAAM,CAAC,YAAY,EAClE,EAAA,WAAW,CACR,CACP,CACG;AAEL,gBAAA,IAAI,KACHE,sBAAA,CAAA,aAAA,CAACK,wBAAI,EAAC,EAAA,IAAI,EAAC,aAAa,EAAA;oBACtBL,sBAAC,CAAA,aAAA,CAAAM,SAAS,IAAC,OAAO,EAAC,UAAU,EAAE,EAAA,IAAI,CAAa,CAC3C,CACR;AACA,gBAAA,KAAK,IAAIN,sBAAC,CAAA,aAAA,CAAAO,mBAAS,EAAC,EAAA,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,EAAA,CAAI,CAC3D,CACF;AACT,QAAA,MAAM,IAAIP,sBAAA,CAAA,aAAA,CAACQ,6BAAc,EAAA,EAAC,SAAS,EAAEV,eAAM,CAAC,QAAQ,EAAc,aAAA,EAAA,WAAW,EAAG,CAAA,CACzE;AAEd;;;;"}
|
|
@@ -26,11 +26,11 @@ const ListItemContent = ({ label, hint, itemInfoSlot, endInfoSlot, alert, mediaS
|
|
|
26
26
|
return buildClassnames([base]);
|
|
27
27
|
}, [endInfoSlot, itemInfoSlot]);
|
|
28
28
|
return (React__default.createElement(FlexRow, { flexWrap: "nowrap", justifyContent: "space-between", alignItems: "center", gap: "base" },
|
|
29
|
-
React__default.createElement(FlexRow, { flexWrap: "nowrap", gap: "base",
|
|
29
|
+
React__default.createElement(FlexRow, { flexWrap: "nowrap", gap: "base", flexGrow: "1" },
|
|
30
30
|
allowsDragging && React__default.createElement(DragIndicatorIcon, { "data-testid": "drag-icon" }),
|
|
31
31
|
React__default.createElement(SelectionType, { selectionMode: selectionMode, isSelected: isSelected, isLink: isLink }),
|
|
32
32
|
mediaSlot,
|
|
33
|
-
React__default.createElement(FlexCol, { gap: "xs",
|
|
33
|
+
React__default.createElement(FlexCol, { gap: "xs", flexGrow: "1" },
|
|
34
34
|
React__default.createElement("div", { className: getInfoContainerClassNames, "data-testid": "info-container" },
|
|
35
35
|
React__default.createElement(Text, { slot: "label" },
|
|
36
36
|
React__default.createElement(Text$1, { variant: "body" }, label)),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItemContent.js","sources":["../../../../../src/components/SelectDropdown/ListItem/components/ListItemContent.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport { Text } from 'react-aria-components';\nimport { buildClassnames } from '../../../../utils';\nimport { FlexCol } from '../../../Flex/FlexCol';\nimport { ArrowRightIcon, DragIndicatorIcon } from '../../../../icons';\nimport { ListItemContentProps } from './types';\nimport { Text as VeeqoText } from '../../../Text';\nimport { MiniAlert } from '../../../Alerts/MiniAlert';\nimport { SelectionType } from './SelectionType';\nimport styles from '../ListItem.module.scss';\nimport { FlexRow } from '../../../Flex/FlexRow';\n\nexport const ListItemContent = ({\n label,\n hint,\n itemInfoSlot,\n endInfoSlot,\n alert,\n mediaSlot,\n allowsDragging = false,\n selectionMode = 'single',\n isLink,\n isSelected = false,\n}: ListItemContentProps) => {\n const getInfoContainerClassNames = useMemo(() => {\n const base = styles.infoContainer;\n\n if (itemInfoSlot && endInfoSlot) {\n return buildClassnames([base, styles.hasItemInfoAndEndInfo]);\n }\n\n if (itemInfoSlot) {\n return buildClassnames([base, styles.hasItemInfoOnly]);\n }\n\n if (endInfoSlot) {\n return buildClassnames([base, styles.hasEndInfoOnly]);\n }\n\n return buildClassnames([base]);\n }, [endInfoSlot, itemInfoSlot]);\n\n return (\n <FlexRow flexWrap=\"nowrap\" justifyContent=\"space-between\" alignItems=\"center\" gap=\"base\">\n <FlexRow flexWrap=\"nowrap\" gap=\"base\"
|
|
1
|
+
{"version":3,"file":"ListItemContent.js","sources":["../../../../../src/components/SelectDropdown/ListItem/components/ListItemContent.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport { Text } from 'react-aria-components';\nimport { buildClassnames } from '../../../../utils';\nimport { FlexCol } from '../../../Flex/FlexCol';\nimport { ArrowRightIcon, DragIndicatorIcon } from '../../../../icons';\nimport { ListItemContentProps } from './types';\nimport { Text as VeeqoText } from '../../../Text';\nimport { MiniAlert } from '../../../Alerts/MiniAlert';\nimport { SelectionType } from './SelectionType';\nimport styles from '../ListItem.module.scss';\nimport { FlexRow } from '../../../Flex/FlexRow';\n\nexport const ListItemContent = ({\n label,\n hint,\n itemInfoSlot,\n endInfoSlot,\n alert,\n mediaSlot,\n allowsDragging = false,\n selectionMode = 'single',\n isLink,\n isSelected = false,\n}: ListItemContentProps) => {\n const getInfoContainerClassNames = useMemo(() => {\n const base = styles.infoContainer;\n\n if (itemInfoSlot && endInfoSlot) {\n return buildClassnames([base, styles.hasItemInfoAndEndInfo]);\n }\n\n if (itemInfoSlot) {\n return buildClassnames([base, styles.hasItemInfoOnly]);\n }\n\n if (endInfoSlot) {\n return buildClassnames([base, styles.hasEndInfoOnly]);\n }\n\n return buildClassnames([base]);\n }, [endInfoSlot, itemInfoSlot]);\n\n return (\n <FlexRow flexWrap=\"nowrap\" justifyContent=\"space-between\" alignItems=\"center\" gap=\"base\">\n <FlexRow flexWrap=\"nowrap\" gap=\"base\" flexGrow=\"1\">\n {allowsDragging && <DragIndicatorIcon data-testid=\"drag-icon\" />}\n <SelectionType selectionMode={selectionMode} isSelected={isSelected} isLink={isLink} />\n {mediaSlot}\n <FlexCol gap=\"xs\" flexGrow=\"1\">\n <div className={getInfoContainerClassNames} data-testid=\"info-container\">\n <Text slot=\"label\">\n <VeeqoText variant=\"body\">{label}</VeeqoText>\n </Text>\n {itemInfoSlot}\n {endInfoSlot && (\n <div className={endInfoSlot ? styles.justifyEnd : styles.justifyStart}>\n {endInfoSlot}\n </div>\n )}\n </div>\n\n {hint && (\n <Text slot=\"description\">\n <VeeqoText variant=\"hintText\">{hint}</VeeqoText>\n </Text>\n )}\n {alert && <MiniAlert title={alert.title} variant={alert.variant} />}\n </FlexCol>\n </FlexRow>\n {isLink && <ArrowRightIcon className={styles.linkIcon} data-testid=\"link-icon\" />}\n </FlexRow>\n );\n};\n"],"names":["React","VeeqoText"],"mappings":";;;;;;;;;;;;;AAYO,MAAM,eAAe,GAAG,CAAC,EAC9B,KAAK,EACL,IAAI,EACJ,YAAY,EACZ,WAAW,EACX,KAAK,EACL,SAAS,EACT,cAAc,GAAG,KAAK,EACtB,aAAa,GAAG,QAAQ,EACxB,MAAM,EACN,UAAU,GAAG,KAAK,GACG,KAAI;AACzB,IAAA,MAAM,0BAA0B,GAAG,OAAO,CAAC,MAAK;AAC9C,QAAA,MAAM,IAAI,GAAG,MAAM,CAAC,aAAa;QAEjC,IAAI,YAAY,IAAI,WAAW,EAAE;YAC/B,OAAO,eAAe,CAAC,CAAC,IAAI,EAAE,MAAM,CAAC,qBAAqB,CAAC,CAAC;AAC7D;AAED,QAAA,IAAI,YAAY,EAAE;YAChB,OAAO,eAAe,CAAC,CAAC,IAAI,EAAE,MAAM,CAAC,eAAe,CAAC,CAAC;AACvD;AAED,QAAA,IAAI,WAAW,EAAE;YACf,OAAO,eAAe,CAAC,CAAC,IAAI,EAAE,MAAM,CAAC,cAAc,CAAC,CAAC;AACtD;AAED,QAAA,OAAO,eAAe,CAAC,CAAC,IAAI,CAAC,CAAC;AAChC,KAAC,EAAE,CAAC,WAAW,EAAE,YAAY,CAAC,CAAC;AAE/B,IAAA,QACEA,cAAC,CAAA,aAAA,CAAA,OAAO,IAAC,QAAQ,EAAC,QAAQ,EAAC,cAAc,EAAC,eAAe,EAAC,UAAU,EAAC,QAAQ,EAAC,GAAG,EAAC,MAAM,EAAA;AACtF,QAAAA,cAAA,CAAA,aAAA,CAAC,OAAO,EAAA,EAAC,QAAQ,EAAC,QAAQ,EAAC,GAAG,EAAC,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAA;AAC/C,YAAA,cAAc,IAAIA,cAAA,CAAA,aAAA,CAAC,iBAAiB,EAAA,EAAA,aAAA,EAAa,WAAW,EAAG,CAAA;AAChE,YAAAA,cAAA,CAAA,aAAA,CAAC,aAAa,EAAA,EAAC,aAAa,EAAE,aAAa,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,EAAI,CAAA;YACtF,SAAS;YACVA,cAAC,CAAA,aAAA,CAAA,OAAO,IAAC,GAAG,EAAC,IAAI,EAAC,QAAQ,EAAC,GAAG,EAAA;AAC5B,gBAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,0BAA0B,EAAA,aAAA,EAAc,gBAAgB,EAAA;AACtE,oBAAAA,cAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,IAAI,EAAC,OAAO,EAAA;wBAChBA,cAAC,CAAA,aAAA,CAAAC,MAAS,IAAC,OAAO,EAAC,MAAM,EAAE,EAAA,KAAK,CAAa,CACxC;oBACN,YAAY;oBACZ,WAAW,KACVD,cAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,WAAW,GAAG,MAAM,CAAC,UAAU,GAAG,MAAM,CAAC,YAAY,EAClE,EAAA,WAAW,CACR,CACP,CACG;AAEL,gBAAA,IAAI,KACHA,cAAA,CAAA,aAAA,CAAC,IAAI,EAAC,EAAA,IAAI,EAAC,aAAa,EAAA;oBACtBA,cAAC,CAAA,aAAA,CAAAC,MAAS,IAAC,OAAO,EAAC,UAAU,EAAE,EAAA,IAAI,CAAa,CAC3C,CACR;AACA,gBAAA,KAAK,IAAID,cAAC,CAAA,aAAA,CAAA,SAAS,EAAC,EAAA,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,EAAA,CAAI,CAC3D,CACF;AACT,QAAA,MAAM,IAAIA,cAAA,CAAA,aAAA,CAAC,cAAc,EAAA,EAAC,SAAS,EAAE,MAAM,CAAC,QAAQ,EAAc,aAAA,EAAA,WAAW,EAAG,CAAA,CACzE;AAEd;;;;"}
|