UNPKG

@storybook/react-native-server

Version:

A better way to develop React Native Components for your app

58 lines (57 loc) 2.71 kB
"use strict"; var __importDefault = (this && this.__importDefault) || function (mod) { return (mod && mod.__esModule) ? mod : { "default": mod }; }; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; var react_1 = __importDefault(require("react")); var styles = { main: { margin: 15, maxWidth: 600, lineHeight: 1.4, fontFamily: '"Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif', }, code: { fontSize: 15, fontWeight: 600, padding: '2px 5px', border: '1px solid #eae9e9', borderRadius: 4, backgroundColor: '#f3f2f2', color: '#3a3a3a', }, codeBlock: { backgroundColor: '#f3f2f2', padding: '1px 10px', margin: '10px 0', }, instructionsCode: { color: '#000000', }, }; var PreviewHelp = function () { return (react_1.default.createElement("div", { style: styles.main }, react_1.default.createElement("h1", null, "Welcome to storybook"), react_1.default.createElement("p", null, "This is a UI component dev environment for your app."), react_1.default.createElement("p", null, "We've added some basic stories inside the ", react_1.default.createElement("span", { style: styles.code }, "storybook/stories"), ' ', "directory. A story is a single state of one or more UI components. You can have as many stories as you want. Basically a story is like a visual test case."), react_1.default.createElement("p", null, "To see your Storybook stories on the device, you should start your mobile app for the\u00A0", react_1.default.createElement("span", { style: styles.code }, "<platform>"), " of your choice (typically ios or android). (Note that due to an implementation detail, your stories will only show up in the left-pane after your device has connected to this storybook server.)"), react_1.default.createElement("p", null, "For ", react_1.default.createElement("span", { style: styles.code }, "create-react-native-app"), " apps:"), react_1.default.createElement("div", { style: styles.codeBlock }, react_1.default.createElement("pre", { style: styles.instructionsCode }, "npm run <platform>")), react_1.default.createElement("p", null, "For ", react_1.default.createElement("span", { style: styles.code }, "react-native init"), " apps:"), react_1.default.createElement("div", { style: styles.codeBlock }, react_1.default.createElement("pre", { style: styles.instructionsCode }, "react-native run-<platform>")))); }; exports.default = PreviewHelp;