/
Stack.tsx
74 lines (60 loc) · 1.95 KB
/
Stack.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
/** @jsx withSlots */
import * as React from 'react';
import { withSlots, createComponent, getSlots } from '../../Foundation';
import { getNativeProps, htmlElementProperties, warnDeprecations } from '../../Utilities';
import StackItem from './StackItem/StackItem';
import { IStackItemProps } from './StackItem/StackItem.types';
import { styles } from './Stack.styles';
import { IStackComponent, IStackProps, IStackSlots } from './Stack.types';
const StackItemType = (<StackItem /> as React.ReactElement<IStackItemProps>).type;
const StackView: IStackComponent['view'] = props => {
const { as: RootType = 'div', disableShrink, wrap, ...rest } = props;
warnDeprecations('Stack', props, {
gap: 'tokens.childrenGap',
maxHeight: 'tokens.maxHeight',
maxWidth: 'tokens.maxWidth',
padding: 'tokens.padding'
});
const stackChildren: (React.ReactChild | null)[] = React.Children.map(
props.children,
(child: React.ReactElement<IStackItemProps>, index: number) => {
if (!child) {
return null;
}
if (child.type === StackItemType) {
const defaultItemProps: IStackItemProps = {
shrink: !disableShrink
};
return React.cloneElement(child, {
...defaultItemProps,
...child.props
});
}
return child;
}
);
const nativeProps = getNativeProps(rest, htmlElementProperties);
const Slots = getSlots<IStackProps, IStackSlots>(props, {
root: RootType,
inner: 'div'
});
if (wrap) {
return (
<Slots.root {...nativeProps}>
<Slots.inner>{stackChildren}</Slots.inner>
</Slots.root>
);
}
return <Slots.root {...nativeProps}>{stackChildren}</Slots.root>;
};
const StackStatics = {
Item: StackItem
};
export const Stack: React.StatelessComponent<IStackProps> & {
Item: React.StatelessComponent<IStackItemProps>;
} = createComponent(StackView, {
displayName: 'Stack',
styles,
statics: StackStatics
});
export default Stack;