SwitchField - AMiSi Mobile Starter

SwitchField presents a controlled React Native switch inside a labeled field.

Usage

import { useState } from 'react';

import { SwitchField } from '@amisi-mobile-starter/ui';

export const NotificationSetting = () => {
  const [isEnabled, setIsEnabled] = useState(true);

  return (
    <SwitchField
      label="Push notifications"
      value={isEnabled}
      onValueChange={setIsEnabled}
      helperText="You can change this later."
    />
  );
};

Props

Prop	Type	Default	Description
`label`	`string`	Required	Setting label.
`value`	`boolean`	Required	Controlled switch state.
`onValueChange`	`(nextValue: boolean) => void`	Required	Runs when the native switch changes.
`helperText`	`string`	`undefined`	Supporting text shown when there is no error.
`error`	`string`	`undefined`	Error shown instead of helper text.
`style`	`ViewProps['style']`	`undefined`	Style applied to the outer wrapper.

The public type combines ViewProps with SwitchProps except value and onValueChange. Remaining props are passed to the native Switch. Its default track colors are #737373 and #2da8ff; its default thumb color is #ffffff. Supplied native color props override them.