diff --git a/package.json b/package.json index 93ddc4a..3c5c3c5 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@observation.org/react-native-components", - "version": "1.8.0", + "version": "1.9.0", "main": "src/index.ts", "repository": "git@github.com:observation/react-native-components.git", "author": "Observation.org", diff --git a/src/components/BackButton.tsx b/src/components/BackButton.tsx index 8e4c491..f5e3fd4 100644 --- a/src/components/BackButton.tsx +++ b/src/components/BackButton.tsx @@ -13,9 +13,7 @@ const BackButton = ({ navigation }: Props) => ( navigation.goBack()} - iconName="chevron-left" - size={theme.icon.size.extraExtraLarge} - color={theme.color.primary} + icon={{ name: 'chevron-left', size: theme.icon.size.extraExtraLarge, color: theme.color.primary }} /> ) diff --git a/src/components/IconButton.tsx b/src/components/IconButton.tsx index ba1282f..d337257 100644 --- a/src/components/IconButton.tsx +++ b/src/components/IconButton.tsx @@ -1,33 +1,19 @@ import React from 'react' import { TouchableOpacity, ViewStyle, StyleProp } from 'react-native' -import { Icon } from './Icon' -import { IconName } from '../lib/Icons' +import { Icon, IconProps } from './Icon' import theme from '../styles/theme' type Props = { containerStyle?: StyleProp disabled?: boolean onPress?: () => void - iconName: IconName - iconStyle?: 'light' | 'solid' - size?: number - color?: string + icon: IconProps accessibilityLabel?: string testID?: string } -const IconButton = ({ - containerStyle, - disabled, - onPress, - iconName, - iconStyle, - size = theme.icon.size.large, - color, - accessibilityLabel, - testID = 'pressable', -}: Props) => ( +const IconButton = ({ containerStyle, disabled, onPress, icon, accessibilityLabel, testID = 'pressable' }: Props) => ( - + ) diff --git a/src/components/Tooltip.tsx b/src/components/Tooltip.tsx index 5081865..613b404 100644 --- a/src/components/Tooltip.tsx +++ b/src/components/Tooltip.tsx @@ -1,16 +1,15 @@ import React from 'react' import { StyleSheet, View, Text, TouchableOpacity, ViewStyle, StyleProp } from 'react-native' -import { Icon } from './Icon' +import { Icon, IconProps } from './Icon' import LargeButton, { LargeButtonProps } from '../components/LargeButton' -import { IconName } from '../lib/Icons' import textStyle from '../styles/text' import theme from '../styles/theme' type TooltipProps = { title: string text: string - iconName?: IconName + icon?: IconProps closable?: boolean onClose?: () => void buttons?: LargeButtonProps[] @@ -20,7 +19,7 @@ type TooltipProps = { } const Tooltip = ({ - iconName, + icon, title, text, closable = true, @@ -34,9 +33,9 @@ const Tooltip = ({ - {iconName && ( + {icon && ( - + )} diff --git a/src/components/__tests__/IconButton.test.tsx b/src/components/__tests__/IconButton.test.tsx index 668e9b6..6886f99 100644 --- a/src/components/__tests__/IconButton.test.tsx +++ b/src/components/__tests__/IconButton.test.tsx @@ -2,14 +2,14 @@ import React from 'react' import { render, fireEvent } from '@testing-library/react-native' +import { IconProps } from '../Icon' import IconButton from '../IconButton' describe('IconButton', () => { + const icon: IconProps = { name: 'chevron-left', size: 20, color: 'black' } test('Rendering', () => { // GIVEN - const { toJSON } = render( - , - ) + const { toJSON } = render() // THEN expect(toJSON()).toMatchSnapshot() @@ -18,9 +18,7 @@ describe('IconButton', () => { test('Handle press when enabled', () => { // GIVEN const mockOnPress = jest.fn() - const { getByTestId } = render( - , - ) + const { getByTestId } = render() // WHEN const pressable = getByTestId('pressable') @@ -33,9 +31,7 @@ describe('IconButton', () => { test('Do not handle press when disabled', () => { // GIVEN const mockOnPress = jest.fn() - const { getByTestId } = render( - , - ) + const { getByTestId } = render() // WHEN const pressable = getByTestId('pressable') diff --git a/src/components/__tests__/ToolTip.test.tsx b/src/components/__tests__/ToolTip.test.tsx index da8b257..4de0b98 100644 --- a/src/components/__tests__/ToolTip.test.tsx +++ b/src/components/__tests__/ToolTip.test.tsx @@ -10,7 +10,7 @@ describe('Tooltip', () => { describe('Rendering', () => { test('With icon', () => { // GIVEN - const { toJSON } = render() + const { toJSON } = render() // THEN expect(toJSON()).toMatchSnapshot() @@ -45,7 +45,7 @@ describe('Tooltip', () => { test('Click on close', () => { // GIVEN const { getByTestId } = render( - , + , ) // WHEN fireEvent.press(getByTestId('close')) @@ -58,7 +58,7 @@ describe('Tooltip', () => { // GIVEN const onPress = jest.fn() const { getByText } = render( - , + , ) // WHEN