From 73308af061af5e17ac7d4a73fa027a2f303c70dd Mon Sep 17 00:00:00 2001 From: Kirill Rogovoy Date: Fri, 23 Jul 2021 11:02:26 +0300 Subject: Update graph data when Emacs node changes + minor improvements --- app_expo/components/checkbox/checkbox.props.ts | 44 --------- app_expo/components/checkbox/checkbox.story.tsx | 121 ------------------------ app_expo/components/checkbox/checkbox.tsx | 53 ----------- 3 files changed, 218 deletions(-) delete mode 100644 app_expo/components/checkbox/checkbox.props.ts delete mode 100644 app_expo/components/checkbox/checkbox.story.tsx delete mode 100644 app_expo/components/checkbox/checkbox.tsx (limited to 'app_expo/components/checkbox') diff --git a/app_expo/components/checkbox/checkbox.props.ts b/app_expo/components/checkbox/checkbox.props.ts deleted file mode 100644 index 4a212e3..0000000 --- a/app_expo/components/checkbox/checkbox.props.ts +++ /dev/null @@ -1,44 +0,0 @@ -import { StyleProp, ViewStyle } from 'react-native' -import { TxKeyPath } from '../../i18n' - -export interface CheckboxProps { - /** - * Additional container style. Useful for margins. - */ - style?: StyleProp - - /** - * Additional outline style. - */ - outlineStyle?: StyleProp - - /** - * Additional fill style. Only visible when checked. - */ - fillStyle?: StyleProp - - /** - * Is the checkbox checked? - */ - value?: boolean - - /** - * The text to display if there isn't a tx. - */ - text?: string - - /** - * The i18n lookup key. - */ - tx?: TxKeyPath - - /** - * Multiline or clipped single line? - */ - multiline?: boolean - - /** - * Fires when the user tabs to change the value. - */ - onToggle?: (newValue: boolean) => void -} diff --git a/app_expo/components/checkbox/checkbox.story.tsx b/app_expo/components/checkbox/checkbox.story.tsx deleted file mode 100644 index a6dce83..0000000 --- a/app_expo/components/checkbox/checkbox.story.tsx +++ /dev/null @@ -1,121 +0,0 @@ -/* eslint-disable react-native/no-inline-styles */ -/* eslint-disable react-native/no-color-literals */ - -import * as React from 'react' -import { View, ViewStyle } from 'react-native' -import { storiesOf } from '@storybook/react-native' -import { StoryScreen, Story, UseCase } from '../../../storybook/views' -import { Checkbox } from './checkbox' -import { Toggle } from 'react-powerplug' - -declare let module - -const arrayStyle: ViewStyle[] = [{ paddingVertical: 40 }, { alignSelf: 'flex-end' }] -const arrayOutlineStyle: ViewStyle[] = [{ borderColor: '#b443c9' }, { borderWidth: 25 }] -const arrayFillStyle: ViewStyle[] = [{ backgroundColor: '#55e0ff' }] - -storiesOf('Checkbox', module) - .addDecorator((fn) => {fn()}) - .add('Behaviour', () => ( - - - - {({ on, toggle }) => } - - - - - - - - - - )) - .add('Styling', () => ( - - - - {({ on, toggle }) => ( - - - - )} - - - - - {({ on, toggle }) => ( - - - - )} - - - - - {({ on, toggle }) => ( - - - - )} - - - - - {({ on, toggle }) => ( - - - - )} - - - - - - {({ on, toggle }) => ( - - - - )} - - - - )) diff --git a/app_expo/components/checkbox/checkbox.tsx b/app_expo/components/checkbox/checkbox.tsx deleted file mode 100644 index fba748e..0000000 --- a/app_expo/components/checkbox/checkbox.tsx +++ /dev/null @@ -1,53 +0,0 @@ -import * as React from 'react' -import { TextStyle, TouchableOpacity, View, ViewStyle } from 'react-native' -import { Text } from '../text/text' -import { color, spacing } from '../../theme' -import { CheckboxProps } from './checkbox.props' - -const ROOT: ViewStyle = { - flexDirection: 'row', - paddingVertical: spacing[1], - alignSelf: 'flex-start', -} - -const DIMENSIONS = { width: 16, height: 16 } - -const OUTLINE: ViewStyle = { - ...DIMENSIONS, - marginTop: 2, // finicky and will depend on font/line-height/baseline/weather - justifyContent: 'center', - alignItems: 'center', - borderWidth: 1, - borderColor: color.primaryDarker, - borderRadius: 1, -} - -const FILL: ViewStyle = { - width: DIMENSIONS.width - 4, - height: DIMENSIONS.height - 4, - backgroundColor: color.primary, -} - -const LABEL: TextStyle = { paddingLeft: spacing[2] } - -export function Checkbox(props: CheckboxProps) { - const numberOfLines = props.multiline ? 0 : 1 - - const rootStyle = [ROOT, props.style] - const outlineStyle = [OUTLINE, props.outlineStyle] - const fillStyle = [FILL, props.fillStyle] - - const onPress = props.onToggle ? () => props.onToggle && props.onToggle(!props.value) : null - - return ( - - {props.value && } - - - ) -} -- cgit v1.2.3