{"version":3,"sources":["webpack:///./doc/components/ui-framework/introduction.md"],"names":["_frontmatter","layoutProps","MDXLayout","MDXContent","components","props","mdxType","parentName","isMDXComponent"],"mappings":"sQAKO,IAAMA,EAAe,CAC1B,GAAM,eACN,MAAS,gBAQLC,EAAc,CAClBD,gBAEIE,EAAY,UACH,SAASC,EAAT,GAGZ,IAFDC,EAEC,EAFDA,WACGC,E,oIACF,mBACD,OAAO,cAACH,EAAD,iBAAeD,EAAiBI,EAAhC,CAAuCD,WAAYA,EAAYE,QAAQ,cAC5E,iHAA8F,iCAAGC,WAAW,KAAQ,CAChH,KAAQ,0DADkF,kBAA9F,0IAGA,oGACA,wBACE,oBAAIA,WAAW,MAAf,6EAAkG,oBAAIA,WAAW,MAC7G,oBAAIA,WAAW,MAAf,uEAEJ,oBAAIA,WAAW,MAAf,+GAAoI,oBAAIA,WAAW,MAC/I,oBAAIA,WAAW,MAAf,wHAEJ,oBAAIA,WAAW,MAAf,kIAAuJ,oBAAIA,WAAW,MAClK,oBAAIA,WAAW,MAAf,4FAGN,+JACA,wBACE,oBAAIA,WAAW,MAAf,yPAMNJ,EAAWK,gBAAiB","file":"component---doc-components-ui-framework-introduction-md-e5d451d890c234e306d8.js","sourcesContent":["import React from 'react'\n  /* @jsx mdx */\nimport { mdx } from '@mdx-js/react';\n/* @jsx mdx */\n\nexport const _frontmatter = {\n  \"id\": \"introduction\",\n  \"title\": \"Introduction\"\n};\n\nconst makeShortcode = name => function MDXDefaultShortcode(props) {\n  console.warn(\"Component \" + name + \" was not imported, exported, or provided by MDXProvider as global scope\");\n  return <div {...props} />;\n};\n\nconst layoutProps = {\n  _frontmatter\n};\nconst MDXLayout = \"wrapper\";\nexport default function MDXContent({\n  components,\n  ...props\n}) {\n  return <MDXLayout {...layoutProps} {...props} components={components} mdxType=\"MDXLayout\">\n    <p>{`The UI Framework is the set of components within Episerver's Design System. There is a `}<a parentName=\"p\" {...{\n        \"href\": \"https://www.npmjs.com/package/@episerver/ui-framework\"\n      }}>{`package on npm`}</a>{` with a React implementation that can be used by anyone. The Interactive Demo's at the top of the component descriptions are using it.`}</p>\n    <p>{`The components exist in three phases and is noted in the component title:`}</p>\n    <ul>\n      <li parentName=\"ul\">{`Alpha: Guidelines for how the component can be used, including wireframes.`}<ul parentName=\"li\">\n          <li parentName=\"ul\">{`They lack an implementation in React that can be used right away.`}</li>\n        </ul></li>\n      <li parentName=\"ul\">{`Beta: The guidelines have gone through some more research, and there is some React implementation available.`}<ul parentName=\"li\">\n          <li parentName=\"ul\">{`The implementation is not used in any products, and can be buggy or behave differently compared to the guidelines.`}</li>\n        </ul></li>\n      <li parentName=\"ul\">{`No labeling: The guidelines are backed up by components used in some products and what is known to not work has been addressed.`}<ul parentName=\"li\">\n          <li parentName=\"ul\">{`Nothing is ever truly complete and is always subject to change given new information.`}</li>\n        </ul></li>\n    </ul>\n    <p>{`There is an extra stage that components go through that is visible on the Interactive Demo and the public Readme of the npm package:`}</p>\n    <ul>\n      <li parentName=\"ul\">{`Preview: As components are contributed from other teams, and has worked for them, they might not follow the same API design, or otherwise look and behave like, other components in the UI Framework. They are usable but subject to major changes.`}</li>\n    </ul>\n\n    </MDXLayout>;\n}\n;\nMDXContent.isMDXComponent = true;\n      "],"sourceRoot":""}