@micromag/screen-contribution 0.3.541 → 0.3.547

package/es/index.js

@@ -454,7 +454,6 @@ var ContributionScreen = function ContributionScreen(_ref) {
 };
 ContributionScreen.propTypes = propTypes;
 ContributionScreen.defaultProps = defaultProps;
-var ContributionScreen$1 = ContributionScreen;
 
 var definition = {
   id: 'contribution',
@@ -476,7 +475,7 @@ var definition = {
       "value": "Contribution"
     }]
   }),
-  component: ContributionScreen$1,
+  component: ContributionScreen,
   layouts: ['top', 'middle', 'bottom'],
   fields: [{
     name: 'layout',
@@ -620,4 +619,4 @@ var definition = {
   }]
 };
 
-export { ContributionScreen$1 as ContributionScreen, definition as default };
+export { ContributionScreen, definition as default };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@micromag/screen-contribution",
-    "version": "0.3.541",
+    "version": "0.3.547",
     "private": false,
     "description": "",
     "keywords": [
@@ -30,12 +30,11 @@
         }
     ],
     "license": "ISC",
-    "main": "lib/index.js",
+    "type": "module",
     "module": "es/index.js",
     "style": "assets/css/styles.css",
     "exports": {
         ".": {
-            "require": "./lib/index.js",
             "import": "./es/index.js"
         },
         "./assets/css/styles": "./assets/css/styles.css",
@@ -64,19 +63,19 @@
         "@fortawesome/fontawesome-svg-core": "^6.5.2",
         "@fortawesome/free-solid-svg-icons": "^6.5.2",
         "@fortawesome/react-fontawesome": "^0.2.0",
-        "@micromag/core": "^0.3.541",
-        "@micromag/data": "^0.3.541",
-        "@micromag/element-background": "^0.3.541",
-        "@micromag/element-button": "^0.3.541",
-        "@micromag/element-container": "^0.3.541",
-        "@micromag/element-footer": "^0.3.541",
-        "@micromag/element-header": "^0.3.541",
-        "@micromag/element-heading": "^0.3.541",
-        "@micromag/element-scroll": "^0.3.541",
-        "@micromag/element-share-incentive": "^0.3.541",
-        "@micromag/element-text": "^0.3.541",
-        "@micromag/element-text-input": "^0.3.541",
-        "@micromag/transforms": "^0.3.541",
+        "@micromag/core": "^0.3.547",
+        "@micromag/data": "^0.3.547",
+        "@micromag/element-background": "^0.3.547",
+        "@micromag/element-button": "^0.3.547",
+        "@micromag/element-container": "^0.3.547",
+        "@micromag/element-footer": "^0.3.547",
+        "@micromag/element-header": "^0.3.547",
+        "@micromag/element-heading": "^0.3.547",
+        "@micromag/element-scroll": "^0.3.547",
+        "@micromag/element-share-incentive": "^0.3.547",
+        "@micromag/element-text": "^0.3.547",
+        "@micromag/element-text-input": "^0.3.547",
+        "@micromag/transforms": "^0.3.547",
         "classnames": "^2.2.6",
         "lodash": "^4.17.21",
         "prop-types": "^15.7.2",
@@ -87,5 +86,5 @@
         "access": "public",
         "registry": "https://registry.npmjs.org/"
     },
-    "gitHead": "6c04a7e327b5fbc096785c11320b3fbd3c5751c8"
+    "gitHead": "3c2f5904ce61fcfa61f673c38c2a5ec56e9e2b07"
 }

package/lib/index.js

