{"componentChunkName":"component---src-pages-experimental-import-pattern-index-mdx","path":"/experimental/import-pattern/","result":{"pageContext":{"isCreatedByStatefulCreatePages":true,"frontmatter":{"title":"Import pattern","description":"The import action transfers data or objects from an external source into a system."},"relativePagePath":"/experimental/import-pattern/index.mdx","titleType":"prepend","MdxNode":{"id":"0317004d-f3cd-5b08-a523-de3c7aa6227e","children":[],"parent":"3b0233ef-ad83-5153-a121-910da14b6379","internal":{"content":"---\ntitle: Import pattern\ndescription: The import action transfers data or objects from an external source into a system.\n---\n\n<PageDescription>\n\nThe import action transfers data or objects from an external source into a system.\n\n</PageDescription>\n\n#### Status:\n\n[Experimental](experimental/about)\n\n#### Maintainers:\n\n[Vikki Paterson](https://github.com/vikkipaterson)\n\n![Example of an import modal in context](/images/0.5.png)\n\n<Caption>Example of an import modal in context</Caption>\n\n## Choose a file\n\nWherever possible there should be a drag and drop zone. Use a file drop component and offer the option to browse locally to select a file. Note that file selection should be restricted to allowed file types.\n\n<Row>\n<Column colLg={8}>\n\n![Example of an import modal](/images/2.png)\n\n<Caption>Example of an import modal</Caption>\n\n</Column>\n</Row>\n\n<Row>\n<Column colLg={8}>\n\n![Example of drag and drop file import](/images/3.png)\n\n<Caption>Example of drag and drop file import</Caption>\n\n</Column>\n</Row>\n\n<Row>\n<Column colLg={8}>\n\n![Example of loaded files in the import modal](/images/4.png)\n\n<Caption>Example of loaded files in the import modal</Caption>\n\n</Column>\n</Row>\n\n## Import from a URL\n\nIf your product supports importing from a URL, use this method.\n\n<Row>\n<Column colLg={8}>\n\n![Example of importing with a URL](images/5.png)\n\n<Caption>Example of importing with a URL</Caption>\n\n</Column>\n</Row>\n","type":"Mdx","contentDigest":"c5cc2f4cb344d1120cafdd7130976cf1","counter":1442,"owner":"gatsby-plugin-mdx"},"frontmatter":{"title":"Import pattern","description":"The import action transfers data or objects from an external source into a system."},"exports":{},"rawBody":"---\ntitle: Import pattern\ndescription: The import action transfers data or objects from an external source into a system.\n---\n\n<PageDescription>\n\nThe import action transfers data or objects from an external source into a system.\n\n</PageDescription>\n\n#### Status:\n\n[Experimental](experimental/about)\n\n#### Maintainers:\n\n[Vikki Paterson](https://github.com/vikkipaterson)\n\n![Example of an import modal in context](/images/0.5.png)\n\n<Caption>Example of an import modal in context</Caption>\n\n## Choose a file\n\nWherever possible there should be a drag and drop zone. Use a file drop component and offer the option to browse locally to select a file. Note that file selection should be restricted to allowed file types.\n\n<Row>\n<Column colLg={8}>\n\n![Example of an import modal](/images/2.png)\n\n<Caption>Example of an import modal</Caption>\n\n</Column>\n</Row>\n\n<Row>\n<Column colLg={8}>\n\n![Example of drag and drop file import](/images/3.png)\n\n<Caption>Example of drag and drop file import</Caption>\n\n</Column>\n</Row>\n\n<Row>\n<Column colLg={8}>\n\n![Example of loaded files in the import modal](/images/4.png)\n\n<Caption>Example of loaded files in the import modal</Caption>\n\n</Column>\n</Row>\n\n## Import from a URL\n\nIf your product supports importing from a URL, use this method.\n\n<Row>\n<Column colLg={8}>\n\n![Example of importing with a URL](images/5.png)\n\n<Caption>Example of importing with a URL</Caption>\n\n</Column>\n</Row>\n","fileAbsolutePath":"/zeit/3eb073a4/src/pages/experimental/import-pattern/index.mdx"}}}}