{"componentChunkName":"component---src-pages-experimental-import-pattern-index-mdx","path":"/experimental/import-pattern/","webpackCompilationHash":"9a5cb62a61994334ab3f","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":"510a33ed-ad6c-538a-9ebd-6050a9364b9e","children":[],"parent":"a08e5a24-fc05-57de-80f4-86c814cb5e0b","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":"267dbcde6f63dc9369f963173e98018b","counter":1263,"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":"/tmp/35443907/src/pages/experimental/import-pattern/index.mdx"}}}}