@brightlayer-ui/react-native-auth-workflow/components/WorkflowCard/WorkflowCardInstructions.js

Re-usable workflow components for Authentication and Registration within Eaton applications.

var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
import React from 'react';
import { StyleSheet, View } from 'react-native';
import { Divider, Text } from 'react-native-paper';
import { useScreenDimensions } from '../../hooks/useScreenDimensions';
const makeStyles = (isTablet) => StyleSheet.create({
    container: {
        marginHorizontal: isTablet ? 24 : 16,
        paddingTop: isTablet ? 0 : 32,
        paddingBottom: isTablet ? 30 : 40,
    },
    workflowCardInstructions: {
        letterSpacing: 0,
    },
});
/**
 * Component that renders the instructions content for the workflow card.
 *
 * @param {WorkflowCardInstructionProps} props - Props of WorkflowCardInstruction component
 *
 * @category Component
 */
export const WorkflowCardInstructions = (props) => {
    const { instructions, divider = true, style } = props, otherProps = __rest(props, ["instructions", "divider", "style"]);
    const { isTablet } = useScreenDimensions();
    const styles = makeStyles(isTablet);
    return instructions ? (React.createElement(React.Fragment, null,
        React.createElement(View, { style: [styles.container] }, typeof instructions === 'string' ? (React.createElement(Text, Object.assign({ variant: "bodyLarge", style: [styles.workflowCardInstructions, style] }, otherProps), instructions)) : (instructions)),
        divider && React.createElement(Divider, { bold: true }))) : null;
};