@wordpress/components 19.4.0 → 19.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +16 -1
- package/CONTRIBUTING.md +69 -2
- package/build/box-control/unit-control.js +2 -2
- package/build/box-control/unit-control.js.map +1 -1
- package/build/card/card/component.js +2 -2
- package/build/card/card/component.js.map +1 -1
- package/build/card/card-body/component.js +1 -1
- package/build/card/card-body/component.js.map +1 -1
- package/build/card/card-divider/component.js +1 -1
- package/build/card/card-divider/component.js.map +1 -1
- package/build/card/card-footer/component.js +1 -1
- package/build/card/card-footer/component.js.map +1 -1
- package/build/card/card-header/component.js +1 -1
- package/build/card/card-header/component.js.map +1 -1
- package/build/card/card-media/component.js +1 -1
- package/build/card/card-media/component.js.map +1 -1
- package/build/color-palette/index.native.js +35 -30
- package/build/color-palette/index.native.js.map +1 -1
- package/build/color-picker/component.js.map +1 -1
- package/build/color-picker/hex-input.js +6 -9
- package/build/color-picker/hex-input.js.map +1 -1
- package/build/confirm-dialog/component.js.map +1 -1
- package/build/divider/component.js.map +1 -1
- package/build/elevation/component.js +1 -1
- package/build/elevation/component.js.map +1 -1
- package/build/flex/flex/component.js +1 -1
- package/build/flex/flex/component.js.map +1 -1
- package/build/flex/flex-block/component.js +1 -1
- package/build/flex/flex-block/component.js.map +1 -1
- package/build/flex/flex-item/component.js +1 -1
- package/build/flex/flex-item/component.js.map +1 -1
- package/build/flyout/flyout/component.js +1 -1
- package/build/flyout/flyout/component.js.map +1 -1
- package/build/flyout/flyout-content/component.js +1 -1
- package/build/flyout/flyout-content/component.js.map +1 -1
- package/build/focal-point-picker/index.js +18 -12
- package/build/focal-point-picker/index.js.map +1 -1
- package/build/font-size-picker/index.js +0 -1
- package/build/font-size-picker/index.js.map +1 -1
- package/build/grid/component.js +1 -1
- package/build/grid/component.js.map +1 -1
- package/build/h-stack/component.js +1 -1
- package/build/h-stack/component.js.map +1 -1
- package/build/heading/component.js.map +1 -1
- package/build/index.js +12 -0
- package/build/index.js.map +1 -1
- package/build/index.native.js +15 -1
- package/build/index.native.js.map +1 -1
- package/build/input-control/index.js.map +1 -1
- package/build/input-control/input-base.js.map +1 -1
- package/build/input-control/input-field.js +7 -7
- package/build/input-control/input-field.js.map +1 -1
- package/build/input-control/reducer/reducer.js +3 -0
- package/build/input-control/reducer/reducer.js.map +1 -1
- package/build/item-group/item/component.js.map +1 -1
- package/build/item-group/item-group/component.js.map +1 -1
- package/build/mobile/bottom-sheet/bottom-sheet-navigation/navigation-screen.native.js +1 -1
- package/build/mobile/bottom-sheet/bottom-sheet-navigation/navigation-screen.native.js.map +1 -1
- package/build/mobile/color-settings/palette.screen.native.js +26 -9
- package/build/mobile/color-settings/palette.screen.native.js.map +1 -1
- package/build/mobile/global-styles-context/utils.native.js +63 -9
- package/build/mobile/global-styles-context/utils.native.js.map +1 -1
- package/build/mobile/inserter-button/index.native.js +3 -3
- package/build/mobile/inserter-button/index.native.js.map +1 -1
- package/build/mobile/inserter-button/sparkles.js +25 -0
- package/build/mobile/inserter-button/sparkles.js.map +1 -0
- package/build/navigator/index.js +16 -0
- package/build/navigator/index.js.map +1 -1
- package/build/navigator/navigator-back-button/component.js +72 -0
- package/build/navigator/navigator-back-button/component.js.map +1 -0
- package/build/navigator/navigator-back-button/hook.js +49 -0
- package/build/navigator/navigator-back-button/hook.js.map +1 -0
- package/build/navigator/navigator-back-button/index.js +16 -0
- package/build/navigator/navigator-back-button/index.js.map +1 -0
- package/build/navigator/navigator-button/component.js +71 -0
- package/build/navigator/navigator-button/component.js.map +1 -0
- package/build/navigator/navigator-button/hook.js +59 -0
- package/build/navigator/navigator-button/hook.js.map +1 -0
- package/build/navigator/navigator-button/index.js +16 -0
- package/build/navigator/navigator-button/index.js.map +1 -0
- package/build/navigator/navigator-provider/component.js +11 -21
- package/build/navigator/navigator-provider/component.js.map +1 -1
- package/build/navigator/navigator-screen/component.js +14 -22
- package/build/navigator/navigator-screen/component.js.map +1 -1
- package/build/resizable-box/index.js.map +1 -1
- package/build/resizable-box/resize-tooltip/index.js.map +1 -1
- package/build/resizable-box/resize-tooltip/label.js.map +1 -1
- package/build/scrollable/component.js +1 -1
- package/build/scrollable/component.js.map +1 -1
- package/build/select-control/index.js.map +1 -1
- package/build/spacer/component.js.map +1 -1
- package/build/surface/component.js +1 -1
- package/build/surface/component.js.map +1 -1
- package/build/text/component.js +1 -1
- package/build/text/component.js.map +1 -1
- package/build/text-control/index.js +2 -2
- package/build/text-control/index.js.map +1 -1
- package/build/toggle-group-control/toggle-group-control/component.js.map +1 -1
- package/build/toggle-group-control/toggle-group-control-option/component.js.map +1 -1
- package/build/tools-panel/tools-panel/component.js.map +1 -1
- package/build/tools-panel/tools-panel-header/component.js.map +1 -1
- package/build/tools-panel/tools-panel-item/component.js.map +1 -1
- package/build/tree-grid/index.js +50 -6
- package/build/tree-grid/index.js.map +1 -1
- package/build/truncate/component.js +1 -1
- package/build/truncate/component.js.map +1 -1
- package/build/ui/control-group/component.js +1 -1
- package/build/ui/control-group/component.js.map +1 -1
- package/build/ui/control-label/component.js +1 -1
- package/build/ui/control-label/component.js.map +1 -1
- package/build/ui/form-group/form-group.js +1 -1
- package/build/ui/form-group/form-group.js.map +1 -1
- package/build/ui/shortcut/component.js.map +1 -1
- package/build/ui/spinner/component.js +1 -1
- package/build/ui/spinner/component.js.map +1 -1
- package/build/ui/tooltip/component.js +1 -1
- package/build/ui/tooltip/component.js.map +1 -1
- package/build/ui/tooltip/content.js +1 -1
- package/build/ui/tooltip/content.js.map +1 -1
- package/build/unit-control/index.js.map +1 -1
- package/build/v-stack/component.js +1 -1
- package/build/v-stack/component.js.map +1 -1
- package/build/visually-hidden/component.js +1 -1
- package/build/visually-hidden/component.js.map +1 -1
- package/build/z-stack/component.js.map +1 -1
- package/build-module/box-control/unit-control.js +1 -1
- package/build-module/box-control/unit-control.js.map +1 -1
- package/build-module/card/card/component.js +2 -2
- package/build-module/card/card/component.js.map +1 -1
- package/build-module/card/card-body/component.js +1 -1
- package/build-module/card/card-body/component.js.map +1 -1
- package/build-module/card/card-divider/component.js +1 -1
- package/build-module/card/card-divider/component.js.map +1 -1
- package/build-module/card/card-footer/component.js +1 -1
- package/build-module/card/card-footer/component.js.map +1 -1
- package/build-module/card/card-header/component.js +1 -1
- package/build-module/card/card-header/component.js.map +1 -1
- package/build-module/card/card-media/component.js +1 -1
- package/build-module/card/card-media/component.js.map +1 -1
- package/build-module/color-palette/index.native.js +36 -31
- package/build-module/color-palette/index.native.js.map +1 -1
- package/build-module/color-picker/component.js.map +1 -1
- package/build-module/color-picker/hex-input.js +6 -9
- package/build-module/color-picker/hex-input.js.map +1 -1
- package/build-module/confirm-dialog/component.js.map +1 -1
- package/build-module/divider/component.js.map +1 -1
- package/build-module/elevation/component.js +1 -1
- package/build-module/elevation/component.js.map +1 -1
- package/build-module/flex/flex/component.js +1 -1
- package/build-module/flex/flex/component.js.map +1 -1
- package/build-module/flex/flex-block/component.js +1 -1
- package/build-module/flex/flex-block/component.js.map +1 -1
- package/build-module/flex/flex-item/component.js +1 -1
- package/build-module/flex/flex-item/component.js.map +1 -1
- package/build-module/flyout/flyout/component.js +1 -1
- package/build-module/flyout/flyout/component.js.map +1 -1
- package/build-module/flyout/flyout-content/component.js +1 -1
- package/build-module/flyout/flyout-content/component.js.map +1 -1
- package/build-module/focal-point-picker/index.js +18 -12
- package/build-module/focal-point-picker/index.js.map +1 -1
- package/build-module/font-size-picker/index.js +0 -1
- package/build-module/font-size-picker/index.js.map +1 -1
- package/build-module/grid/component.js +1 -1
- package/build-module/grid/component.js.map +1 -1
- package/build-module/h-stack/component.js +1 -1
- package/build-module/h-stack/component.js.map +1 -1
- package/build-module/heading/component.js.map +1 -1
- package/build-module/index.js +1 -1
- package/build-module/index.js.map +1 -1
- package/build-module/index.native.js +1 -1
- package/build-module/index.native.js.map +1 -1
- package/build-module/input-control/index.js.map +1 -1
- package/build-module/input-control/input-base.js.map +1 -1
- package/build-module/input-control/input-field.js +6 -6
- package/build-module/input-control/input-field.js.map +1 -1
- package/build-module/input-control/reducer/reducer.js +3 -0
- package/build-module/input-control/reducer/reducer.js.map +1 -1
- package/build-module/item-group/item/component.js.map +1 -1
- package/build-module/item-group/item-group/component.js.map +1 -1
- package/build-module/mobile/bottom-sheet/bottom-sheet-navigation/navigation-screen.native.js +1 -1
- package/build-module/mobile/bottom-sheet/bottom-sheet-navigation/navigation-screen.native.js.map +1 -1
- package/build-module/mobile/color-settings/palette.screen.native.js +27 -10
- package/build-module/mobile/color-settings/palette.screen.native.js.map +1 -1
- package/build-module/mobile/global-styles-context/utils.native.js +60 -10
- package/build-module/mobile/global-styles-context/utils.native.js.map +1 -1
- package/build-module/mobile/inserter-button/index.native.js +1 -1
- package/build-module/mobile/inserter-button/index.native.js.map +1 -1
- package/build-module/mobile/inserter-button/sparkles.js +16 -0
- package/build-module/mobile/inserter-button/sparkles.js.map +1 -0
- package/build-module/navigator/index.js +2 -0
- package/build-module/navigator/index.js.map +1 -1
- package/build-module/navigator/navigator-back-button/component.js +59 -0
- package/build-module/navigator/navigator-back-button/component.js.map +1 -0
- package/build-module/navigator/navigator-back-button/hook.js +36 -0
- package/build-module/navigator/navigator-back-button/hook.js.map +1 -0
- package/build-module/navigator/navigator-back-button/index.js +2 -0
- package/build-module/navigator/navigator-back-button/index.js.map +1 -0
- package/build-module/navigator/navigator-button/component.js +58 -0
- package/build-module/navigator/navigator-button/component.js.map +1 -0
- package/build-module/navigator/navigator-button/hook.js +46 -0
- package/build-module/navigator/navigator-button/hook.js.map +1 -0
- package/build-module/navigator/navigator-button/index.js +2 -0
- package/build-module/navigator/navigator-button/index.js.map +1 -0
- package/build-module/navigator/navigator-provider/component.js +11 -21
- package/build-module/navigator/navigator-provider/component.js.map +1 -1
- package/build-module/navigator/navigator-screen/component.js +13 -22
- package/build-module/navigator/navigator-screen/component.js.map +1 -1
- package/build-module/resizable-box/index.js.map +1 -1
- package/build-module/resizable-box/resize-tooltip/index.js.map +1 -1
- package/build-module/resizable-box/resize-tooltip/label.js.map +1 -1
- package/build-module/scrollable/component.js +1 -1
- package/build-module/scrollable/component.js.map +1 -1
- package/build-module/select-control/index.js +1 -1
- package/build-module/select-control/index.js.map +1 -1
- package/build-module/spacer/component.js.map +1 -1
- package/build-module/surface/component.js +1 -1
- package/build-module/surface/component.js.map +1 -1
- package/build-module/text/component.js +1 -1
- package/build-module/text/component.js.map +1 -1
- package/build-module/text-control/index.js +2 -2
- package/build-module/text-control/index.js.map +1 -1
- package/build-module/toggle-group-control/toggle-group-control/component.js.map +1 -1
- package/build-module/toggle-group-control/toggle-group-control-option/component.js.map +1 -1
- package/build-module/tools-panel/tools-panel/component.js.map +1 -1
- package/build-module/tools-panel/tools-panel-header/component.js.map +1 -1
- package/build-module/tools-panel/tools-panel-item/component.js.map +1 -1
- package/build-module/tree-grid/index.js +51 -7
- package/build-module/tree-grid/index.js.map +1 -1
- package/build-module/truncate/component.js +1 -1
- package/build-module/truncate/component.js.map +1 -1
- package/build-module/ui/control-group/component.js +1 -1
- package/build-module/ui/control-group/component.js.map +1 -1
- package/build-module/ui/control-label/component.js +1 -1
- package/build-module/ui/control-label/component.js.map +1 -1
- package/build-module/ui/form-group/form-group.js +1 -1
- package/build-module/ui/form-group/form-group.js.map +1 -1
- package/build-module/ui/shortcut/component.js.map +1 -1
- package/build-module/ui/spinner/component.js +1 -1
- package/build-module/ui/spinner/component.js.map +1 -1
- package/build-module/ui/tooltip/component.js +1 -1
- package/build-module/ui/tooltip/component.js.map +1 -1
- package/build-module/ui/tooltip/content.js +1 -1
- package/build-module/ui/tooltip/content.js.map +1 -1
- package/build-module/unit-control/index.js.map +1 -1
- package/build-module/v-stack/component.js +1 -1
- package/build-module/v-stack/component.js.map +1 -1
- package/build-module/visually-hidden/component.js +1 -1
- package/build-module/visually-hidden/component.js.map +1 -1
- package/build-module/z-stack/component.js.map +1 -1
- package/build-types/card/card-divider/hook.d.ts +0 -1
- package/build-types/card/card-divider/hook.d.ts.map +1 -1
- package/build-types/color-picker/styles.d.ts +2 -4
- package/build-types/color-picker/styles.d.ts.map +1 -1
- package/build-types/confirm-dialog/component.d.ts +2 -6
- package/build-types/confirm-dialog/component.d.ts.map +1 -1
- package/build-types/flyout/flyout/hook.d.ts +0 -1
- package/build-types/flyout/flyout/hook.d.ts.map +1 -1
- package/build-types/input-control/index.d.ts +3 -3
- package/build-types/input-control/index.d.ts.map +1 -1
- package/build-types/input-control/input-base.d.ts +2 -2
- package/build-types/input-control/input-base.d.ts.map +1 -1
- package/build-types/input-control/input-field.d.ts +1 -3
- package/build-types/input-control/input-field.d.ts.map +1 -1
- package/build-types/input-control/reducer/reducer.d.ts.map +1 -1
- package/build-types/input-control/types.d.ts +1 -1
- package/build-types/input-control/types.d.ts.map +1 -1
- package/build-types/navigator/index.d.ts +2 -0
- package/build-types/navigator/index.d.ts.map +1 -1
- package/build-types/navigator/navigator-back-button/component.d.ts +38 -0
- package/build-types/navigator/navigator-back-button/component.d.ts.map +1 -0
- package/build-types/navigator/navigator-back-button/hook.d.ts +282 -0
- package/build-types/navigator/navigator-back-button/hook.d.ts.map +1 -0
- package/build-types/navigator/navigator-back-button/index.d.ts +2 -0
- package/build-types/navigator/navigator-back-button/index.d.ts.map +1 -0
- package/build-types/navigator/navigator-button/component.d.ts +37 -0
- package/build-types/navigator/navigator-button/component.d.ts.map +1 -0
- package/build-types/navigator/navigator-button/hook.d.ts +282 -0
- package/build-types/navigator/navigator-button/hook.d.ts.map +1 -0
- package/build-types/navigator/navigator-button/index.d.ts +2 -0
- package/build-types/navigator/navigator-button/index.d.ts.map +1 -0
- package/build-types/navigator/navigator-provider/component.d.ts +10 -20
- package/build-types/navigator/navigator-provider/component.d.ts.map +1 -1
- package/build-types/navigator/navigator-screen/component.d.ts +10 -20
- package/build-types/navigator/navigator-screen/component.d.ts.map +1 -1
- package/build-types/navigator/types.d.ts +21 -0
- package/build-types/navigator/types.d.ts.map +1 -1
- package/build-types/number-control/styles/number-control-styles.d.ts +1 -1
- package/build-types/resizable-box/index.d.ts +2 -2
- package/build-types/resizable-box/index.d.ts.map +1 -1
- package/build-types/resizable-box/resize-tooltip/index.d.ts.map +1 -1
- package/build-types/select-control/index.d.ts +1 -3
- package/build-types/select-control/index.d.ts.map +1 -1
- package/build-types/ui/context/wordpress-component.d.ts +2 -6
- package/build-types/ui/context/wordpress-component.d.ts.map +1 -1
- package/build-types/unit-control/index.d.ts +1 -3
- package/build-types/unit-control/index.d.ts.map +1 -1
- package/build-types/z-stack/component.d.ts.map +1 -1
- package/package.json +8 -7
- package/src/alignment-matrix-control/README.md +4 -0
- package/src/alignment-matrix-control/stories/index.js +1 -1
- package/src/base-control/stories/index.js +65 -22
- package/src/box-control/stories/index.js +4 -1
- package/src/box-control/unit-control.js +1 -1
- package/src/card/card/component.js +1 -1
- package/src/card/card-body/component.js +1 -1
- package/src/card/card-divider/component.js +1 -1
- package/src/card/card-footer/component.js +1 -1
- package/src/card/card-header/component.js +1 -1
- package/src/card/card-media/component.js +1 -1
- package/src/color-palette/index.native.js +92 -75
- package/src/color-palette/style.native.scss +10 -5
- package/src/color-picker/component.tsx +2 -2
- package/src/color-picker/hex-input.tsx +9 -9
- package/src/confirm-dialog/component.tsx +2 -2
- package/src/divider/component.tsx +2 -2
- package/src/elevation/component.js +1 -1
- package/src/flex/flex/component.js +1 -1
- package/src/flex/flex-block/component.js +1 -1
- package/src/flex/flex-item/component.js +1 -1
- package/src/flyout/flyout/component.js +1 -1
- package/src/flyout/flyout-content/component.js +1 -1
- package/src/focal-point-picker/README.md +7 -0
- package/src/focal-point-picker/index.js +12 -7
- package/src/focal-point-picker/stories/index.js +30 -0
- package/src/focal-point-picker/test/index.js +44 -0
- package/src/font-size-picker/index.js +0 -1
- package/src/form-file-upload/README.md +1 -1
- package/src/form-file-upload/stories/index.js +51 -0
- package/src/grid/component.js +1 -1
- package/src/h-stack/component.js +1 -1
- package/src/heading/component.tsx +2 -2
- package/src/index.js +2 -0
- package/src/index.native.js +5 -1
- package/src/input-control/index.tsx +2 -2
- package/src/input-control/input-base.tsx +2 -2
- package/src/input-control/input-field.tsx +4 -6
- package/src/input-control/reducer/reducer.ts +3 -0
- package/src/input-control/stories/index.js +1 -1
- package/src/input-control/types.ts +1 -1
- package/src/item-group/item/component.tsx +2 -2
- package/src/item-group/item-group/component.tsx +2 -2
- package/src/mobile/bottom-sheet/bottom-sheet-navigation/navigation-screen.native.js +10 -1
- package/src/mobile/color-settings/palette.screen.native.js +39 -9
- package/src/mobile/color-settings/style.native.scss +4 -0
- package/src/mobile/global-styles-context/test/fixtures/theme.native.js +27 -0
- package/src/mobile/global-styles-context/test/utils.native.js +2 -2
- package/src/mobile/global-styles-context/utils.native.js +75 -6
- package/src/mobile/inserter-button/index.native.js +1 -2
- package/src/mobile/inserter-button/sparkles.js +15 -0
- package/src/navigation/stories/index.js +1 -1
- package/src/navigator/index.ts +2 -0
- package/src/navigator/navigator-back-button/README.md +31 -0
- package/src/navigator/navigator-back-button/component.tsx +62 -0
- package/src/navigator/navigator-back-button/hook.ts +40 -0
- package/src/navigator/navigator-back-button/index.ts +1 -0
- package/src/navigator/navigator-button/README.md +38 -0
- package/src/navigator/navigator-button/component.tsx +61 -0
- package/src/navigator/navigator-button/hook.ts +55 -0
- package/src/navigator/navigator-button/index.ts +1 -0
- package/src/navigator/navigator-provider/README.md +20 -33
- package/src/navigator/navigator-provider/component.tsx +12 -22
- package/src/navigator/navigator-screen/README.md +1 -1
- package/src/navigator/navigator-screen/component.tsx +14 -23
- package/src/navigator/stories/index.js +24 -37
- package/src/navigator/test/index.js +89 -34
- package/src/navigator/types.ts +26 -0
- package/src/number-control/stories/index.js +1 -1
- package/src/radio/stories/index.js +1 -1
- package/src/radio-group/stories/index.js +4 -1
- package/src/resizable-box/index.tsx +2 -2
- package/src/resizable-box/resize-tooltip/index.tsx +2 -2
- package/src/resizable-box/resize-tooltip/label.tsx +2 -2
- package/src/scrollable/component.js +1 -1
- package/src/select-control/index.tsx +2 -3
- package/src/spacer/component.tsx +2 -2
- package/src/surface/component.js +1 -1
- package/src/text/component.js +1 -1
- package/src/text-control/index.js +2 -2
- package/src/toggle-group-control/stories/index.js +1 -1
- package/src/toggle-group-control/toggle-group-control/component.tsx +2 -2
- package/src/toggle-group-control/toggle-group-control-option/component.tsx +2 -2
- package/src/tools-panel/stories/index.js +0 -1
- package/src/tools-panel/tools-panel/component.tsx +2 -2
- package/src/tools-panel/tools-panel-header/component.tsx +2 -2
- package/src/tools-panel/tools-panel-item/component.tsx +2 -2
- package/src/tree-grid/README.md +24 -1
- package/src/tree-grid/index.js +66 -7
- package/src/tree-grid/stories/index.js +4 -1
- package/src/tree-grid/test/__snapshots__/index.js.snap +1 -14
- package/src/tree-grid/test/index.js +226 -7
- package/src/truncate/component.js +1 -1
- package/src/ui/context/wordpress-component.ts +2 -2
- package/src/ui/control-group/component.js +1 -1
- package/src/ui/control-label/component.js +1 -1
- package/src/ui/form-group/form-group.js +1 -1
- package/src/ui/shortcut/component.tsx +2 -2
- package/src/ui/spinner/component.js +1 -1
- package/src/ui/tooltip/component.js +1 -1
- package/src/ui/tooltip/content.js +1 -1
- package/src/unit-control/index.tsx +2 -2
- package/src/unit-control/stories/index.js +1 -1
- package/src/v-stack/component.js +1 -1
- package/src/visually-hidden/component.js +1 -1
- package/src/z-stack/component.tsx +2 -2
- package/tsconfig.tsbuildinfo +1 -1
- package/src/tools-panel/stories/typography-panel.js +0 -215
|
@@ -12,13 +12,13 @@ import { Component } from '@wordpress/element';
|
|
|
12
12
|
import { Icon } from '@wordpress/components';
|
|
13
13
|
import { withPreferredColorScheme } from '@wordpress/compose';
|
|
14
14
|
import { __, sprintf } from '@wordpress/i18n';
|
|
15
|
-
import { sparkles } from '@wordpress/icons';
|
|
16
15
|
import { BlockIcon } from '@wordpress/block-editor';
|
|
17
16
|
/**
|
|
18
17
|
* Internal dependencies
|
|
19
18
|
*/
|
|
20
19
|
|
|
21
20
|
import styles from './style.scss';
|
|
21
|
+
import sparkles from './sparkles';
|
|
22
22
|
|
|
23
23
|
class MenuItem extends Component {
|
|
24
24
|
constructor() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/mobile/inserter-button/index.native.js"],"names":["View","TouchableHighlight","Text","Component","Icon","withPreferredColorScheme","__","sprintf","
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/mobile/inserter-button/index.native.js"],"names":["View","TouchableHighlight","Text","Component","Icon","withPreferredColorScheme","__","sprintf","BlockIcon","styles","sparkles","MenuItem","constructor","arguments","onPress","bind","onSelect","item","props","render","getStylesFromColorScheme","itemWidth","maxWidth","modalIconWrapperStyle","modalIconWrapper","modalIconWrapperDark","modalIconStyle","modalIcon","modalItemLabelStyle","modalItemLabel","modalItemLabelDark","clipboardBlockStyles","clipboardBlock","clipboardBlockDark","isClipboardBlock","id","blockTitle","title","blockIsNew","isNew","accessibilityLabelFormat","accessibilityLabel","touchableArea","isDisabled","disabled","modalItem","width","newIndicator","icon","InserterButton","Styles"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,IAAT,EAAeC,kBAAf,EAAmCC,IAAnC,QAA+C,cAA/C;AAEA;AACA;AACA;;AACA,SAASC,SAAT,QAA0B,oBAA1B;AACA,SAASC,IAAT,QAAqB,uBAArB;AACA,SAASC,wBAAT,QAAyC,oBAAzC;AACA,SAASC,EAAT,EAAaC,OAAb,QAA4B,iBAA5B;AACA,SAASC,SAAT,QAA0B,yBAA1B;AAEA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,cAAnB;AACA,OAAOC,QAAP,MAAqB,YAArB;;AACA,MAAMC,QAAN,SAAuBR,SAAvB,CAAiC;AAChCS,EAAAA,WAAW,GAAG;AACb,UAAO,GAAGC,SAAV;AAEA,SAAKC,OAAL,GAAe,KAAKA,OAAL,CAAaC,IAAb,CAAmB,IAAnB,CAAf;AACA;;AAEDD,EAAAA,OAAO,GAAG;AACT,UAAM;AAAEE,MAAAA,QAAF;AAAYC,MAAAA;AAAZ,QAAqB,KAAKC,KAAhC;AACAF,IAAAA,QAAQ,CAAEC,IAAF,CAAR;AACA;;AAEDE,EAAAA,MAAM,GAAG;AACR,UAAM;AACLC,MAAAA,wBADK;AAELH,MAAAA,IAFK;AAGLI,MAAAA,SAHK;AAILC,MAAAA;AAJK,QAKF,KAAKJ,KALT;AAOA,UAAMK,qBAAqB,GAAGH,wBAAwB,CACrDX,MAAM,CAACe,gBAD8C,EAErDf,MAAM,CAACgB,oBAF8C,CAAtD;AAIA,UAAMC,cAAc,GAAGjB,MAAM,CAACkB,SAA9B;AACA,UAAMC,mBAAmB,GAAGR,wBAAwB,CACnDX,MAAM,CAACoB,cAD4C,EAEnDpB,MAAM,CAACqB,kBAF4C,CAApD;AAKA,UAAMC,oBAAoB,GAAGX,wBAAwB,CACpDX,MAAM,CAACuB,cAD6C,EAEpDvB,MAAM,CAACwB,kBAF6C,CAArD;AAKA,UAAMC,gBAAgB,GAAGjB,IAAI,CAACkB,EAAL,KAAY,WAArC;AACA,UAAMC,UAAU,GAAGF,gBAAgB,GAAG5B,EAAE,CAAE,cAAF,CAAL,GAA0BW,IAAI,CAACoB,KAAlE;AACA,UAAMC,UAAU,GAAGrB,IAAI,CAACsB,KAAL,KAAe,IAAlC;AACA,UAAMC,wBAAwB,GAAGF,UAAU,GACxC;AACAhC,IAAAA,EAAE,CAAE,2BAAF,CAFsC,GAGxC;AACAA,IAAAA,EAAE,CAAE,UAAF,CAJL;AAKA,UAAMmC,kBAAkB,GAAGlC,OAAO,CACjCiC,wBADiC,EAEjCvB,IAAI,CAACoB,KAF4B,CAAlC;AAKA,WACC,cAAC,kBAAD;AACC,MAAA,KAAK,EAAG,CACP5B,MAAM,CAACiC,aADA,EAEPzB,IAAI,CAAC0B,UAAL,GAAkBlC,MAAM,CAACmC,QAAzB,GAAoC,IAF7B,CADT;AAKC,MAAA,aAAa,EAAC,aALf;AAMC,MAAA,aAAa,EAAG,GANjB;AAOC,MAAA,iBAAiB,EAAC,QAPnB;AAQC,MAAA,kBAAkB,EAAGH,kBARtB;AASC,MAAA,OAAO,EAAG,KAAK3B,OAThB;AAUC,MAAA,QAAQ,EAAGG,IAAI,CAAC0B;AAVjB,OAYC,cAAC,IAAD;AAAM,MAAA,KAAK,EAAG,CAAElC,MAAM,CAACoC,SAAT,EAAoB;AAAEC,QAAAA,KAAK,EAAExB;AAAT,OAApB;AAAd,OACC,cAAC,IAAD;AACC,MAAA,KAAK,EAAG,CACPC,qBADO,EAEPF,SAAS,IAAI;AACZyB,QAAAA,KAAK,EAAEzB;AADK,OAFN,EAKPa,gBAAgB,IAAIH,oBALb;AADT,OASGO,UAAU,IACX,cAAC,IAAD;AACC,MAAA,IAAI,EAAG5B,QADR;AAEC,MAAA,KAAK,EAAGD,MAAM,CAACsC;AAFhB,MAVF,EAeC,cAAC,IAAD;AAAM,MAAA,KAAK,EAAGrB;AAAd,OACC,cAAC,SAAD;AACC,MAAA,IAAI,EAAGT,IAAI,CAAC+B,IADb;AAEC,MAAA,IAAI,EAAGtB,cAAc,CAACoB;AAFvB,MADD,CAfD,CADD,EAuBC,cAAC,IAAD;AAAM,MAAA,aAAa,EAAG,CAAtB;AAA0B,MAAA,KAAK,EAAGlB;AAAlC,OACGQ,UADH,CAvBD,CAZD,CADD;AA0CA;;AA1F+B;;AA6FjC,MAAMa,cAAc,GAAG5C,wBAAwB,CAAEM,QAAF,CAA/C;AAEAsC,cAAc,CAACC,MAAf,GAAwB;AACvBL,EAAAA,SAAS,EAAEpC,MAAM,CAACoC,SADK;AAEvBrB,EAAAA,gBAAgB,EAAEf,MAAM,CAACe;AAFF,CAAxB;AAKA,eAAeyB,cAAf","sourcesContent":["/**\n * External dependencies\n */\nimport { View, TouchableHighlight, Text } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { Component } from '@wordpress/element';\nimport { Icon } from '@wordpress/components';\nimport { withPreferredColorScheme } from '@wordpress/compose';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { BlockIcon } from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\nimport sparkles from './sparkles';\nclass MenuItem extends Component {\n\tconstructor() {\n\t\tsuper( ...arguments );\n\n\t\tthis.onPress = this.onPress.bind( this );\n\t}\n\n\tonPress() {\n\t\tconst { onSelect, item } = this.props;\n\t\tonSelect( item );\n\t}\n\n\trender() {\n\t\tconst {\n\t\t\tgetStylesFromColorScheme,\n\t\t\titem,\n\t\t\titemWidth,\n\t\t\tmaxWidth,\n\t\t} = this.props;\n\n\t\tconst modalIconWrapperStyle = getStylesFromColorScheme(\n\t\t\tstyles.modalIconWrapper,\n\t\t\tstyles.modalIconWrapperDark\n\t\t);\n\t\tconst modalIconStyle = styles.modalIcon;\n\t\tconst modalItemLabelStyle = getStylesFromColorScheme(\n\t\t\tstyles.modalItemLabel,\n\t\t\tstyles.modalItemLabelDark\n\t\t);\n\n\t\tconst clipboardBlockStyles = getStylesFromColorScheme(\n\t\t\tstyles.clipboardBlock,\n\t\t\tstyles.clipboardBlockDark\n\t\t);\n\n\t\tconst isClipboardBlock = item.id === 'clipboard';\n\t\tconst blockTitle = isClipboardBlock ? __( 'Copied block' ) : item.title;\n\t\tconst blockIsNew = item.isNew === true;\n\t\tconst accessibilityLabelFormat = blockIsNew\n\t\t\t? // translators: Newly available block name. %s: The localized block name\n\t\t\t __( '%s block, newly available' )\n\t\t\t: // translators: Block name. %s: The localized block name\n\t\t\t __( '%s block' );\n\t\tconst accessibilityLabel = sprintf(\n\t\t\taccessibilityLabelFormat,\n\t\t\titem.title\n\t\t);\n\n\t\treturn (\n\t\t\t<TouchableHighlight\n\t\t\t\tstyle={ [\n\t\t\t\t\tstyles.touchableArea,\n\t\t\t\t\titem.isDisabled ? styles.disabled : null,\n\t\t\t\t] }\n\t\t\t\tunderlayColor=\"transparent\"\n\t\t\t\tactiveOpacity={ 0.5 }\n\t\t\t\taccessibilityRole=\"button\"\n\t\t\t\taccessibilityLabel={ accessibilityLabel }\n\t\t\t\tonPress={ this.onPress }\n\t\t\t\tdisabled={ item.isDisabled }\n\t\t\t>\n\t\t\t\t<View style={ [ styles.modalItem, { width: maxWidth } ] }>\n\t\t\t\t\t<View\n\t\t\t\t\t\tstyle={ [\n\t\t\t\t\t\t\tmodalIconWrapperStyle,\n\t\t\t\t\t\t\titemWidth && {\n\t\t\t\t\t\t\t\twidth: itemWidth,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\tisClipboardBlock && clipboardBlockStyles,\n\t\t\t\t\t\t] }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ blockIsNew && (\n\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\ticon={ sparkles }\n\t\t\t\t\t\t\t\tstyle={ styles.newIndicator }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t<View style={ modalIconStyle }>\n\t\t\t\t\t\t\t<BlockIcon\n\t\t\t\t\t\t\t\ticon={ item.icon }\n\t\t\t\t\t\t\t\tsize={ modalIconStyle.width }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</View>\n\t\t\t\t\t</View>\n\t\t\t\t\t<Text numberOfLines={ 3 } style={ modalItemLabelStyle }>\n\t\t\t\t\t\t{ blockTitle }\n\t\t\t\t\t</Text>\n\t\t\t\t</View>\n\t\t\t</TouchableHighlight>\n\t\t);\n\t}\n}\n\nconst InserterButton = withPreferredColorScheme( MenuItem );\n\nInserterButton.Styles = {\n\tmodalItem: styles.modalItem,\n\tmodalIconWrapper: styles.modalIconWrapper,\n};\n\nexport default InserterButton;\n"]}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { createElement } from "@wordpress/element";
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* WordPress dependencies
|
|
5
|
+
*/
|
|
6
|
+
import { SVG, Path } from '@wordpress/primitives';
|
|
7
|
+
const sparkles = createElement(SVG, {
|
|
8
|
+
viewBox: "0 0 24 24",
|
|
9
|
+
fill: "none",
|
|
10
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
11
|
+
}, createElement(Path, {
|
|
12
|
+
d: "M10 11c-1.588-.479-4-.91-4-.91s2-.241 4-.454c1.8-.191 3.365-.502 4-3.181C14.635 3.775 15 1 15 1s.365 2.775 1 5.455c.635 2.679 2 2.969 4 3.181 2 .213 4 .455 4 .455s-2.412.43-4 .909c-1.588.479-3 1-4 4.546-.746 2.643-.893 4.948-1 5.454-.107-.506-.167-2.5-1-5.454C13 12 11.588 11.479 10 11zM7.333 3.5C6.803 3.333 6 3.182 6 3.182s.667-.085 1.333-.16c.6-.066 1.122-.175 1.334-1.113C8.878.971 9 0 9 0s.122.971.333 1.91c.212.937.667 1.038 1.334 1.113.666.074 1.333.159 1.333.159s-.804.15-1.333.318c-.53.167-1 .35-1.334 1.59C9.085 6.017 9.036 6.824 9 7c-.036-.177-.056-.875-.333-1.91-.334-1.24-.804-1.423-1.334-1.59zM2.444 18C1.474 17.713 0 17.454 0 17.454s1.222-.145 2.444-.272c1.1-.115 2.057-.302 2.445-1.91C5.277 13.666 5.5 12 5.5 12s.223 1.665.611 3.273c.388 1.607 1.222 1.781 2.445 1.909 1.222.127 2.444.273 2.444.273s-1.474.258-2.444.545c-.971.287-1.834.6-2.445 2.727-.456 1.586-.546 2.97-.611 3.273-.065-.304-.102-1.5-.611-3.273C4.278 18.6 3.415 18.287 2.444 18z",
|
|
13
|
+
fill: "#F0C930"
|
|
14
|
+
}));
|
|
15
|
+
export default sparkles;
|
|
16
|
+
//# sourceMappingURL=sparkles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/mobile/inserter-button/sparkles.js"],"names":["SVG","Path","sparkles"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,GAAT,EAAcC,IAAd,QAA0B,uBAA1B;AAEA,MAAMC,QAAQ,GACb,cAAC,GAAD;AAAK,EAAA,OAAO,EAAC,WAAb;AAAyB,EAAA,IAAI,EAAC,MAA9B;AAAqC,EAAA,KAAK,EAAC;AAA3C,GACC,cAAC,IAAD;AACC,EAAA,CAAC,EAAC,k8BADH;AAEC,EAAA,IAAI,EAAC;AAFN,EADD,CADD;AASA,eAAeA,QAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { SVG, Path } from '@wordpress/primitives';\n\nconst sparkles = (\n\t<SVG viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n\t\t<Path\n\t\t\td=\"M10 11c-1.588-.479-4-.91-4-.91s2-.241 4-.454c1.8-.191 3.365-.502 4-3.181C14.635 3.775 15 1 15 1s.365 2.775 1 5.455c.635 2.679 2 2.969 4 3.181 2 .213 4 .455 4 .455s-2.412.43-4 .909c-1.588.479-3 1-4 4.546-.746 2.643-.893 4.948-1 5.454-.107-.506-.167-2.5-1-5.454C13 12 11.588 11.479 10 11zM7.333 3.5C6.803 3.333 6 3.182 6 3.182s.667-.085 1.333-.16c.6-.066 1.122-.175 1.334-1.113C8.878.971 9 0 9 0s.122.971.333 1.91c.212.937.667 1.038 1.334 1.113.666.074 1.333.159 1.333.159s-.804.15-1.333.318c-.53.167-1 .35-1.334 1.59C9.085 6.017 9.036 6.824 9 7c-.036-.177-.056-.875-.333-1.91-.334-1.24-.804-1.423-1.334-1.59zM2.444 18C1.474 17.713 0 17.454 0 17.454s1.222-.145 2.444-.272c1.1-.115 2.057-.302 2.445-1.91C5.277 13.666 5.5 12 5.5 12s.223 1.665.611 3.273c.388 1.607 1.222 1.781 2.445 1.909 1.222.127 2.444.273 2.444.273s-1.474.258-2.444.545c-.971.287-1.834.6-2.445 2.727-.456 1.586-.546 2.97-.611 3.273-.065-.304-.102-1.5-.611-3.273C4.278 18.6 3.415 18.287 2.444 18z\"\n\t\t\tfill=\"#F0C930\"\n\t\t/>\n\t</SVG>\n);\n\nexport default sparkles;\n"]}
|
|
@@ -1,4 +1,6 @@
|
|
|
1
1
|
export { default as NavigatorProvider } from './navigator-provider';
|
|
2
2
|
export { default as NavigatorScreen } from './navigator-screen';
|
|
3
|
+
export { default as NavigatorButton } from './navigator-button';
|
|
4
|
+
export { default as NavigatorBackButton } from './navigator-back-button';
|
|
3
5
|
export { default as useNavigator } from './use-navigator';
|
|
4
6
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/navigator/index.ts"],"names":["default","NavigatorProvider","NavigatorScreen","useNavigator"],"mappings":"AAAA,SAASA,OAAO,IAAIC,iBAApB,QAA6C,sBAA7C;AACA,SAASD,OAAO,IAAIE,eAApB,QAA2C,oBAA3C;AACA,SAASF,OAAO,IAAIG,YAApB,QAAwC,iBAAxC","sourcesContent":["export { default as NavigatorProvider } from './navigator-provider';\nexport { default as NavigatorScreen } from './navigator-screen';\nexport { default as useNavigator } from './use-navigator';\n"]}
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/navigator/index.ts"],"names":["default","NavigatorProvider","NavigatorScreen","NavigatorButton","NavigatorBackButton","useNavigator"],"mappings":"AAAA,SAASA,OAAO,IAAIC,iBAApB,QAA6C,sBAA7C;AACA,SAASD,OAAO,IAAIE,eAApB,QAA2C,oBAA3C;AACA,SAASF,OAAO,IAAIG,eAApB,QAA2C,oBAA3C;AACA,SAASH,OAAO,IAAII,mBAApB,QAA+C,yBAA/C;AACA,SAASJ,OAAO,IAAIK,YAApB,QAAwC,iBAAxC","sourcesContent":["export { default as NavigatorProvider } from './navigator-provider';\nexport { default as NavigatorScreen } from './navigator-screen';\nexport { default as NavigatorButton } from './navigator-button';\nexport { default as NavigatorBackButton } from './navigator-back-button';\nexport { default as useNavigator } from './use-navigator';\n"]}
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
|
+
import { createElement } from "@wordpress/element";
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* External dependencies
|
|
6
|
+
*/
|
|
7
|
+
|
|
8
|
+
/**
|
|
9
|
+
* Internal dependencies
|
|
10
|
+
*/
|
|
11
|
+
import { contextConnect } from '../../ui/context';
|
|
12
|
+
import { View } from '../../view';
|
|
13
|
+
import { useNavigatorBackButton } from './hook';
|
|
14
|
+
|
|
15
|
+
function NavigatorBackButton(props, forwardedRef) {
|
|
16
|
+
const navigatorBackButtonProps = useNavigatorBackButton(props);
|
|
17
|
+
return createElement(View, _extends({
|
|
18
|
+
ref: forwardedRef
|
|
19
|
+
}, navigatorBackButtonProps));
|
|
20
|
+
}
|
|
21
|
+
/**
|
|
22
|
+
* The `NavigatorBackButton` component can be used to navigate to a screen and
|
|
23
|
+
* should be used in combination with the `NavigatorProvider`, the
|
|
24
|
+
* `NavigatorScreen` and the `NavigatorButton` components (or the `useNavigator`
|
|
25
|
+
* hook).
|
|
26
|
+
*
|
|
27
|
+
* @example
|
|
28
|
+
* ```jsx
|
|
29
|
+
* import {
|
|
30
|
+
* __experimentalNavigatorProvider as NavigatorProvider,
|
|
31
|
+
* __experimentalNavigatorScreen as NavigatorScreen,
|
|
32
|
+
* __experimentalNavigatorButton as NavigatorButton,
|
|
33
|
+
* __experimentalNavigatorBackButton as NavigatorBackButton,
|
|
34
|
+
* } from '@wordpress/components';
|
|
35
|
+
*
|
|
36
|
+
* const MyNavigation = () => (
|
|
37
|
+
* <NavigatorProvider initialPath="/">
|
|
38
|
+
* <NavigatorScreen path="/">
|
|
39
|
+
* <p>This is the home screen.</p>
|
|
40
|
+
* <NavigatorButton path="/child">
|
|
41
|
+
* Navigate to child screen.
|
|
42
|
+
* </NavigatorButton>
|
|
43
|
+
* </NavigatorScreen>
|
|
44
|
+
*
|
|
45
|
+
* <NavigatorScreen path="/child">
|
|
46
|
+
* <p>This is the child screen.</p>
|
|
47
|
+
* <NavigatorBackButton>
|
|
48
|
+
* Go back
|
|
49
|
+
* </NavigatorBackButton>
|
|
50
|
+
* </NavigatorScreen>
|
|
51
|
+
* </NavigatorProvider>
|
|
52
|
+
* );
|
|
53
|
+
* ```
|
|
54
|
+
*/
|
|
55
|
+
|
|
56
|
+
|
|
57
|
+
const ConnectedNavigatorBackButton = contextConnect(NavigatorBackButton, 'NavigatorBackButton');
|
|
58
|
+
export default ConnectedNavigatorBackButton;
|
|
59
|
+
//# sourceMappingURL=component.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/navigator/navigator-back-button/component.tsx"],"names":["contextConnect","View","useNavigatorBackButton","NavigatorBackButton","props","forwardedRef","navigatorBackButtonProps","ConnectedNavigatorBackButton"],"mappings":";;;AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,cAAT,QAAwD,kBAAxD;AACA,SAASC,IAAT,QAAqB,YAArB;AACA,SAASC,sBAAT,QAAuC,QAAvC;;AAGA,SAASC,mBAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAMC,wBAAwB,GAAGJ,sBAAsB,CAAEE,KAAF,CAAvD;AAEA,SAAO,cAAC,IAAD;AAAM,IAAA,GAAG,EAAGC;AAAZ,KAAgCC,wBAAhC,EAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAMC,4BAA4B,GAAGP,cAAc,CAClDG,mBADkD,EAElD,qBAFkD,CAAnD;AAKA,eAAeI,4BAAf","sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * Internal dependencies\n */\nimport { contextConnect, WordPressComponentProps } from '../../ui/context';\nimport { View } from '../../view';\nimport { useNavigatorBackButton } from './hook';\nimport type { NavigatorBackButtonProps } from '../types';\n\nfunction NavigatorBackButton(\n\tprops: WordPressComponentProps< NavigatorBackButtonProps, 'button' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst navigatorBackButtonProps = useNavigatorBackButton( props );\n\n\treturn <View ref={ forwardedRef } { ...navigatorBackButtonProps } />;\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 (or the `useNavigator`\n * hook).\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 */\nconst ConnectedNavigatorBackButton = contextConnect(\n\tNavigatorBackButton,\n\t'NavigatorBackButton'\n);\n\nexport default ConnectedNavigatorBackButton;\n"]}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* WordPress dependencies
|
|
3
|
+
*/
|
|
4
|
+
import { useCallback } from '@wordpress/element';
|
|
5
|
+
/**
|
|
6
|
+
* Internal dependencies
|
|
7
|
+
*/
|
|
8
|
+
|
|
9
|
+
/**
|
|
10
|
+
* Internal dependencies
|
|
11
|
+
*/
|
|
12
|
+
|
|
13
|
+
import { useContextSystem } from '../../ui/context';
|
|
14
|
+
import Button from '../../button';
|
|
15
|
+
import useNavigator from '../use-navigator';
|
|
16
|
+
export function useNavigatorBackButton(props) {
|
|
17
|
+
const {
|
|
18
|
+
onClick,
|
|
19
|
+
as = Button,
|
|
20
|
+
...otherProps
|
|
21
|
+
} = useContextSystem(props, 'NavigatorBackButton');
|
|
22
|
+
const {
|
|
23
|
+
goBack
|
|
24
|
+
} = useNavigator();
|
|
25
|
+
const handleClick = useCallback(e => {
|
|
26
|
+
e.preventDefault();
|
|
27
|
+
goBack();
|
|
28
|
+
onClick === null || onClick === void 0 ? void 0 : onClick(e);
|
|
29
|
+
}, [goBack, onClick]);
|
|
30
|
+
return {
|
|
31
|
+
as,
|
|
32
|
+
onClick: handleClick,
|
|
33
|
+
...otherProps
|
|
34
|
+
};
|
|
35
|
+
}
|
|
36
|
+
//# sourceMappingURL=hook.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/navigator/navigator-back-button/hook.ts"],"names":["useCallback","useContextSystem","Button","useNavigator","useNavigatorBackButton","props","onClick","as","otherProps","goBack","handleClick","e","preventDefault"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,WAAT,QAA4B,oBAA5B;AAEA;AACA;AACA;;AACA;AACA;AACA;;AACA,SAASC,gBAAT,QAA0D,kBAA1D;AACA,OAAOC,MAAP,MAAmB,cAAnB;AACA,OAAOC,YAAP,MAAyB,kBAAzB;AAGA,OAAO,SAASC,sBAAT,CACNC,KADM,EAEL;AACD,QAAM;AAAEC,IAAAA,OAAF;AAAWC,IAAAA,EAAE,GAAGL,MAAhB;AAAwB,OAAGM;AAA3B,MAA0CP,gBAAgB,CAC/DI,KAD+D,EAE/D,qBAF+D,CAAhE;AAKA,QAAM;AAAEI,IAAAA;AAAF,MAAaN,YAAY,EAA/B;AACA,QAAMO,WAAyD,GAAGV,WAAW,CAC1EW,CAAF,IAAS;AACRA,IAAAA,CAAC,CAACC,cAAF;AACAH,IAAAA,MAAM;AACNH,IAAAA,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO,CAAIK,CAAJ,CAAP;AACA,GAL2E,EAM5E,CAAEF,MAAF,EAAUH,OAAV,CAN4E,CAA7E;AASA,SAAO;AACNC,IAAAA,EADM;AAEND,IAAAA,OAAO,EAAEI,WAFH;AAGN,OAAGF;AAHG,GAAP;AAKA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\n/**\n * Internal dependencies\n */\nimport { useContextSystem, WordPressComponentProps } from '../../ui/context';\nimport Button from '../../button';\nimport useNavigator from '../use-navigator';\nimport type { NavigatorBackButtonProps } from '../types';\n\nexport function useNavigatorBackButton(\n\tprops: WordPressComponentProps< NavigatorBackButtonProps, 'button' >\n) {\n\tconst { onClick, as = Button, ...otherProps } = useContextSystem(\n\t\tprops,\n\t\t'NavigatorBackButton'\n\t);\n\n\tconst { goBack } = useNavigator();\n\tconst handleClick: React.MouseEventHandler< HTMLButtonElement > = useCallback(\n\t\t( e ) => {\n\t\t\te.preventDefault();\n\t\t\tgoBack();\n\t\t\tonClick?.( e );\n\t\t},\n\t\t[ goBack, onClick ]\n\t);\n\n\treturn {\n\t\tas,\n\t\tonClick: handleClick,\n\t\t...otherProps,\n\t};\n}\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/navigator/navigator-back-button/index.ts"],"names":["default"],"mappings":"AAAA,SAASA,OAAT,QAAwB,aAAxB","sourcesContent":["export { default } from './component';\n"]}
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
|
+
import { createElement } from "@wordpress/element";
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* External dependencies
|
|
6
|
+
*/
|
|
7
|
+
|
|
8
|
+
/**
|
|
9
|
+
* Internal dependencies
|
|
10
|
+
*/
|
|
11
|
+
import { contextConnect } from '../../ui/context';
|
|
12
|
+
import { View } from '../../view';
|
|
13
|
+
import { useNavigatorButton } from './hook';
|
|
14
|
+
|
|
15
|
+
function NavigatorButton(props, forwardedRef) {
|
|
16
|
+
const navigatorButtonProps = useNavigatorButton(props);
|
|
17
|
+
return createElement(View, _extends({
|
|
18
|
+
ref: forwardedRef
|
|
19
|
+
}, navigatorButtonProps));
|
|
20
|
+
}
|
|
21
|
+
/**
|
|
22
|
+
* The `NavigatorButton` component can be used to navigate to a screen and should
|
|
23
|
+
* be used in combination with the `NavigatorProvider`, the `NavigatorScreen`
|
|
24
|
+
* and the `NavigatorBackButton` components (or the `useNavigator` hook).
|
|
25
|
+
*
|
|
26
|
+
* @example
|
|
27
|
+
* ```jsx
|
|
28
|
+
* import {
|
|
29
|
+
* __experimentalNavigatorProvider as NavigatorProvider,
|
|
30
|
+
* __experimentalNavigatorScreen as NavigatorScreen,
|
|
31
|
+
* __experimentalNavigatorButton as NavigatorButton,
|
|
32
|
+
* __experimentalNavigatorBackButton as NavigatorBackButton,
|
|
33
|
+
* } from '@wordpress/components';
|
|
34
|
+
*
|
|
35
|
+
* const MyNavigation = () => (
|
|
36
|
+
* <NavigatorProvider initialPath="/">
|
|
37
|
+
* <NavigatorScreen path="/">
|
|
38
|
+
* <p>This is the home screen.</p>
|
|
39
|
+
* <NavigatorButton path="/child">
|
|
40
|
+
* Navigate to child screen.
|
|
41
|
+
* </NavigatorButton>
|
|
42
|
+
* </NavigatorScreen>
|
|
43
|
+
*
|
|
44
|
+
* <NavigatorScreen path="/child">
|
|
45
|
+
* <p>This is the child screen.</p>
|
|
46
|
+
* <NavigatorBackButton>
|
|
47
|
+
* Go back
|
|
48
|
+
* </NavigatorBackButton>
|
|
49
|
+
* </NavigatorScreen>
|
|
50
|
+
* </NavigatorProvider>
|
|
51
|
+
* );
|
|
52
|
+
* ```
|
|
53
|
+
*/
|
|
54
|
+
|
|
55
|
+
|
|
56
|
+
const ConnectedNavigatorButton = contextConnect(NavigatorButton, 'NavigatorButton');
|
|
57
|
+
export default ConnectedNavigatorButton;
|
|
58
|
+
//# sourceMappingURL=component.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/navigator/navigator-button/component.tsx"],"names":["contextConnect","View","useNavigatorButton","NavigatorButton","props","forwardedRef","navigatorButtonProps","ConnectedNavigatorButton"],"mappings":";;;AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,cAAT,QAAwD,kBAAxD;AACA,SAASC,IAAT,QAAqB,YAArB;AACA,SAASC,kBAAT,QAAmC,QAAnC;;AAGA,SAASC,eAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAMC,oBAAoB,GAAGJ,kBAAkB,CAAEE,KAAF,CAA/C;AAEA,SAAO,cAAC,IAAD;AAAM,IAAA,GAAG,EAAGC;AAAZ,KAAgCC,oBAAhC,EAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAMC,wBAAwB,GAAGP,cAAc,CAC9CG,eAD8C,EAE9C,iBAF8C,CAA/C;AAKA,eAAeI,wBAAf","sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * Internal dependencies\n */\nimport { contextConnect, WordPressComponentProps } from '../../ui/context';\nimport { View } from '../../view';\nimport { useNavigatorButton } from './hook';\nimport type { NavigatorButtonProps } from '../types';\n\nfunction NavigatorButton(\n\tprops: WordPressComponentProps< NavigatorButtonProps, 'button' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst navigatorButtonProps = useNavigatorButton( props );\n\n\treturn <View ref={ forwardedRef } { ...navigatorButtonProps } />;\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 (or the `useNavigator` hook).\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 */\nconst ConnectedNavigatorButton = contextConnect(\n\tNavigatorButton,\n\t'NavigatorButton'\n);\n\nexport default ConnectedNavigatorButton;\n"]}
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* WordPress dependencies
|
|
3
|
+
*/
|
|
4
|
+
import { useCallback } from '@wordpress/element';
|
|
5
|
+
import { escapeAttribute } from '@wordpress/escape-html';
|
|
6
|
+
/**
|
|
7
|
+
* Internal dependencies
|
|
8
|
+
*/
|
|
9
|
+
|
|
10
|
+
/**
|
|
11
|
+
* Internal dependencies
|
|
12
|
+
*/
|
|
13
|
+
|
|
14
|
+
import { useContextSystem } from '../../ui/context';
|
|
15
|
+
import Button from '../../button';
|
|
16
|
+
import useNavigator from '../use-navigator';
|
|
17
|
+
|
|
18
|
+
const cssSelectorForAttribute = (attrName, attrValue) => `[${attrName}="${attrValue}"]`;
|
|
19
|
+
|
|
20
|
+
export function useNavigatorButton(props) {
|
|
21
|
+
const {
|
|
22
|
+
path,
|
|
23
|
+
onClick,
|
|
24
|
+
as = Button,
|
|
25
|
+
attributeName = 'id',
|
|
26
|
+
...otherProps
|
|
27
|
+
} = useContextSystem(props, 'NavigatorButton');
|
|
28
|
+
const escapedPath = escapeAttribute(path);
|
|
29
|
+
const {
|
|
30
|
+
goTo
|
|
31
|
+
} = useNavigator();
|
|
32
|
+
const handleClick = useCallback(e => {
|
|
33
|
+
e.preventDefault();
|
|
34
|
+
goTo(escapedPath, {
|
|
35
|
+
focusTargetSelector: cssSelectorForAttribute(attributeName, escapedPath)
|
|
36
|
+
});
|
|
37
|
+
onClick === null || onClick === void 0 ? void 0 : onClick(e);
|
|
38
|
+
}, [goTo, onClick]);
|
|
39
|
+
return {
|
|
40
|
+
as,
|
|
41
|
+
onClick: handleClick,
|
|
42
|
+
...otherProps,
|
|
43
|
+
[attributeName]: escapedPath
|
|
44
|
+
};
|
|
45
|
+
}
|
|
46
|
+
//# sourceMappingURL=hook.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/navigator/navigator-button/hook.ts"],"names":["useCallback","escapeAttribute","useContextSystem","Button","useNavigator","cssSelectorForAttribute","attrName","attrValue","useNavigatorButton","props","path","onClick","as","attributeName","otherProps","escapedPath","goTo","handleClick","e","preventDefault","focusTargetSelector"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,WAAT,QAA4B,oBAA5B;AACA,SAASC,eAAT,QAAgC,wBAAhC;AAEA;AACA;AACA;;AACA;AACA;AACA;;AACA,SAASC,gBAAT,QAA0D,kBAA1D;AACA,OAAOC,MAAP,MAAmB,cAAnB;AACA,OAAOC,YAAP,MAAyB,kBAAzB;;AAGA,MAAMC,uBAAuB,GAAG,CAAEC,QAAF,EAAoBC,SAApB,KAC9B,IAAID,QAAU,KAAKC,SAAW,IADhC;;AAGA,OAAO,SAASC,kBAAT,CACNC,KADM,EAEL;AACD,QAAM;AACLC,IAAAA,IADK;AAELC,IAAAA,OAFK;AAGLC,IAAAA,EAAE,GAAGT,MAHA;AAILU,IAAAA,aAAa,GAAG,IAJX;AAKL,OAAGC;AALE,MAMFZ,gBAAgB,CAAEO,KAAF,EAAS,iBAAT,CANpB;AAQA,QAAMM,WAAW,GAAGd,eAAe,CAAES,IAAF,CAAnC;AAEA,QAAM;AAAEM,IAAAA;AAAF,MAAWZ,YAAY,EAA7B;AACA,QAAMa,WAAyD,GAAGjB,WAAW,CAC1EkB,CAAF,IAAS;AACRA,IAAAA,CAAC,CAACC,cAAF;AACAH,IAAAA,IAAI,CAAED,WAAF,EAAe;AAClBK,MAAAA,mBAAmB,EAAEf,uBAAuB,CAC3CQ,aAD2C,EAE3CE,WAF2C;AAD1B,KAAf,CAAJ;AAMAJ,IAAAA,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO,CAAIO,CAAJ,CAAP;AACA,GAV2E,EAW5E,CAAEF,IAAF,EAAQL,OAAR,CAX4E,CAA7E;AAcA,SAAO;AACNC,IAAAA,EADM;AAEND,IAAAA,OAAO,EAAEM,WAFH;AAGN,OAAGH,UAHG;AAIN,KAAED,aAAF,GAAmBE;AAJb,GAAP;AAMA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useCallback } from '@wordpress/element';\nimport { escapeAttribute } from '@wordpress/escape-html';\n\n/**\n * Internal dependencies\n */\n/**\n * Internal dependencies\n */\nimport { useContextSystem, WordPressComponentProps } from '../../ui/context';\nimport Button from '../../button';\nimport useNavigator from '../use-navigator';\nimport type { NavigatorButtonProps } from '../types';\n\nconst cssSelectorForAttribute = ( attrName: string, attrValue: string ) =>\n\t`[${ attrName }=\"${ attrValue }\"]`;\n\nexport function useNavigatorButton(\n\tprops: WordPressComponentProps< NavigatorButtonProps, 'button' >\n) {\n\tconst {\n\t\tpath,\n\t\tonClick,\n\t\tas = Button,\n\t\tattributeName = 'id',\n\t\t...otherProps\n\t} = useContextSystem( props, 'NavigatorButton' );\n\n\tconst escapedPath = escapeAttribute( path );\n\n\tconst { goTo } = useNavigator();\n\tconst handleClick: React.MouseEventHandler< HTMLButtonElement > = useCallback(\n\t\t( e ) => {\n\t\t\te.preventDefault();\n\t\t\tgoTo( escapedPath, {\n\t\t\t\tfocusTargetSelector: cssSelectorForAttribute(\n\t\t\t\t\tattributeName,\n\t\t\t\t\tescapedPath\n\t\t\t\t),\n\t\t\t} );\n\t\t\tonClick?.( e );\n\t\t},\n\t\t[ goTo, onClick ]\n\t);\n\n\treturn {\n\t\tas,\n\t\tonClick: handleClick,\n\t\t...otherProps,\n\t\t[ attributeName ]: escapedPath,\n\t};\n}\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/navigator/navigator-button/index.ts"],"names":["default"],"mappings":"AAAA,SAASA,OAAT,QAAwB,aAAxB","sourcesContent":["export { default } from './component';\n"]}
|
|
@@ -27,7 +27,7 @@ var _ref = process.env.NODE_ENV === "production" ? {
|
|
|
27
27
|
} : {
|
|
28
28
|
name: "192ebb7-classes",
|
|
29
29
|
styles: "overflow-x:hidden;label:classes;",
|
|
30
|
-
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
30
|
+
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvbmF2aWdhdG9yL25hdmlnYXRvci1wcm92aWRlci9jb21wb25lbnQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXdGWSIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL25hdmlnYXRvci9uYXZpZ2F0b3ItcHJvdmlkZXIvY29tcG9uZW50LnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB0eXBlIHsgRm9yd2FyZGVkUmVmIH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIFdvcmRQcmVzcyBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgdXNlTWVtbywgdXNlU3RhdGUsIHVzZUNhbGxiYWNrIH0gZnJvbSAnQHdvcmRwcmVzcy9lbGVtZW50JztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHtcblx0Y29udGV4dENvbm5lY3QsXG5cdHVzZUNvbnRleHRTeXN0ZW0sXG5cdFdvcmRQcmVzc0NvbXBvbmVudFByb3BzLFxufSBmcm9tICcuLi8uLi91aS9jb250ZXh0JztcbmltcG9ydCB7IHVzZUN4IH0gZnJvbSAnLi4vLi4vdXRpbHMvaG9va3MvdXNlLWN4JztcbmltcG9ydCB7IFZpZXcgfSBmcm9tICcuLi8uLi92aWV3JztcbmltcG9ydCB7IE5hdmlnYXRvckNvbnRleHQgfSBmcm9tICcuLi9jb250ZXh0JztcbmltcG9ydCB0eXBlIHtcblx0TmF2aWdhdG9yUHJvdmlkZXJQcm9wcyxcblx0TmF2aWdhdG9yTG9jYXRpb24sXG5cdE5hdmlnYXRvckNvbnRleHQgYXMgTmF2aWdhdG9yQ29udGV4dFR5cGUsXG59IGZyb20gJy4uL3R5cGVzJztcblxuZnVuY3Rpb24gTmF2aWdhdG9yUHJvdmlkZXIoXG5cdHByb3BzOiBXb3JkUHJlc3NDb21wb25lbnRQcm9wczwgTmF2aWdhdG9yUHJvdmlkZXJQcm9wcywgJ2RpdicgPixcblx0Zm9yd2FyZGVkUmVmOiBGb3J3YXJkZWRSZWY8IGFueSA+XG4pIHtcblx0Y29uc3Qge1xuXHRcdGluaXRpYWxQYXRoLFxuXHRcdGNoaWxkcmVuLFxuXHRcdGNsYXNzTmFtZSxcblx0XHQuLi5vdGhlclByb3BzXG5cdH0gPSB1c2VDb250ZXh0U3lzdGVtKCBwcm9wcywgJ05hdmlnYXRvclByb3ZpZGVyJyApO1xuXG5cdGNvbnN0IFsgbG9jYXRpb25IaXN0b3J5LCBzZXRMb2NhdGlvbkhpc3RvcnkgXSA9IHVzZVN0YXRlPFxuXHRcdE5hdmlnYXRvckxvY2F0aW9uW11cblx0PiggW1xuXHRcdHtcblx0XHRcdHBhdGg6IGluaXRpYWxQYXRoLFxuXHRcdH0sXG5cdF0gKTtcblxuXHRjb25zdCBnb1RvOiBOYXZpZ2F0b3JDb250ZXh0VHlwZVsgJ2dvVG8nIF0gPSB1c2VDYWxsYmFjayhcblx0XHQoIHBhdGgsIG9wdGlvbnMgPSB7fSApID0+IHtcblx0XHRcdHNldExvY2F0aW9uSGlzdG9yeSggW1xuXHRcdFx0XHQuLi5sb2NhdGlvbkhpc3RvcnksXG5cdFx0XHRcdHtcblx0XHRcdFx0XHQuLi5vcHRpb25zLFxuXHRcdFx0XHRcdHBhdGgsXG5cdFx0XHRcdFx0aXNCYWNrOiBmYWxzZSxcblx0XHRcdFx0fSxcblx0XHRcdF0gKTtcblx0XHR9LFxuXHRcdFsgbG9jYXRpb25IaXN0b3J5IF1cblx0KTtcblxuXHRjb25zdCBnb0JhY2s6IE5hdmlnYXRvckNvbnRleHRUeXBlWyAnZ29CYWNrJyBdID0gdXNlQ2FsbGJhY2soICgpID0+IHtcblx0XHRpZiAoIGxvY2F0aW9uSGlzdG9yeS5sZW5ndGggPiAxICkge1xuXHRcdFx0c2V0TG9jYXRpb25IaXN0b3J5KCBbXG5cdFx0XHRcdC4uLmxvY2F0aW9uSGlzdG9yeS5zbGljZSggMCwgLTIgKSxcblx0XHRcdFx0e1xuXHRcdFx0XHRcdC4uLmxvY2F0aW9uSGlzdG9yeVsgbG9jYXRpb25IaXN0b3J5Lmxlbmd0aCAtIDIgXSxcblx0XHRcdFx0XHRpc0JhY2s6IHRydWUsXG5cdFx0XHRcdH0sXG5cdFx0XHRdICk7XG5cdFx0fVxuXHR9LCBbIGxvY2F0aW9uSGlzdG9yeSBdICk7XG5cblx0Y29uc3QgbmF2aWdhdG9yQ29udGV4dFZhbHVlOiBOYXZpZ2F0b3JDb250ZXh0VHlwZSA9IHVzZU1lbW8oXG5cdFx0KCkgPT4gKCB7XG5cdFx0XHRsb2NhdGlvbjoge1xuXHRcdFx0XHQuLi5sb2NhdGlvbkhpc3RvcnlbIGxvY2F0aW9uSGlzdG9yeS5sZW5ndGggLSAxIF0sXG5cdFx0XHRcdGlzSW5pdGlhbDogbG9jYXRpb25IaXN0b3J5Lmxlbmd0aCA9PT0gMSxcblx0XHRcdH0sXG5cdFx0XHRnb1RvLFxuXHRcdFx0Z29CYWNrLFxuXHRcdH0gKSxcblx0XHRbIGxvY2F0aW9uSGlzdG9yeSwgZ29UbywgZ29CYWNrIF1cblx0KTtcblxuXHRjb25zdCBjeCA9IHVzZUN4KCk7XG5cdGNvbnN0IGNsYXNzZXMgPSB1c2VNZW1vKFxuXHRcdC8vIFByZXZlbnRzIGhvcml6b250YWwgb3ZlcmZsb3cgd2hpbGUgYW5pbWF0aW5nIHNjcmVlbiB0cmFuc2l0aW9uc1xuXHRcdCgpID0+IGN4KCBjc3MoIHsgb3ZlcmZsb3dYOiAnaGlkZGVuJyB9ICksIGNsYXNzTmFtZSApLFxuXHRcdFsgY2xhc3NOYW1lLCBjeCBdXG5cdCk7XG5cblx0cmV0dXJuIChcblx0XHQ8VmlldyByZWY9eyBmb3J3YXJkZWRSZWYgfSBjbGFzc05hbWU9eyBjbGFzc2VzIH0geyAuLi5vdGhlclByb3BzIH0+XG5cdFx0XHQ8TmF2aWdhdG9yQ29udGV4dC5Qcm92aWRlciB2YWx1ZT17IG5hdmlnYXRvckNvbnRleHRWYWx1ZSB9PlxuXHRcdFx0XHR7IGNoaWxkcmVuIH1cblx0XHRcdDwvTmF2aWdhdG9yQ29udGV4dC5Qcm92aWRlcj5cblx0XHQ8L1ZpZXc+XG5cdCk7XG59XG5cbi8qKlxuICogVGhlIGBOYXZpZ2F0b3JQcm92aWRlcmAgY29tcG9uZW50IGFsbG93cyByZW5kZXJpbmcgbmVzdGVkIHZpZXdzL3BhbmVscy9tZW51c1xuICogKHZpYSB0aGUgYE5hdmlnYXRvclNjcmVlbmAgY29tcG9uZW50IGFuZCBuYXZpZ2F0ZSBiZXR3ZWVuIHRoZXNlIGRpZmZlcmVudFxuICogdmlldyAodmlhIHRoZSBgTmF2aWdhdG9yQnV0dG9uYCBhbmQgYE5hdmlnYXRvckJhY2tCdXR0b25gIGNvbXBvbmVudHMgb3IgdGhlXG4gKiBgdXNlTmF2aWdhdG9yYCBob29rKS5cbiAqXG4gKiBAZXhhbXBsZVxuICogYGBganN4XG4gKiBpbXBvcnQge1xuICogICBfX2V4cGVyaW1lbnRhbE5hdmlnYXRvclByb3ZpZGVyIGFzIE5hdmlnYXRvclByb3ZpZGVyLFxuICogICBfX2V4cGVyaW1lbnRhbE5hdmlnYXRvclNjcmVlbiBhcyBOYXZpZ2F0b3JTY3JlZW4sXG4gKiAgIF9fZXhwZXJpbWVudGFsTmF2aWdhdG9yQnV0dG9uIGFzIE5hdmlnYXRvckJ1dHRvbixcbiAqICAgX19leHBlcmltZW50YWxOYXZpZ2F0b3JCYWNrQnV0dG9uIGFzIE5hdmlnYXRvckJhY2tCdXR0b24sXG4gKiB9IGZyb20gJ0B3b3JkcHJlc3MvY29tcG9uZW50cyc7XG4gKlxuICogY29uc3QgTXlOYXZpZ2F0aW9uID0gKCkgPT4gKFxuICogICA8TmF2aWdhdG9yUHJvdmlkZXIgaW5pdGlhbFBhdGg9XCIvXCI+XG4gKiAgICAgPE5hdmlnYXRvclNjcmVlbiBwYXRoPVwiL1wiPlxuICogICAgICAgPHA+VGhpcyBpcyB0aGUgaG9tZSBzY3JlZW4uPC9wPlxuICogICAgICAgIDxOYXZpZ2F0b3JCdXR0b24gcGF0aD1cIi9jaGlsZFwiPlxuICogICAgICAgICAgTmF2aWdhdGUgdG8gY2hpbGQgc2NyZWVuLlxuICogICAgICAgPC9OYXZpZ2F0b3JCdXR0b24+XG4gKiAgICAgPC9OYXZpZ2F0b3JTY3JlZW4+XG4gKlxuICogICAgIDxOYXZpZ2F0b3JTY3JlZW4gcGF0aD1cIi9jaGlsZFwiPlxuICogICAgICAgPHA+VGhpcyBpcyB0aGUgY2hpbGQgc2NyZWVuLjwvcD5cbiAqICAgICAgIDxOYXZpZ2F0b3JCYWNrQnV0dG9uPlxuICogICAgICAgICBHbyBiYWNrXG4gKiAgICAgICA8L05hdmlnYXRvckJhY2tCdXR0b24+XG4gKiAgICAgPC9OYXZpZ2F0b3JTY3JlZW4+XG4gKiAgIDwvTmF2aWdhdG9yUHJvdmlkZXI+XG4gKiApO1xuICogYGBgXG4gKi9cbmNvbnN0IENvbm5lY3RlZE5hdmlnYXRvclByb3ZpZGVyID0gY29udGV4dENvbm5lY3QoXG5cdE5hdmlnYXRvclByb3ZpZGVyLFxuXHQnTmF2aWdhdG9yUHJvdmlkZXInXG4pO1xuXG5leHBvcnQgZGVmYXVsdCBDb25uZWN0ZWROYXZpZ2F0b3JQcm92aWRlcjtcbiJdfQ== */",
|
|
31
31
|
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
32
32
|
};
|
|
33
33
|
|
|
@@ -73,44 +73,34 @@ function NavigatorProvider(props, forwardedRef) {
|
|
|
73
73
|
}, children));
|
|
74
74
|
}
|
|
75
75
|
/**
|
|
76
|
-
* The `NavigatorProvider` component allows rendering nested panels
|
|
76
|
+
* The `NavigatorProvider` component allows rendering nested views/panels/menus
|
|
77
|
+
* (via the `NavigatorScreen` component and navigate between these different
|
|
78
|
+
* view (via the `NavigatorButton` and `NavigatorBackButton` components or the
|
|
79
|
+
* `useNavigator` hook).
|
|
77
80
|
*
|
|
78
81
|
* @example
|
|
79
82
|
* ```jsx
|
|
80
83
|
* import {
|
|
81
84
|
* __experimentalNavigatorProvider as NavigatorProvider,
|
|
82
85
|
* __experimentalNavigatorScreen as NavigatorScreen,
|
|
83
|
-
*
|
|
86
|
+
* __experimentalNavigatorButton as NavigatorButton,
|
|
87
|
+
* __experimentalNavigatorBackButton as NavigatorBackButton,
|
|
84
88
|
* } from '@wordpress/components';
|
|
85
89
|
*
|
|
86
|
-
* function NavigatorButton( { path, ...props } ) {
|
|
87
|
-
* const { goTo } = useNavigator();
|
|
88
|
-
* return (
|
|
89
|
-
* <Button
|
|
90
|
-
* variant="primary"
|
|
91
|
-
* onClick={ () => goTo( path ) }
|
|
92
|
-
* { ...props }
|
|
93
|
-
* />
|
|
94
|
-
* );
|
|
95
|
-
* }
|
|
96
|
-
*
|
|
97
|
-
* function NavigatorBackButton( props ) {
|
|
98
|
-
* const { goBack } = useNavigator();
|
|
99
|
-
* return <Button variant="secondary" onClick={ () => goBack() } { ...props } />;
|
|
100
|
-
* }
|
|
101
|
-
*
|
|
102
90
|
* const MyNavigation = () => (
|
|
103
91
|
* <NavigatorProvider initialPath="/">
|
|
104
92
|
* <NavigatorScreen path="/">
|
|
105
93
|
* <p>This is the home screen.</p>
|
|
106
|
-
*
|
|
94
|
+
* <NavigatorButton path="/child">
|
|
107
95
|
* Navigate to child screen.
|
|
108
96
|
* </NavigatorButton>
|
|
109
97
|
* </NavigatorScreen>
|
|
110
98
|
*
|
|
111
99
|
* <NavigatorScreen path="/child">
|
|
112
100
|
* <p>This is the child screen.</p>
|
|
113
|
-
* <NavigatorBackButton>
|
|
101
|
+
* <NavigatorBackButton>
|
|
102
|
+
* Go back
|
|
103
|
+
* </NavigatorBackButton>
|
|
114
104
|
* </NavigatorScreen>
|
|
115
105
|
* </NavigatorProvider>
|
|
116
106
|
* );
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/navigator/navigator-provider/component.tsx"],"names":["css","useMemo","useState","useCallback","contextConnect","useContextSystem","useCx","View","NavigatorContext","NavigatorProvider","props","forwardedRef","initialPath","children","className","otherProps","locationHistory","setLocationHistory","path","goTo","options","isBack","goBack","length","slice","navigatorContextValue","location","isInitial","cx","classes","ConnectedNavigatorProvider"],"mappings":";;;;;AAAA;AACA;AACA;AAEA,SAASA,GAAT,QAAoB,gBAApB;AAEA;AACA;AACA;;AACA,SAASC,OAAT,EAAkBC,QAAlB,EAA4BC,WAA5B,QAA+C,oBAA/C;AAEA;AACA;AACA;;AACA,SACCC,cADD,EAECC,gBAFD,QAIO,kBAJP;AAKA,SAASC,KAAT,QAAsB,0BAAtB;AACA,SAASC,IAAT,QAAqB,YAArB;AACA,SAASC,gBAAT,QAAiC,YAAjC;;;;;;;;;;;;AAOA,SAASC,iBAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAM;AACLC,IAAAA,WADK;AAELC,IAAAA,QAFK;AAGLC,IAAAA,SAHK;AAIL,OAAGC;AAJE,MAKFV,gBAAgB,CAAEK,KAAF,EAAS,mBAAT,CALpB;AAOA,QAAM,CAAEM,eAAF,EAAmBC,kBAAnB,IAA0Cf,QAAQ,CAErD,CACF;AACCgB,IAAAA,IAAI,EAAEN;AADP,GADE,CAFqD,CAAxD;AAQA,QAAMO,IAAoC,GAAGhB,WAAW,CACvD,UAAEe,IAAF,EAA0B;AAAA,QAAlBE,OAAkB,uEAAR,EAAQ;AACzBH,IAAAA,kBAAkB,CAAE,CACnB,GAAGD,eADgB,EAEnB,EACC,GAAGI,OADJ;AAECF,MAAAA,IAFD;AAGCG,MAAAA,MAAM,EAAE;AAHT,KAFmB,CAAF,CAAlB;AAQA,GAVsD,EAWvD,CAAEL,eAAF,CAXuD,CAAxD;AAcA,QAAMM,MAAwC,GAAGnB,WAAW,CAAE,MAAM;AACnE,QAAKa,eAAe,CAACO,MAAhB,GAAyB,CAA9B,EAAkC;AACjCN,MAAAA,kBAAkB,CAAE,CACnB,GAAGD,eAAe,CAACQ,KAAhB,CAAuB,CAAvB,EAA0B,CAAC,CAA3B,CADgB,EAEnB,EACC,GAAGR,eAAe,CAAEA,eAAe,CAACO,MAAhB,GAAyB,CAA3B,CADnB;AAECF,QAAAA,MAAM,EAAE;AAFT,OAFmB,CAAF,CAAlB;AAOA;AACD,GAV2D,EAUzD,CAAEL,eAAF,CAVyD,CAA5D;AAYA,QAAMS,qBAA2C,GAAGxB,OAAO,CAC1D,OAAQ;AACPyB,IAAAA,QAAQ,EAAE,EACT,GAAGV,eAAe,CAAEA,eAAe,CAACO,MAAhB,GAAyB,CAA3B,CADT;AAETI,MAAAA,SAAS,EAAEX,eAAe,CAACO,MAAhB,KAA2B;AAF7B,KADH;AAKPJ,IAAAA,IALO;AAMPG,IAAAA;AANO,GAAR,CAD0D,EAS1D,CAAEN,eAAF,EAAmBG,IAAnB,EAAyBG,MAAzB,CAT0D,CAA3D;AAYA,QAAMM,EAAE,GAAGtB,KAAK,EAAhB;AACA,QAAMuB,OAAO,GAAG5B,OAAO,EACtB;AACA,QAAM2B,EAAE,OAAkCd,SAAlC,CAFc,EAGtB,CAAEA,SAAF,EAAac,EAAb,CAHsB,CAAvB;AAMA,SACC,cAAC,IAAD;AAAM,IAAA,GAAG,EAAGjB,YAAZ;AAA2B,IAAA,SAAS,EAAGkB;AAAvC,KAAsDd,UAAtD,GACC,cAAC,gBAAD,CAAkB,QAAlB;AAA2B,IAAA,KAAK,EAAGU;AAAnC,KACGZ,QADH,CADD,CADD;AAOA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/navigator/navigator-provider/component.tsx"],"names":["css","useMemo","useState","useCallback","contextConnect","useContextSystem","useCx","View","NavigatorContext","NavigatorProvider","props","forwardedRef","initialPath","children","className","otherProps","locationHistory","setLocationHistory","path","goTo","options","isBack","goBack","length","slice","navigatorContextValue","location","isInitial","cx","classes","ConnectedNavigatorProvider"],"mappings":";;;;;AAAA;AACA;AACA;AAEA,SAASA,GAAT,QAAoB,gBAApB;AAEA;AACA;AACA;;AACA,SAASC,OAAT,EAAkBC,QAAlB,EAA4BC,WAA5B,QAA+C,oBAA/C;AAEA;AACA;AACA;;AACA,SACCC,cADD,EAECC,gBAFD,QAIO,kBAJP;AAKA,SAASC,KAAT,QAAsB,0BAAtB;AACA,SAASC,IAAT,QAAqB,YAArB;AACA,SAASC,gBAAT,QAAiC,YAAjC;;;;;;;;;;;;AAOA,SAASC,iBAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAM;AACLC,IAAAA,WADK;AAELC,IAAAA,QAFK;AAGLC,IAAAA,SAHK;AAIL,OAAGC;AAJE,MAKFV,gBAAgB,CAAEK,KAAF,EAAS,mBAAT,CALpB;AAOA,QAAM,CAAEM,eAAF,EAAmBC,kBAAnB,IAA0Cf,QAAQ,CAErD,CACF;AACCgB,IAAAA,IAAI,EAAEN;AADP,GADE,CAFqD,CAAxD;AAQA,QAAMO,IAAoC,GAAGhB,WAAW,CACvD,UAAEe,IAAF,EAA0B;AAAA,QAAlBE,OAAkB,uEAAR,EAAQ;AACzBH,IAAAA,kBAAkB,CAAE,CACnB,GAAGD,eADgB,EAEnB,EACC,GAAGI,OADJ;AAECF,MAAAA,IAFD;AAGCG,MAAAA,MAAM,EAAE;AAHT,KAFmB,CAAF,CAAlB;AAQA,GAVsD,EAWvD,CAAEL,eAAF,CAXuD,CAAxD;AAcA,QAAMM,MAAwC,GAAGnB,WAAW,CAAE,MAAM;AACnE,QAAKa,eAAe,CAACO,MAAhB,GAAyB,CAA9B,EAAkC;AACjCN,MAAAA,kBAAkB,CAAE,CACnB,GAAGD,eAAe,CAACQ,KAAhB,CAAuB,CAAvB,EAA0B,CAAC,CAA3B,CADgB,EAEnB,EACC,GAAGR,eAAe,CAAEA,eAAe,CAACO,MAAhB,GAAyB,CAA3B,CADnB;AAECF,QAAAA,MAAM,EAAE;AAFT,OAFmB,CAAF,CAAlB;AAOA;AACD,GAV2D,EAUzD,CAAEL,eAAF,CAVyD,CAA5D;AAYA,QAAMS,qBAA2C,GAAGxB,OAAO,CAC1D,OAAQ;AACPyB,IAAAA,QAAQ,EAAE,EACT,GAAGV,eAAe,CAAEA,eAAe,CAACO,MAAhB,GAAyB,CAA3B,CADT;AAETI,MAAAA,SAAS,EAAEX,eAAe,CAACO,MAAhB,KAA2B;AAF7B,KADH;AAKPJ,IAAAA,IALO;AAMPG,IAAAA;AANO,GAAR,CAD0D,EAS1D,CAAEN,eAAF,EAAmBG,IAAnB,EAAyBG,MAAzB,CAT0D,CAA3D;AAYA,QAAMM,EAAE,GAAGtB,KAAK,EAAhB;AACA,QAAMuB,OAAO,GAAG5B,OAAO,EACtB;AACA,QAAM2B,EAAE,OAAkCd,SAAlC,CAFc,EAGtB,CAAEA,SAAF,EAAac,EAAb,CAHsB,CAAvB;AAMA,SACC,cAAC,IAAD;AAAM,IAAA,GAAG,EAAGjB,YAAZ;AAA2B,IAAA,SAAS,EAAGkB;AAAvC,KAAsDd,UAAtD,GACC,cAAC,gBAAD,CAAkB,QAAlB;AAA2B,IAAA,KAAK,EAAGU;AAAnC,KACGZ,QADH,CADD,CADD;AAOA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAMiB,0BAA0B,GAAG1B,cAAc,CAChDK,iBADgD,EAEhD,mBAFgD,CAAjD;AAKA,eAAeqB,0BAAf","sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\nimport { css } from '@emotion/react';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo, useState, useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport {\n\tcontextConnect,\n\tuseContextSystem,\n\tWordPressComponentProps,\n} from '../../ui/context';\nimport { useCx } from '../../utils/hooks/use-cx';\nimport { View } from '../../view';\nimport { NavigatorContext } from '../context';\nimport type {\n\tNavigatorProviderProps,\n\tNavigatorLocation,\n\tNavigatorContext as NavigatorContextType,\n} from '../types';\n\nfunction NavigatorProvider(\n\tprops: WordPressComponentProps< NavigatorProviderProps, 'div' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst {\n\t\tinitialPath,\n\t\tchildren,\n\t\tclassName,\n\t\t...otherProps\n\t} = useContextSystem( props, 'NavigatorProvider' );\n\n\tconst [ locationHistory, setLocationHistory ] = useState<\n\t\tNavigatorLocation[]\n\t>( [\n\t\t{\n\t\t\tpath: initialPath,\n\t\t},\n\t] );\n\n\tconst goTo: NavigatorContextType[ 'goTo' ] = useCallback(\n\t\t( path, options = {} ) => {\n\t\t\tsetLocationHistory( [\n\t\t\t\t...locationHistory,\n\t\t\t\t{\n\t\t\t\t\t...options,\n\t\t\t\t\tpath,\n\t\t\t\t\tisBack: false,\n\t\t\t\t},\n\t\t\t] );\n\t\t},\n\t\t[ locationHistory ]\n\t);\n\n\tconst goBack: NavigatorContextType[ 'goBack' ] = useCallback( () => {\n\t\tif ( locationHistory.length > 1 ) {\n\t\t\tsetLocationHistory( [\n\t\t\t\t...locationHistory.slice( 0, -2 ),\n\t\t\t\t{\n\t\t\t\t\t...locationHistory[ locationHistory.length - 2 ],\n\t\t\t\t\tisBack: true,\n\t\t\t\t},\n\t\t\t] );\n\t\t}\n\t}, [ locationHistory ] );\n\n\tconst navigatorContextValue: NavigatorContextType = useMemo(\n\t\t() => ( {\n\t\t\tlocation: {\n\t\t\t\t...locationHistory[ locationHistory.length - 1 ],\n\t\t\t\tisInitial: locationHistory.length === 1,\n\t\t\t},\n\t\t\tgoTo,\n\t\t\tgoBack,\n\t\t} ),\n\t\t[ locationHistory, goTo, goBack ]\n\t);\n\n\tconst cx = useCx();\n\tconst classes = useMemo(\n\t\t// Prevents horizontal overflow while animating screen transitions\n\t\t() => cx( css( { overflowX: 'hidden' } ), className ),\n\t\t[ className, cx ]\n\t);\n\n\treturn (\n\t\t<View ref={ forwardedRef } className={ classes } { ...otherProps }>\n\t\t\t<NavigatorContext.Provider value={ navigatorContextValue }>\n\t\t\t\t{ children }\n\t\t\t</NavigatorContext.Provider>\n\t\t</View>\n\t);\n}\n\n/**\n * The `NavigatorProvider` component allows rendering nested views/panels/menus\n * (via the `NavigatorScreen` component and navigate between these different\n * view (via the `NavigatorButton` and `NavigatorBackButton` components or the\n * `useNavigator` hook).\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 */\nconst ConnectedNavigatorProvider = contextConnect(\n\tNavigatorProvider,\n\t'NavigatorProvider'\n);\n\nexport default ConnectedNavigatorProvider;\n"]}
|
|
@@ -17,6 +17,7 @@ import { focus } from '@wordpress/dom';
|
|
|
17
17
|
import { useContext, useEffect, useMemo, useRef } from '@wordpress/element';
|
|
18
18
|
import { useReducedMotion, useMergeRefs, usePrevious } from '@wordpress/compose';
|
|
19
19
|
import { isRTL } from '@wordpress/i18n';
|
|
20
|
+
import { escapeAttribute } from '@wordpress/escape-html';
|
|
20
21
|
/**
|
|
21
22
|
* Internal dependencies
|
|
22
23
|
*/
|
|
@@ -37,7 +38,7 @@ var _ref = process.env.NODE_ENV === "production" ? {
|
|
|
37
38
|
} : {
|
|
38
39
|
name: "1ulogbc-classes",
|
|
39
40
|
styles: "overflow-x:auto;max-height:100%;label:classes;",
|
|
40
|
-
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
41
|
+
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvbmF2aWdhdG9yL25hdmlnYXRvci1zY3JlZW4vY29tcG9uZW50LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUErREkiLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy9uYXZpZ2F0b3IvbmF2aWdhdG9yLXNjcmVlbi9jb21wb25lbnQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHR5cGUgeyBGb3J3YXJkZWRSZWYgfSBmcm9tICdyZWFjdCc7XG4vLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgbm8tcmVzdHJpY3RlZC1pbXBvcnRzXG5pbXBvcnQgeyBtb3Rpb24sIE1vdGlvblByb3BzIH0gZnJvbSAnZnJhbWVyLW1vdGlvbic7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbi8qKlxuICogV29yZFByZXNzIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBmb2N1cyB9IGZyb20gJ0B3b3JkcHJlc3MvZG9tJztcbmltcG9ydCB7IHVzZUNvbnRleHQsIHVzZUVmZmVjdCwgdXNlTWVtbywgdXNlUmVmIH0gZnJvbSAnQHdvcmRwcmVzcy9lbGVtZW50JztcbmltcG9ydCB7XG5cdHVzZVJlZHVjZWRNb3Rpb24sXG5cdHVzZU1lcmdlUmVmcyxcblx0dXNlUHJldmlvdXMsXG59IGZyb20gJ0B3b3JkcHJlc3MvY29tcG9zZSc7XG5pbXBvcnQgeyBpc1JUTCB9IGZyb20gJ0B3b3JkcHJlc3MvaTE4bic7XG5pbXBvcnQgeyBlc2NhcGVBdHRyaWJ1dGUgfSBmcm9tICdAd29yZHByZXNzL2VzY2FwZS1odG1sJztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHtcblx0Y29udGV4dENvbm5lY3QsXG5cdHVzZUNvbnRleHRTeXN0ZW0sXG5cdFdvcmRQcmVzc0NvbXBvbmVudFByb3BzLFxufSBmcm9tICcuLi8uLi91aS9jb250ZXh0JztcbmltcG9ydCB7IHVzZUN4IH0gZnJvbSAnLi4vLi4vdXRpbHMvaG9va3MvdXNlLWN4JztcbmltcG9ydCB7IFZpZXcgfSBmcm9tICcuLi8uLi92aWV3JztcbmltcG9ydCB7IE5hdmlnYXRvckNvbnRleHQgfSBmcm9tICcuLi9jb250ZXh0JztcbmltcG9ydCB0eXBlIHsgTmF2aWdhdG9yU2NyZWVuUHJvcHMgfSBmcm9tICcuLi90eXBlcyc7XG5cbmNvbnN0IGFuaW1hdGlvbkVudGVyRGVsYXkgPSAwO1xuY29uc3QgYW5pbWF0aW9uRW50ZXJEdXJhdGlvbiA9IDAuMTQ7XG5jb25zdCBhbmltYXRpb25FeGl0RHVyYXRpb24gPSAwLjE0O1xuY29uc3QgYW5pbWF0aW9uRXhpdERlbGF5ID0gMDtcblxuLy8gUHJvcHMgc3BlY2lmaWMgdG8gYGZyYW1lci1tb3Rpb25gIGNhbid0IGJlIGN1cnJlbnRseSBwYXNzZWQgdG8gYE5hdmlnYXRvclNjcmVlbmAsXG4vLyBhcyBzb21lIG9mIHRoZW0gd291bGQgb3ZlcmxhcCB3aXRoIEhUTUwgcHJvcHMgKGUuZy4gYG9uQW5pbWF0aW9uU3RhcnRgLCAuLi4pXG50eXBlIFByb3BzID0gT21pdDxcblx0V29yZFByZXNzQ29tcG9uZW50UHJvcHM8IE5hdmlnYXRvclNjcmVlblByb3BzLCAnZGl2JywgZmFsc2UgPixcblx0a2V5b2YgTW90aW9uUHJvcHNcbj47XG5cbmZ1bmN0aW9uIE5hdmlnYXRvclNjcmVlbiggcHJvcHM6IFByb3BzLCBmb3J3YXJkZWRSZWY6IEZvcndhcmRlZFJlZjwgYW55ID4gKSB7XG5cdGNvbnN0IHsgY2hpbGRyZW4sIGNsYXNzTmFtZSwgcGF0aCwgLi4ub3RoZXJQcm9wcyB9ID0gdXNlQ29udGV4dFN5c3RlbShcblx0XHRwcm9wcyxcblx0XHQnTmF2aWdhdG9yU2NyZWVuJ1xuXHQpO1xuXG5cdGNvbnN0IHByZWZlcnNSZWR1Y2VkTW90aW9uID0gdXNlUmVkdWNlZE1vdGlvbigpO1xuXHRjb25zdCB7IGxvY2F0aW9uIH0gPSB1c2VDb250ZXh0KCBOYXZpZ2F0b3JDb250ZXh0ICk7XG5cdGNvbnN0IGlzTWF0Y2ggPSBsb2NhdGlvbi5wYXRoID09PSBlc2NhcGVBdHRyaWJ1dGUoIHBhdGggKTtcblx0Y29uc3Qgd3JhcHBlclJlZiA9IHVzZVJlZjwgSFRNTERpdkVsZW1lbnQgPiggbnVsbCApO1xuXG5cdGNvbnN0IHByZXZpb3VzTG9jYXRpb24gPSB1c2VQcmV2aW91cyggbG9jYXRpb24gKTtcblxuXHRjb25zdCBjeCA9IHVzZUN4KCk7XG5cdGNvbnN0IGNsYXNzZXMgPSB1c2VNZW1vKFxuXHRcdCgpID0+XG5cdFx0XHRjeChcblx0XHRcdFx0Y3NzKCB7XG5cdFx0XHRcdFx0Ly8gRW5zdXJlcyBob3Jpem9udGFsIG92ZXJmbG93IGlzIHZpc3VhbGx5IGFjY2Vzc2libGVcblx0XHRcdFx0XHRvdmVyZmxvd1g6ICdhdXRvJyxcblx0XHRcdFx0XHQvLyBJbiBjYXNlIHRoZSByb290IGhhcyBhIGhlaWdodCwgaXQgc2hvdWxkIG5vdCBiZSBleGNlZWRlZFxuXHRcdFx0XHRcdG1heEhlaWdodDogJzEwMCUnLFxuXHRcdFx0XHR9ICksXG5cdFx0XHRcdGNsYXNzTmFtZVxuXHRcdFx0KSxcblx0XHRbIGNsYXNzTmFtZSwgY3ggXVxuXHQpO1xuXG5cdC8vIEZvY3VzIHJlc3RvcmF0aW9uXG5cdGNvbnN0IGlzSW5pdGlhbExvY2F0aW9uID0gbG9jYXRpb24uaXNJbml0aWFsICYmICEgbG9jYXRpb24uaXNCYWNrO1xuXHR1c2VFZmZlY3QoICgpID0+IHtcblx0XHQvLyBPbmx5IGF0dGVtcHQgdG8gcmVzdG9yZSBmb2N1czpcblx0XHQvLyAtIGlmIHRoZSBjdXJyZW50IGxvY2F0aW9uIGlzIG5vdCB0aGUgaW5pdGlhbCBvbmUgKHRvIGF2b2lkIG1vdmluZyBmb2N1cyBvbiBwYWdlIGxvYWQpXG5cdFx0Ly8gLSB3aGVuIHRoZSBzY3JlZW4gYmVjb21lcyB2aXNpYmxlXG5cdFx0Ly8gLSBpZiB0aGUgd3JhcHBlciByZWYgaGFzIGJlZW4gYXNzaWduZWRcblx0XHRpZiAoIGlzSW5pdGlhbExvY2F0aW9uIHx8ICEgaXNNYXRjaCB8fCAhIHdyYXBwZXJSZWYuY3VycmVudCApIHtcblx0XHRcdHJldHVybjtcblx0XHR9XG5cblx0XHRsZXQgZWxlbWVudFRvRm9jdXM6IEhUTUxFbGVtZW50IHwgbnVsbCA9IG51bGw7XG5cblx0XHQvLyBXaGVuIG5hdmlnYXRpbmcgYmFjaywgaWYgYSBzZWxlY3RvciBpcyBwcm92aWRlZCwgdXNlIGl0IHRvIGxvb2sgZm9yIHRoZVxuXHRcdC8vIHRhcmdldCBlbGVtZW50IChhc3N1bWVkIHRvIGJlIGEgbm9kZSBpbnNpZGUgdGhlIGN1cnJlbnQgTmF2aWdhdG9yU2NyZWVuKVxuXHRcdGlmICggbG9jYXRpb24uaXNCYWNrICYmIHByZXZpb3VzTG9jYXRpb24/LmZvY3VzVGFyZ2V0U2VsZWN0b3IgKSB7XG5cdFx0XHRlbGVtZW50VG9Gb2N1cyA9IHdyYXBwZXJSZWYuY3VycmVudC5xdWVyeVNlbGVjdG9yKFxuXHRcdFx0XHRwcmV2aW91c0xvY2F0aW9uLmZvY3VzVGFyZ2V0U2VsZWN0b3Jcblx0XHRcdCk7XG5cdFx0fVxuXG5cdFx0Ly8gSWYgdGhlIHByZXZpb3VzIHF1ZXJ5IGRpZG4ndCBydW4gb3IgZmluZCBhbnkgZWxlbWVudCB0byBmb2N1cywgZmFsbGJhY2tcblx0XHQvLyB0byB0aGUgZmlyc3QgdGFiYmFibGUgZWxlbWVudCBpbiB0aGUgc2NyZWVuIChvciB0aGUgc2NyZWVuIGl0c2VsZikuXG5cdFx0aWYgKCAhIGVsZW1lbnRUb0ZvY3VzICkge1xuXHRcdFx0Y29uc3QgZmlyc3RUYWJiYWJsZSA9ICggZm9jdXMudGFiYmFibGUuZmluZChcblx0XHRcdFx0d3JhcHBlclJlZi5jdXJyZW50XG5cdFx0XHQpIGFzIEhUTUxFbGVtZW50W10gKVsgMCBdO1xuXG5cdFx0XHRlbGVtZW50VG9Gb2N1cyA9IGZpcnN0VGFiYmFibGUgPz8gd3JhcHBlclJlZi5jdXJyZW50O1xuXHRcdH1cblxuXHRcdGVsZW1lbnRUb0ZvY3VzLmZvY3VzKCk7XG5cdH0sIFsgaXNJbml0aWFsTG9jYXRpb24sIGlzTWF0Y2ggXSApO1xuXG5cdGNvbnN0IG1lcmdlZFdyYXBwZXJSZWYgPSB1c2VNZXJnZVJlZnMoIFsgZm9yd2FyZGVkUmVmLCB3cmFwcGVyUmVmIF0gKTtcblxuXHRpZiAoICEgaXNNYXRjaCApIHtcblx0XHRyZXR1cm4gbnVsbDtcblx0fVxuXG5cdGlmICggcHJlZmVyc1JlZHVjZWRNb3Rpb24gKSB7XG5cdFx0cmV0dXJuIChcblx0XHRcdDxWaWV3XG5cdFx0XHRcdHJlZj17IG1lcmdlZFdyYXBwZXJSZWYgfVxuXHRcdFx0XHRjbGFzc05hbWU9eyBjbGFzc2VzIH1cblx0XHRcdFx0eyAuLi5vdGhlclByb3BzIH1cblx0XHRcdD5cblx0XHRcdFx0eyBjaGlsZHJlbiB9XG5cdFx0XHQ8L1ZpZXc+XG5cdFx0KTtcblx0fVxuXG5cdGNvbnN0IGFuaW1hdGUgPSB7XG5cdFx0b3BhY2l0eTogMSxcblx0XHR0cmFuc2l0aW9uOiB7XG5cdFx0XHRkZWxheTogYW5pbWF0aW9uRW50ZXJEZWxheSxcblx0XHRcdGR1cmF0aW9uOiBhbmltYXRpb25FbnRlckR1cmF0aW9uLFxuXHRcdFx0ZWFzZTogJ2Vhc2VJbk91dCcsXG5cdFx0fSxcblx0XHR4OiAwLFxuXHR9O1xuXHRjb25zdCBpbml0aWFsID0ge1xuXHRcdG9wYWNpdHk6IDAsXG5cdFx0eDpcblx0XHRcdCggaXNSVEwoKSAmJiBsb2NhdGlvbi5pc0JhY2sgKSB8fCAoICEgaXNSVEwoKSAmJiAhIGxvY2F0aW9uLmlzQmFjayApXG5cdFx0XHRcdD8gNTBcblx0XHRcdFx0OiAtNTAsXG5cdH07XG5cdGNvbnN0IGV4aXQgPSB7XG5cdFx0ZGVsYXk6IGFuaW1hdGlvbkV4aXREZWxheSxcblx0XHRvcGFjaXR5OiAwLFxuXHRcdHg6XG5cdFx0XHQoICEgaXNSVEwoKSAmJiBsb2NhdGlvbi5pc0JhY2sgKSB8fCAoIGlzUlRMKCkgJiYgISBsb2NhdGlvbi5pc0JhY2sgKVxuXHRcdFx0XHQ/IDUwXG5cdFx0XHRcdDogLTUwLFxuXHRcdHRyYW5zaXRpb246IHtcblx0XHRcdGR1cmF0aW9uOiBhbmltYXRpb25FeGl0RHVyYXRpb24sXG5cdFx0XHRlYXNlOiAnZWFzZUluT3V0Jyxcblx0XHR9LFxuXHR9O1xuXG5cdGNvbnN0IGFuaW1hdGVkUHJvcHMgPSB7XG5cdFx0YW5pbWF0ZSxcblx0XHRleGl0LFxuXHRcdGluaXRpYWwsXG5cdH07XG5cblx0cmV0dXJuIChcblx0XHQ8bW90aW9uLmRpdlxuXHRcdFx0cmVmPXsgbWVyZ2VkV3JhcHBlclJlZiB9XG5cdFx0XHRjbGFzc05hbWU9eyBjbGFzc2VzIH1cblx0XHRcdHsgLi4ub3RoZXJQcm9wcyB9XG5cdFx0XHR7IC4uLmFuaW1hdGVkUHJvcHMgfVxuXHRcdD5cblx0XHRcdHsgY2hpbGRyZW4gfVxuXHRcdDwvbW90aW9uLmRpdj5cblx0KTtcbn1cblxuLyoqXG4gKiBUaGUgYE5hdmlnYXRvclNjcmVlbmAgY29tcG9uZW50IHJlcHJlc2VudHMgYSBzaW5nbGUgdmlldy9zY3JlZW4vcGFuZWwgYW5kXG4gKiBzaG91bGQgYmUgdXNlZCBpbiBjb21iaW5hdGlvbiB3aXRoIHRoZSBgTmF2aWdhdG9yUHJvdmlkZXJgLCB0aGVcbiAqIGBOYXZpZ2F0b3JCdXR0b25gIGFuZCB0aGUgYE5hdmlnYXRvckJhY2tCdXR0b25gIGNvbXBvbmVudHMgKG9yIHRoZSBgdXNlTmF2aWdhdG9yYFxuICogaG9vaykuXG4gKlxuICogQGV4YW1wbGVcbiAqIGBgYGpzeFxuICogaW1wb3J0IHtcbiAqICAgX19leHBlcmltZW50YWxOYXZpZ2F0b3JQcm92aWRlciBhcyBOYXZpZ2F0b3JQcm92aWRlcixcbiAqICAgX19leHBlcmltZW50YWxOYXZpZ2F0b3JTY3JlZW4gYXMgTmF2aWdhdG9yU2NyZWVuLFxuICogICBfX2V4cGVyaW1lbnRhbE5hdmlnYXRvckJ1dHRvbiBhcyBOYXZpZ2F0b3JCdXR0b24sXG4gKiAgIF9fZXhwZXJpbWVudGFsTmF2aWdhdG9yQmFja0J1dHRvbiBhcyBOYXZpZ2F0b3JCYWNrQnV0dG9uLFxuICogfSBmcm9tICdAd29yZHByZXNzL2NvbXBvbmVudHMnO1xuICpcbiAqIGNvbnN0IE15TmF2aWdhdGlvbiA9ICgpID0+IChcbiAqICAgPE5hdmlnYXRvclByb3ZpZGVyIGluaXRpYWxQYXRoPVwiL1wiPlxuICogICAgIDxOYXZpZ2F0b3JTY3JlZW4gcGF0aD1cIi9cIj5cbiAqICAgICAgIDxwPlRoaXMgaXMgdGhlIGhvbWUgc2NyZWVuLjwvcD5cbiAqICAgICAgICA8TmF2aWdhdG9yQnV0dG9uIHBhdGg9XCIvY2hpbGRcIj5cbiAqICAgICAgICAgIE5hdmlnYXRlIHRvIGNoaWxkIHNjcmVlbi5cbiAqICAgICAgIDwvTmF2aWdhdG9yQnV0dG9uPlxuICogICAgIDwvTmF2aWdhdG9yU2NyZWVuPlxuICpcbiAqICAgICA8TmF2aWdhdG9yU2NyZWVuIHBhdGg9XCIvY2hpbGRcIj5cbiAqICAgICAgIDxwPlRoaXMgaXMgdGhlIGNoaWxkIHNjcmVlbi48L3A+XG4gKiAgICAgICA8TmF2aWdhdG9yQmFja0J1dHRvbj5cbiAqICAgICAgICAgR28gYmFja1xuICogICAgICAgPC9OYXZpZ2F0b3JCYWNrQnV0dG9uPlxuICogICAgIDwvTmF2aWdhdG9yU2NyZWVuPlxuICogICA8L05hdmlnYXRvclByb3ZpZGVyPlxuICogKTtcbiAqIGBgYFxuICovXG5jb25zdCBDb25uZWN0ZWROYXZpZ2F0b3JTY3JlZW4gPSBjb250ZXh0Q29ubmVjdChcblx0TmF2aWdhdG9yU2NyZWVuLFxuXHQnTmF2aWdhdG9yU2NyZWVuJ1xuKTtcblxuZXhwb3J0IGRlZmF1bHQgQ29ubmVjdGVkTmF2aWdhdG9yU2NyZWVuO1xuIl19 */",
|
|
41
42
|
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
42
43
|
};
|
|
43
44
|
|
|
@@ -52,7 +53,7 @@ function NavigatorScreen(props, forwardedRef) {
|
|
|
52
53
|
const {
|
|
53
54
|
location
|
|
54
55
|
} = useContext(NavigatorContext);
|
|
55
|
-
const isMatch = location.path === path;
|
|
56
|
+
const isMatch = location.path === escapeAttribute(path);
|
|
56
57
|
const wrapperRef = useRef(null);
|
|
57
58
|
const previousLocation = usePrevious(location);
|
|
58
59
|
const cx = useCx();
|
|
@@ -130,44 +131,34 @@ function NavigatorScreen(props, forwardedRef) {
|
|
|
130
131
|
}, otherProps, animatedProps), children);
|
|
131
132
|
}
|
|
132
133
|
/**
|
|
133
|
-
* The `NavigatorScreen` component represents a single view/screen/panel
|
|
134
|
+
* The `NavigatorScreen` component represents a single view/screen/panel and
|
|
135
|
+
* should be used in combination with the `NavigatorProvider`, the
|
|
136
|
+
* `NavigatorButton` and the `NavigatorBackButton` components (or the `useNavigator`
|
|
137
|
+
* hook).
|
|
134
138
|
*
|
|
135
139
|
* @example
|
|
136
140
|
* ```jsx
|
|
137
141
|
* import {
|
|
138
142
|
* __experimentalNavigatorProvider as NavigatorProvider,
|
|
139
143
|
* __experimentalNavigatorScreen as NavigatorScreen,
|
|
140
|
-
*
|
|
144
|
+
* __experimentalNavigatorButton as NavigatorButton,
|
|
145
|
+
* __experimentalNavigatorBackButton as NavigatorBackButton,
|
|
141
146
|
* } from '@wordpress/components';
|
|
142
147
|
*
|
|
143
|
-
* function NavigatorButton( { path, ...props } ) {
|
|
144
|
-
* const { goTo } = useNavigator();
|
|
145
|
-
* return (
|
|
146
|
-
* <Button
|
|
147
|
-
* variant="primary"
|
|
148
|
-
* onClick={ () => goTo( path ) }
|
|
149
|
-
* { ...props }
|
|
150
|
-
* />
|
|
151
|
-
* );
|
|
152
|
-
* }
|
|
153
|
-
*
|
|
154
|
-
* function NavigatorBackButton( props ) {
|
|
155
|
-
* const { goBack } = useNavigator();
|
|
156
|
-
* return <Button variant="secondary" onClick={ () => goBack() } { ...props } />;
|
|
157
|
-
* }
|
|
158
|
-
*
|
|
159
148
|
* const MyNavigation = () => (
|
|
160
149
|
* <NavigatorProvider initialPath="/">
|
|
161
150
|
* <NavigatorScreen path="/">
|
|
162
151
|
* <p>This is the home screen.</p>
|
|
163
|
-
*
|
|
152
|
+
* <NavigatorButton path="/child">
|
|
164
153
|
* Navigate to child screen.
|
|
165
154
|
* </NavigatorButton>
|
|
166
155
|
* </NavigatorScreen>
|
|
167
156
|
*
|
|
168
157
|
* <NavigatorScreen path="/child">
|
|
169
158
|
* <p>This is the child screen.</p>
|
|
170
|
-
* <NavigatorBackButton>
|
|
159
|
+
* <NavigatorBackButton>
|
|
160
|
+
* Go back
|
|
161
|
+
* </NavigatorBackButton>
|
|
171
162
|
* </NavigatorScreen>
|
|
172
163
|
* </NavigatorProvider>
|
|
173
164
|
* );
|