diff --git a/src/components/Checkbox/Checkbox.tsx b/src/components/Checkbox/Checkbox.tsx index c748bc12..896461d6 100644 --- a/src/components/Checkbox/Checkbox.tsx +++ b/src/components/Checkbox/Checkbox.tsx @@ -1,5 +1,6 @@ -import { Checkbox as RNPCheckbox } from 'react-native-paper'; import { CheckboxProps } from '@bluebase/components'; +// tslint:disable-next-line: sort-imports +import { Checkbox as RNPCheckbox } from 'react-native-paper'; import { SelectionControl } from '../SelectionControl'; import { Theme } from '@bluebase/core'; import { componentMapper } from '@bluebase/component-mapper'; @@ -21,6 +22,14 @@ export const Checkbox = componentMapper(SelectionControl, { return color; }, + onPress: ({ onPress, onValueChange, value, checked }: any) => () => { + if (onPress) { + onPress(); + } + if (onValueChange) { + onValueChange(value, !checked); + } + }, status: ({ checked, indeterminate }: CheckboxProps) => { if (indeterminate === true) { diff --git a/src/components/Checkbox/__stories__/Checkbox.stories.tsx b/src/components/Checkbox/__stories__/Checkbox.stories.tsx index ad24a758..b3e47a50 100644 --- a/src/components/Checkbox/__stories__/Checkbox.stories.tsx +++ b/src/components/Checkbox/__stories__/Checkbox.stories.tsx @@ -23,7 +23,11 @@ stories color="blue" /> { + // console.log(a); + // console.log(b); + }} label="Unchecked" color="blue" checked={false} diff --git a/src/components/Checkbox/__tests__/Checkbox.test.tsx b/src/components/Checkbox/__tests__/Checkbox.test.tsx index faa456b2..7305e2c1 100644 --- a/src/components/Checkbox/__tests__/Checkbox.test.tsx +++ b/src/components/Checkbox/__tests__/Checkbox.test.tsx @@ -1,4 +1,5 @@ import { BlueBaseApp, getComponent } from '@bluebase/core'; + import { Checkbox } from '../Checkbox'; import React from 'react'; import { mount } from 'enzyme'; @@ -110,6 +111,29 @@ describe.only('Checkbox', () => { expect(component.find('Checkbox Text').last().text()).toEqual('Foo'); }); + it('should check that the onPress and onValueChange is binded correctly', async () => { + const onPressFunc = jest.fn(); + const onValueChangeFunc = jest.fn(); + + const BBCheckbox = getComponent('Checkbox'); + + const component = mount( + + + + ); + + await waitForElement(component as any, BBCheckbox); + + const onPress = component.find('TouchableHighlight').last().prop('onPress') as any; + onPress(); + expect(onPressFunc).toBeCalled(); + + const onValueChange = component.find('TouchableHighlight').last().prop('onValueChange') as any; + onValueChange(); + expect(onValueChangeFunc).toBeCalledWith(1, true); + }); + });