@wordpress/components 35.0.0 → 35.1.1-next.v.202606191442.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 +47 -1
- package/build/alignment-matrix-control/cell.cjs +1 -1
- package/build/alignment-matrix-control/cell.cjs.map +2 -2
- package/build/alignment-matrix-control/index.cjs +1 -1
- package/build/alignment-matrix-control/index.cjs.map +2 -2
- package/build/angle-picker-control/angle-circle.cjs +1 -1
- package/build/angle-picker-control/angle-circle.cjs.map +2 -2
- package/build/angle-picker-control/index.cjs +2 -2
- package/build/autocomplete/get-autocomplete-match.cjs.map +1 -1
- package/build/autocomplete/index.cjs.map +1 -1
- package/build/base-control/styles/base-control-styles.cjs +6 -6
- package/build/base-control/styles/base-control-styles.cjs.map +2 -2
- package/build/border-control/styles.cjs +17 -14
- package/build/border-control/styles.cjs.map +2 -2
- package/build/button/index.cjs +3 -7
- package/build/button/index.cjs.map +2 -2
- package/build/card/card-divider/hook.cjs.map +2 -2
- package/build/color-palette/index.cjs +3 -0
- package/build/color-palette/index.cjs.map +2 -2
- package/build/color-picker/component.cjs.map +1 -1
- package/build/custom-gradient-picker/gradient-bar/index.cjs.map +2 -2
- package/build/date-time/utils.cjs.map +1 -1
- package/build/draggable/index.cjs +1 -1
- package/build/draggable/index.cjs.map +2 -2
- package/build/external-link/index.cjs +1 -1
- package/build/external-link/index.cjs.map +1 -1
- package/build/menu/popover.cjs.map +1 -1
- package/build/menu/styles.cjs +17 -17
- package/build/menu/styles.cjs.map +2 -2
- package/build/modal/index.cjs.map +1 -1
- package/build/modal/use-modal-exit-animation.cjs +37 -52
- package/build/modal/use-modal-exit-animation.cjs.map +2 -2
- package/build/navigable-container/container.cjs +15 -21
- package/build/navigable-container/container.cjs.map +2 -2
- package/build/palette-edit/index.cjs +1 -1
- package/build/progress-bar/index.cjs +1 -1
- package/build/progress-bar/index.cjs.map +2 -2
- package/build/query-controls/index.cjs +2 -2
- package/build/query-controls/index.cjs.map +2 -2
- package/build/range-control/index.cjs.map +1 -1
- package/build/sandbox/index.cjs +7 -1
- package/build/sandbox/index.cjs.map +2 -2
- package/build/snackbar/index.cjs +1 -1
- package/build/spinner/styles.cjs +4 -4
- package/build/spinner/styles.cjs.map +2 -2
- package/build/tabs/index.cjs +0 -18
- package/build/tabs/index.cjs.map +2 -2
- package/build/tabs/tablist.cjs +5 -15
- package/build/tabs/tablist.cjs.map +2 -2
- package/build/tools-panel/styles.cjs +13 -13
- package/build/tools-panel/styles.cjs.map +2 -2
- package/build/tools-panel/tools-panel/hook.cjs.map +1 -1
- package/build/tree-select/index.cjs +1 -1
- package/build/tree-select/index.cjs.map +1 -1
- package/build/truncate/utils.cjs +1 -1
- package/build/truncate/utils.cjs.map +1 -1
- package/build/unit-control/utils.cjs +33 -35
- package/build/unit-control/utils.cjs.map +2 -2
- package/build/utils/colors-values.cjs +12 -12
- package/build/utils/colors-values.cjs.map +2 -2
- package/build/utils/config-values.cjs +2 -2
- package/build/utils/config-values.cjs.map +2 -2
- package/build/utils/dropdown-motion.cjs.map +2 -2
- package/build/utils/strings.cjs.map +1 -1
- package/build-module/alignment-matrix-control/cell.mjs +1 -1
- package/build-module/alignment-matrix-control/cell.mjs.map +2 -2
- package/build-module/alignment-matrix-control/index.mjs +1 -1
- package/build-module/alignment-matrix-control/index.mjs.map +2 -2
- package/build-module/angle-picker-control/angle-circle.mjs +1 -1
- package/build-module/angle-picker-control/angle-circle.mjs.map +2 -2
- package/build-module/angle-picker-control/index.mjs +2 -2
- package/build-module/autocomplete/get-autocomplete-match.mjs.map +1 -1
- package/build-module/autocomplete/index.mjs.map +1 -1
- package/build-module/base-control/styles/base-control-styles.mjs +6 -6
- package/build-module/base-control/styles/base-control-styles.mjs.map +2 -2
- package/build-module/border-control/styles.mjs +17 -14
- package/build-module/border-control/styles.mjs.map +2 -2
- package/build-module/button/index.mjs +2 -5
- package/build-module/button/index.mjs.map +2 -2
- package/build-module/card/card-divider/hook.mjs.map +2 -2
- package/build-module/color-palette/index.mjs +3 -0
- package/build-module/color-palette/index.mjs.map +2 -2
- package/build-module/color-picker/component.mjs.map +1 -1
- package/build-module/custom-gradient-picker/gradient-bar/index.mjs.map +2 -2
- package/build-module/date-time/utils.mjs.map +1 -1
- package/build-module/draggable/index.mjs +1 -1
- package/build-module/draggable/index.mjs.map +2 -2
- package/build-module/external-link/index.mjs +1 -1
- package/build-module/external-link/index.mjs.map +1 -1
- package/build-module/menu/popover.mjs.map +1 -1
- package/build-module/menu/styles.mjs +17 -17
- package/build-module/menu/styles.mjs.map +2 -2
- package/build-module/modal/index.mjs.map +1 -1
- package/build-module/modal/use-modal-exit-animation.mjs +37 -52
- package/build-module/modal/use-modal-exit-animation.mjs.map +2 -2
- package/build-module/navigable-container/container.mjs +16 -22
- package/build-module/navigable-container/container.mjs.map +2 -2
- package/build-module/palette-edit/index.mjs +1 -1
- package/build-module/progress-bar/index.mjs +1 -1
- package/build-module/progress-bar/index.mjs.map +2 -2
- package/build-module/query-controls/index.mjs +2 -2
- package/build-module/query-controls/index.mjs.map +2 -2
- package/build-module/range-control/index.mjs.map +1 -1
- package/build-module/sandbox/index.mjs +3 -1
- package/build-module/sandbox/index.mjs.map +2 -2
- package/build-module/snackbar/index.mjs +1 -1
- package/build-module/spinner/styles.mjs +4 -4
- package/build-module/spinner/styles.mjs.map +2 -2
- package/build-module/tabs/index.mjs +1 -19
- package/build-module/tabs/index.mjs.map +2 -2
- package/build-module/tabs/tablist.mjs +5 -15
- package/build-module/tabs/tablist.mjs.map +2 -2
- package/build-module/tools-panel/styles.mjs +13 -13
- package/build-module/tools-panel/styles.mjs.map +2 -2
- package/build-module/tools-panel/tools-panel/hook.mjs.map +1 -1
- package/build-module/tree-select/index.mjs +1 -1
- package/build-module/tree-select/index.mjs.map +1 -1
- package/build-module/truncate/utils.mjs +1 -1
- package/build-module/truncate/utils.mjs.map +1 -1
- package/build-module/unit-control/utils.mjs +33 -35
- package/build-module/unit-control/utils.mjs.map +2 -2
- package/build-module/utils/colors-values.mjs +12 -12
- package/build-module/utils/colors-values.mjs.map +2 -2
- package/build-module/utils/config-values.mjs +2 -2
- package/build-module/utils/config-values.mjs.map +2 -2
- package/build-module/utils/dropdown-motion.mjs.map +2 -2
- package/build-module/utils/strings.mjs.map +1 -1
- package/build-style/style-rtl.css +122 -91
- package/build-style/style.css +122 -91
- package/build-types/base-control/styles/base-control-styles.d.ts.map +1 -1
- package/build-types/border-control/styles.d.ts.map +1 -1
- package/build-types/button/index.d.ts +0 -2
- package/build-types/button/index.d.ts.map +1 -1
- package/build-types/card/card-divider/hook.d.ts +1 -274
- package/build-types/card/card-divider/hook.d.ts.map +1 -1
- package/build-types/color-palette/index.d.ts.map +1 -1
- package/build-types/composite/stories/index.story.d.ts.map +1 -1
- package/build-types/confirm-dialog/stories/index.story.d.ts.map +1 -1
- package/build-types/custom-gradient-picker/gradient-bar/index.d.ts.map +1 -1
- package/build-types/dropdown/stories/index.story.d.ts.map +1 -1
- package/build-types/menu/styles.d.ts.map +1 -1
- package/build-types/menu/types.d.ts +2 -2
- package/build-types/navigable-container/container.d.ts.map +1 -1
- package/build-types/sandbox/index.d.ts +15 -0
- package/build-types/sandbox/index.d.ts.map +1 -1
- package/build-types/spinner/styles.d.ts.map +1 -1
- package/build-types/tabs/index.d.ts.map +1 -1
- package/build-types/tabs/tablist.d.ts.map +1 -1
- package/build-types/tools-panel/styles.d.ts.map +1 -1
- package/build-types/unit-control/utils.d.ts.map +1 -1
- package/build-types/utils/colors-values.d.ts.map +1 -1
- package/build-types/utils/dropdown-motion.d.ts.map +1 -1
- package/build-types/validated-form-controls/components/combobox-control.d.ts +1 -1
- package/package.json +44 -36
- package/src/angle-picker-control/angle-circle.tsx +3 -3
- package/src/base-control/README.md +2 -2
- package/src/base-control/styles/base-control-styles.ts +1 -0
- package/src/border-control/styles.ts +1 -0
- package/src/button/index.tsx +2 -4
- package/src/button/style.scss +3 -3
- package/src/card/card/README.md +4 -4
- package/src/card/card-divider/hook.ts +5 -1
- package/src/card/test/__snapshots__/index.tsx.snap +3 -3
- package/src/checkbox-control/README.md +1 -1
- package/src/clipboard-button/README.md +4 -4
- package/src/color-palette/index.tsx +5 -0
- package/src/color-palette/test/index.tsx +30 -0
- package/src/combobox-control/README.md +1 -1
- package/src/composite/stories/index.story.tsx +5 -0
- package/src/confirm-dialog/README.md +1 -1
- package/src/confirm-dialog/stories/index.story.tsx +1 -0
- package/src/custom-gradient-picker/gradient-bar/index.tsx +1 -1
- package/src/dropdown/stories/index.story.tsx +5 -0
- package/src/dropdown-menu/style.scss +1 -1
- package/src/external-link/style.scss +4 -4
- package/src/flex/flex/README.md +1 -1
- package/src/form-toggle/style.scss +1 -1
- package/src/heading/test/__snapshots__/index.tsx.snap +4 -4
- package/src/menu/README.md +2 -2
- package/src/menu/styles.ts +2 -0
- package/src/menu/test/index.tsx +120 -87
- package/src/menu/types.ts +2 -2
- package/src/modal/style.scss +1 -1
- package/src/modal/use-modal-exit-animation.ts +2 -2
- package/src/navigable-container/container.tsx +22 -30
- package/src/notice/style.scss +11 -13
- package/src/panel/README.md +2 -0
- package/src/panel/stories/index.story.tsx +2 -2
- package/src/panel/style.scss +1 -1
- package/src/popover/README.md +1 -1
- package/src/radio-control/style.scss +1 -1
- package/src/sandbox/index.tsx +18 -1
- package/src/sandbox/test/index.tsx +44 -1
- package/src/scrollable/README.md +1 -1
- package/src/spinner/styles.ts +1 -0
- package/src/tab-panel/style.scss +6 -6
- package/src/tabs/index.tsx +1 -26
- package/src/tabs/tablist.tsx +5 -21
- package/src/tabs/test/index.tsx +16 -27
- package/src/text/test/__snapshots__/index.tsx.snap +3 -3
- package/src/toggle-group-control/test/__snapshots__/index.tsx.snap +34 -26
- package/src/toolbar/toolbar-group/style.scss +2 -2
- package/src/tools-panel/styles.ts +1 -1
- package/src/tooltip/stories/index.story.tsx +2 -2
- package/src/tooltip/style.scss +1 -1
- package/src/unit-control/utils.ts +33 -52
- package/src/utils/colors-values.js +36 -16
- package/src/utils/config-values.js +2 -2
- package/src/utils/dropdown-motion.ts +6 -4
- package/src/utils/theme-variables.scss +18 -13
- package/build/mobile/image/constants.cjs +0 -34
- package/build/mobile/image/constants.cjs.map +0 -7
- package/build-module/mobile/image/constants.mjs +0 -9
- package/build-module/mobile/image/constants.mjs.map +0 -7
- package/build-types/mobile/image/constants.d.ts +0 -5
- package/build-types/mobile/image/constants.d.ts.map +0 -1
- package/src/autocomplete/autocompleter-ui.native.js +0 -211
- package/src/autocomplete/background-view.android.js +0 -25
- package/src/autocomplete/background-view.ios.js +0 -23
- package/src/autocomplete/style.android.scss +0 -7
- package/src/autocomplete/style.native.scss +0 -74
- package/src/base-control/index.native.js +0 -14
- package/src/button/index.native.js +0 -236
- package/src/button/style.native.scss +0 -9
- package/src/color-control/index.native.js +0 -24
- package/src/color-indicator/index.native.js +0 -80
- package/src/color-indicator/style.native.scss +0 -51
- package/src/color-palette/index.native.js +0 -360
- package/src/color-palette/style.native.scss +0 -49
- package/src/color-picker/hsv-color-picker.native.js +0 -88
- package/src/color-picker/hue-picker.native.js +0 -198
- package/src/color-picker/index.native.js +0 -215
- package/src/color-picker/saturation-picker.native.js +0 -167
- package/src/color-picker/style.native.scss +0 -87
- package/src/custom-gradient-picker/index.native.js +0 -110
- package/src/custom-gradient-picker/style.native.scss +0 -3
- package/src/dashicon/index.native.js +0 -18
- package/src/disabled/index.native.js +0 -10
- package/src/draggable/index.native.js +0 -234
- package/src/draggable/style.native.scss +0 -3
- package/src/draggable/test/index.native.js +0 -138
- package/src/dropdown/index.native.js +0 -59
- package/src/dropdown-menu/index.native.js +0 -152
- package/src/external-link/index.native.js +0 -25
- package/src/focal-point-picker/focal-point.native.js +0 -30
- package/src/focal-point-picker/index.native.js +0 -281
- package/src/focal-point-picker/tooltip/index.native.js +0 -144
- package/src/focal-point-picker/tooltip/style.native.scss +0 -42
- package/src/font-size-picker/index.native.js +0 -190
- package/src/font-size-picker/style.native.scss +0 -6
- package/src/footer-message-control/index.native.js +0 -14
- package/src/higher-order/with-focus-outside/index.native.js +0 -38
- package/src/index.native.js +0 -134
- package/src/keyboard-shortcuts/index.native.js +0 -2
- package/src/mobile/README.md +0 -3
- package/src/mobile/autocompletion-items.native.js +0 -11
- package/src/mobile/badge/README.md +0 -31
- package/src/mobile/badge/index.native.js +0 -27
- package/src/mobile/badge/style.scss +0 -18
- package/src/mobile/bottom-sheet/borderStyles.android.scss +0 -8
- package/src/mobile/bottom-sheet/borderStyles.ios.scss +0 -9
- package/src/mobile/bottom-sheet/bottom-sheet-context.native.js +0 -40
- package/src/mobile/bottom-sheet/bottom-sheet-navigation/README.md +0 -101
- package/src/mobile/bottom-sheet/bottom-sheet-navigation/bottom-sheet-navigation-context.native.js +0 -16
- package/src/mobile/bottom-sheet/bottom-sheet-navigation/navigation-container.native.js +0 -193
- package/src/mobile/bottom-sheet/bottom-sheet-navigation/navigation-screen.native.js +0 -146
- package/src/mobile/bottom-sheet/bottom-sheet-navigation/styles.native.scss +0 -11
- package/src/mobile/bottom-sheet/bottom-sheet-navigation/test/navigation-container.native.js +0 -197
- package/src/mobile/bottom-sheet/button.native.js +0 -19
- package/src/mobile/bottom-sheet/cell.native.js +0 -464
- package/src/mobile/bottom-sheet/cellStyles.android.scss +0 -15
- package/src/mobile/bottom-sheet/cellStyles.ios.scss +0 -19
- package/src/mobile/bottom-sheet/chevron-back.native.js +0 -18
- package/src/mobile/bottom-sheet/color-cell.native.js +0 -35
- package/src/mobile/bottom-sheet/cycle-picker-cell.native.js +0 -31
- package/src/mobile/bottom-sheet/footer-message-cell.native.js +0 -23
- package/src/mobile/bottom-sheet/footer-message-link/README.md +0 -37
- package/src/mobile/bottom-sheet/footer-message-link/footer-message-link.native.js +0 -26
- package/src/mobile/bottom-sheet/footer-message-link/styles.native.scss +0 -7
- package/src/mobile/bottom-sheet/index.native.js +0 -646
- package/src/mobile/bottom-sheet/keyboard-avoiding-view.native.js +0 -125
- package/src/mobile/bottom-sheet/link-cell.native.js +0 -35
- package/src/mobile/bottom-sheet/link-suggestion-item-cell.native.js +0 -92
- package/src/mobile/bottom-sheet/link-suggestion-styles.native.scss +0 -27
- package/src/mobile/bottom-sheet/lock-icon/index.native.js +0 -19
- package/src/mobile/bottom-sheet/lock-icon/styles.native.scss +0 -8
- package/src/mobile/bottom-sheet/nav-bar/README.md +0 -63
- package/src/mobile/bottom-sheet/nav-bar/action-button.native.js +0 -30
- package/src/mobile/bottom-sheet/nav-bar/apply-button.native.js +0 -53
- package/src/mobile/bottom-sheet/nav-bar/back-button.native.js +0 -94
- package/src/mobile/bottom-sheet/nav-bar/heading.native.js +0 -33
- package/src/mobile/bottom-sheet/nav-bar/index.native.js +0 -23
- package/src/mobile/bottom-sheet/nav-bar/styles.native.scss +0 -69
- package/src/mobile/bottom-sheet/picker-cell.native.js +0 -40
- package/src/mobile/bottom-sheet/radio-cell.native.js +0 -39
- package/src/mobile/bottom-sheet/range-cell.native.js +0 -274
- package/src/mobile/bottom-sheet/range-cell.native.scss +0 -40
- package/src/mobile/bottom-sheet/range-text-input.native.js +0 -248
- package/src/mobile/bottom-sheet/ripple.native.js +0 -83
- package/src/mobile/bottom-sheet/ripple.native.scss +0 -11
- package/src/mobile/bottom-sheet/stepper-cell/index.native.js +0 -264
- package/src/mobile/bottom-sheet/stepper-cell/stepper.android.js +0 -78
- package/src/mobile/bottom-sheet/stepper-cell/stepper.ios.js +0 -64
- package/src/mobile/bottom-sheet/stepper-cell/style.native.scss +0 -89
- package/src/mobile/bottom-sheet/styles.native.scss +0 -333
- package/src/mobile/bottom-sheet/sub-sheet/README.md +0 -90
- package/src/mobile/bottom-sheet/sub-sheet/index.native.js +0 -49
- package/src/mobile/bottom-sheet/switch-cell.native.js +0 -75
- package/src/mobile/bottom-sheet/test/index.native.js +0 -24
- package/src/mobile/bottom-sheet/test/range-cell.native.js +0 -73
- package/src/mobile/bottom-sheet-select-control/README.md +0 -97
- package/src/mobile/bottom-sheet-select-control/index.native.js +0 -124
- package/src/mobile/bottom-sheet-select-control/style.native.scss +0 -3
- package/src/mobile/bottom-sheet-text-control/README.md +0 -98
- package/src/mobile/bottom-sheet-text-control/index.native.js +0 -104
- package/src/mobile/bottom-sheet-text-control/styles.scss +0 -25
- package/src/mobile/clipboard/index.native.js +0 -18
- package/src/mobile/color-settings/gradient-picker-screen.native.js +0 -37
- package/src/mobile/color-settings/index.native.js +0 -88
- package/src/mobile/color-settings/palette.screen.native.js +0 -232
- package/src/mobile/color-settings/picker-screen.native.js +0 -60
- package/src/mobile/color-settings/style.native.scss +0 -62
- package/src/mobile/color-settings/utils.native.js +0 -36
- package/src/mobile/cycle-select-control/README.md +0 -3
- package/src/mobile/cycle-select-control/index.native.js +0 -39
- package/src/mobile/dashicons/index.native.js +0 -22
- package/src/mobile/focal-point-settings-panel/index.native.js +0 -84
- package/src/mobile/focal-point-settings-panel/styles.native.scss +0 -3
- package/src/mobile/gradient/index.native.js +0 -188
- package/src/mobile/gradient/style.native.scss +0 -8
- package/src/mobile/gradient/test/index.native.js +0 -114
- package/src/mobile/gridicons/index.native.js +0 -39
- package/src/mobile/html-text-input/index.native.js +0 -169
- package/src/mobile/html-text-input/style.android.scss +0 -8
- package/src/mobile/html-text-input/style.ios.scss +0 -10
- package/src/mobile/html-text-input/style.scss +0 -45
- package/src/mobile/html-text-input/test/__snapshots__/index.native.js.snap +0 -48
- package/src/mobile/html-text-input/test/index.native.js +0 -118
- package/src/mobile/image/constants.js +0 -1
- package/src/mobile/image/icon-customize.native.js +0 -10
- package/src/mobile/image/icon-retry.native.js +0 -11
- package/src/mobile/image/image-editing-button.native.js +0 -63
- package/src/mobile/image/index.native.js +0 -401
- package/src/mobile/image/style.native.scss +0 -179
- package/src/mobile/image/utils/index.native.js +0 -58
- package/src/mobile/keyboard-avoiding-view/index.android.js +0 -8
- package/src/mobile/keyboard-avoiding-view/index.ios.js +0 -143
- package/src/mobile/keyboard-avoiding-view/styles.native.scss +0 -9
- package/src/mobile/keyboard-aware-flat-list/index.android.js +0 -81
- package/src/mobile/keyboard-aware-flat-list/index.ios.js +0 -147
- package/src/mobile/keyboard-aware-flat-list/shared.native.js +0 -26
- package/src/mobile/keyboard-aware-flat-list/styles.native.scss +0 -8
- package/src/mobile/keyboard-aware-flat-list/test/use-keyboard-offset.native.js +0 -203
- package/src/mobile/keyboard-aware-flat-list/test/use-scroll-to-section.native.js +0 -142
- package/src/mobile/keyboard-aware-flat-list/test/use-scroll.native.js +0 -71
- package/src/mobile/keyboard-aware-flat-list/test/use-text-input-caret-position.native.js +0 -82
- package/src/mobile/keyboard-aware-flat-list/test/use-text-input-offset.native.js +0 -147
- package/src/mobile/keyboard-aware-flat-list/use-keyboard-offset.native.js +0 -87
- package/src/mobile/keyboard-aware-flat-list/use-scroll-to-element.native.js +0 -41
- package/src/mobile/keyboard-aware-flat-list/use-scroll-to-section.native.js +0 -100
- package/src/mobile/keyboard-aware-flat-list/use-scroll.native.js +0 -100
- package/src/mobile/keyboard-aware-flat-list/use-text-input-caret-position.native.js +0 -36
- package/src/mobile/keyboard-aware-flat-list/use-text-input-offset.native.js +0 -54
- package/src/mobile/layout-animation/index.native.js +0 -16
- package/src/mobile/link-picker/index.native.js +0 -160
- package/src/mobile/link-picker/link-picker-results.native.js +0 -129
- package/src/mobile/link-picker/link-picker-screen.native.js +0 -60
- package/src/mobile/link-picker/styles.native.scss +0 -45
- package/src/mobile/link-picker/test/performance/index.native.js +0 -35
- package/src/mobile/link-settings/index.native.js +0 -332
- package/src/mobile/link-settings/link-rel.native.js +0 -10
- package/src/mobile/link-settings/link-settings-navigation.native.js +0 -50
- package/src/mobile/link-settings/link-settings-screen.native.js +0 -44
- package/src/mobile/link-settings/style.native.scss +0 -4
- package/src/mobile/link-settings/test/edit.native.js +0 -325
- package/src/mobile/link-settings/test/link-settings-navigation.native.js +0 -94
- package/src/mobile/media-edit/index.native.js +0 -125
- package/src/mobile/picker/index.android.js +0 -104
- package/src/mobile/picker/index.ios.js +0 -96
- package/src/mobile/picker/styles.native.scss +0 -29
- package/src/mobile/segmented-control/index.native.js +0 -186
- package/src/mobile/segmented-control/style.native.scss +0 -99
- package/src/mobile/utils/alignments.native.js +0 -78
- package/src/mobile/utils/get-px-from-css-unit.native.js +0 -329
- package/src/mobile/utils/index.native.js +0 -12
- package/src/mobile/utils/test/get-px-from-css-unit.native.js +0 -172
- package/src/mobile/utils/test/index.native.js +0 -134
- package/src/mobile/utils/use-is-floating-keyboard.native.js +0 -31
- package/src/mobile/utils/use-unit-converter-to-mobile.native.js +0 -90
- package/src/notice/index.native.js +0 -123
- package/src/notice/list.native.js +0 -55
- package/src/notice/style.native.scss +0 -60
- package/src/panel/actions.native.js +0 -46
- package/src/panel/actions.native.scss +0 -12
- package/src/panel/body.native.js +0 -29
- package/src/panel/body.native.scss +0 -11
- package/src/panel/bottom-separator-cover.native.js +0 -27
- package/src/panel/bottom-separator-cover.native.scss +0 -9
- package/src/private-apis.native.js +0 -13
- package/src/query-controls/index.native.js +0 -103
- package/src/radio-control/index.native.js +0 -24
- package/src/range-control/index.native.js +0 -73
- package/src/resizable-box/index.native.js +0 -32
- package/src/resizable-box/style.native.scss +0 -14
- package/src/sandbox/index.native.js +0 -392
- package/src/sandbox/style.native.scss +0 -7
- package/src/search-control/index.native.js +0 -274
- package/src/search-control/platform-style.android.scss +0 -57
- package/src/search-control/platform-style.ios.scss +0 -43
- package/src/search-control/style.native.scss +0 -63
- package/src/select-control/index.native.js +0 -41
- package/src/slot-fill/index.native.js +0 -25
- package/src/spinner/index.native.js +0 -22
- package/src/spinner/style.native.scss +0 -4
- package/src/style-provider/index.native.js +0 -3
- package/src/text/index.native.js +0 -13
- package/src/text/styles/emotion-css.native.js +0 -6
- package/src/text/styles/font-family.native.js +0 -1
- package/src/text/styles/text-mixins.native.js +0 -163
- package/src/text-control/index.native.js +0 -41
- package/src/textarea-control/index.native.js +0 -26
- package/src/toggle-control/index.native.js +0 -31
- package/src/toolbar/toolbar/style.native.scss +0 -11
- package/src/toolbar/toolbar/toolbar-container.native.js +0 -8
- package/src/toolbar/toolbar-button/toolbar-button-container.native.js +0 -8
- package/src/toolbar/toolbar-group/style.native.scss +0 -10
- package/src/toolbar/toolbar-group/toolbar-group-collapsed.native.js +0 -36
- package/src/toolbar/toolbar-group/toolbar-group-container.native.js +0 -26
- package/src/toolbar/toolbar-item/index.native.js +0 -17
- package/src/tooltip/index.native.js +0 -292
- package/src/tooltip/style.native.scss +0 -39
- package/src/tooltip/test/index.native.js +0 -98
- package/src/unit-control/index.native.js +0 -202
- package/src/unit-control/style.native.scss +0 -19
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/sandbox/index.tsx"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { renderToString, useRef, useState, useEffect, useMemo } from '@wordpress/element';\nimport { useFocusableIframe, useMergeRefs } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst observeAndResizeJS = function () {\n const {\n MutationObserver\n } = window;\n if (!MutationObserver || !document.body || !window.parent) {\n return;\n }\n function sendResize() {\n const clientBoundingRect = document.body.getBoundingClientRect();\n window.parent.postMessage({\n action: 'resize',\n width: clientBoundingRect.width,\n height: clientBoundingRect.height\n }, '*');\n }\n const observer = new MutationObserver(sendResize);\n observer.observe(document.body, {\n attributes: true,\n attributeOldValue: false,\n characterData: true,\n characterDataOldValue: false,\n childList: true,\n subtree: true\n });\n window.addEventListener('load', sendResize, true);\n\n // Hack: Remove viewport unit styles, as these are relative\n // the iframe root and interfere with our mechanism for\n // determining the unconstrained page bounds.\n function removeViewportStyles(ruleOrNode) {\n if (ruleOrNode.style) {\n ['width', 'height', 'minHeight', 'maxHeight'].forEach(function (style) {\n if (/^\\\\d+(vw|vh|svw|lvw|dvw|svh|lvh|dvh|vi|svi|lvi|dvi|vb|svb|lvb|dvb|vmin|svmin|lvmin|dvmin|vmax|svmax|lvmax|dvmax)$/.test(ruleOrNode.style[style])) {\n ruleOrNode.style[style] = '';\n }\n });\n }\n }\n Array.prototype.forEach.call(document.querySelectorAll('[style]'), removeViewportStyles);\n Array.prototype.forEach.call(document.styleSheets, function (stylesheet) {\n Array.prototype.forEach.call(stylesheet.cssRules || stylesheet.rules, removeViewportStyles);\n });\n document.body.style.position = 'absolute';\n document.body.style.width = '100%';\n document.body.setAttribute('data-resizable-iframe-connected', '');\n sendResize();\n\n // Resize events can change the width of elements with 100% width, but we don't\n // get an DOM mutations for that, so do the resize when the window is resized, too.\n window.addEventListener('resize', sendResize, true);\n};\n\n// TODO: These styles shouldn't be coupled with WordPress.\nconst style = `\n\tbody {\n\t\tmargin: 0;\n\t}\n\thtml,\n\tbody,\n\tbody > div {\n\t\twidth: 100%;\n\t}\n\thtml.wp-has-aspect-ratio,\n\tbody.wp-has-aspect-ratio,\n\tbody.wp-has-aspect-ratio > div,\n\tbody.wp-has-aspect-ratio > div iframe {\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\toverflow: hidden; /* If it has an aspect ratio, it shouldn't scroll. */\n\t}\n\tbody > div > * {\n\t\tmargin-top: 0 !important; /* Has to have !important to override inline styles. */\n\t\tmargin-bottom: 0 !important;\n\t}\n`;\n\n/**\n * Builds the full HTML document string for the sandbox iframe content.\n */\nfunction buildSandBoxDocument({\n html,\n title,\n type,\n styles,\n scripts\n}) {\n const htmlDoc = /*#__PURE__*/_jsxs(\"html\", {\n lang: document.documentElement.lang,\n className: type,\n children: [/*#__PURE__*/_jsxs(\"head\", {\n children: [/*#__PURE__*/_jsx(\"title\", {\n children: title\n }), /*#__PURE__*/_jsx(\"style\", {\n dangerouslySetInnerHTML: {\n __html: style\n }\n }), styles.map((rules, i) => /*#__PURE__*/_jsx(\"style\", {\n dangerouslySetInnerHTML: {\n __html: rules\n }\n }, i))]\n }), /*#__PURE__*/_jsxs(\"body\", {\n \"data-resizable-iframe-connected\": \"data-resizable-iframe-connected\",\n className: type,\n children: [/*#__PURE__*/_jsx(\"div\", {\n dangerouslySetInnerHTML: {\n __html: html\n }\n }), /*#__PURE__*/_jsx(\"script\", {\n type: \"text/javascript\",\n dangerouslySetInnerHTML: {\n __html: `(${observeAndResizeJS.toString()})();`\n }\n }), scripts.map(src => /*#__PURE__*/_jsx(\"script\", {\n src: src\n }, src))]\n })]\n });\n return '<!DOCTYPE html>' + renderToString(htmlDoc);\n}\n\n/**\n * Isolated sandbox that uses the `srcdoc` attribute to render content\n * without `allow-same-origin`. This is the default for user-controlled\n * content (e.g., the HTML block) where same-origin access would be a\n * security risk.\n *\n * Because `srcdoc` is a declarative attribute, the browser automatically\n * re-renders the content when the iframe is moved in the DOM (e.g.,\n * block reordering), so no `load` event listener is needed.\n * The `message` listener is re-synced on every `load` so\n * it follows the iframe if it's reparented into a different document.\n */\nfunction IsolatedSandBox({\n html = '',\n title = '',\n type,\n styles = [],\n scripts = [],\n onFocus,\n tabIndex\n}) {\n const ref = useRef(null);\n const [width, setWidth] = useState(0);\n const [height, setHeight] = useState(0);\n const srcDoc = useMemo(() => buildSandBoxDocument({\n html,\n title,\n type,\n styles,\n scripts\n }), [html, title, type, styles, scripts]);\n useEffect(() => {\n const iframe = ref.current;\n if (!iframe) {\n return;\n }\n function checkMessageForResize(event) {\n // Verify that the mounted element is the source of the message.\n // iframe.contentWindow is accessible cross-origin as a\n // WindowProxy reference, so this check still works without\n // allow-same-origin.\n if (!iframe || iframe.contentWindow !== event.source) {\n return;\n }\n\n // Attempt to parse the message data as JSON if passed as string.\n let data = event.data || {};\n if ('string' === typeof data) {\n try {\n data = JSON.parse(data);\n } catch {}\n }\n\n // Update the state only if the message is formatted as we expect,\n // i.e. as an object with a 'resize' action.\n if ('resize' !== data.action) {\n return;\n }\n setWidth(data.width);\n setHeight(data.height);\n }\n let currentView = null;\n function syncListener() {\n const view = iframe?.ownerDocument?.defaultView ?? null;\n if (view === currentView) {\n return;\n }\n currentView?.removeEventListener('message', checkMessageForResize);\n currentView = view;\n currentView?.addEventListener('message', checkMessageForResize);\n }\n syncListener();\n iframe.addEventListener('load', syncListener);\n return () => {\n iframe.removeEventListener('load', syncListener);\n currentView?.removeEventListener('message', checkMessageForResize);\n };\n }, []);\n return /*#__PURE__*/_jsx(\"iframe\", {\n ref: useMergeRefs([ref, useFocusableIframe()]),\n title: title,\n tabIndex: tabIndex,\n className: \"components-sandbox\",\n sandbox: \"allow-scripts allow-presentation\",\n srcDoc: srcDoc,\n onFocus: onFocus,\n width: Math.ceil(width),\n height: Math.ceil(height)\n });\n}\n\n/**\n * Same-origin sandbox that writes to `contentDocument` directly. This\n * preserves the parent page's URL as the iframe's document URL, which\n * provides a valid Referer header for nested iframes (required by\n * providers like YouTube).\n *\n * Only used when `allowSameOrigin` is true \u2014 i.e., for server-fetched\n * oEmbed previews that are not directly user-controlled.\n *\n * This implementation is intentionally kept close to the original\n * pre-refactor code to preserve past bugfixes:\n * - load listener for iframe re-initialization after DOM moves (#21916)\n * - forceRerender guard to avoid unnecessary full rewrites (#20176)\n */\nfunction SameOriginSandBox({\n html = '',\n title = '',\n type,\n styles = [],\n scripts = [],\n onFocus,\n tabIndex\n}) {\n const ref = useRef(null);\n const [width, setWidth] = useState(0);\n const [height, setHeight] = useState(0);\n function isFrameAccessible() {\n try {\n return !!ref.current?.contentDocument?.body;\n } catch {\n return false;\n }\n }\n function trySandBox(forceRerender = false) {\n if (!isFrameAccessible()) {\n return;\n }\n const {\n contentDocument,\n ownerDocument\n } = ref.current;\n if (!forceRerender && null !== contentDocument?.body.getAttribute('data-resizable-iframe-connected')) {\n return;\n }\n\n // Put the html snippet into a html document, and then write it to the iframe's document\n // we can use this in the future to inject custom styles or scripts.\n // Scripts go into the body rather than the head, to support embedded content such as Instagram\n // that expect the scripts to be part of the body.\n const htmlDoc = /*#__PURE__*/_jsxs(\"html\", {\n lang: ownerDocument.documentElement.lang,\n className: type,\n children: [/*#__PURE__*/_jsxs(\"head\", {\n children: [/*#__PURE__*/_jsx(\"title\", {\n children: title\n }), /*#__PURE__*/_jsx(\"style\", {\n dangerouslySetInnerHTML: {\n __html: style\n }\n }), styles.map((rules, i) => /*#__PURE__*/_jsx(\"style\", {\n dangerouslySetInnerHTML: {\n __html: rules\n }\n }, i))]\n }), /*#__PURE__*/_jsxs(\"body\", {\n \"data-resizable-iframe-connected\": \"data-resizable-iframe-connected\",\n className: type,\n children: [/*#__PURE__*/_jsx(\"div\", {\n dangerouslySetInnerHTML: {\n __html: html\n }\n }), /*#__PURE__*/_jsx(\"script\", {\n type: \"text/javascript\",\n dangerouslySetInnerHTML: {\n __html: `(${observeAndResizeJS.toString()})();`\n }\n }), scripts.map(src => /*#__PURE__*/_jsx(\"script\", {\n src: src\n }, src))]\n })]\n });\n\n // Writing the document like this makes it act in the same way as if it was\n // loaded over the network, so DOM creation and mutation, script execution, etc.\n // all work as expected.\n contentDocument.open();\n contentDocument.write('<!DOCTYPE html>' + renderToString(htmlDoc));\n contentDocument.close();\n }\n useEffect(() => {\n trySandBox();\n function tryNoForceSandBox() {\n trySandBox(false);\n }\n function checkMessageForResize(event) {\n const iframe = ref.current;\n\n // Verify that the mounted element is the source of the message.\n if (!iframe || iframe.contentWindow !== event.source) {\n return;\n }\n\n // Attempt to parse the message data as JSON if passed as string.\n let data = event.data || {};\n if ('string' === typeof data) {\n try {\n data = JSON.parse(data);\n } catch {}\n }\n\n // Update the state only if the message is formatted as we expect,\n // i.e. as an object with a 'resize' action.\n if ('resize' !== data.action) {\n return;\n }\n setWidth(data.width);\n setHeight(data.height);\n }\n const iframe = ref.current;\n const defaultView = iframe?.ownerDocument?.defaultView;\n\n // This used to be registered using <iframe onLoad={} />, but it made the iframe blank\n // after reordering the containing block. See these two issues for more details:\n // https://github.com/WordPress/gutenberg/issues/6146\n // https://github.com/facebook/react/issues/18752\n iframe?.addEventListener('load', tryNoForceSandBox, false);\n defaultView?.addEventListener('message', checkMessageForResize);\n return () => {\n iframe?.removeEventListener('load', tryNoForceSandBox, false);\n defaultView?.removeEventListener('message', checkMessageForResize);\n };\n // Passing `exhaustive-deps` will likely involve a more detailed refactor.\n // See https://github.com/WordPress/gutenberg/pull/44378\n }, []);\n useEffect(() => {\n trySandBox();\n // Passing `exhaustive-deps` will likely involve a more detailed refactor.\n // See https://github.com/WordPress/gutenberg/pull/44378\n }, [title, styles, scripts]);\n useEffect(() => {\n trySandBox(true);\n // Passing `exhaustive-deps` will likely involve a more detailed refactor.\n // See https://github.com/WordPress/gutenberg/pull/44378\n }, [html, type]);\n return /*#__PURE__*/_jsx(\"iframe\", {\n ref: useMergeRefs([ref, useFocusableIframe()]),\n title: title,\n tabIndex: tabIndex,\n className: \"components-sandbox\",\n sandbox: \"allow-scripts allow-same-origin allow-presentation\",\n onFocus: onFocus,\n width: Math.ceil(width),\n height: Math.ceil(height)\n });\n}\n\n/**\n * This component provides an isolated environment for arbitrary HTML via iframes.\n *\n * ```jsx\n * import { SandBox } from '@wordpress/components';\n *\n * const MySandBox = () => (\n * \t<SandBox html=\"<p>Content</p>\" title=\"SandBox\" type=\"embed\" />\n * );\n * ```\n */\nfunction SandBox({\n allowSameOrigin = false,\n ...contentProps\n}) {\n if (allowSameOrigin) {\n return /*#__PURE__*/_jsx(SameOriginSandBox, {\n ...contentProps\n });\n }\n return /*#__PURE__*/_jsx(IsolatedSandBox, {\n ...contentProps\n });\n}\nexport default SandBox;"],
|
|
5
|
-
"mappings": ";AAGA,SAAS,gBAAgB,QAAQ,UAAU,WAAW,eAAe;AACrE,SAAS,oBAAoB,oBAAoB;AAKjD,SAAS,OAAO,MAAM,QAAQ,aAAa;
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { renderToString, useRef, useState, useEffect, useMemo } from '@wordpress/element';\nimport { useFocusableIframe, useMergeRefs } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\n/**\n * Matches CSS viewport-relative length values such as `100vh`, `50.5vw`,\n * and `.5dvh`. Used to strip viewport units from user-supplied HTML inside\n * the sandbox iframe, because those units are relative to the iframe's\n * own size and would create a measurement feedback loop with the\n * resize observer.\n *\n * Exported for tests. NOTE: an identical regex literal is duplicated\n * inside `observeAndResizeJS` below because that function is serialized\n * via `.toString()` and embedded into the iframe's `srcdoc` — it has no\n * access to this module's scope at runtime. If you change one, change\n * the other; the \"is embedded in the sandbox iframe srcdoc\" test\n * guards against drift.\n */\nexport const VIEWPORT_UNIT_VALUE_REGEX = /^\\d*\\.?\\d+(?:vw|vh|svw|lvw|dvw|svh|lvh|dvh|vi|svi|lvi|dvi|vb|svb|lvb|dvb|vmin|svmin|lvmin|dvmin|vmax|svmax|lvmax|dvmax)$/;\nconst observeAndResizeJS = function () {\n const {\n MutationObserver\n } = window;\n if (!MutationObserver || !document.body || !window.parent) {\n return;\n }\n function sendResize() {\n const clientBoundingRect = document.body.getBoundingClientRect();\n window.parent.postMessage({\n action: 'resize',\n width: clientBoundingRect.width,\n height: clientBoundingRect.height\n }, '*');\n }\n const observer = new MutationObserver(sendResize);\n observer.observe(document.body, {\n attributes: true,\n attributeOldValue: false,\n characterData: true,\n characterDataOldValue: false,\n childList: true,\n subtree: true\n });\n window.addEventListener('load', sendResize, true);\n\n // Hack: Remove viewport unit styles, as these are relative\n // the iframe root and interfere with our mechanism for\n // determining the unconstrained page bounds.\n function removeViewportStyles(ruleOrNode) {\n if (ruleOrNode.style) {\n ['width', 'height', 'minHeight', 'maxHeight'].forEach(function (style) {\n if (/^\\d*\\.?\\d+(?:vw|vh|svw|lvw|dvw|svh|lvh|dvh|vi|svi|lvi|dvi|vb|svb|lvb|dvb|vmin|svmin|lvmin|dvmin|vmax|svmax|lvmax|dvmax)$/.test(ruleOrNode.style[style])) {\n ruleOrNode.style[style] = '';\n }\n });\n }\n }\n Array.prototype.forEach.call(document.querySelectorAll('[style]'), removeViewportStyles);\n Array.prototype.forEach.call(document.styleSheets, function (stylesheet) {\n Array.prototype.forEach.call(stylesheet.cssRules || stylesheet.rules, removeViewportStyles);\n });\n document.body.style.position = 'absolute';\n document.body.style.width = '100%';\n document.body.setAttribute('data-resizable-iframe-connected', '');\n sendResize();\n\n // Resize events can change the width of elements with 100% width, but we don't\n // get an DOM mutations for that, so do the resize when the window is resized, too.\n window.addEventListener('resize', sendResize, true);\n};\n\n// TODO: These styles shouldn't be coupled with WordPress.\nconst style = `\n\tbody {\n\t\tmargin: 0;\n\t}\n\thtml,\n\tbody,\n\tbody > div {\n\t\twidth: 100%;\n\t}\n\thtml.wp-has-aspect-ratio,\n\tbody.wp-has-aspect-ratio,\n\tbody.wp-has-aspect-ratio > div,\n\tbody.wp-has-aspect-ratio > div iframe {\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\toverflow: hidden; /* If it has an aspect ratio, it shouldn't scroll. */\n\t}\n\tbody > div > * {\n\t\tmargin-top: 0 !important; /* Has to have !important to override inline styles. */\n\t\tmargin-bottom: 0 !important;\n\t}\n`;\n\n/**\n * Builds the full HTML document string for the sandbox iframe content.\n */\nfunction buildSandBoxDocument({\n html,\n title,\n type,\n styles,\n scripts\n}) {\n const htmlDoc = /*#__PURE__*/_jsxs(\"html\", {\n lang: document.documentElement.lang,\n className: type,\n children: [/*#__PURE__*/_jsxs(\"head\", {\n children: [/*#__PURE__*/_jsx(\"title\", {\n children: title\n }), /*#__PURE__*/_jsx(\"style\", {\n dangerouslySetInnerHTML: {\n __html: style\n }\n }), styles.map((rules, i) => /*#__PURE__*/_jsx(\"style\", {\n dangerouslySetInnerHTML: {\n __html: rules\n }\n }, i))]\n }), /*#__PURE__*/_jsxs(\"body\", {\n \"data-resizable-iframe-connected\": \"data-resizable-iframe-connected\",\n className: type,\n children: [/*#__PURE__*/_jsx(\"div\", {\n dangerouslySetInnerHTML: {\n __html: html\n }\n }), /*#__PURE__*/_jsx(\"script\", {\n type: \"text/javascript\",\n dangerouslySetInnerHTML: {\n __html: `(${observeAndResizeJS.toString()})();`\n }\n }), scripts.map(src => /*#__PURE__*/_jsx(\"script\", {\n src: src\n }, src))]\n })]\n });\n return '<!DOCTYPE html>' + renderToString(htmlDoc);\n}\n\n/**\n * Isolated sandbox that uses the `srcdoc` attribute to render content\n * without `allow-same-origin`. This is the default for user-controlled\n * content (e.g., the HTML block) where same-origin access would be a\n * security risk.\n *\n * Because `srcdoc` is a declarative attribute, the browser automatically\n * re-renders the content when the iframe is moved in the DOM (e.g.,\n * block reordering), so no `load` event listener is needed.\n * The `message` listener is re-synced on every `load` so\n * it follows the iframe if it's reparented into a different document.\n */\nfunction IsolatedSandBox({\n html = '',\n title = '',\n type,\n styles = [],\n scripts = [],\n onFocus,\n tabIndex\n}) {\n const ref = useRef(null);\n const [width, setWidth] = useState(0);\n const [height, setHeight] = useState(0);\n const srcDoc = useMemo(() => buildSandBoxDocument({\n html,\n title,\n type,\n styles,\n scripts\n }), [html, title, type, styles, scripts]);\n useEffect(() => {\n const iframe = ref.current;\n if (!iframe) {\n return;\n }\n function checkMessageForResize(event) {\n // Verify that the mounted element is the source of the message.\n // iframe.contentWindow is accessible cross-origin as a\n // WindowProxy reference, so this check still works without\n // allow-same-origin.\n if (!iframe || iframe.contentWindow !== event.source) {\n return;\n }\n\n // Attempt to parse the message data as JSON if passed as string.\n let data = event.data || {};\n if ('string' === typeof data) {\n try {\n data = JSON.parse(data);\n } catch {}\n }\n\n // Update the state only if the message is formatted as we expect,\n // i.e. as an object with a 'resize' action.\n if ('resize' !== data.action) {\n return;\n }\n setWidth(data.width);\n setHeight(data.height);\n }\n let currentView = null;\n function syncListener() {\n const view = iframe?.ownerDocument?.defaultView ?? null;\n if (view === currentView) {\n return;\n }\n currentView?.removeEventListener('message', checkMessageForResize);\n currentView = view;\n currentView?.addEventListener('message', checkMessageForResize);\n }\n syncListener();\n iframe.addEventListener('load', syncListener);\n return () => {\n iframe.removeEventListener('load', syncListener);\n currentView?.removeEventListener('message', checkMessageForResize);\n };\n }, []);\n return /*#__PURE__*/_jsx(\"iframe\", {\n ref: useMergeRefs([ref, useFocusableIframe()]),\n title: title,\n tabIndex: tabIndex,\n className: \"components-sandbox\",\n sandbox: \"allow-scripts allow-presentation\",\n srcDoc: srcDoc,\n onFocus: onFocus,\n width: Math.ceil(width),\n height: Math.ceil(height)\n });\n}\n\n/**\n * Same-origin sandbox that writes to `contentDocument` directly. This\n * preserves the parent page's URL as the iframe's document URL, which\n * provides a valid Referer header for nested iframes (required by\n * providers like YouTube).\n *\n * Only used when `allowSameOrigin` is true — i.e., for server-fetched\n * oEmbed previews that are not directly user-controlled.\n *\n * This implementation is intentionally kept close to the original\n * pre-refactor code to preserve past bugfixes:\n * - load listener for iframe re-initialization after DOM moves (#21916)\n * - forceRerender guard to avoid unnecessary full rewrites (#20176)\n */\nfunction SameOriginSandBox({\n html = '',\n title = '',\n type,\n styles = [],\n scripts = [],\n onFocus,\n tabIndex\n}) {\n const ref = useRef(null);\n const [width, setWidth] = useState(0);\n const [height, setHeight] = useState(0);\n function isFrameAccessible() {\n try {\n return !!ref.current?.contentDocument?.body;\n } catch {\n return false;\n }\n }\n function trySandBox(forceRerender = false) {\n if (!isFrameAccessible()) {\n return;\n }\n const {\n contentDocument,\n ownerDocument\n } = ref.current;\n if (!forceRerender && null !== contentDocument?.body.getAttribute('data-resizable-iframe-connected')) {\n return;\n }\n\n // Put the html snippet into a html document, and then write it to the iframe's document\n // we can use this in the future to inject custom styles or scripts.\n // Scripts go into the body rather than the head, to support embedded content such as Instagram\n // that expect the scripts to be part of the body.\n const htmlDoc = /*#__PURE__*/_jsxs(\"html\", {\n lang: ownerDocument.documentElement.lang,\n className: type,\n children: [/*#__PURE__*/_jsxs(\"head\", {\n children: [/*#__PURE__*/_jsx(\"title\", {\n children: title\n }), /*#__PURE__*/_jsx(\"style\", {\n dangerouslySetInnerHTML: {\n __html: style\n }\n }), styles.map((rules, i) => /*#__PURE__*/_jsx(\"style\", {\n dangerouslySetInnerHTML: {\n __html: rules\n }\n }, i))]\n }), /*#__PURE__*/_jsxs(\"body\", {\n \"data-resizable-iframe-connected\": \"data-resizable-iframe-connected\",\n className: type,\n children: [/*#__PURE__*/_jsx(\"div\", {\n dangerouslySetInnerHTML: {\n __html: html\n }\n }), /*#__PURE__*/_jsx(\"script\", {\n type: \"text/javascript\",\n dangerouslySetInnerHTML: {\n __html: `(${observeAndResizeJS.toString()})();`\n }\n }), scripts.map(src => /*#__PURE__*/_jsx(\"script\", {\n src: src\n }, src))]\n })]\n });\n\n // Writing the document like this makes it act in the same way as if it was\n // loaded over the network, so DOM creation and mutation, script execution, etc.\n // all work as expected.\n contentDocument.open();\n contentDocument.write('<!DOCTYPE html>' + renderToString(htmlDoc));\n contentDocument.close();\n }\n useEffect(() => {\n trySandBox();\n function tryNoForceSandBox() {\n trySandBox(false);\n }\n function checkMessageForResize(event) {\n const iframe = ref.current;\n\n // Verify that the mounted element is the source of the message.\n if (!iframe || iframe.contentWindow !== event.source) {\n return;\n }\n\n // Attempt to parse the message data as JSON if passed as string.\n let data = event.data || {};\n if ('string' === typeof data) {\n try {\n data = JSON.parse(data);\n } catch {}\n }\n\n // Update the state only if the message is formatted as we expect,\n // i.e. as an object with a 'resize' action.\n if ('resize' !== data.action) {\n return;\n }\n setWidth(data.width);\n setHeight(data.height);\n }\n const iframe = ref.current;\n const defaultView = iframe?.ownerDocument?.defaultView;\n\n // This used to be registered using <iframe onLoad={} />, but it made the iframe blank\n // after reordering the containing block. See these two issues for more details:\n // https://github.com/WordPress/gutenberg/issues/6146\n // https://github.com/facebook/react/issues/18752\n iframe?.addEventListener('load', tryNoForceSandBox, false);\n defaultView?.addEventListener('message', checkMessageForResize);\n return () => {\n iframe?.removeEventListener('load', tryNoForceSandBox, false);\n defaultView?.removeEventListener('message', checkMessageForResize);\n };\n // Passing `exhaustive-deps` will likely involve a more detailed refactor.\n // See https://github.com/WordPress/gutenberg/pull/44378\n }, []);\n useEffect(() => {\n trySandBox();\n // Passing `exhaustive-deps` will likely involve a more detailed refactor.\n // See https://github.com/WordPress/gutenberg/pull/44378\n }, [title, styles, scripts]);\n useEffect(() => {\n trySandBox(true);\n // Passing `exhaustive-deps` will likely involve a more detailed refactor.\n // See https://github.com/WordPress/gutenberg/pull/44378\n }, [html, type]);\n return /*#__PURE__*/_jsx(\"iframe\", {\n ref: useMergeRefs([ref, useFocusableIframe()]),\n title: title,\n tabIndex: tabIndex,\n className: \"components-sandbox\",\n sandbox: \"allow-scripts allow-same-origin allow-presentation\",\n onFocus: onFocus,\n width: Math.ceil(width),\n height: Math.ceil(height)\n });\n}\n\n/**\n * This component provides an isolated environment for arbitrary HTML via iframes.\n *\n * ```jsx\n * import { SandBox } from '@wordpress/components';\n *\n * const MySandBox = () => (\n * \t<SandBox html=\"<p>Content</p>\" title=\"SandBox\" type=\"embed\" />\n * );\n * ```\n */\nfunction SandBox({\n allowSameOrigin = false,\n ...contentProps\n}) {\n if (allowSameOrigin) {\n return /*#__PURE__*/_jsx(SameOriginSandBox, {\n ...contentProps\n });\n }\n return /*#__PURE__*/_jsx(IsolatedSandBox, {\n ...contentProps\n });\n}\nexport default SandBox;"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["style", "iframe"]
|
|
7
7
|
}
|
|
@@ -18,13 +18,13 @@ var StyledSpinner = /* @__PURE__ */ _styled("svg", process.env.NODE_ENV === "pro
|
|
|
18
18
|
} : {
|
|
19
19
|
target: "ea4tfvq2",
|
|
20
20
|
label: "StyledSpinner"
|
|
21
|
-
})("width:", CONFIG.spinnerSize, "px;height:", CONFIG.spinnerSize, "px;display:inline-block;margin:5px 11px 0;position:relative;color:", COLORS.theme.accent, ";overflow:visible;opacity:1;background-color:transparent;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
21
|
+
})("width:", CONFIG.spinnerSize, "px;height:", CONFIG.spinnerSize, "px;display:inline-block;margin:5px 11px 0;position:relative;color:", COLORS.theme.accent, ";overflow:visible;opacity:1;background-color:transparent;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFvQnVDIiwiZmlsZSI6InN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IGNzcywga2V5ZnJhbWVzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBDT0xPUlMsIENPTkZJRyB9IGZyb20gJy4uL3V0aWxzJztcblxuY29uc3Qgc3BpbkFuaW1hdGlvbiA9IGtleWZyYW1lc2Bcblx0ZnJvbSB7XG5cdFx0dHJhbnNmb3JtOiByb3RhdGUoMGRlZyk7XG5cdH1cblx0dG8ge1xuXHRcdHRyYW5zZm9ybTogcm90YXRlKDM2MGRlZyk7XG5cdH1cbiBgO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkU3Bpbm5lciA9IHN0eWxlZC5zdmdgXG5cdHdpZHRoOiAkeyBDT05GSUcuc3Bpbm5lclNpemUgfXB4O1xuXHRoZWlnaHQ6ICR7IENPTkZJRy5zcGlubmVyU2l6ZSB9cHg7XG5cdGRpc3BsYXk6IGlubGluZS1ibG9jaztcblx0bWFyZ2luOiA1cHggMTFweCAwO1xuXHRwb3NpdGlvbjogcmVsYXRpdmU7XG5cdGNvbG9yOiAkeyBDT0xPUlMudGhlbWUuYWNjZW50IH07XG5cdG92ZXJmbG93OiB2aXNpYmxlO1xuXHRvcGFjaXR5OiAxO1xuXHRiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbmA7XG5cbmNvbnN0IGNvbW1vblBhdGhQcm9wcyA9IGNzc2Bcblx0ZmlsbDogdHJhbnNwYXJlbnQ7XG5cdHN0cm9rZS13aWR0aDogMS41cHg7XG5gO1xuXG4vLyBUT0RPOiBzaG91bGQgdXNlIHRoZSBgc3Ryb2tlLXN1cmZhY2UtbmV1dHJhbGAgV1BEUyB0b2tlbiB3aGVuIHJlZmFjdG9yZWQgdG8gU0NTUyBtb2R1bGVzXG5leHBvcnQgY29uc3QgU3Bpbm5lclRyYWNrID0gc3R5bGVkLmNpcmNsZWBcblx0JHsgY29tbW9uUGF0aFByb3BzIH07XG5cdHN0cm9rZTogJHsgQ09MT1JTLmdyYXlbIDMwMCBdIH07XG5gO1xuXG5leHBvcnQgY29uc3QgU3Bpbm5lckluZGljYXRvciA9IHN0eWxlZC5wYXRoYFxuXHQkeyBjb21tb25QYXRoUHJvcHMgfTtcblx0c3Ryb2tlOiBjdXJyZW50Q29sb3I7XG5cdHN0cm9rZS1saW5lY2FwOiByb3VuZDtcblx0dHJhbnNmb3JtLW9yaWdpbjogNTAlIDUwJTtcblx0YW5pbWF0aW9uOiAxLjRzIGxpbmVhciBpbmZpbml0ZSBib3RoICR7IHNwaW5BbmltYXRpb24gfTtcbmA7XG4iXX0= */"));
|
|
22
22
|
var commonPathProps = process.env.NODE_ENV === "production" ? {
|
|
23
23
|
name: "9s4963",
|
|
24
24
|
styles: "fill:transparent;stroke-width:1.5px"
|
|
25
25
|
} : {
|
|
26
26
|
name: "o2zng0-commonPathProps",
|
|
27
|
-
styles: "fill:transparent;stroke-width:1.5px;label:commonPathProps;/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
27
|
+
styles: "fill:transparent;stroke-width:1.5px;label:commonPathProps;/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFnQzJCIiwiZmlsZSI6InN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IGNzcywga2V5ZnJhbWVzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBDT0xPUlMsIENPTkZJRyB9IGZyb20gJy4uL3V0aWxzJztcblxuY29uc3Qgc3BpbkFuaW1hdGlvbiA9IGtleWZyYW1lc2Bcblx0ZnJvbSB7XG5cdFx0dHJhbnNmb3JtOiByb3RhdGUoMGRlZyk7XG5cdH1cblx0dG8ge1xuXHRcdHRyYW5zZm9ybTogcm90YXRlKDM2MGRlZyk7XG5cdH1cbiBgO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkU3Bpbm5lciA9IHN0eWxlZC5zdmdgXG5cdHdpZHRoOiAkeyBDT05GSUcuc3Bpbm5lclNpemUgfXB4O1xuXHRoZWlnaHQ6ICR7IENPTkZJRy5zcGlubmVyU2l6ZSB9cHg7XG5cdGRpc3BsYXk6IGlubGluZS1ibG9jaztcblx0bWFyZ2luOiA1cHggMTFweCAwO1xuXHRwb3NpdGlvbjogcmVsYXRpdmU7XG5cdGNvbG9yOiAkeyBDT0xPUlMudGhlbWUuYWNjZW50IH07XG5cdG92ZXJmbG93OiB2aXNpYmxlO1xuXHRvcGFjaXR5OiAxO1xuXHRiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbmA7XG5cbmNvbnN0IGNvbW1vblBhdGhQcm9wcyA9IGNzc2Bcblx0ZmlsbDogdHJhbnNwYXJlbnQ7XG5cdHN0cm9rZS13aWR0aDogMS41cHg7XG5gO1xuXG4vLyBUT0RPOiBzaG91bGQgdXNlIHRoZSBgc3Ryb2tlLXN1cmZhY2UtbmV1dHJhbGAgV1BEUyB0b2tlbiB3aGVuIHJlZmFjdG9yZWQgdG8gU0NTUyBtb2R1bGVzXG5leHBvcnQgY29uc3QgU3Bpbm5lclRyYWNrID0gc3R5bGVkLmNpcmNsZWBcblx0JHsgY29tbW9uUGF0aFByb3BzIH07XG5cdHN0cm9rZTogJHsgQ09MT1JTLmdyYXlbIDMwMCBdIH07XG5gO1xuXG5leHBvcnQgY29uc3QgU3Bpbm5lckluZGljYXRvciA9IHN0eWxlZC5wYXRoYFxuXHQkeyBjb21tb25QYXRoUHJvcHMgfTtcblx0c3Ryb2tlOiBjdXJyZW50Q29sb3I7XG5cdHN0cm9rZS1saW5lY2FwOiByb3VuZDtcblx0dHJhbnNmb3JtLW9yaWdpbjogNTAlIDUwJTtcblx0YW5pbWF0aW9uOiAxLjRzIGxpbmVhciBpbmZpbml0ZSBib3RoICR7IHNwaW5BbmltYXRpb24gfTtcbmA7XG4iXX0= */",
|
|
28
28
|
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
29
29
|
};
|
|
30
30
|
var SpinnerTrack = /* @__PURE__ */ _styled("circle", process.env.NODE_ENV === "production" ? {
|
|
@@ -32,13 +32,13 @@ var SpinnerTrack = /* @__PURE__ */ _styled("circle", process.env.NODE_ENV === "p
|
|
|
32
32
|
} : {
|
|
33
33
|
target: "ea4tfvq1",
|
|
34
34
|
label: "SpinnerTrack"
|
|
35
|
-
})(commonPathProps, ";stroke:", COLORS.gray[300], ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
35
|
+
})(commonPathProps, ";stroke:", COLORS.gray[300], ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFzQ3lDIiwiZmlsZSI6InN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IGNzcywga2V5ZnJhbWVzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBDT0xPUlMsIENPTkZJRyB9IGZyb20gJy4uL3V0aWxzJztcblxuY29uc3Qgc3BpbkFuaW1hdGlvbiA9IGtleWZyYW1lc2Bcblx0ZnJvbSB7XG5cdFx0dHJhbnNmb3JtOiByb3RhdGUoMGRlZyk7XG5cdH1cblx0dG8ge1xuXHRcdHRyYW5zZm9ybTogcm90YXRlKDM2MGRlZyk7XG5cdH1cbiBgO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkU3Bpbm5lciA9IHN0eWxlZC5zdmdgXG5cdHdpZHRoOiAkeyBDT05GSUcuc3Bpbm5lclNpemUgfXB4O1xuXHRoZWlnaHQ6ICR7IENPTkZJRy5zcGlubmVyU2l6ZSB9cHg7XG5cdGRpc3BsYXk6IGlubGluZS1ibG9jaztcblx0bWFyZ2luOiA1cHggMTFweCAwO1xuXHRwb3NpdGlvbjogcmVsYXRpdmU7XG5cdGNvbG9yOiAkeyBDT0xPUlMudGhlbWUuYWNjZW50IH07XG5cdG92ZXJmbG93OiB2aXNpYmxlO1xuXHRvcGFjaXR5OiAxO1xuXHRiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbmA7XG5cbmNvbnN0IGNvbW1vblBhdGhQcm9wcyA9IGNzc2Bcblx0ZmlsbDogdHJhbnNwYXJlbnQ7XG5cdHN0cm9rZS13aWR0aDogMS41cHg7XG5gO1xuXG4vLyBUT0RPOiBzaG91bGQgdXNlIHRoZSBgc3Ryb2tlLXN1cmZhY2UtbmV1dHJhbGAgV1BEUyB0b2tlbiB3aGVuIHJlZmFjdG9yZWQgdG8gU0NTUyBtb2R1bGVzXG5leHBvcnQgY29uc3QgU3Bpbm5lclRyYWNrID0gc3R5bGVkLmNpcmNsZWBcblx0JHsgY29tbW9uUGF0aFByb3BzIH07XG5cdHN0cm9rZTogJHsgQ09MT1JTLmdyYXlbIDMwMCBdIH07XG5gO1xuXG5leHBvcnQgY29uc3QgU3Bpbm5lckluZGljYXRvciA9IHN0eWxlZC5wYXRoYFxuXHQkeyBjb21tb25QYXRoUHJvcHMgfTtcblx0c3Ryb2tlOiBjdXJyZW50Q29sb3I7XG5cdHN0cm9rZS1saW5lY2FwOiByb3VuZDtcblx0dHJhbnNmb3JtLW9yaWdpbjogNTAlIDUwJTtcblx0YW5pbWF0aW9uOiAxLjRzIGxpbmVhciBpbmZpbml0ZSBib3RoICR7IHNwaW5BbmltYXRpb24gfTtcbmA7XG4iXX0= */"));
|
|
36
36
|
var SpinnerIndicator = /* @__PURE__ */ _styled("path", process.env.NODE_ENV === "production" ? {
|
|
37
37
|
target: "ea4tfvq0"
|
|
38
38
|
} : {
|
|
39
39
|
target: "ea4tfvq0",
|
|
40
40
|
label: "SpinnerIndicator"
|
|
41
|
-
})(commonPathProps, ";stroke:currentColor;stroke-linecap:round;transform-origin:50% 50%;animation:1.4s linear infinite both ", spinAnimation, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
41
|
+
})(commonPathProps, ";stroke:currentColor;stroke-linecap:round;transform-origin:50% 50%;animation:1.4s linear infinite both ", spinAnimation, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEyQzJDIiwiZmlsZSI6InN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IGNzcywga2V5ZnJhbWVzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBDT0xPUlMsIENPTkZJRyB9IGZyb20gJy4uL3V0aWxzJztcblxuY29uc3Qgc3BpbkFuaW1hdGlvbiA9IGtleWZyYW1lc2Bcblx0ZnJvbSB7XG5cdFx0dHJhbnNmb3JtOiByb3RhdGUoMGRlZyk7XG5cdH1cblx0dG8ge1xuXHRcdHRyYW5zZm9ybTogcm90YXRlKDM2MGRlZyk7XG5cdH1cbiBgO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkU3Bpbm5lciA9IHN0eWxlZC5zdmdgXG5cdHdpZHRoOiAkeyBDT05GSUcuc3Bpbm5lclNpemUgfXB4O1xuXHRoZWlnaHQ6ICR7IENPTkZJRy5zcGlubmVyU2l6ZSB9cHg7XG5cdGRpc3BsYXk6IGlubGluZS1ibG9jaztcblx0bWFyZ2luOiA1cHggMTFweCAwO1xuXHRwb3NpdGlvbjogcmVsYXRpdmU7XG5cdGNvbG9yOiAkeyBDT0xPUlMudGhlbWUuYWNjZW50IH07XG5cdG92ZXJmbG93OiB2aXNpYmxlO1xuXHRvcGFjaXR5OiAxO1xuXHRiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbmA7XG5cbmNvbnN0IGNvbW1vblBhdGhQcm9wcyA9IGNzc2Bcblx0ZmlsbDogdHJhbnNwYXJlbnQ7XG5cdHN0cm9rZS13aWR0aDogMS41cHg7XG5gO1xuXG4vLyBUT0RPOiBzaG91bGQgdXNlIHRoZSBgc3Ryb2tlLXN1cmZhY2UtbmV1dHJhbGAgV1BEUyB0b2tlbiB3aGVuIHJlZmFjdG9yZWQgdG8gU0NTUyBtb2R1bGVzXG5leHBvcnQgY29uc3QgU3Bpbm5lclRyYWNrID0gc3R5bGVkLmNpcmNsZWBcblx0JHsgY29tbW9uUGF0aFByb3BzIH07XG5cdHN0cm9rZTogJHsgQ09MT1JTLmdyYXlbIDMwMCBdIH07XG5gO1xuXG5leHBvcnQgY29uc3QgU3Bpbm5lckluZGljYXRvciA9IHN0eWxlZC5wYXRoYFxuXHQkeyBjb21tb25QYXRoUHJvcHMgfTtcblx0c3Ryb2tlOiBjdXJyZW50Q29sb3I7XG5cdHN0cm9rZS1saW5lY2FwOiByb3VuZDtcblx0dHJhbnNmb3JtLW9yaWdpbjogNTAlIDUwJTtcblx0YW5pbWF0aW9uOiAxLjRzIGxpbmVhciBpbmZpbml0ZSBib3RoICR7IHNwaW5BbmltYXRpb24gfTtcbmA7XG4iXX0= */"));
|
|
42
42
|
export {
|
|
43
43
|
SpinnerIndicator,
|
|
44
44
|
SpinnerTrack,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/spinner/styles.ts"],
|
|
4
|
-
"sourcesContent": ["import _styled from \"@emotion/styled/base\";\nfunction _EMOTION_STRINGIFIED_CSS_ERROR__() { return \"You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).\"; }\n/**\n * External dependencies\n */\n\nimport { css, keyframes } from '@emotion/react';\n\n/**\n * Internal dependencies\n */\nimport { COLORS, CONFIG } from '../utils';\nconst spinAnimation = keyframes`\n\tfrom {\n\t\ttransform: rotate(0deg);\n\t}\n\tto {\n\t\ttransform: rotate(360deg);\n\t}\n `;\nexport const StyledSpinner = /*#__PURE__*/_styled(\"svg\", process.env.NODE_ENV === \"production\" ? {\n target: \"ea4tfvq2\"\n} : {\n target: \"ea4tfvq2\",\n label: \"StyledSpinner\"\n})(\"width:\", CONFIG.spinnerSize, \"px;height:\", CONFIG.spinnerSize, \"px;display:inline-block;margin:5px 11px 0;position:relative;color:\", COLORS.theme.accent, \";overflow:visible;opacity:1;background-color:transparent;\" + (process.env.NODE_ENV === \"production\" ? \"\" : \"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
5
|
-
"mappings": ";AAAA,OAAO,aAAa;AAMpB,SAAS,KAAK,iBAAiB;AAK/B,SAAS,QAAQ,cAAc;AAV/B,SAAS,mCAAmC;AAAE,SAAO;AAAmO;AAWxR,IAAM,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQf,IAAM,gBAA6B,wBAAQ,OAAO,QAAQ,IAAI,aAAa,eAAe;AAAA,EAC/F,QAAQ;AACV,IAAI;AAAA,EACF,QAAQ;AAAA,EACR,OAAO;AACT,CAAC,EAAE,UAAU,OAAO,aAAa,cAAc,OAAO,aAAa,sEAAsE,OAAO,MAAM,QAAQ,+DAA+D,QAAQ,IAAI,aAAa,eAAe,KAAK,
|
|
4
|
+
"sourcesContent": ["import _styled from \"@emotion/styled/base\";\nfunction _EMOTION_STRINGIFIED_CSS_ERROR__() { return \"You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).\"; }\n/**\n * External dependencies\n */\n\nimport { css, keyframes } from '@emotion/react';\n\n/**\n * Internal dependencies\n */\nimport { COLORS, CONFIG } from '../utils';\nconst spinAnimation = keyframes`\n\tfrom {\n\t\ttransform: rotate(0deg);\n\t}\n\tto {\n\t\ttransform: rotate(360deg);\n\t}\n `;\nexport const StyledSpinner = /*#__PURE__*/_styled(\"svg\", process.env.NODE_ENV === \"production\" ? {\n target: \"ea4tfvq2\"\n} : {\n target: \"ea4tfvq2\",\n label: \"StyledSpinner\"\n})(\"width:\", CONFIG.spinnerSize, \"px;height:\", CONFIG.spinnerSize, \"px;display:inline-block;margin:5px 11px 0;position:relative;color:\", COLORS.theme.accent, \";overflow:visible;opacity:1;background-color:transparent;\" + (process.env.NODE_ENV === \"production\" ? \"\" : \"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFvQnVDIiwiZmlsZSI6InN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IGNzcywga2V5ZnJhbWVzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBDT0xPUlMsIENPTkZJRyB9IGZyb20gJy4uL3V0aWxzJztcblxuY29uc3Qgc3BpbkFuaW1hdGlvbiA9IGtleWZyYW1lc2Bcblx0ZnJvbSB7XG5cdFx0dHJhbnNmb3JtOiByb3RhdGUoMGRlZyk7XG5cdH1cblx0dG8ge1xuXHRcdHRyYW5zZm9ybTogcm90YXRlKDM2MGRlZyk7XG5cdH1cbiBgO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkU3Bpbm5lciA9IHN0eWxlZC5zdmdgXG5cdHdpZHRoOiAkeyBDT05GSUcuc3Bpbm5lclNpemUgfXB4O1xuXHRoZWlnaHQ6ICR7IENPTkZJRy5zcGlubmVyU2l6ZSB9cHg7XG5cdGRpc3BsYXk6IGlubGluZS1ibG9jaztcblx0bWFyZ2luOiA1cHggMTFweCAwO1xuXHRwb3NpdGlvbjogcmVsYXRpdmU7XG5cdGNvbG9yOiAkeyBDT0xPUlMudGhlbWUuYWNjZW50IH07XG5cdG92ZXJmbG93OiB2aXNpYmxlO1xuXHRvcGFjaXR5OiAxO1xuXHRiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbmA7XG5cbmNvbnN0IGNvbW1vblBhdGhQcm9wcyA9IGNzc2Bcblx0ZmlsbDogdHJhbnNwYXJlbnQ7XG5cdHN0cm9rZS13aWR0aDogMS41cHg7XG5gO1xuXG4vLyBUT0RPOiBzaG91bGQgdXNlIHRoZSBgc3Ryb2tlLXN1cmZhY2UtbmV1dHJhbGAgV1BEUyB0b2tlbiB3aGVuIHJlZmFjdG9yZWQgdG8gU0NTUyBtb2R1bGVzXG5leHBvcnQgY29uc3QgU3Bpbm5lclRyYWNrID0gc3R5bGVkLmNpcmNsZWBcblx0JHsgY29tbW9uUGF0aFByb3BzIH07XG5cdHN0cm9rZTogJHsgQ09MT1JTLmdyYXlbIDMwMCBdIH07XG5gO1xuXG5leHBvcnQgY29uc3QgU3Bpbm5lckluZGljYXRvciA9IHN0eWxlZC5wYXRoYFxuXHQkeyBjb21tb25QYXRoUHJvcHMgfTtcblx0c3Ryb2tlOiBjdXJyZW50Q29sb3I7XG5cdHN0cm9rZS1saW5lY2FwOiByb3VuZDtcblx0dHJhbnNmb3JtLW9yaWdpbjogNTAlIDUwJTtcblx0YW5pbWF0aW9uOiAxLjRzIGxpbmVhciBpbmZpbml0ZSBib3RoICR7IHNwaW5BbmltYXRpb24gfTtcbmA7XG4iXX0= */\"));\nconst commonPathProps = process.env.NODE_ENV === \"production\" ? {\n name: \"9s4963\",\n styles: \"fill:transparent;stroke-width:1.5px\"\n} : {\n name: \"o2zng0-commonPathProps\",\n styles: \"fill:transparent;stroke-width:1.5px;label:commonPathProps;/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFnQzJCIiwiZmlsZSI6InN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IGNzcywga2V5ZnJhbWVzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBDT0xPUlMsIENPTkZJRyB9IGZyb20gJy4uL3V0aWxzJztcblxuY29uc3Qgc3BpbkFuaW1hdGlvbiA9IGtleWZyYW1lc2Bcblx0ZnJvbSB7XG5cdFx0dHJhbnNmb3JtOiByb3RhdGUoMGRlZyk7XG5cdH1cblx0dG8ge1xuXHRcdHRyYW5zZm9ybTogcm90YXRlKDM2MGRlZyk7XG5cdH1cbiBgO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkU3Bpbm5lciA9IHN0eWxlZC5zdmdgXG5cdHdpZHRoOiAkeyBDT05GSUcuc3Bpbm5lclNpemUgfXB4O1xuXHRoZWlnaHQ6ICR7IENPTkZJRy5zcGlubmVyU2l6ZSB9cHg7XG5cdGRpc3BsYXk6IGlubGluZS1ibG9jaztcblx0bWFyZ2luOiA1cHggMTFweCAwO1xuXHRwb3NpdGlvbjogcmVsYXRpdmU7XG5cdGNvbG9yOiAkeyBDT0xPUlMudGhlbWUuYWNjZW50IH07XG5cdG92ZXJmbG93OiB2aXNpYmxlO1xuXHRvcGFjaXR5OiAxO1xuXHRiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbmA7XG5cbmNvbnN0IGNvbW1vblBhdGhQcm9wcyA9IGNzc2Bcblx0ZmlsbDogdHJhbnNwYXJlbnQ7XG5cdHN0cm9rZS13aWR0aDogMS41cHg7XG5gO1xuXG4vLyBUT0RPOiBzaG91bGQgdXNlIHRoZSBgc3Ryb2tlLXN1cmZhY2UtbmV1dHJhbGAgV1BEUyB0b2tlbiB3aGVuIHJlZmFjdG9yZWQgdG8gU0NTUyBtb2R1bGVzXG5leHBvcnQgY29uc3QgU3Bpbm5lclRyYWNrID0gc3R5bGVkLmNpcmNsZWBcblx0JHsgY29tbW9uUGF0aFByb3BzIH07XG5cdHN0cm9rZTogJHsgQ09MT1JTLmdyYXlbIDMwMCBdIH07XG5gO1xuXG5leHBvcnQgY29uc3QgU3Bpbm5lckluZGljYXRvciA9IHN0eWxlZC5wYXRoYFxuXHQkeyBjb21tb25QYXRoUHJvcHMgfTtcblx0c3Ryb2tlOiBjdXJyZW50Q29sb3I7XG5cdHN0cm9rZS1saW5lY2FwOiByb3VuZDtcblx0dHJhbnNmb3JtLW9yaWdpbjogNTAlIDUwJTtcblx0YW5pbWF0aW9uOiAxLjRzIGxpbmVhciBpbmZpbml0ZSBib3RoICR7IHNwaW5BbmltYXRpb24gfTtcbmA7XG4iXX0= */\",\n toString: _EMOTION_STRINGIFIED_CSS_ERROR__\n};\n\n// TODO: should use the `stroke-surface-neutral` WPDS token when refactored to SCSS modules\nexport const SpinnerTrack = /*#__PURE__*/_styled(\"circle\", process.env.NODE_ENV === \"production\" ? {\n target: \"ea4tfvq1\"\n} : {\n target: \"ea4tfvq1\",\n label: \"SpinnerTrack\"\n})(commonPathProps, \";stroke:\", COLORS.gray[300], \";\" + (process.env.NODE_ENV === \"production\" ? \"\" : \"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFzQ3lDIiwiZmlsZSI6InN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IGNzcywga2V5ZnJhbWVzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBDT0xPUlMsIENPTkZJRyB9IGZyb20gJy4uL3V0aWxzJztcblxuY29uc3Qgc3BpbkFuaW1hdGlvbiA9IGtleWZyYW1lc2Bcblx0ZnJvbSB7XG5cdFx0dHJhbnNmb3JtOiByb3RhdGUoMGRlZyk7XG5cdH1cblx0dG8ge1xuXHRcdHRyYW5zZm9ybTogcm90YXRlKDM2MGRlZyk7XG5cdH1cbiBgO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkU3Bpbm5lciA9IHN0eWxlZC5zdmdgXG5cdHdpZHRoOiAkeyBDT05GSUcuc3Bpbm5lclNpemUgfXB4O1xuXHRoZWlnaHQ6ICR7IENPTkZJRy5zcGlubmVyU2l6ZSB9cHg7XG5cdGRpc3BsYXk6IGlubGluZS1ibG9jaztcblx0bWFyZ2luOiA1cHggMTFweCAwO1xuXHRwb3NpdGlvbjogcmVsYXRpdmU7XG5cdGNvbG9yOiAkeyBDT0xPUlMudGhlbWUuYWNjZW50IH07XG5cdG92ZXJmbG93OiB2aXNpYmxlO1xuXHRvcGFjaXR5OiAxO1xuXHRiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbmA7XG5cbmNvbnN0IGNvbW1vblBhdGhQcm9wcyA9IGNzc2Bcblx0ZmlsbDogdHJhbnNwYXJlbnQ7XG5cdHN0cm9rZS13aWR0aDogMS41cHg7XG5gO1xuXG4vLyBUT0RPOiBzaG91bGQgdXNlIHRoZSBgc3Ryb2tlLXN1cmZhY2UtbmV1dHJhbGAgV1BEUyB0b2tlbiB3aGVuIHJlZmFjdG9yZWQgdG8gU0NTUyBtb2R1bGVzXG5leHBvcnQgY29uc3QgU3Bpbm5lclRyYWNrID0gc3R5bGVkLmNpcmNsZWBcblx0JHsgY29tbW9uUGF0aFByb3BzIH07XG5cdHN0cm9rZTogJHsgQ09MT1JTLmdyYXlbIDMwMCBdIH07XG5gO1xuXG5leHBvcnQgY29uc3QgU3Bpbm5lckluZGljYXRvciA9IHN0eWxlZC5wYXRoYFxuXHQkeyBjb21tb25QYXRoUHJvcHMgfTtcblx0c3Ryb2tlOiBjdXJyZW50Q29sb3I7XG5cdHN0cm9rZS1saW5lY2FwOiByb3VuZDtcblx0dHJhbnNmb3JtLW9yaWdpbjogNTAlIDUwJTtcblx0YW5pbWF0aW9uOiAxLjRzIGxpbmVhciBpbmZpbml0ZSBib3RoICR7IHNwaW5BbmltYXRpb24gfTtcbmA7XG4iXX0= */\"));\nexport const SpinnerIndicator = /*#__PURE__*/_styled(\"path\", process.env.NODE_ENV === \"production\" ? {\n target: \"ea4tfvq0\"\n} : {\n target: \"ea4tfvq0\",\n label: \"SpinnerIndicator\"\n})(commonPathProps, \";stroke:currentColor;stroke-linecap:round;transform-origin:50% 50%;animation:1.4s linear infinite both \", spinAnimation, \";\" + (process.env.NODE_ENV === \"production\" ? \"\" : \"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEyQzJDIiwiZmlsZSI6InN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IGNzcywga2V5ZnJhbWVzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBDT0xPUlMsIENPTkZJRyB9IGZyb20gJy4uL3V0aWxzJztcblxuY29uc3Qgc3BpbkFuaW1hdGlvbiA9IGtleWZyYW1lc2Bcblx0ZnJvbSB7XG5cdFx0dHJhbnNmb3JtOiByb3RhdGUoMGRlZyk7XG5cdH1cblx0dG8ge1xuXHRcdHRyYW5zZm9ybTogcm90YXRlKDM2MGRlZyk7XG5cdH1cbiBgO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkU3Bpbm5lciA9IHN0eWxlZC5zdmdgXG5cdHdpZHRoOiAkeyBDT05GSUcuc3Bpbm5lclNpemUgfXB4O1xuXHRoZWlnaHQ6ICR7IENPTkZJRy5zcGlubmVyU2l6ZSB9cHg7XG5cdGRpc3BsYXk6IGlubGluZS1ibG9jaztcblx0bWFyZ2luOiA1cHggMTFweCAwO1xuXHRwb3NpdGlvbjogcmVsYXRpdmU7XG5cdGNvbG9yOiAkeyBDT0xPUlMudGhlbWUuYWNjZW50IH07XG5cdG92ZXJmbG93OiB2aXNpYmxlO1xuXHRvcGFjaXR5OiAxO1xuXHRiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbmA7XG5cbmNvbnN0IGNvbW1vblBhdGhQcm9wcyA9IGNzc2Bcblx0ZmlsbDogdHJhbnNwYXJlbnQ7XG5cdHN0cm9rZS13aWR0aDogMS41cHg7XG5gO1xuXG4vLyBUT0RPOiBzaG91bGQgdXNlIHRoZSBgc3Ryb2tlLXN1cmZhY2UtbmV1dHJhbGAgV1BEUyB0b2tlbiB3aGVuIHJlZmFjdG9yZWQgdG8gU0NTUyBtb2R1bGVzXG5leHBvcnQgY29uc3QgU3Bpbm5lclRyYWNrID0gc3R5bGVkLmNpcmNsZWBcblx0JHsgY29tbW9uUGF0aFByb3BzIH07XG5cdHN0cm9rZTogJHsgQ09MT1JTLmdyYXlbIDMwMCBdIH07XG5gO1xuXG5leHBvcnQgY29uc3QgU3Bpbm5lckluZGljYXRvciA9IHN0eWxlZC5wYXRoYFxuXHQkeyBjb21tb25QYXRoUHJvcHMgfTtcblx0c3Ryb2tlOiBjdXJyZW50Q29sb3I7XG5cdHN0cm9rZS1saW5lY2FwOiByb3VuZDtcblx0dHJhbnNmb3JtLW9yaWdpbjogNTAlIDUwJTtcblx0YW5pbWF0aW9uOiAxLjRzIGxpbmVhciBpbmZpbml0ZSBib3RoICR7IHNwaW5BbmltYXRpb24gfTtcbmA7XG4iXX0= */\"));"],
|
|
5
|
+
"mappings": ";AAAA,OAAO,aAAa;AAMpB,SAAS,KAAK,iBAAiB;AAK/B,SAAS,QAAQ,cAAc;AAV/B,SAAS,mCAAmC;AAAE,SAAO;AAAmO;AAWxR,IAAM,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQf,IAAM,gBAA6B,wBAAQ,OAAO,QAAQ,IAAI,aAAa,eAAe;AAAA,EAC/F,QAAQ;AACV,IAAI;AAAA,EACF,QAAQ;AAAA,EACR,OAAO;AACT,CAAC,EAAE,UAAU,OAAO,aAAa,cAAc,OAAO,aAAa,sEAAsE,OAAO,MAAM,QAAQ,+DAA+D,QAAQ,IAAI,aAAa,eAAe,KAAK,8sDAA8sD;AACx9D,IAAM,kBAAkB,QAAQ,IAAI,aAAa,eAAe;AAAA,EAC9D,MAAM;AAAA,EACN,QAAQ;AACV,IAAI;AAAA,EACF,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,UAAU;AACZ;AAGO,IAAM,eAA4B,wBAAQ,UAAU,QAAQ,IAAI,aAAa,eAAe;AAAA,EACjG,QAAQ;AACV,IAAI;AAAA,EACF,QAAQ;AAAA,EACR,OAAO;AACT,CAAC,EAAE,iBAAiB,YAAY,OAAO,KAAK,GAAG,GAAG,OAAO,QAAQ,IAAI,aAAa,eAAe,KAAK,8sDAA8sD;AAC7yD,IAAM,mBAAgC,wBAAQ,QAAQ,QAAQ,IAAI,aAAa,eAAe;AAAA,EACnG,QAAQ;AACV,IAAI;AAAA,EACF,QAAQ;AAAA,EACR,OAAO;AACT,CAAC,EAAE,iBAAiB,2GAA2G,eAAe,OAAO,QAAQ,IAAI,aAAa,eAAe,KAAK,8sDAA8sD;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
// packages/components/src/tabs/index.tsx
|
|
2
2
|
import * as Ariakit from "@ariakit/react";
|
|
3
3
|
import { useInstanceId } from "@wordpress/compose";
|
|
4
|
-
import {
|
|
4
|
+
import { useMemo } from "@wordpress/element";
|
|
5
5
|
import { isRTL } from "@wordpress/i18n";
|
|
6
6
|
import { TabsContext } from "./context.mjs";
|
|
7
7
|
import { Tab } from "./tab.mjs";
|
|
@@ -41,24 +41,6 @@ var Tabs = Object.assign(function Tabs2({
|
|
|
41
41
|
activeId: externalToInternalTabId(activeTabId, instanceId),
|
|
42
42
|
rtl: isRTL()
|
|
43
43
|
});
|
|
44
|
-
const {
|
|
45
|
-
items,
|
|
46
|
-
activeId
|
|
47
|
-
} = Ariakit.useStoreState(store);
|
|
48
|
-
const {
|
|
49
|
-
setActiveId
|
|
50
|
-
} = store;
|
|
51
|
-
useEffect(() => {
|
|
52
|
-
requestAnimationFrame(() => {
|
|
53
|
-
const focusedElement = items?.[0]?.element?.ownerDocument.activeElement;
|
|
54
|
-
if (!focusedElement || !items.some((item) => focusedElement === item.element)) {
|
|
55
|
-
return;
|
|
56
|
-
}
|
|
57
|
-
if (activeId !== focusedElement.id) {
|
|
58
|
-
setActiveId(focusedElement.id);
|
|
59
|
-
}
|
|
60
|
-
});
|
|
61
|
-
}, [activeId, items, setActiveId]);
|
|
62
44
|
const contextValue = useMemo(() => ({
|
|
63
45
|
store,
|
|
64
46
|
instanceId
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/tabs/index.tsx"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport {
|
|
5
|
-
"mappings": ";AAGA,YAAY,aAAa;AAKzB,SAAS,qBAAqB;AAC9B,SAAS,
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { useMemo } from '@wordpress/element';\nimport { isRTL } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\n\nimport { TabsContext } from './context';\nimport { Tab } from './tab';\nimport { TabList } from './tablist';\nimport { TabPanel } from './tabpanel';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nfunction externalToInternalTabId(externalId, instanceId) {\n return externalId && `${instanceId}-${externalId}`;\n}\nfunction internalToExternalTabId(internalId, instanceId) {\n return typeof internalId === 'string' ? internalId.replace(`${instanceId}-`, '') : internalId;\n}\n\n/**\n * Tabs is a collection of React components that combine to render\n * an [ARIA-compliant tabs pattern](https://www.w3.org/WAI/ARIA/apg/patterns/tabs/).\n *\n * Tabs organizes content across different screens, data sets, and interactions.\n * It has two sections: a list of tabs, and the view to show when a tab is chosen.\n *\n * `Tabs` itself is a wrapper component and context provider.\n * It is responsible for managing the state of the tabs, and rendering one instance of the `Tabs.TabList` component and one or more instances of the `Tab.TabPanel` component.\n */\nexport const Tabs = Object.assign(function Tabs({\n selectOnMove = true,\n defaultTabId,\n orientation = 'horizontal',\n onSelect,\n children,\n selectedTabId,\n activeTabId,\n defaultActiveTabId,\n onActiveTabIdChange\n}) {\n const instanceId = useInstanceId(Tabs, 'tabs');\n const store = Ariakit.useTabStore({\n selectOnMove,\n orientation,\n defaultSelectedId: externalToInternalTabId(defaultTabId, instanceId),\n setSelectedId: newSelectedId => {\n onSelect?.(internalToExternalTabId(newSelectedId, instanceId));\n },\n selectedId: externalToInternalTabId(selectedTabId, instanceId),\n defaultActiveId: externalToInternalTabId(defaultActiveTabId, instanceId),\n setActiveId: newActiveId => {\n onActiveTabIdChange?.(internalToExternalTabId(newActiveId, instanceId));\n },\n activeId: externalToInternalTabId(activeTabId, instanceId),\n rtl: isRTL()\n });\n const contextValue = useMemo(() => ({\n store,\n instanceId\n }), [store, instanceId]);\n return /*#__PURE__*/_jsx(TabsContext.Provider, {\n value: contextValue,\n children: children\n });\n}, {\n /**\n * Renders a single tab.\n *\n * The currently active tab receives default styling that can be\n * overridden with CSS targeting `[aria-selected=\"true\"]`.\n */\n Tab: Object.assign(Tab, {\n displayName: 'Tabs.Tab'\n }),\n /**\n * A wrapper component for the `Tab` components.\n *\n * It is responsible for rendering the list of tabs.\n */\n TabList: Object.assign(TabList, {\n displayName: 'Tabs.TabList'\n }),\n /**\n * Renders the content to display for a single tab once that tab is selected.\n */\n TabPanel: Object.assign(TabPanel, {\n displayName: 'Tabs.TabPanel'\n }),\n Context: Object.assign(TabsContext, {\n displayName: 'Tabs.Context'\n })\n});"],
|
|
5
|
+
"mappings": ";AAGA,YAAY,aAAa;AAKzB,SAAS,qBAAqB;AAC9B,SAAS,eAAe;AACxB,SAAS,aAAa;AAMtB,SAAS,mBAAmB;AAC5B,SAAS,WAAW;AACpB,SAAS,eAAe;AACxB,SAAS,gBAAgB;AACzB,SAAS,OAAO,YAAY;AAC5B,SAAS,wBAAwB,YAAY,YAAY;AACvD,SAAO,cAAc,GAAG,UAAU,IAAI,UAAU;AAClD;AACA,SAAS,wBAAwB,YAAY,YAAY;AACvD,SAAO,OAAO,eAAe,WAAW,WAAW,QAAQ,GAAG,UAAU,KAAK,EAAE,IAAI;AACrF;AAYO,IAAM,OAAO,OAAO,OAAO,SAASA,MAAK;AAAA,EAC9C,eAAe;AAAA,EACf;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAG;AACD,QAAM,aAAa,cAAcA,OAAM,MAAM;AAC7C,QAAM,QAAgB,oBAAY;AAAA,IAChC;AAAA,IACA;AAAA,IACA,mBAAmB,wBAAwB,cAAc,UAAU;AAAA,IACnE,eAAe,mBAAiB;AAC9B,iBAAW,wBAAwB,eAAe,UAAU,CAAC;AAAA,IAC/D;AAAA,IACA,YAAY,wBAAwB,eAAe,UAAU;AAAA,IAC7D,iBAAiB,wBAAwB,oBAAoB,UAAU;AAAA,IACvE,aAAa,iBAAe;AAC1B,4BAAsB,wBAAwB,aAAa,UAAU,CAAC;AAAA,IACxE;AAAA,IACA,UAAU,wBAAwB,aAAa,UAAU;AAAA,IACzD,KAAK,MAAM;AAAA,EACb,CAAC;AACD,QAAM,eAAe,QAAQ,OAAO;AAAA,IAClC;AAAA,IACA;AAAA,EACF,IAAI,CAAC,OAAO,UAAU,CAAC;AACvB,SAAoB,qBAAK,YAAY,UAAU;AAAA,IAC7C,OAAO;AAAA,IACP;AAAA,EACF,CAAC;AACH,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOD,KAAK,OAAO,OAAO,KAAK;AAAA,IACtB,aAAa;AAAA,EACf,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAMD,SAAS,OAAO,OAAO,SAAS;AAAA,IAC9B,aAAa;AAAA,EACf,CAAC;AAAA;AAAA;AAAA;AAAA,EAID,UAAU,OAAO,OAAO,UAAU;AAAA,IAChC,aAAa;AAAA,EACf,CAAC;AAAA,EACD,SAAS,OAAO,OAAO,aAAa;AAAA,IAClC,aAAa;AAAA,EACf,CAAC;AACH,CAAC;",
|
|
6
6
|
"names": ["Tabs"]
|
|
7
7
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
// packages/components/src/tabs/tablist.tsx
|
|
2
|
-
import
|
|
2
|
+
import { useStoreState } from "@ariakit/react";
|
|
3
3
|
import clsx from "clsx";
|
|
4
4
|
import warning from "@wordpress/warning";
|
|
5
5
|
import { forwardRef, useLayoutEffect, useState } from "@wordpress/element";
|
|
@@ -50,14 +50,13 @@ var TabList = forwardRef(function TabList2({
|
|
|
50
50
|
const {
|
|
51
51
|
store
|
|
52
52
|
} = useTabsContext() ?? {};
|
|
53
|
-
const selectedId =
|
|
54
|
-
const
|
|
55
|
-
const
|
|
56
|
-
const items = Ariakit.useStoreState(store, "items");
|
|
53
|
+
const selectedId = useStoreState(store, "selectedId");
|
|
54
|
+
const selectOnMove = useStoreState(store, "selectOnMove");
|
|
55
|
+
const items = useStoreState(store, "items");
|
|
57
56
|
const [parent, setParent] = useState();
|
|
58
57
|
const refs = useMergeRefs([ref, setParent]);
|
|
59
58
|
const selectedItem = store?.item(selectedId);
|
|
60
|
-
const renderedItems =
|
|
59
|
+
const renderedItems = useStoreState(store, "renderedItems");
|
|
61
60
|
const selectedItemIndex = renderedItems && selectedItem ? renderedItems.indexOf(selectedItem) : -1;
|
|
62
61
|
const selectedRect = useTrackElementOffsetRect(selectedItem?.element, [selectedItemIndex]);
|
|
63
62
|
const overflow = useTrackOverflow(parent, {
|
|
@@ -71,14 +70,6 @@ var TabList = forwardRef(function TabList2({
|
|
|
71
70
|
roundRect: true
|
|
72
71
|
});
|
|
73
72
|
useScrollRectIntoView(parent, selectedRect);
|
|
74
|
-
const onBlur = () => {
|
|
75
|
-
if (!selectOnMove) {
|
|
76
|
-
return;
|
|
77
|
-
}
|
|
78
|
-
if (selectedId !== activeId) {
|
|
79
|
-
store?.setActiveId(selectedId);
|
|
80
|
-
}
|
|
81
|
-
};
|
|
82
73
|
if (!store) {
|
|
83
74
|
globalThis.SCRIPT_DEBUG === true ? warning("`Tabs.TabList` must be wrapped in a `Tabs` component.") : void 0;
|
|
84
75
|
return null;
|
|
@@ -92,7 +83,6 @@ var TabList = forwardRef(function TabList2({
|
|
|
92
83
|
// tabbable when it is a scrolling container.
|
|
93
84
|
tabIndex: props.tabIndex ?? -1
|
|
94
85
|
}),
|
|
95
|
-
onBlur,
|
|
96
86
|
"data-select-on-move": selectOnMove ? "true" : "false",
|
|
97
87
|
...otherProps,
|
|
98
88
|
className: clsx(overflow.first && "is-overflowing-first", overflow.last && "is-overflowing-last", otherProps.className),
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/tabs/tablist.tsx"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport
|
|
5
|
-
"mappings": ";AAGA,
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport { useStoreState } from '@ariakit/react';\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport warning from '@wordpress/warning';\nimport { forwardRef, useLayoutEffect, useState } from '@wordpress/element';\nimport { useMergeRefs } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\n\nimport { useTabsContext } from './context';\nimport { StyledTabList } from './styles';\nimport { useTrackElementOffsetRect } from '../utils/element-rect';\nimport { useTrackOverflow } from './use-track-overflow';\nimport { useAnimatedOffsetRect } from '../utils/hooks/use-animated-offset-rect';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst DEFAULT_SCROLL_MARGIN = 24;\n\n/**\n * Scrolls a given parent element so that a given rect is visible.\n *\n * The scroll is updated initially and whenever the rect changes.\n */\nfunction useScrollRectIntoView(parent, rect, {\n margin = DEFAULT_SCROLL_MARGIN\n} = {}) {\n useLayoutEffect(() => {\n if (!parent || !rect) {\n return;\n }\n const {\n scrollLeft: parentScroll\n } = parent;\n const parentWidth = parent.getBoundingClientRect().width;\n const {\n left: childLeft,\n width: childWidth\n } = rect;\n const parentRightEdge = parentScroll + parentWidth;\n const childRightEdge = childLeft + childWidth;\n const rightOverflow = childRightEdge + margin - parentRightEdge;\n const leftOverflow = parentScroll - (childLeft - margin);\n let scrollLeft = null;\n if (leftOverflow > 0) {\n scrollLeft = parentScroll - leftOverflow;\n } else if (rightOverflow > 0) {\n scrollLeft = parentScroll + rightOverflow;\n }\n if (scrollLeft !== null) {\n /**\n * The optional chaining is used here to avoid unit test failures.\n * It can be removed when JSDOM supports `Element` scroll methods.\n * See: https://github.com/WordPress/gutenberg/pull/66498#issuecomment-2441146096\n */\n parent.scroll?.({\n left: scrollLeft\n });\n }\n }, [margin, parent, rect]);\n}\nexport const TabList = forwardRef(function TabList({\n children,\n ...otherProps\n}, ref) {\n const {\n store\n } = useTabsContext() ?? {};\n const selectedId = useStoreState(store, 'selectedId');\n const selectOnMove = useStoreState(store, 'selectOnMove');\n const items = useStoreState(store, 'items');\n const [parent, setParent] = useState();\n const refs = useMergeRefs([ref, setParent]);\n const selectedItem = store?.item(selectedId);\n const renderedItems = useStoreState(store, 'renderedItems');\n const selectedItemIndex = renderedItems && selectedItem ? renderedItems.indexOf(selectedItem) : -1;\n // Use selectedItemIndex as a dependency to force recalculation when the\n // selected item index changes (elements are swapped / added / removed).\n const selectedRect = useTrackElementOffsetRect(selectedItem?.element, [selectedItemIndex]);\n\n // Track overflow to show scroll hints.\n const overflow = useTrackOverflow(parent, {\n first: items?.at(0)?.element,\n last: items?.at(-1)?.element\n });\n\n // Size, position, and animate the indicator.\n useAnimatedOffsetRect(parent, selectedRect, {\n prefix: 'selected',\n dataAttribute: 'indicator-animated',\n transitionEndFilter: event => event.pseudoElement === '::before',\n roundRect: true\n });\n\n // Make sure selected tab is scrolled into view.\n useScrollRectIntoView(parent, selectedRect);\n if (!store) {\n globalThis.SCRIPT_DEBUG === true ? warning('`Tabs.TabList` must be wrapped in a `Tabs` component.') : void 0;\n return null;\n }\n return /*#__PURE__*/_jsx(StyledTabList, {\n ref: refs,\n store: store,\n render: props => /*#__PURE__*/_jsx(\"div\", {\n ...props,\n // Fallback to -1 to prevent browsers from making the tablist\n // tabbable when it is a scrolling container.\n tabIndex: props.tabIndex ?? -1\n }),\n \"data-select-on-move\": selectOnMove ? 'true' : 'false',\n ...otherProps,\n className: clsx(overflow.first && 'is-overflowing-first', overflow.last && 'is-overflowing-last', otherProps.className),\n children: children\n });\n});"],
|
|
5
|
+
"mappings": ";AAGA,SAAS,qBAAqB;AAC9B,OAAO,UAAU;AAKjB,OAAO,aAAa;AACpB,SAAS,YAAY,iBAAiB,gBAAgB;AACtD,SAAS,oBAAoB;AAM7B,SAAS,sBAAsB;AAC/B,SAAS,qBAAqB;AAC9B,SAAS,iCAAiC;AAC1C,SAAS,wBAAwB;AACjC,SAAS,6BAA6B;AACtC,SAAS,OAAO,YAAY;AAC5B,IAAM,wBAAwB;AAO9B,SAAS,sBAAsB,QAAQ,MAAM;AAAA,EAC3C,SAAS;AACX,IAAI,CAAC,GAAG;AACN,kBAAgB,MAAM;AACpB,QAAI,CAAC,UAAU,CAAC,MAAM;AACpB;AAAA,IACF;AACA,UAAM;AAAA,MACJ,YAAY;AAAA,IACd,IAAI;AACJ,UAAM,cAAc,OAAO,sBAAsB,EAAE;AACnD,UAAM;AAAA,MACJ,MAAM;AAAA,MACN,OAAO;AAAA,IACT,IAAI;AACJ,UAAM,kBAAkB,eAAe;AACvC,UAAM,iBAAiB,YAAY;AACnC,UAAM,gBAAgB,iBAAiB,SAAS;AAChD,UAAM,eAAe,gBAAgB,YAAY;AACjD,QAAI,aAAa;AACjB,QAAI,eAAe,GAAG;AACpB,mBAAa,eAAe;AAAA,IAC9B,WAAW,gBAAgB,GAAG;AAC5B,mBAAa,eAAe;AAAA,IAC9B;AACA,QAAI,eAAe,MAAM;AAMvB,aAAO,SAAS;AAAA,QACd,MAAM;AAAA,MACR,CAAC;AAAA,IACH;AAAA,EACF,GAAG,CAAC,QAAQ,QAAQ,IAAI,CAAC;AAC3B;AACO,IAAM,UAAU,WAAW,SAASA,SAAQ;AAAA,EACjD;AAAA,EACA,GAAG;AACL,GAAG,KAAK;AACN,QAAM;AAAA,IACJ;AAAA,EACF,IAAI,eAAe,KAAK,CAAC;AACzB,QAAM,aAAa,cAAc,OAAO,YAAY;AACpD,QAAM,eAAe,cAAc,OAAO,cAAc;AACxD,QAAM,QAAQ,cAAc,OAAO,OAAO;AAC1C,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAS;AACrC,QAAM,OAAO,aAAa,CAAC,KAAK,SAAS,CAAC;AAC1C,QAAM,eAAe,OAAO,KAAK,UAAU;AAC3C,QAAM,gBAAgB,cAAc,OAAO,eAAe;AAC1D,QAAM,oBAAoB,iBAAiB,eAAe,cAAc,QAAQ,YAAY,IAAI;AAGhG,QAAM,eAAe,0BAA0B,cAAc,SAAS,CAAC,iBAAiB,CAAC;AAGzF,QAAM,WAAW,iBAAiB,QAAQ;AAAA,IACxC,OAAO,OAAO,GAAG,CAAC,GAAG;AAAA,IACrB,MAAM,OAAO,GAAG,EAAE,GAAG;AAAA,EACvB,CAAC;AAGD,wBAAsB,QAAQ,cAAc;AAAA,IAC1C,QAAQ;AAAA,IACR,eAAe;AAAA,IACf,qBAAqB,WAAS,MAAM,kBAAkB;AAAA,IACtD,WAAW;AAAA,EACb,CAAC;AAGD,wBAAsB,QAAQ,YAAY;AAC1C,MAAI,CAAC,OAAO;AACV,eAAW,iBAAiB,OAAO,QAAQ,uDAAuD,IAAI;AACtG,WAAO;AAAA,EACT;AACA,SAAoB,qBAAK,eAAe;AAAA,IACtC,KAAK;AAAA,IACL;AAAA,IACA,QAAQ,WAAsB,qBAAK,OAAO;AAAA,MACxC,GAAG;AAAA;AAAA;AAAA,MAGH,UAAU,MAAM,YAAY;AAAA,IAC9B,CAAC;AAAA,IACD,uBAAuB,eAAe,SAAS;AAAA,IAC/C,GAAG;AAAA,IACH,WAAW,KAAK,SAAS,SAAS,wBAAwB,SAAS,QAAQ,uBAAuB,WAAW,SAAS;AAAA,IACtH;AAAA,EACF,CAAC;AACH,CAAC;",
|
|
6
6
|
"names": ["TabList"]
|
|
7
7
|
}
|