UNPKG

@wordpress/components

Version:
8 lines (7 loc) 6.4 kB
{ "version": 3, "sources": ["../../src/navigator/legacy.ts"], "sourcesContent": ["/**\n * Internal dependencies\n */\nimport { Navigator as InternalNavigator } from './navigator/component';\nimport { NavigatorScreen as InternalNavigatorScreen } from './navigator-screen/component';\nimport { NavigatorButton as InternalNavigatorButton } from './navigator-button/component';\nimport { NavigatorBackButton as InternalNavigatorBackButton } from './navigator-back-button/component';\nimport { NavigatorToParentButton as InternalNavigatorToParentButton } from './navigator-to-parent-button/component';\nexport { useNavigator } from './use-navigator';\n\n/**\n * The `NavigatorProvider` component allows rendering nested views/panels/menus\n * (via the `NavigatorScreen` component and navigate between them\n * (via the `NavigatorButton` and `NavigatorBackButton` components).\n *\n * ```jsx\n * import {\n * __experimentalNavigatorProvider as NavigatorProvider,\n * __experimentalNavigatorScreen as NavigatorScreen,\n * __experimentalNavigatorButton as NavigatorButton,\n * __experimentalNavigatorBackButton as NavigatorBackButton,\n * } from '@wordpress/components';\n *\n * const MyNavigation = () => (\n * <NavigatorProvider initialPath=\"/\">\n * <NavigatorScreen path=\"/\">\n * <p>This is the home screen.</p>\n * <NavigatorButton path=\"/child\">\n * Navigate to child screen.\n * </NavigatorButton>\n * </NavigatorScreen>\n *\n * <NavigatorScreen path=\"/child\">\n * <p>This is the child screen.</p>\n * <NavigatorBackButton>\n * Go back\n * </NavigatorBackButton>\n * </NavigatorScreen>\n * </NavigatorProvider>\n * );\n * ```\n */\nexport const NavigatorProvider = Object.assign(InternalNavigator, {\n displayName: 'NavigatorProvider'\n});\n\n/**\n * The `NavigatorScreen` component represents a single view/screen/panel and\n * should be used in combination with the `NavigatorProvider`, the\n * `NavigatorButton` and the `NavigatorBackButton` components.\n *\n * @example\n * ```jsx\n * import {\n * __experimentalNavigatorProvider as NavigatorProvider,\n * __experimentalNavigatorScreen as NavigatorScreen,\n * __experimentalNavigatorButton as NavigatorButton,\n * __experimentalNavigatorBackButton as NavigatorBackButton,\n * } from '@wordpress/components';\n *\n * const MyNavigation = () => (\n * <NavigatorProvider initialPath=\"/\">\n * <NavigatorScreen path=\"/\">\n * <p>This is the home screen.</p>\n * <NavigatorButton path=\"/child\">\n * Navigate to child screen.\n * </NavigatorButton>\n * </NavigatorScreen>\n *\n * <NavigatorScreen path=\"/child\">\n * <p>This is the child screen.</p>\n * <NavigatorBackButton>\n * Go back\n * </NavigatorBackButton>\n * </NavigatorScreen>\n * </NavigatorProvider>\n * );\n * ```\n */\nexport const NavigatorScreen = Object.assign(InternalNavigatorScreen, {\n displayName: 'NavigatorScreen'\n});\n\n/**\n * The `NavigatorButton` component can be used to navigate to a screen and should\n * be used in combination with the `NavigatorProvider`, the `NavigatorScreen`\n * and the `NavigatorBackButton` components.\n *\n * @example\n * ```jsx\n * import {\n * __experimentalNavigatorProvider as NavigatorProvider,\n * __experimentalNavigatorScreen as NavigatorScreen,\n * __experimentalNavigatorButton as NavigatorButton,\n * __experimentalNavigatorBackButton as NavigatorBackButton,\n * } from '@wordpress/components';\n *\n * const MyNavigation = () => (\n * <NavigatorProvider initialPath=\"/\">\n * <NavigatorScreen path=\"/\">\n * <p>This is the home screen.</p>\n * <NavigatorButton path=\"/child\">\n * Navigate to child screen.\n * </NavigatorButton>\n * </NavigatorScreen>\n *\n * <NavigatorScreen path=\"/child\">\n * <p>This is the child screen.</p>\n * <NavigatorBackButton>\n * Go back\n * </NavigatorBackButton>\n * </NavigatorScreen>\n * </NavigatorProvider>\n * );\n * ```\n */\nexport const NavigatorButton = Object.assign(InternalNavigatorButton, {\n displayName: 'NavigatorButton'\n});\n\n/**\n * The `NavigatorBackButton` component can be used to navigate to a screen and\n * should be used in combination with the `NavigatorProvider`, the\n * `NavigatorScreen` and the `NavigatorButton` components.\n *\n * @example\n * ```jsx\n * import {\n * __experimentalNavigatorProvider as NavigatorProvider,\n * __experimentalNavigatorScreen as NavigatorScreen,\n * __experimentalNavigatorButton as NavigatorButton,\n * __experimentalNavigatorBackButton as NavigatorBackButton,\n * } from '@wordpress/components';\n *\n * const MyNavigation = () => (\n * <NavigatorProvider initialPath=\"/\">\n * <NavigatorScreen path=\"/\">\n * <p>This is the home screen.</p>\n * <NavigatorButton path=\"/child\">\n * Navigate to child screen.\n * </NavigatorButton>\n * </NavigatorScreen>\n *\n * <NavigatorScreen path=\"/child\">\n * <p>This is the child screen.</p>\n * <NavigatorBackButton>\n * Go back (to parent)\n * </NavigatorBackButton>\n * </NavigatorScreen>\n * </NavigatorProvider>\n * );\n * ```\n */\nexport const NavigatorBackButton = Object.assign(InternalNavigatorBackButton, {\n displayName: 'NavigatorBackButton'\n});\n\n/**\n * _Note: this component is deprecated. Please use the `NavigatorBackButton`\n * component instead._\n *\n * @deprecated\n */\nexport const NavigatorToParentButton = Object.assign(InternalNavigatorToParentButton, {\n displayName: 'NavigatorToParentButton'\n});"], "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,uBAA+C;AAC/C,IAAAA,oBAA2D;AAC3D,IAAAA,oBAA2D;AAC3D,IAAAA,oBAAmE;AACnE,IAAAA,oBAA2E;AAC3E,2BAA6B;AAkCtB,IAAM,oBAAoB,OAAO,OAAO,iBAAAC,WAAmB;AAAA,EAChE,aAAa;AACf,CAAC;AAmCM,IAAM,kBAAkB,OAAO,OAAO,kBAAAC,iBAAyB;AAAA,EACpE,aAAa;AACf,CAAC;AAmCM,IAAM,kBAAkB,OAAO,OAAO,kBAAAC,iBAAyB;AAAA,EACpE,aAAa;AACf,CAAC;AAmCM,IAAM,sBAAsB,OAAO,OAAO,kBAAAC,qBAA6B;AAAA,EAC5E,aAAa;AACf,CAAC;AAQM,IAAM,0BAA0B,OAAO,OAAO,kBAAAC,yBAAiC;AAAA,EACpF,aAAa;AACf,CAAC;", "names": ["import_component", "InternalNavigator", "InternalNavigatorScreen", "InternalNavigatorButton", "InternalNavigatorBackButton", "InternalNavigatorToParentButton"] }