diff --git a/packages/components/src/divider/divider.tsx b/packages/components/src/divider/divider.tsx new file mode 100644 index 00000000..897d4dd9 --- /dev/null +++ b/packages/components/src/divider/divider.tsx @@ -0,0 +1,32 @@ +import { Stack, styled } from '@tamagui/core' + +export const Divider = styled(Stack, { + name: 'Divider', + backgroundColor: '$neutral-10', + flexShrink: 0, + // borderWidth: 0, + flex: 1, + height: '100%', + // maxHeight: 0, + width: 1, + marginHorizontal: 12, + // y: -0.5, + + variants: { + // vertical: { + // true: { + // y: 0, + // x: -0.5, + // height: isWeb ? 'initial' : 'auto', + // // maxHeight auto WILL BE passed to style attribute, but for some reason not used? + // // almost seems like a react or browser bug, but for now `initial` works + // // also, it doesn't happen for `height`, but for consistency using the same values + // maxHeight: isWeb ? 'initial' : 'auto', + // width: 0, + // maxWidth: 0, + // borderBottomWidth: 0, + // borderRightWidth: 1, + // }, + // }, + } as const, +}) diff --git a/packages/components/src/divider/index.tsx b/packages/components/src/divider/index.tsx new file mode 100644 index 00000000..53d72785 --- /dev/null +++ b/packages/components/src/divider/index.tsx @@ -0,0 +1 @@ +export * from './divider' diff --git a/packages/components/src/index.tsx b/packages/components/src/index.tsx index 4a0a52da..d76bae03 100644 --- a/packages/components/src/index.tsx +++ b/packages/components/src/index.tsx @@ -1,4 +1,7 @@ export * from './button' +export * from './chat-message' +export * from './divider' +export * from './icon-button' export * from './image' export * from './input' export * from './shape'