react-native-svg/lib/extract/extractStroke.js

import extractBrush from './extractBrush';
import extractOpacity from './extractOpacity';
import {strokeProps} from '../props';

const separator = /\s*,\s*/;

const caps = {
    butt: 0,
    square: 2,
    round: 1
};

const joins = {
    miter: 0,
    bevel: 2,
    round: 1
};

const strokeKeys = Object.keys(strokeProps);

export default function(props, styleProperties) {
    strokeKeys.forEach((name) => {
        if (props.hasOwnProperty(name)) {
            styleProperties.push(name);
        }
    });

    const {stroke} = props;
    const strokeWidth = props.strokeWidth;
    let strokeDasharray = props.strokeDasharray;

    if (!strokeDasharray || strokeDasharray === 'none') {
        strokeDasharray = null;
    } else if (typeof strokeDasharray === 'string') {
        strokeDasharray = strokeDasharray.split(separator).map(dash => +dash);
    }

    // <dasharray> It's a list of comma and/or white space separated <length>s
    // and <percentage>s that specify the lengths of alternating dashes and gaps.
    // If an odd number of values is provided, then the list of values is repeated
    // to yield an even number of values. Thus, 5,3,2 is equivalent to 5,3,2,5,3,2.
    if (strokeDasharray && (strokeDasharray.length % 2) === 1) {
        strokeDasharray.concat(strokeDasharray);
    }

    return {
        stroke: extractBrush(stroke),
        strokeOpacity: extractOpacity(props.strokeOpacity),
        strokeLinecap: caps[props.strokeLinecap] || 0,
        strokeLinejoin: joins[props.strokeLinejoin] || 0,
        strokeDasharray: strokeDasharray,
        strokeWidth: `${strokeWidth || 1}`,
        strokeDashoffset: strokeDasharray ? (+props.strokeDashoffset || 0) : null,
        strokeMiterlimit: props.strokeMiterlimit || 4
    };
}