Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More

@storybook/addon-ondevice-actions

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@storybook/addon-ondevice-actions

Action Logger addon for react-native storybook


Version published
Maintainers
14
Created

What is @storybook/addon-ondevice-actions?

@storybook/addon-ondevice-actions is an addon for Storybook that allows you to log actions and events directly on your device. This is particularly useful for mobile and tablet development, where you want to see the interactions and events happening in real-time on the actual device.

What are @storybook/addon-ondevice-actions's main functionalities?

Logging Actions

This feature allows you to log actions such as button presses. The `action` function from `@storybook/addon-ondevice-actions` is used to log the event, which can then be viewed in the Storybook UI.

import { storiesOf } from '@storybook/react-native';
import { action } from '@storybook/addon-ondevice-actions';
import { Button } from 'react-native';

storiesOf('Button', module)
  .add('with text', () => (
    <Button
      onPress={action('button-pressed')}
      title="Press me"
    />
  ));

Custom Action Handlers

This feature allows you to create custom action handlers for different events. In this example, the `onChangeText` event of a `TextInput` component is logged using the `action` function.

import { storiesOf } from '@storybook/react-native';
import { action } from '@storybook/addon-ondevice-actions';
import { TextInput } from 'react-native';

storiesOf('TextInput', module)
  .add('with placeholder', () => (
    <TextInput
      placeholder="Type here"
      onChangeText={action('text-changed')}
    />
  ));

Other packages similar to @storybook/addon-ondevice-actions

Keywords

FAQs

Package last updated on 06 Dec 2024

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts