{"data":{"prismicDocsCategory":{"data":{"pages":[{"page":{"uid":"what-is-uxpin-merge","document":[{"data":{"title":{"text":"What is UXPin Merge?"},"visible_in_table_of_content":"true"}}]}},{"page":{"uid":"using-react.js-components","document":[{"data":{"title":{"text":"Using React.js Components"},"visible_in_table_of_content":"true"}}]}},{"page":{"uid":"creating-a-library","document":[{"data":{"title":{"text":"Creating a Library"},"visible_in_table_of_content":"true"}}]}},{"page":{"uid":"ai-assisted-merge-integration","document":[{"data":{"title":{"text":"AI-Assisted Merge Integration"},"visible_in_table_of_content":"true"}}]}},{"page":{"uid":"start-with-a-boilerplate-repo","document":[{"data":{"title":{"text":"Start with a Boilerplate Repo"},"visible_in_table_of_content":"true"}}]}},{"page":{"uid":"integrating-your-own-components","document":[{"data":{"title":{"text":"Integrating Your Own Components"},"visible_in_table_of_content":"true"}}]}},{"page":{"uid":"config-file","document":[{"data":{"title":{"text":"Config File"},"visible_in_table_of_content":"true"}}]}},{"page":{"uid":"webpack-configuration","document":[{"data":{"title":{"text":"Webpack Configuration"},"visible_in_table_of_content":"true"}}]}},{"page":{"uid":"wrapper-component","document":[{"data":{"title":{"text":"Wrapper Component"},"visible_in_table_of_content":"true"}}]}},{"page":{"uid":"adjusting-components","document":[{"data":{"title":{"text":"Adjusting Components"},"visible_in_table_of_content":"true"}}]}},{"page":{"uid":"configuring-the-properties-panel","document":[{"data":{"title":{"text":"Configuring the Properties Panel"},"visible_in_table_of_content":"true"}}]}},{"page":{"uid":"authoring-and-managing-jsx-presets","document":[{"data":{"title":{"text":"Authoring and Managing JSX Presets"},"visible_in_table_of_content":"true"}}]}},{"page":{"uid":"cli-tool","document":[{"data":{"title":{"text":"CLI Tool"},"visible_in_table_of_content":"true"}}]}},{"page":{"uid":"ci-servers","document":[{"data":{"title":{"text":"Connecting code to UXPin (CI & push)"},"visible_in_table_of_content":"true"}}]}},{"page":{"uid":"version-control","document":[{"data":{"title":{"text":"Version Control"},"visible_in_table_of_content":"true"}}]}},{"page":{"uid":"patterns","document":[{"data":{"title":{"text":"Patterns"},"visible_in_table_of_content":"true"}}]}},{"page":{"uid":"tailwind-css-integration","document":[{"data":{"title":{"text":"Tailwind CSS Integration"},"visible_in_table_of_content":"true"}}]}},{"page":{"uid":"merge-design-system-documentation","document":[{"data":{"title":{"text":"Merge Design System Documentation"},"visible_in_table_of_content":"true"}}]}},{"page":{"uid":"merge-component-manager","document":[{"data":{"title":{"text":"Merge Component Manager"},"visible_in_table_of_content":"true"}}]}},{"page":{"uid":"storybook-integration","document":[{"data":{"title":{"text":"Storybook integration"},"visible_in_table_of_content":"true"}}]}},{"page":{"uid":"merge-faq","document":[{"data":{"title":{"text":"Frequently Asked Questions"},"visible_in_table_of_content":"true"}}]}}]}},"prismicDocsPage":{"data":{"title":{"text":"Frequently Asked Questions"},"isVisibleForRobots":"true","body":[{"__typename":"PrismicDocsPageBodyContent","slice_type":"content","primary":{"content_title":{"text":"General"},"content":{"html":"<h4>What component frameworks does Merge support?</h4><p>Currently, Merge supports React.js. You can try to run other frameworks wrapped in React.js but we can’t guarantee it will work.</p>"}}},{"__typename":"PrismicDocsPageBodyContent","slice_type":"content","primary":{"content_title":{"text":null},"content":{"html":"<h4>What code languages does Merge support?</h4><p>Currently, Merge supports React.js components defined in:</p><ul><li>JavaScript with properties defined using PropTypes</li><li>JavaScript with properties defined using Flow type annotations</li><li>TypeScript with properties defined using TypeScript types</li></ul>"}}},{"__typename":"PrismicDocsPageBodyContent","slice_type":"content","primary":{"content_title":{"text":""},"content":{"html":"<h4>When Merge will be available?</h4><p>Merge has been available for quite some time.<br />If you&#39;re interested, go to our <a target=\"_blank\" rel=\"noopener\" href=\"https://www.uxpin.com/merge\">Merge page</a> and request access. </p><p></p>"}}},{"__typename":"PrismicDocsPageBodyContent","slice_type":"content","primary":{"content_title":{"text":""},"content":{"html":"<h4>What is the newest version of Merge?</h4><p>The newest version of Merge package is 3.0.0<br />If you installed Merge in your design system you can check it in `package.json` of your design system. </p>"}}},{"__typename":"PrismicDocsPageBodyContent","slice_type":"content","primary":{"content_title":{"text":null},"content":{"html":"<h4>Does Merge support different branches of the code repository?</h4><p>No, currently Merge works only on `master` branch.</p>"}}},{"__typename":"PrismicDocsPageBodyContent","slice_type":"content","primary":{"content_title":{"text":null},"content":{"html":"<h4>How can I see my code component in my UXPin account</h4><p>There are two ways to connect your design system through Merge to UXPin:</p><ol><li>Use continues integration tools (recommended)</li><li>Use `push` command in the terminal with token stored inside</li></ol><p>You can read more about that in <a target=\"_blank\" rel=\"noopener\" href=\"https://www.uxpin.com/docs/merge/ci-servers/\">this section</a></p>"}}},{"__typename":"PrismicDocsPageBodyContent","slice_type":"content","primary":{"content_title":{"text":null},"content":{"html":"<h4>Can I change the position of nested components?</h4><p>Yes, you can change it be dragging components <strong>on the layer panel</strong>. It changes the position of the layer, and the components.<br />You can nest or unnest components on the layer panel.</p>"}}},{"__typename":"PrismicDocsPageBodyVideo","slice_type":"video","primary":{"video_link":{"url":"https://uxpincommunity.cdn.prismic.io/uxpincommunity/3edfe04e-808b-466c-9472-f4749c910048_Changing+position+of+component.mp4"},"video_description":{"text":null}}},{"__typename":"PrismicDocsPageBodyContent","slice_type":"content","primary":{"content_title":{"text":"Technical issues"},"content":{"html":"<h4>Experimental mode can&#39;t load</h4><p>There is a load of things that can affect experimental mode, but we found that deleting file `.uxpin-merge` in your design system repository fixes it in most cases.</p>"}}},{"__typename":"PrismicDocsPageBodyContent","slice_type":"content","primary":{"content_title":{"text":null},"content":{"html":"<h4>Merge wants to reload the page in experimental mode all the time</h4><p>We recommend adding the flag `--disable-tunneling` in the command starting Merge. It requires to run Merge in Google Chrome.<br />You can find examples of adding `--disable-tunneling` in our repositories.</p>"}}},{"__typename":"PrismicDocsPageBodyContent","slice_type":"content","primary":{"content_title":{"text":""},"content":{"html":"<h4>Why checkbox component is not getting checked on the preview?</h4><p>It&#39;s a common symptom of &quot;controlled&quot; form control without a correct `@uxpinbind` annotation. Read more about &quot;controlled&quot; and &quot;uncontrolled&quot; form controls in React.js documentation.</p>"}}},{"__typename":"PrismicDocsPageBodyContent","slice_type":"content","primary":{"content_title":{"text":null},"content":{"html":"<h3>Why I can&#39;t type into the text field (text input) component on the preview?</h3><p>It&#39;s a common symptom of &quot;controlled&quot; form control without a correct `@uxpinbind` annotation. Read more about &quot;controlled&quot; and &quot;uncontrolled&quot; form controls in React.js documentation.</p>"}}}]}}},"pageContext":{"isCreatedByStatefulCreatePages":false,"categoryUid":"merge","pageUid":"merge-faq","meta_description":"UXPin's merge Docs, frequently asked questions for new and advanced users","meta_image":"https://images.prismic.io/uxpincommunity/fa3875f8df8606e6405ba46165becc1ea6ed3d34.png?auto=compress,format","meta_title":"Frequently Asked Questions | Merge","page_title":"Frequently Asked Questions | Merge"}}