@@ -1,628 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var reactIntl = require('react-intl');
-var _defineProperty = require('@babel/runtime/helpers/defineProperty');
-var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
-var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
-var faSpinner = require('@fortawesome/free-solid-svg-icons/faSpinner');
-var reactFontawesome = require('@fortawesome/react-fontawesome');
-var classNames = require('classnames');
-var PropTypes = require('prop-types');
-var React = require('react');
-var core = require('@micromag/core');
-var components = require('@micromag/core/components');
-var contexts = require('@micromag/core/contexts');
-var hooks = require('@micromag/core/hooks');
-var utils = require('@micromag/core/utils');
-var data = require('@micromag/data');
-var Background = require('@micromag/element-background');
-var Button = require('@micromag/element-button');
-var Container = require('@micromag/element-container');
-var Footer = require('@micromag/element-footer');
-var Header = require('@micromag/element-header');
-var Heading = require('@micromag/element-heading');
-var Scroll = require('@micromag/element-scroll');
-var Text = require('@micromag/element-text');
-var TextInput = require('@micromag/element-text-input');
-
-var styles = {"container":"micromag-screen-contribution-container","inner":"micromag-screen-contribution-inner","background":"micromag-screen-contribution-background","buttonSubmit":"micromag-screen-contribution-buttonSubmit","content":"micromag-screen-contribution-content","header":"micromag-screen-contribution-header","emptyTitle":"micromag-screen-contribution-emptyTitle","emptyInputName":"micromag-screen-contribution-emptyInputName","emptyInputMessage":"micromag-screen-contribution-emptyInputMessage","emptySubmit":"micromag-screen-contribution-emptySubmit","title":"micromag-screen-contribution-title","interactiveContainer":"micromag-screen-contribution-interactiveContainer","form":"micromag-screen-contribution-form","inputName":"micromag-screen-contribution-inputName","inputMessage":"micromag-screen-contribution-inputMessage","formContent":"micromag-screen-contribution-formContent","formLoading":"micromag-screen-contribution-formLoading","rotate":"micromag-screen-contribution-rotate","loadingIcon":"micromag-screen-contribution-loadingIcon","contributionsContainer":"micromag-screen-contribution-contributionsContainer","contributionsContent":"micromag-screen-contribution-contributionsContent","contributions":"micromag-screen-contribution-contributions","contribution":"micromag-screen-contribution-contribution","footer":"micromag-screen-contribution-footer","disabled":"micromag-screen-contribution-disabled","submitting":"micromag-screen-contribution-submitting","submitted":"micromag-screen-contribution-submitted","showContributions":"micromag-screen-contribution-showContributions","isPlaceholder":"micromag-screen-contribution-isPlaceholder"};
-
-var propTypes = {
-  id: PropTypes.string,
-  layout: PropTypes.oneOf(['top', 'middle', 'bottom']),
-  title: core.PropTypes.headingElement,
-  name: core.PropTypes.inputElement,
-  message: core.PropTypes.inputElement,
-  submit: core.PropTypes.textElement,
-  nameStyle: core.PropTypes.textStyle,
-  messageStyle: core.PropTypes.textStyle,
-  spacing: PropTypes.number,
-  background: core.PropTypes.backgroundElement,
-  header: core.PropTypes.header,
-  footer: core.PropTypes.footer,
-  current: PropTypes.bool,
-  active: PropTypes.bool,
-  transitions: core.PropTypes.transitions,
-  transitionStagger: PropTypes.number,
-  resizeTransitionDuration: PropTypes.number,
-  type: PropTypes.string,
-  className: PropTypes.string
-};
-var defaultProps = {
-  id: null,
-  layout: 'middle',
-  title: null,
-  name: null,
-  message: null,
-  submit: null,
-  nameStyle: null,
-  messageStyle: null,
-  spacing: 20,
-  background: null,
-  header: null,
-  footer: null,
-  current: true,
-  active: true,
-  transitions: null,
-  transitionStagger: 100,
-  resizeTransitionDuration: 750,
-  type: null,
-  className: null
-};
-var ContributionScreen = function ContributionScreen(_ref) {
-  var id = _ref.id,
-    layout = _ref.layout,
-    title = _ref.title,
-    name = _ref.name,
-    message = _ref.message,
-    submit = _ref.submit,
-    nameStyle = _ref.nameStyle,
-    messageStyle = _ref.messageStyle,
-    spacing = _ref.spacing,
-    background = _ref.background,
-    header = _ref.header,
-    footer = _ref.footer,
-    current = _ref.current,
-    active = _ref.active,
-    transitions = _ref.transitions,
-    transitionStagger = _ref.transitionStagger,
-    resizeTransitionDuration = _ref.resizeTransitionDuration,
-    type = _ref.type,
-    className = _ref.className;
-  var screenId = id || 'screen-id';
-  var trackScreenEvent = hooks.useTrackScreenEvent(type);
-  var _useScreenSize = contexts.useScreenSize(),
-    width = _useScreenSize.width,
-    height = _useScreenSize.height,
-    resolution = _useScreenSize.resolution;
-  var _useViewerContext = contexts.useViewerContext(),
-    viewerTopHeight = _useViewerContext.topHeight,
-    viewerBottomHeight = _useViewerContext.bottomHeight,
-    viewerBottomSidesWidth = _useViewerContext.bottomSidesWidth;
-  var _useScreenRenderConte = contexts.useScreenRenderContext(),
-    isView = _useScreenRenderConte.isView,
-    isPreview = _useScreenRenderConte.isPreview,
-    isPlaceholder = _useScreenRenderConte.isPlaceholder,
-    isEdit = _useScreenRenderConte.isEdit,
-    isStatic = _useScreenRenderConte.isStatic,
-    isCapture = _useScreenRenderConte.isCapture;
-  var _useViewerWebView = contexts.useViewerWebView(),
-    openWebView = _useViewerWebView.open;
-  var _usePlaybackContext = contexts.usePlaybackContext(),
-    muted = _usePlaybackContext.muted;
-  var mediaRef = contexts.usePlaybackMediaRef(current);
-  var backgroundPlaying = current && (isView || isEdit);
-  var mediaShouldLoad = current || active;
-  var transitionPlaying = current;
-  var transitionDisabled = isStatic || isCapture || isPlaceholder || isPreview || isEdit;
-  var scrollingDisabled = !isEdit && transitionDisabled || !current;
-  var hasHeader = utils.isHeaderFilled(header);
-  var hasFooter = utils.isFooterFilled(footer);
-  var footerProps = utils.getFooterProps(footer, {
-    isView: isView,
-    current: current,
-    openWebView: openWebView,
-    isPreview: isPreview
-  });
-  var hasTitle = utils.isTextFilled(title);
-  var hasNameLabel = utils.isLabelFilled(name);
-  var hasMessageLabel = utils.isLabelFilled(message);
-  var hasSubmit = utils.isTextFilled(submit);
-  var contributionsRef = React.useRef(null);
-  var formRef = React.useRef(null);
-  var _useState = React.useState(null),
-    _useState2 = _slicedToArray(_useState, 2),
-    interactiveContainerHeight = _useState2[0],
-    setInteractiveContainerHeight = _useState2[1];
-  var _useState3 = React.useState(''),
-    _useState4 = _slicedToArray(_useState3, 2),
-    userName = _useState4[0],
-    setUserName = _useState4[1];
-  var _useState5 = React.useState(''),
-    _useState6 = _slicedToArray(_useState5, 2),
-    userMessage = _useState6[0],
-    setUserMessage = _useState6[1];
-
-  // 0 = default, 1 = submitting, 2 = submitted, 3 = resizing, 4 = done
-  var _useState7 = React.useState(isStatic || isCapture ? 4 : 0),
-    _useState8 = _slicedToArray(_useState7, 2),
-    submitState = _useState8[0],
-    setSubmitState = _useState8[1];
-  var onContributionSubmitted = React.useCallback(function () {
-    setSubmitState(2);
-    trackScreenEvent('submit_success', "".concat(userName, ": ").concat(userMessage));
-  }, [setSubmitState, trackScreenEvent, userName, userMessage]);
-  var _useContributionCreat = data.useContributionCreate({
-      screenId: screenId
-    }),
-    submitContribution = _useContributionCreat.create;
-  var _useContributions = data.useContributions({
-      screenId: screenId,
-      opts: {
-        autoload: !isPlaceholder
-      }
-    }),
-    contributions = _useContributions.contributions;
-  var onNameChange = React.useCallback(function (e) {
-    setUserName(e.currentTarget.value);
-  }, [setUserName]);
-  var onMessageChange = React.useCallback(function (e) {
-    setUserMessage(e.currentTarget.value);
-  }, [setUserMessage]);
-  var nameFilled = React.useRef(false);
-  var onNameBlur = React.useCallback(function (e) {
-    if (!nameFilled.current && e.currentTarget.value.length > 0) {
-      nameFilled.current = true;
-      trackScreenEvent('input_filled', 'Name', {
-        userName: e.currentTarget.value,
-        userMessage: userMessage
-      });
-    }
-  }, [trackScreenEvent, userMessage]);
-  var messageFilled = React.useRef(false);
-  var onMessageBlur = React.useCallback(function (e) {
-    if (!messageFilled.current && e.currentTarget.value.length > 0) {
-      messageFilled.current = true;
-      trackScreenEvent('input_filled', 'Message', {
-        userName: userName,
-        userMessage: e.currentTarget.value
-      });
-    }
-  }, [trackScreenEvent, userName]);
-
-  // Call to Action
-  var _useState9 = React.useState(false),
-    _useState10 = _slicedToArray(_useState9, 2),
-    scrolledBottom = _useState10[0],
-    setScrolledBottom = _useState10[1];
-  var swipeUpLinkActive = scrolledBottom && submitState === 4;
-  var _useDimensionObserver = hooks.useDimensionObserver(),
-    footerRef = _useDimensionObserver.ref,
-    _useDimensionObserver2 = _useDimensionObserver.height,
-    callToActionHeight = _useDimensionObserver2 === void 0 ? 0 : _useDimensionObserver2;
-  var onScrolledBottom = React.useCallback(function (_ref2) {
-    var initial = _ref2.initial;
-    if (initial) {
-      trackScreenEvent('scroll', 'Contributions list');
-    }
-    setScrolledBottom(true);
-  }, [trackScreenEvent, setScrolledBottom]);
-  var onScrolledNotBottom = React.useCallback(function () {
-    setScrolledBottom(false);
-  }, [setScrolledBottom]);
-  var onSubmit = React.useCallback(function (e) {
-    e.preventDefault();
-    if (submitState === 0) {
-      setInteractiveContainerHeight(formRef.current.offsetHeight);
-      setSubmitState(1);
-      submitContribution({
-        name: userName,
-        message: userMessage
-      });
-      onContributionSubmitted();
-      trackScreenEvent('click_submit', "".concat(userName, ": ").concat(userMessage), {
-        userName: userName,
-        userMessage: userMessage
-      });
-    }
-  }, [submitState, setSubmitState, userName, userMessage, trackScreenEvent, onContributionSubmitted]);
-  React.useEffect(function () {
-    var timeout = null;
-    if (submitState === 2) {
-      timeout = setTimeout(setSubmitState, resizeTransitionDuration, 4);
-      setInteractiveContainerHeight(contributionsRef.current.offsetHeight);
-      setSubmitState(3);
-    }
-    return function () {
-      if (submitState === 3 && timeout !== null) {
-        clearTimeout(timeout);
-      }
-    };
-  }, [submitState, setInteractiveContainerHeight, setSubmitState, resizeTransitionDuration]);
-
-  // Title
-
-  var items = [/*#__PURE__*/React.createElement(components.ScreenElement, {
-    key: "title",
-    placeholder: "title",
-    placeholderProps: {
-      height: '0.75em'
-    },
-    emptyLabel: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
-      id: "2ZOPe+",
-      defaultMessage: [{
-        "type": 0,
-        "value": "Title"
-      }]
-    }),
-    emptyClassName: styles.emptyTitle,
-    isEmpty: !hasTitle
-  }, hasTitle ? /*#__PURE__*/React.createElement(Heading, Object.assign({}, title, {
-    className: styles.title
-  })) : null)];
-  var allContributions = [].concat(_toConsumableArray(userName !== null && userMessage !== null ? [{
-    name: userName,
-    message: userMessage
-  }] : []), _toConsumableArray(contributions || []));
-
-  // Form
-
-  items.push( /*#__PURE__*/React.createElement("div", {
-    key: "form",
-    className: styles.interactiveContainer,
-    style: {
-      height: submitState < 4 ? interactiveContainerHeight : null,
-      transitionDuration: "".concat(resizeTransitionDuration, "ms")
-    }
-  }, /*#__PURE__*/React.createElement("form", {
-    className: styles.form,
-    onSubmit: onSubmit,
-    ref: formRef
-  }, /*#__PURE__*/React.createElement("div", {
-    className: styles.formContent
-  }, /*#__PURE__*/React.createElement(components.ScreenElement, {
-    placeholder: "inputText",
-    placeholderProps: {
-      height: '0.25em'
-    },
-    emptyLabel: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
-      id: "G/ITGY",
-      defaultMessage: [{
-        "type": 0,
-        "value": "Your name"
-      }]
-    }),
-    emptyClassName: styles.emptyInputName,
-    isEmpty: !hasNameLabel
-  }, /*#__PURE__*/React.createElement(components.Transitions, {
-    transitions: transitions,
-    playing: transitionPlaying,
-    delay: transitionStagger,
-    disabled: transitionDisabled
-  }, /*#__PURE__*/React.createElement(TextInput, Object.assign({
-    className: styles.inputName
-  }, name, {
-    value: userName,
-    onChange: function onChange(e) {
-      return onNameChange(e);
-    },
-    onBlur: function onBlur(e) {
-      return onNameBlur(e);
-    },
-    focusable: current && isView,
-    disabled: isPreview,
-    required: true
-  })))), /*#__PURE__*/React.createElement(components.ScreenElement, {
-    placeholder: "inputText",
-    placeholderProps: {
-      height: '0.75em'
-    },
-    emptyLabel: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
-      id: "JAguka",
-      defaultMessage: [{
-        "type": 0,
-        "value": "Your message"
-      }]
-    }),
-    emptyClassName: styles.emptyInputMessage,
-    isEmpty: !hasMessageLabel
-  }, /*#__PURE__*/React.createElement(components.Transitions, {
-    transitions: transitions,
-    playing: transitionPlaying,
-    delay: transitionStagger * 2,
-    disabled: transitionDisabled
-  }, /*#__PURE__*/React.createElement(TextInput, Object.assign({
-    className: styles.inputMessage
-  }, message, {
-    value: userMessage,
-    onChange: function onChange(e) {
-      return onMessageChange(e);
-    },
-    onBlur: function onBlur(e) {
-      return onMessageBlur(e);
-    },
-    disabled: isPreview,
-    focusable: current && isView,
-    multiline: true,
-    required: true
-  })))), /*#__PURE__*/React.createElement(components.ScreenElement, {
-    placeholder: "button",
-    emptyLabel: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
-      id: "5uH4x7",
-      defaultMessage: [{
-        "type": 0,
-        "value": "Submit"
-      }]
-    }),
-    emptyClassName: styles.emptySubmit,
-    isEmpty: !hasSubmit
-  }, /*#__PURE__*/React.createElement(components.Transitions, {
-    transitions: transitions,
-    playing: transitionPlaying,
-    delay: transitionStagger * 3,
-    disabled: transitionDisabled
-  }, /*#__PURE__*/React.createElement(Button, {
-    type: "submit",
-    className: styles.buttonSubmit,
-    disabled: isPreview,
-    buttonStyle: submit !== null ? submit.buttonStyle : null,
-    focusable: current && isView
-  }, /*#__PURE__*/React.createElement(Text, Object.assign({}, submit, {
-    inline: true
-  })))))), /*#__PURE__*/React.createElement("div", {
-    className: styles.formLoading
-  }, /*#__PURE__*/React.createElement(reactFontawesome.FontAwesomeIcon, {
-    className: styles.loadingIcon,
-    icon: faSpinner.faSpinner
-  }))), /*#__PURE__*/React.createElement("div", {
-    className: styles.contributionsContainer,
-    "aria-hidden": submitState === 4 ? null : 'true'
-  }, /*#__PURE__*/React.createElement("div", {
-    className: styles.contributionsContent
-  }, /*#__PURE__*/React.createElement("div", {
-    className: styles.contributions,
-    ref: contributionsRef
-  }, allContributions.map(function (contribution, contributionIndex) {
-    var nameInnerStyle = nameStyle !== null ? nameStyle.style || null : null;
-    var messageInnerStyle = messageStyle !== null ? messageStyle.style || null : null;
-    return /*#__PURE__*/React.createElement("div", {
-      key: "contribution-".concat(contributionIndex),
-      className: styles.contribution,
-      style: nameInnerStyle !== null ? utils.getStyleFromColor(nameInnerStyle.color, 'borderColor') : null
-    }, /*#__PURE__*/React.createElement(Heading, {
-      className: styles.contributionName,
-      body: contribution.name,
-      size: 2,
-      textStyle: nameInnerStyle
-    }), /*#__PURE__*/React.createElement(Text, {
-      className: styles.contributionMessage,
-      body: contribution.message,
-      textStyle: messageInnerStyle
-    }));
-  })))), hasFooter ? /*#__PURE__*/React.createElement("div", {
-    style: {
-      height: callToActionHeight
-    }
-  }) : null));
-  var headerElement = !isPlaceholder && hasHeader ? /*#__PURE__*/React.createElement("div", {
-    className: styles.header,
-    style: {
-      paddingBottom: spacing
-    }
-  }, /*#__PURE__*/React.createElement(Header, header)) : null;
-  var headerInScroll = submitState >= 4;
-  return /*#__PURE__*/React.createElement("div", {
-    className: classNames([styles.container, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, className, className !== null), styles.isPlaceholder, isPlaceholder), styles.submitting, submitState === 1), styles.submitted, submitState > 1), styles.showContributions, submitState === 4)]),
-    "data-screen-ready": true
-  }, /*#__PURE__*/React.createElement(Container, {
-    width: width,
-    height: height,
-    className: styles.content
-  }, /*#__PURE__*/React.createElement("div", {
-    className: styles.inner,
-    style: !isPlaceholder ? {
-      paddingLeft: spacing,
-      paddingRight: spacing,
-      paddingTop: (!isPreview ? viewerTopHeight : 0) + (hasHeader ? spacing / 2 : spacing),
-      paddingBottom: (current && !isPreview ? viewerBottomHeight : 0) + spacing
-    } : null
-  }, !headerInScroll ? headerElement : null, /*#__PURE__*/React.createElement(Scroll, {
-    verticalAlign: layout,
-    disabled: scrollingDisabled,
-    onScrolledBottom: onScrolledBottom,
-    onScrolledNotBottom: onScrolledNotBottom,
-    withShadow: true
-  }, headerInScroll ? headerElement : null, items), !isPlaceholder && hasFooter ? /*#__PURE__*/React.createElement("div", {
-    ref: footerRef,
-    className: classNames([styles.footer, _defineProperty({}, styles.disabled, !swipeUpLinkActive)]),
-    style: {
-      paddingLeft: Math.max(viewerBottomSidesWidth, spacing / 2),
-      paddingRight: Math.max(viewerBottomSidesWidth, spacing / 2),
-      paddingTop: 0,
-      paddingBottom: (!isPreview ? viewerBottomHeight : 0) + spacing / 2
-    }
-  }, /*#__PURE__*/React.createElement(Footer, footerProps)) : null)), !isPlaceholder ? /*#__PURE__*/React.createElement(Background, {
-    background: background,
-    width: width,
-    height: height,
-    resolution: resolution,
-    playing: backgroundPlaying,
-    muted: muted,
-    shouldLoad: mediaShouldLoad,
-    mediaRef: mediaRef,
-    withoutVideo: isPreview,
-    className: styles.background
-  }) : null);
-};
-ContributionScreen.propTypes = propTypes;
-ContributionScreen.defaultProps = defaultProps;
-var ContributionScreen$1 = ContributionScreen;
-
-var definition = {
-  id: 'contribution',
-  type: 'screen',
-  group: {
-    label: reactIntl.defineMessage({
-      id: "ZiWlL6",
-      defaultMessage: [{
-        "type": 0,
-        "value": "Questions"
-      }]
-    }),
-    order: 7
-  },
-  title: reactIntl.defineMessage({
-    id: "g6b9Lg",
-    defaultMessage: [{
-      "type": 0,
-      "value": "Contribution"
-    }]
-  }),
-  component: ContributionScreen$1,
-  layouts: ['top', 'middle', 'bottom'],
-  fields: [{
-    name: 'layout',
-    type: 'screen-layout',
-    defaultValue: 'top',
-    label: reactIntl.defineMessage({
-      id: "4iBXj2",
-      defaultMessage: [{
-        "type": 0,
-        "value": "Layout"
-      }]
-    })
-  }, {
-    name: 'title',
-    type: 'heading-element',
-    theme: {
-      textStyle: 'heading2'
-    },
-    label: reactIntl.defineMessage({
-      id: "N25iDO",
-      defaultMessage: [{
-        "type": 0,
-        "value": "Title"
-      }]
-    })
-  }, {
-    name: 'name',
-    type: 'input-element',
-    theme: {
-      textStyle: 'text'
-    },
-    label: reactIntl.defineMessage({
-      id: "nXVNeg",
-      defaultMessage: [{
-        "type": 0,
-        "value": "Name"
-      }]
-    })
-  }, {
-    name: 'message',
-    type: 'input-element',
-    theme: {
-      textStyle: 'text'
-    },
-    label: reactIntl.defineMessage({
-      id: "RcLsua",
-      defaultMessage: [{
-        "type": 0,
-        "value": "Message"
-      }]
-    })
-  }, {
-    name: 'submit',
-    type: 'button-element',
-    theme: {
-      textStyle: 'button'
-    },
-    label: reactIntl.defineMessage({
-      id: "uAKPQ9",
-      defaultMessage: [{
-        "type": 0,
-        "value": "Submit"
-      }]
-    })
-  }, {
-    name: 'nameStyle',
-    type: 'item-text-style',
-    theme: {
-      style: {
-        textStyle: 'heading2'
-      }
-    },
-    label: reactIntl.defineMessage({
-      id: "SyMSDa",
-      defaultMessage: [{
-        "type": 0,
-        "value": "Published name style"
-      }]
-    })
-  }, {
-    name: 'messageStyle',
-    type: 'item-text-style',
-    theme: {
-      style: {
-        textStyle: 'text'
-      }
-    },
-    label: reactIntl.defineMessage({
-      id: "+SlKOi",
-      defaultMessage: [{
-        "type": 0,
-        "value": "Published message style"
-      }]
-    })
-  }, {
-    name: 'background',
-    type: 'background',
-    label: reactIntl.defineMessage({
-      id: "+MPZRu",
-      defaultMessage: [{
-        "type": 0,
-        "value": "Background"
-      }]
-    })
-  }, {
-    name: 'header',
-    type: 'header',
-    label: reactIntl.defineMessage({
-      id: "rhuDxI",
-      defaultMessage: [{
-        "type": 0,
-        "value": "Header"
-      }]
-    }),
-    theme: {
-      badge: {
-        label: {
-          textStyle: 'badge'
-        },
-        boxStyle: 'badge'
-      }
-    }
-  }, {
-    name: 'footer',
-    type: 'footer',
-    label: reactIntl.defineMessage({
-      id: "g4nybp",
-      defaultMessage: [{
-        "type": 0,
-        "value": "Footer"
-      }]
-    }),
-    theme: {
-      callToAction: {
-        label: {
-          textStyle: 'cta'
-        },
-        boxStyle: 'cta'
-      }
-    }
-  }]
-};
-
-exports.ContributionScreen = ContributionScreen$1;
-exports.default = definition;