{"componentChunkName":"component---src-pages-experimental-import-pattern-index-mdx","path":"/experimental/import-pattern/","webpackCompilationHash":"9ffd1cb8ca3b610e9ad3","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":"57ac9e45-6d7f-5df3-bb84-72cea018d818","children":[],"parent":"e0acfbec-6d98-5232-ab18-20da7ab3cc44","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":"4d6257b18ea5d5d27bb1e9ac0b3b8c99","counter":1395,"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":"/fargate/7b444b50/src/pages/experimental/import-pattern/index.mdx"}}}}