wix-style-react/dist/es/stories/utils/Components/LiveCodeExample/index.js

wix-style-react

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();

function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }

import React from 'react';
import LiveCodeExample from 'wix-storybook-utils/LiveCodeExample';

import * as wsrScope from '../../../../src/index';
import * as iconsScope from 'wix-ui-icons-common';

/**
 * A utility function to convert a props object to an array of props strings.
 * Example usage:
 *
 *  const myComponentString = props => `
 *    <div
 *      ${createPropsArray(props).join('\n    ')}
 *    />
 *  `;
 *
 *  myComponentString({ id: 'some-id', style: { padding: 5 }})
 *  // Will return:
 *  //  `<div
 *  //    id="some-id"
 *  //    style={{ padding: 5 }}
 *  //  />`
 */
export var createPropsArray = function createPropsArray(props) {
  return Object.entries(props).map(function (_ref) {
    var _ref2 = _slicedToArray(_ref, 2),
        key = _ref2[0],
        value = _ref2[1];

    if (value === true) {
      return key;
    } else if (typeof value === 'string') {
      return key + '="' + value + '"';
    }

    return key + '={' + JSON.stringify(value) + '}';
  });
};

/*
 * The following object defines the globals that'll be available in the live
 * example's context. If a component is failed to render, make sure it's
 * available in the index file.
 */
var baseScope = _extends({}, wsrScope, iconsScope);

var Component = function Component(props) {
  var scope = props.scope,
      rest = _objectWithoutProperties(props, ['scope']);

  // Remove `eslint-disable` comments


  var filteredCode = props.initialCode.replace(/^(\s)*\/\*(\s)*eslint-disable(\s)*\*\/(\s)*$/gm, '');

  return React.createElement(LiveCodeExample, _extends({
    scope: _extends({}, baseScope, scope)
  }, rest, {
    initialCode: filteredCode
  }));
};

Component.propTypes = _extends({}, LiveCodeExample.propTypes);

export default Component;