@wordpress/editor 14.41.0 → 14.41.2-next.v.202603161435.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 +6 -0
- package/build/components/collab-sidebar/index.cjs +7 -4
- package/build/components/collab-sidebar/index.cjs.map +2 -2
- package/build/components/collab-sidebar/utils.cjs +13 -15
- package/build/components/collab-sidebar/utils.cjs.map +2 -2
- package/build/components/collaborators-overlay/avatar-iframe-styles.cjs +141 -0
- package/build/components/collaborators-overlay/avatar-iframe-styles.cjs.map +7 -0
- package/build/components/collaborators-overlay/collaborator-styles.cjs +38 -2
- package/build/components/collaborators-overlay/collaborator-styles.cjs.map +2 -2
- package/build/components/collaborators-overlay/compute-selection.cjs +181 -0
- package/build/components/collaborators-overlay/compute-selection.cjs.map +7 -0
- package/build/components/collaborators-overlay/cursor-dom-utils.cjs +243 -0
- package/build/components/collaborators-overlay/cursor-dom-utils.cjs.map +7 -0
- package/build/components/collaborators-overlay/overlay-iframe-styles.cjs +148 -0
- package/build/components/collaborators-overlay/overlay-iframe-styles.cjs.map +7 -0
- package/build/components/collaborators-overlay/overlay.cjs +100 -229
- package/build/components/collaborators-overlay/overlay.cjs.map +3 -3
- package/build/components/collaborators-overlay/use-block-highlighting.cjs +90 -42
- package/build/components/collaborators-overlay/use-block-highlighting.cjs.map +2 -2
- package/build/components/collaborators-overlay/use-debounced-recompute.cjs +49 -0
- package/build/components/collaborators-overlay/use-debounced-recompute.cjs.map +7 -0
- package/build/components/collaborators-overlay/use-render-cursors.cjs +80 -171
- package/build/components/collaborators-overlay/use-render-cursors.cjs.map +3 -3
- package/build/components/collaborators-presence/avatar/component.cjs +121 -0
- package/build/components/collaborators-presence/avatar/component.cjs.map +7 -0
- package/build/components/collaborators-presence/avatar/index.cjs +37 -0
- package/build/components/collaborators-presence/avatar/index.cjs.map +7 -0
- package/build/components/collaborators-presence/avatar/types.cjs +19 -0
- package/build/components/collaborators-presence/avatar/types.cjs.map +7 -0
- package/build/components/collaborators-presence/avatar/use-image-loading-status.cjs +44 -0
- package/build/components/collaborators-presence/avatar/use-image-loading-status.cjs.map +7 -0
- package/build/components/collaborators-presence/avatar-group/component.cjs +78 -0
- package/build/components/collaborators-presence/avatar-group/component.cjs.map +7 -0
- package/build/components/collaborators-presence/avatar-group/index.cjs +37 -0
- package/build/components/collaborators-presence/avatar-group/index.cjs.map +7 -0
- package/build/components/collaborators-presence/avatar-group/types.cjs +19 -0
- package/build/components/collaborators-presence/avatar-group/types.cjs.map +7 -0
- package/build/components/collaborators-presence/index.cjs +54 -17
- package/build/components/collaborators-presence/index.cjs.map +3 -3
- package/build/components/collaborators-presence/list.cjs +43 -37
- package/build/components/collaborators-presence/list.cjs.map +3 -3
- package/build/components/collaborators-presence/use-collaborator-notifications.cjs +79 -107
- package/build/components/collaborators-presence/use-collaborator-notifications.cjs.map +3 -3
- package/build/components/editor-interface/index.cjs +9 -6
- package/build/components/editor-interface/index.cjs.map +2 -2
- package/build/components/entities-saved-states/hooks/use-is-dirty.cjs +14 -5
- package/build/components/entities-saved-states/hooks/use-is-dirty.cjs.map +2 -2
- package/build/components/global-styles/index.cjs +15 -24
- package/build/components/global-styles/index.cjs.map +3 -3
- package/build/components/global-styles-sidebar/index.cjs +6 -3
- package/build/components/global-styles-sidebar/index.cjs.map +2 -2
- package/build/components/inserter-sidebar/index.cjs +2 -1
- package/build/components/inserter-sidebar/index.cjs.map +2 -2
- package/build/components/page-attributes/parent.cjs +2 -1
- package/build/components/page-attributes/parent.cjs.map +2 -2
- package/build/components/post-revisions-preview/revisions-canvas.cjs +8 -58
- package/build/components/post-revisions-preview/revisions-canvas.cjs.map +3 -3
- package/build/components/post-revisions-preview/revisions-slider.cjs +5 -1
- package/build/components/post-revisions-preview/revisions-slider.cjs.map +2 -2
- package/build/components/post-url/panel.cjs +1 -0
- package/build/components/post-url/panel.cjs.map +2 -2
- package/build/components/preferences-modal/index.cjs +24 -0
- package/build/components/preferences-modal/index.cjs.map +2 -2
- package/build/components/provider/disable-non-page-content-blocks.cjs +31 -28
- package/build/components/provider/disable-non-page-content-blocks.cjs.map +3 -3
- package/build/components/provider/index.cjs +17 -5
- package/build/components/provider/index.cjs.map +2 -2
- package/build/components/provider/use-block-editor-settings.cjs +21 -6
- package/build/components/provider/use-block-editor-settings.cjs.map +3 -3
- package/build/components/provider/{use-post-content-blocks.cjs → use-post-content-block-types.cjs} +8 -19
- package/build/components/provider/use-post-content-block-types.cjs.map +7 -0
- package/build/components/provider/use-revision-blocks.cjs +106 -0
- package/build/components/provider/use-revision-blocks.cjs.map +7 -0
- package/build/components/sidebar/dataform-post-summary.cjs +182 -0
- package/build/components/sidebar/dataform-post-summary.cjs.map +7 -0
- package/build/components/sidebar/header.cjs +1 -1
- package/build/components/sidebar/header.cjs.map +2 -2
- package/build/components/sidebar/post-summary.cjs +11 -0
- package/build/components/sidebar/post-summary.cjs.map +3 -3
- package/build/components/sync-connection-modal/index.cjs +8 -5
- package/build/components/sync-connection-modal/index.cjs.map +2 -2
- package/build/components/template-content-panel/index.cjs +35 -31
- package/build/components/template-content-panel/index.cjs.map +3 -3
- package/build/components/visual-editor/index.cjs +1 -1
- package/build/components/visual-editor/index.cjs.map +2 -2
- package/build/dataviews/store/private-actions.cjs +4 -0
- package/build/dataviews/store/private-actions.cjs.map +2 -2
- package/build/store/private-actions.cjs +11 -2
- package/build/store/private-actions.cjs.map +2 -2
- package/build/store/private-selectors.cjs +52 -13
- package/build/store/private-selectors.cjs.map +2 -2
- package/build/store/reducer.cjs +12 -0
- package/build/store/reducer.cjs.map +2 -2
- package/build/utils/media-upload/on-success.cjs +46 -0
- package/build/utils/media-upload/on-success.cjs.map +7 -0
- package/build-module/components/collab-sidebar/index.mjs +7 -4
- package/build-module/components/collab-sidebar/index.mjs.map +2 -2
- package/build-module/components/collab-sidebar/utils.mjs +13 -15
- package/build-module/components/collab-sidebar/utils.mjs.map +2 -2
- package/build-module/components/collaborators-overlay/avatar-iframe-styles.mjs +128 -0
- package/build-module/components/collaborators-overlay/avatar-iframe-styles.mjs.map +7 -0
- package/build-module/components/collaborators-overlay/collaborator-styles.mjs +25 -1
- package/build-module/components/collaborators-overlay/collaborator-styles.mjs.map +2 -2
- package/build-module/components/collaborators-overlay/compute-selection.mjs +162 -0
- package/build-module/components/collaborators-overlay/compute-selection.mjs.map +7 -0
- package/build-module/components/collaborators-overlay/cursor-dom-utils.mjs +213 -0
- package/build-module/components/collaborators-overlay/cursor-dom-utils.mjs.map +7 -0
- package/build-module/components/collaborators-overlay/overlay-iframe-styles.mjs +130 -0
- package/build-module/components/collaborators-overlay/overlay-iframe-styles.mjs.map +7 -0
- package/build-module/components/collaborators-overlay/overlay.mjs +91 -230
- package/build-module/components/collaborators-overlay/overlay.mjs.map +2 -2
- package/build-module/components/collaborators-overlay/use-block-highlighting.mjs +91 -43
- package/build-module/components/collaborators-overlay/use-block-highlighting.mjs.map +2 -2
- package/build-module/components/collaborators-overlay/use-debounced-recompute.mjs +24 -0
- package/build-module/components/collaborators-overlay/use-debounced-recompute.mjs.map +7 -0
- package/build-module/components/collaborators-overlay/use-render-cursors.mjs +81 -172
- package/build-module/components/collaborators-overlay/use-render-cursors.mjs.map +2 -2
- package/build-module/components/collaborators-presence/avatar/component.mjs +90 -0
- package/build-module/components/collaborators-presence/avatar/component.mjs.map +7 -0
- package/build-module/components/collaborators-presence/avatar/index.mjs +6 -0
- package/build-module/components/collaborators-presence/avatar/index.mjs.map +7 -0
- package/build-module/components/collaborators-presence/avatar/types.mjs +1 -0
- package/build-module/components/collaborators-presence/avatar/types.mjs.map +7 -0
- package/build-module/components/collaborators-presence/avatar/use-image-loading-status.mjs +19 -0
- package/build-module/components/collaborators-presence/avatar/use-image-loading-status.mjs.map +7 -0
- package/build-module/components/collaborators-presence/avatar-group/component.mjs +47 -0
- package/build-module/components/collaborators-presence/avatar-group/component.mjs.map +7 -0
- package/build-module/components/collaborators-presence/avatar-group/index.mjs +6 -0
- package/build-module/components/collaborators-presence/avatar-group/index.mjs.map +7 -0
- package/build-module/components/collaborators-presence/avatar-group/types.mjs +1 -0
- package/build-module/components/collaborators-presence/avatar-group/types.mjs.map +7 -0
- package/build-module/components/collaborators-presence/index.mjs +45 -21
- package/build-module/components/collaborators-presence/index.mjs.map +2 -2
- package/build-module/components/collaborators-presence/list.mjs +35 -43
- package/build-module/components/collaborators-presence/list.mjs.map +2 -2
- package/build-module/components/collaborators-presence/use-collaborator-notifications.mjs +80 -108
- package/build-module/components/collaborators-presence/use-collaborator-notifications.mjs.map +2 -2
- package/build-module/components/editor-interface/index.mjs +10 -7
- package/build-module/components/editor-interface/index.mjs.map +2 -2
- package/build-module/components/entities-saved-states/hooks/use-is-dirty.mjs +14 -5
- package/build-module/components/entities-saved-states/hooks/use-is-dirty.mjs.map +2 -2
- package/build-module/components/global-styles/index.mjs +15 -24
- package/build-module/components/global-styles/index.mjs.map +2 -2
- package/build-module/components/global-styles-sidebar/index.mjs +6 -3
- package/build-module/components/global-styles-sidebar/index.mjs.map +2 -2
- package/build-module/components/inserter-sidebar/index.mjs +2 -1
- package/build-module/components/inserter-sidebar/index.mjs.map +2 -2
- package/build-module/components/page-attributes/parent.mjs +2 -1
- package/build-module/components/page-attributes/parent.mjs.map +2 -2
- package/build-module/components/post-revisions-preview/revisions-canvas.mjs +10 -63
- package/build-module/components/post-revisions-preview/revisions-canvas.mjs.map +2 -2
- package/build-module/components/post-revisions-preview/revisions-slider.mjs +5 -1
- package/build-module/components/post-revisions-preview/revisions-slider.mjs.map +2 -2
- package/build-module/components/post-url/panel.mjs +1 -0
- package/build-module/components/post-url/panel.mjs.map +2 -2
- package/build-module/components/preferences-modal/index.mjs +24 -0
- package/build-module/components/preferences-modal/index.mjs.map +2 -2
- package/build-module/components/provider/disable-non-page-content-blocks.mjs +31 -28
- package/build-module/components/provider/disable-non-page-content-blocks.mjs.map +2 -2
- package/build-module/components/provider/index.mjs +17 -5
- package/build-module/components/provider/index.mjs.map +2 -2
- package/build-module/components/provider/use-block-editor-settings.mjs +21 -6
- package/build-module/components/provider/use-block-editor-settings.mjs.map +2 -2
- package/build-module/components/provider/use-post-content-block-types.mjs +23 -0
- package/build-module/components/provider/use-post-content-block-types.mjs.map +7 -0
- package/build-module/components/provider/use-revision-blocks.mjs +81 -0
- package/build-module/components/provider/use-revision-blocks.mjs.map +7 -0
- package/build-module/components/sidebar/dataform-post-summary.mjs +151 -0
- package/build-module/components/sidebar/dataform-post-summary.mjs.map +7 -0
- package/build-module/components/sidebar/header.mjs +1 -1
- package/build-module/components/sidebar/header.mjs.map +2 -2
- package/build-module/components/sidebar/post-summary.mjs +11 -0
- package/build-module/components/sidebar/post-summary.mjs.map +2 -2
- package/build-module/components/sync-connection-modal/index.mjs +8 -5
- package/build-module/components/sync-connection-modal/index.mjs.map +2 -2
- package/build-module/components/template-content-panel/index.mjs +25 -31
- package/build-module/components/template-content-panel/index.mjs.map +2 -2
- package/build-module/components/visual-editor/index.mjs +1 -1
- package/build-module/components/visual-editor/index.mjs.map +2 -2
- package/build-module/dataviews/store/private-actions.mjs +8 -1
- package/build-module/dataviews/store/private-actions.mjs.map +2 -2
- package/build-module/store/private-actions.mjs +10 -2
- package/build-module/store/private-actions.mjs.map +2 -2
- package/build-module/store/private-selectors.mjs +50 -12
- package/build-module/store/private-selectors.mjs.map +2 -2
- package/build-module/store/reducer.mjs +11 -0
- package/build-module/store/reducer.mjs.map +2 -2
- package/build-module/utils/media-upload/on-success.mjs +25 -0
- package/build-module/utils/media-upload/on-success.mjs.map +7 -0
- package/build-style/style-rtl.css +961 -159
- package/build-style/style.css +961 -159
- package/build-types/components/collab-sidebar/index.d.ts.map +1 -1
- package/build-types/components/collab-sidebar/utils.d.ts.map +1 -1
- package/build-types/components/collaborators-overlay/avatar-iframe-styles.d.ts +11 -0
- package/build-types/components/collaborators-overlay/avatar-iframe-styles.d.ts.map +1 -0
- package/build-types/components/collaborators-overlay/collaborator-styles.d.ts +17 -2
- package/build-types/components/collaborators-overlay/collaborator-styles.d.ts.map +1 -1
- package/build-types/components/collaborators-overlay/compute-selection.d.ts +24 -0
- package/build-types/components/collaborators-overlay/compute-selection.d.ts.map +1 -0
- package/build-types/components/collaborators-overlay/cursor-dom-utils.d.ts +72 -0
- package/build-types/components/collaborators-overlay/cursor-dom-utils.d.ts.map +1 -0
- package/build-types/components/collaborators-overlay/overlay-iframe-styles.d.ts +6 -0
- package/build-types/components/collaborators-overlay/overlay-iframe-styles.d.ts.map +1 -0
- package/build-types/components/collaborators-overlay/overlay.d.ts.map +1 -1
- package/build-types/components/collaborators-overlay/use-block-highlighting.d.ts +21 -5
- package/build-types/components/collaborators-overlay/use-block-highlighting.d.ts.map +1 -1
- package/build-types/components/collaborators-overlay/use-debounced-recompute.d.ts +10 -0
- package/build-types/components/collaborators-overlay/use-debounced-recompute.d.ts.map +1 -0
- package/build-types/components/collaborators-overlay/use-render-cursors.d.ts +6 -1
- package/build-types/components/collaborators-overlay/use-render-cursors.d.ts.map +1 -1
- package/build-types/components/collaborators-presence/avatar/component.d.ts +7 -0
- package/build-types/components/collaborators-presence/avatar/component.d.ts.map +1 -0
- package/build-types/components/collaborators-presence/avatar/index.d.ts +3 -0
- package/build-types/components/collaborators-presence/avatar/index.d.ts.map +1 -0
- package/build-types/components/collaborators-presence/avatar/types.d.ts +66 -0
- package/build-types/components/collaborators-presence/avatar/types.d.ts.map +1 -0
- package/build-types/components/collaborators-presence/avatar/use-image-loading-status.d.ts +17 -0
- package/build-types/components/collaborators-presence/avatar/use-image-loading-status.d.ts.map +1 -0
- package/build-types/components/collaborators-presence/avatar-group/component.d.ts +7 -0
- package/build-types/components/collaborators-presence/avatar-group/component.d.ts.map +1 -0
- package/build-types/components/collaborators-presence/avatar-group/index.d.ts +3 -0
- package/build-types/components/collaborators-presence/avatar-group/index.d.ts.map +1 -0
- package/build-types/components/collaborators-presence/avatar-group/types.d.ts +14 -0
- package/build-types/components/collaborators-presence/avatar-group/types.d.ts.map +1 -0
- package/build-types/components/collaborators-presence/index.d.ts.map +1 -1
- package/build-types/components/collaborators-presence/list.d.ts +2 -1
- package/build-types/components/collaborators-presence/list.d.ts.map +1 -1
- package/build-types/components/collaborators-presence/use-collaborator-notifications.d.ts.map +1 -1
- package/build-types/components/editor-interface/index.d.ts.map +1 -1
- package/build-types/components/entities-saved-states/hooks/use-is-dirty.d.ts.map +1 -1
- package/build-types/components/global-styles/index.d.ts +2 -1
- package/build-types/components/global-styles/index.d.ts.map +1 -1
- package/build-types/components/global-styles-sidebar/index.d.ts.map +1 -1
- package/build-types/components/inserter-sidebar/index.d.ts.map +1 -1
- package/build-types/components/page-attributes/parent.d.ts.map +1 -1
- package/build-types/components/post-author/hook.d.ts +1 -1
- package/build-types/components/post-revisions-preview/revisions-canvas.d.ts +2 -5
- package/build-types/components/post-revisions-preview/revisions-canvas.d.ts.map +1 -1
- package/build-types/components/post-revisions-preview/revisions-slider.d.ts.map +1 -1
- package/build-types/components/provider/disable-non-page-content-blocks.d.ts.map +1 -1
- package/build-types/components/provider/index.d.ts.map +1 -1
- package/build-types/components/provider/use-block-editor-settings.d.ts.map +1 -1
- package/build-types/components/provider/use-post-content-block-types.d.ts +9 -0
- package/build-types/components/provider/use-post-content-block-types.d.ts.map +1 -0
- package/build-types/components/provider/use-revision-blocks.d.ts +10 -0
- package/build-types/components/provider/use-revision-blocks.d.ts.map +1 -0
- package/build-types/components/sidebar/dataform-post-summary.d.ts +4 -0
- package/build-types/components/sidebar/dataform-post-summary.d.ts.map +1 -0
- package/build-types/components/sidebar/post-summary.d.ts.map +1 -1
- package/build-types/components/sync-connection-modal/index.d.ts.map +1 -1
- package/build-types/components/template-content-panel/index.d.ts.map +1 -1
- package/build-types/dataviews/store/private-actions.d.ts.map +1 -1
- package/build-types/store/private-actions.d.ts +7 -0
- package/build-types/store/private-actions.d.ts.map +1 -1
- package/build-types/store/private-selectors.d.ts +7 -0
- package/build-types/store/private-selectors.d.ts.map +1 -1
- package/build-types/store/reducer.d.ts +14 -3
- package/build-types/store/reducer.d.ts.map +1 -1
- package/build-types/utils/media-upload/on-success.d.ts +9 -0
- package/build-types/utils/media-upload/on-success.d.ts.map +1 -0
- package/package.json +45 -44
- package/src/components/collab-sidebar/index.js +7 -4
- package/src/components/collab-sidebar/utils.js +9 -10
- package/src/components/collaborators-overlay/avatar-iframe-styles.ts +134 -0
- package/src/components/collaborators-overlay/collaborator-styles.ts +43 -2
- package/src/components/collaborators-overlay/compute-selection.ts +307 -0
- package/src/components/collaborators-overlay/cursor-dom-utils.ts +382 -0
- package/src/components/collaborators-overlay/overlay-iframe-styles.ts +131 -0
- package/src/components/collaborators-overlay/overlay.tsx +86 -226
- package/src/components/collaborators-overlay/use-block-highlighting.ts +147 -63
- package/src/components/collaborators-overlay/use-debounced-recompute.ts +32 -0
- package/src/components/collaborators-overlay/use-render-cursors.ts +113 -279
- package/src/components/collaborators-presence/avatar/component.tsx +123 -0
- package/src/components/collaborators-presence/avatar/index.ts +2 -0
- package/src/components/collaborators-presence/avatar/styles.scss +184 -0
- package/src/components/collaborators-presence/avatar/test/index.tsx +389 -0
- package/src/components/collaborators-presence/avatar/types.ts +66 -0
- package/src/components/collaborators-presence/avatar/use-image-loading-status.ts +36 -0
- package/src/components/collaborators-presence/avatar-group/component.tsx +55 -0
- package/src/components/collaborators-presence/avatar-group/index.ts +2 -0
- package/src/components/collaborators-presence/avatar-group/styles.scss +33 -0
- package/src/components/collaborators-presence/avatar-group/test/index.tsx +139 -0
- package/src/components/collaborators-presence/avatar-group/types.ts +13 -0
- package/src/components/collaborators-presence/index.tsx +34 -11
- package/src/components/collaborators-presence/list.tsx +44 -40
- package/src/components/collaborators-presence/styles/collaborators-list.scss +26 -19
- package/src/components/collaborators-presence/styles/collaborators-presence.scss +6 -2
- package/src/components/collaborators-presence/test/use-collaborator-notifications.ts +188 -246
- package/src/components/collaborators-presence/use-collaborator-notifications.ts +109 -166
- package/src/components/document-bar/style.scss +1 -1
- package/src/components/editor-interface/index.js +8 -6
- package/src/components/entities-saved-states/hooks/use-is-dirty.js +14 -5
- package/src/components/global-styles/index.js +20 -27
- package/src/components/global-styles-sidebar/index.js +3 -0
- package/src/components/inserter-sidebar/index.js +4 -1
- package/src/components/page-attributes/parent.js +2 -1
- package/src/components/post-publish-panel/test/__snapshots__/index.js.snap +2 -2
- package/src/components/post-revisions-preview/revisions-canvas.js +15 -84
- package/src/components/post-revisions-preview/revisions-slider.js +6 -1
- package/src/components/post-url/panel.js +1 -0
- package/src/components/post-url/style.scss +5 -0
- package/src/components/preferences-modal/index.js +18 -0
- package/src/components/provider/disable-non-page-content-blocks.js +42 -40
- package/src/components/provider/index.js +20 -2
- package/src/components/provider/use-block-editor-settings.js +24 -8
- package/src/components/provider/use-post-content-block-types.js +30 -0
- package/src/components/provider/use-revision-blocks.js +105 -0
- package/src/components/sidebar/dataform-post-summary.js +170 -0
- package/src/components/sidebar/header.js +1 -1
- package/src/components/sidebar/post-summary.js +15 -0
- package/src/components/sync-connection-modal/index.js +12 -6
- package/src/components/sync-connection-modal/style.scss +5 -0
- package/src/components/template-content-panel/index.js +30 -38
- package/src/components/visual-editor/index.js +1 -1
- package/src/dataviews/store/private-actions.ts +14 -0
- package/src/store/private-actions.js +21 -2
- package/src/store/private-selectors.js +75 -10
- package/src/store/reducer.js +19 -0
- package/src/style.scss +3 -0
- package/src/utils/media-upload/on-success.js +34 -0
- package/build/components/provider/use-post-content-blocks.cjs.map +0 -7
- package/build-module/components/provider/use-post-content-blocks.mjs +0 -34
- package/build-module/components/provider/use-post-content-blocks.mjs.map +0 -7
- package/build-types/components/provider/use-post-content-blocks.d.ts +0 -2
- package/build-types/components/provider/use-post-content-blocks.d.ts.map +0 -1
- package/src/components/provider/use-post-content-blocks.js +0 -42
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __export = (target, all) => {
|
|
7
|
+
for (var name in all)
|
|
8
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
+
};
|
|
10
|
+
var __copyProps = (to, from, except, desc) => {
|
|
11
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
+
for (let key of __getOwnPropNames(from))
|
|
13
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
+
}
|
|
16
|
+
return to;
|
|
17
|
+
};
|
|
18
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
+
|
|
20
|
+
// packages/editor/src/components/collaborators-overlay/use-debounced-recompute.ts
|
|
21
|
+
var use_debounced_recompute_exports = {};
|
|
22
|
+
__export(use_debounced_recompute_exports, {
|
|
23
|
+
useDebouncedRecompute: () => useDebouncedRecompute
|
|
24
|
+
});
|
|
25
|
+
module.exports = __toCommonJS(use_debounced_recompute_exports);
|
|
26
|
+
var import_element = require("@wordpress/element");
|
|
27
|
+
function useDebouncedRecompute(delayMs) {
|
|
28
|
+
const [recomputeToken, setRecomputeToken] = (0, import_element.useState)(0);
|
|
29
|
+
const timeoutRef = (0, import_element.useRef)(null);
|
|
30
|
+
const rerenderAfterDelay = (0, import_element.useCallback)(() => {
|
|
31
|
+
if (timeoutRef.current) {
|
|
32
|
+
clearTimeout(timeoutRef.current);
|
|
33
|
+
}
|
|
34
|
+
timeoutRef.current = setTimeout(() => {
|
|
35
|
+
setRecomputeToken((t) => t + 1);
|
|
36
|
+
}, delayMs);
|
|
37
|
+
return () => {
|
|
38
|
+
if (timeoutRef.current) {
|
|
39
|
+
clearTimeout(timeoutRef.current);
|
|
40
|
+
}
|
|
41
|
+
};
|
|
42
|
+
}, [delayMs]);
|
|
43
|
+
return [recomputeToken, rerenderAfterDelay];
|
|
44
|
+
}
|
|
45
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
46
|
+
0 && (module.exports = {
|
|
47
|
+
useDebouncedRecompute
|
|
48
|
+
});
|
|
49
|
+
//# sourceMappingURL=use-debounced-recompute.cjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/components/collaborators-overlay/use-debounced-recompute.ts"],
|
|
4
|
+
"sourcesContent": ["import { useCallback, useRef, useState } from '@wordpress/element';\n\n/**\n * Returns a recompute token and a debounced callback that bumps it.\n * Rapid successive calls cancel the previous pending timeout so only one\n * recompute fires, `delayMs` after the last call.\n *\n * @param delayMs - Milliseconds to wait before bumping the recompute token.\n * @return A tuple of [recomputeToken, rerenderAfterDelay].\n */\nexport function useDebouncedRecompute(\n\tdelayMs: number\n): [ number, () => () => void ] {\n\tconst [ recomputeToken, setRecomputeToken ] = useState( 0 );\n\tconst timeoutRef = useRef< ReturnType< typeof setTimeout > | null >( null );\n\n\tconst rerenderAfterDelay = useCallback( () => {\n\t\tif ( timeoutRef.current ) {\n\t\t\tclearTimeout( timeoutRef.current );\n\t\t}\n\t\ttimeoutRef.current = setTimeout( () => {\n\t\t\tsetRecomputeToken( ( t ) => t + 1 );\n\t\t}, delayMs );\n\t\treturn () => {\n\t\t\tif ( timeoutRef.current ) {\n\t\t\t\tclearTimeout( timeoutRef.current );\n\t\t\t}\n\t\t};\n\t}, [ delayMs ] );\n\n\treturn [ recomputeToken, rerenderAfterDelay ];\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAA8C;AAUvC,SAAS,sBACf,SAC+B;AAC/B,QAAM,CAAE,gBAAgB,iBAAkB,QAAI,yBAAU,CAAE;AAC1D,QAAM,iBAAa,uBAAkD,IAAK;AAE1E,QAAM,yBAAqB,4BAAa,MAAM;AAC7C,QAAK,WAAW,SAAU;AACzB,mBAAc,WAAW,OAAQ;AAAA,IAClC;AACA,eAAW,UAAU,WAAY,MAAM;AACtC,wBAAmB,CAAE,MAAO,IAAI,CAAE;AAAA,IACnC,GAAG,OAAQ;AACX,WAAO,MAAM;AACZ,UAAK,WAAW,SAAU;AACzB,qBAAc,WAAW,OAAQ;AAAA,MAClC;AAAA,IACD;AAAA,EACD,GAAG,CAAE,OAAQ,CAAE;AAEf,SAAO,CAAE,gBAAgB,kBAAmB;AAC7C;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -24,12 +24,16 @@ __export(use_render_cursors_exports, {
|
|
|
24
24
|
});
|
|
25
25
|
module.exports = __toCommonJS(use_render_cursors_exports);
|
|
26
26
|
var import_core_data = require("@wordpress/core-data");
|
|
27
|
+
var import_data = require("@wordpress/data");
|
|
27
28
|
var import_element = require("@wordpress/element");
|
|
29
|
+
var import_preferences = require("@wordpress/preferences");
|
|
28
30
|
var import_lock_unlock = require("../../lock-unlock.cjs");
|
|
29
31
|
var import_get_avatar_url = require("./get-avatar-url.cjs");
|
|
30
32
|
var import_utils = require("../collab-sidebar/utils.cjs");
|
|
33
|
+
var import_compute_selection = require("./compute-selection.cjs");
|
|
34
|
+
var import_use_debounced_recompute = require("./use-debounced-recompute.cjs");
|
|
31
35
|
var { useActiveCollaborators, useResolvedSelection } = (0, import_lock_unlock.unlock)(import_core_data.privateApis);
|
|
32
|
-
function useRenderCursors(overlayElement, blockEditorDocument, postId, postType) {
|
|
36
|
+
function useRenderCursors(overlayElement, blockEditorDocument, postId, postType, delayMs) {
|
|
33
37
|
const sortedUsers = useActiveCollaborators(
|
|
34
38
|
postId ?? null,
|
|
35
39
|
postType ?? null
|
|
@@ -38,191 +42,96 @@ function useRenderCursors(overlayElement, blockEditorDocument, postId, postType)
|
|
|
38
42
|
postId ?? null,
|
|
39
43
|
postType ?? null
|
|
40
44
|
);
|
|
45
|
+
const showOwnCursor = (0, import_data.useSelect)(
|
|
46
|
+
(select) => select(import_preferences.store).get("core", "showCollaborationCursor"),
|
|
47
|
+
[]
|
|
48
|
+
);
|
|
41
49
|
const [cursorPositions, setCursorPositions] = (0, import_element.useState)(
|
|
42
50
|
[]
|
|
43
51
|
);
|
|
44
|
-
const
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
52
|
+
const [recomputeToken, rerenderCursorsAfterDelay] = (0, import_use_debounced_recompute.useDebouncedRecompute)(delayMs);
|
|
53
|
+
(0, import_element.useEffect)(() => {
|
|
54
|
+
if (!overlayElement || !blockEditorDocument) {
|
|
55
|
+
setCursorPositions([]);
|
|
56
|
+
return;
|
|
57
|
+
}
|
|
58
|
+
const overlayRect = overlayElement.getBoundingClientRect();
|
|
59
|
+
const overlayContext = {
|
|
60
|
+
editorDocument: blockEditorDocument,
|
|
61
|
+
overlayRect
|
|
62
|
+
};
|
|
63
|
+
const results = [];
|
|
64
|
+
const hasOtherCollaborators = sortedUsers.some(
|
|
65
|
+
(u) => !u.isMe
|
|
66
|
+
);
|
|
67
|
+
sortedUsers.forEach((user) => {
|
|
68
|
+
if (user.isMe && (!showOwnCursor || !hasOtherCollaborators)) {
|
|
48
69
|
return;
|
|
49
70
|
}
|
|
50
|
-
const
|
|
51
|
-
|
|
52
|
-
|
|
71
|
+
const selection = user.editorState?.selection ?? {
|
|
72
|
+
type: import_core_data.SelectionType.None
|
|
73
|
+
};
|
|
74
|
+
let start = {
|
|
75
|
+
textIndex: null,
|
|
76
|
+
localClientId: null
|
|
77
|
+
};
|
|
78
|
+
let end;
|
|
79
|
+
if (selection.type === import_core_data.SelectionType.Cursor) {
|
|
80
|
+
try {
|
|
81
|
+
start = resolveSelection(selection);
|
|
82
|
+
} catch {
|
|
53
83
|
return;
|
|
54
84
|
}
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
const userName = user.collaboratorInfo.name;
|
|
59
|
-
const clientId = user.clientId;
|
|
60
|
-
const color = (0, import_utils.getAvatarBorderColor)(user.collaboratorInfo.id);
|
|
61
|
-
const avatarUrl = (0, import_get_avatar_url.getAvatarUrl)(
|
|
62
|
-
user.collaboratorInfo.avatar_urls
|
|
63
|
-
);
|
|
64
|
-
let coords = null;
|
|
65
|
-
if (selection.type === import_core_data.SelectionType.None) {
|
|
66
|
-
} else if (selection.type === import_core_data.SelectionType.WholeBlock) {
|
|
67
|
-
} else if (selection.type === import_core_data.SelectionType.Cursor) {
|
|
68
|
-
const { textIndex, localClientId } = resolveSelection(selection);
|
|
69
|
-
if (localClientId) {
|
|
70
|
-
coords = getCursorPosition(
|
|
71
|
-
textIndex,
|
|
72
|
-
localClientId,
|
|
73
|
-
blockEditorDocument,
|
|
74
|
-
overlayElement
|
|
75
|
-
);
|
|
76
|
-
}
|
|
77
|
-
} else if (selection.type === import_core_data.SelectionType.SelectionInOneBlock || selection.type === import_core_data.SelectionType.SelectionInMultipleBlocks) {
|
|
78
|
-
const { textIndex, localClientId } = resolveSelection({
|
|
85
|
+
} else if (selection.type === import_core_data.SelectionType.SelectionInOneBlock || selection.type === import_core_data.SelectionType.SelectionInMultipleBlocks) {
|
|
86
|
+
try {
|
|
87
|
+
start = resolveSelection({
|
|
79
88
|
type: import_core_data.SelectionType.Cursor,
|
|
80
89
|
cursorPosition: selection.cursorStartPosition
|
|
81
90
|
});
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
localClientId,
|
|
86
|
-
blockEditorDocument,
|
|
87
|
-
overlayElement
|
|
88
|
-
);
|
|
89
|
-
}
|
|
90
|
-
}
|
|
91
|
-
if (coords) {
|
|
92
|
-
results.push({
|
|
93
|
-
userName,
|
|
94
|
-
clientId,
|
|
95
|
-
color,
|
|
96
|
-
avatarUrl,
|
|
97
|
-
...coords
|
|
91
|
+
end = resolveSelection({
|
|
92
|
+
type: import_core_data.SelectionType.Cursor,
|
|
93
|
+
cursorPosition: selection.cursorEndPosition
|
|
98
94
|
});
|
|
95
|
+
} catch {
|
|
96
|
+
return;
|
|
99
97
|
}
|
|
100
|
-
});
|
|
101
|
-
setCursorPositions(results);
|
|
102
|
-
},
|
|
103
|
-
[blockEditorDocument, resolveSelection, overlayElement, sortedUsers]
|
|
104
|
-
);
|
|
105
|
-
(0, import_element.useEffect)(computeCursors, [computeCursors]);
|
|
106
|
-
const rerenderCursorsAfterDelay = (0, import_element.useMemo)(
|
|
107
|
-
() => () => {
|
|
108
|
-
const timeout = setTimeout(computeCursors, 500);
|
|
109
|
-
return () => clearTimeout(timeout);
|
|
110
|
-
},
|
|
111
|
-
[computeCursors]
|
|
112
|
-
);
|
|
113
|
-
return { cursors: cursorPositions, rerenderCursorsAfterDelay };
|
|
114
|
-
}
|
|
115
|
-
var getCursorPosition = (absolutePositionIndex, blockId, editorDocument, overlay) => {
|
|
116
|
-
if (absolutePositionIndex === null) {
|
|
117
|
-
return null;
|
|
118
|
-
}
|
|
119
|
-
const blockElement = editorDocument.querySelector(
|
|
120
|
-
`[data-block="${blockId}"]`
|
|
121
|
-
);
|
|
122
|
-
if (!blockElement) {
|
|
123
|
-
return null;
|
|
124
|
-
}
|
|
125
|
-
return getOffsetPositionInBlock(
|
|
126
|
-
blockElement,
|
|
127
|
-
absolutePositionIndex,
|
|
128
|
-
editorDocument,
|
|
129
|
-
overlay
|
|
130
|
-
) ?? null;
|
|
131
|
-
};
|
|
132
|
-
var getOffsetPositionInBlock = (blockElement, charOffset, editorDocument, overlay) => {
|
|
133
|
-
const { node, offset } = findInnerBlockOffset(
|
|
134
|
-
blockElement,
|
|
135
|
-
charOffset,
|
|
136
|
-
editorDocument
|
|
137
|
-
);
|
|
138
|
-
const cursorRange = editorDocument.createRange();
|
|
139
|
-
try {
|
|
140
|
-
cursorRange.setStart(node, offset);
|
|
141
|
-
} catch (error) {
|
|
142
|
-
return null;
|
|
143
|
-
}
|
|
144
|
-
cursorRange.collapse(true);
|
|
145
|
-
const cursorRect = cursorRange.getBoundingClientRect();
|
|
146
|
-
const overlayRect = overlay.getBoundingClientRect();
|
|
147
|
-
const blockRect = blockElement.getBoundingClientRect();
|
|
148
|
-
let cursorX = 0;
|
|
149
|
-
let cursorY = 0;
|
|
150
|
-
if (cursorRect.x === 0 && cursorRect.y === 0 && cursorRect.width === 0 && cursorRect.height === 0) {
|
|
151
|
-
cursorX = blockRect.left - overlayRect.left;
|
|
152
|
-
cursorY = blockRect.top - overlayRect.top;
|
|
153
|
-
} else {
|
|
154
|
-
cursorX = cursorRect.left - overlayRect.left;
|
|
155
|
-
cursorY = cursorRect.top - overlayRect.top;
|
|
156
|
-
}
|
|
157
|
-
let cursorHeight = cursorRect.height;
|
|
158
|
-
if (cursorHeight === 0) {
|
|
159
|
-
cursorHeight = parseInt(
|
|
160
|
-
window.getComputedStyle(blockElement).lineHeight,
|
|
161
|
-
10
|
|
162
|
-
) || blockRect.height;
|
|
163
|
-
}
|
|
164
|
-
return {
|
|
165
|
-
x: cursorX,
|
|
166
|
-
y: cursorY,
|
|
167
|
-
height: cursorHeight
|
|
168
|
-
};
|
|
169
|
-
};
|
|
170
|
-
var MAX_NODE_OFFSET_COUNT = 1e3;
|
|
171
|
-
var findInnerBlockOffset = (blockElement, offset, editorDocument) => {
|
|
172
|
-
const treeWalker = editorDocument.createTreeWalker(
|
|
173
|
-
blockElement,
|
|
174
|
-
NodeFilter.SHOW_TEXT | NodeFilter.SHOW_ELEMENT
|
|
175
|
-
// eslint-disable-line no-bitwise
|
|
176
|
-
);
|
|
177
|
-
let currentOffset = 0;
|
|
178
|
-
let lastTextNode = null;
|
|
179
|
-
let node = null;
|
|
180
|
-
let nodeCount = 1;
|
|
181
|
-
while (node = treeWalker.nextNode()) {
|
|
182
|
-
nodeCount++;
|
|
183
|
-
if (nodeCount > MAX_NODE_OFFSET_COUNT) {
|
|
184
|
-
if (lastTextNode) {
|
|
185
|
-
return { node: lastTextNode, offset: 0 };
|
|
186
98
|
}
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
99
|
+
const userName = user.collaboratorInfo.name;
|
|
100
|
+
const clientId = user.clientId;
|
|
101
|
+
const color = user.isMe ? "var(--wp-admin-theme-color)" : (0, import_utils.getAvatarBorderColor)(user.collaboratorInfo.id);
|
|
102
|
+
const avatarUrl = (0, import_get_avatar_url.getAvatarUrl)(user.collaboratorInfo.avatar_urls);
|
|
103
|
+
const selectionVisual = (0, import_compute_selection.computeSelectionVisual)(
|
|
104
|
+
selection,
|
|
105
|
+
start,
|
|
106
|
+
end,
|
|
107
|
+
overlayContext
|
|
108
|
+
);
|
|
109
|
+
if (selectionVisual.coords) {
|
|
110
|
+
const cursorData = {
|
|
111
|
+
userName,
|
|
112
|
+
clientId,
|
|
113
|
+
color,
|
|
114
|
+
avatarUrl,
|
|
115
|
+
isMe: user.isMe,
|
|
116
|
+
...selectionVisual.coords
|
|
117
|
+
};
|
|
118
|
+
if (selectionVisual.selectionRects) {
|
|
119
|
+
cursorData.selectionRects = selectionVisual.selectionRects;
|
|
203
120
|
}
|
|
204
|
-
|
|
205
|
-
continue;
|
|
206
|
-
} else {
|
|
207
|
-
continue;
|
|
121
|
+
results.push(cursorData);
|
|
208
122
|
}
|
|
209
|
-
}
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
if (lastTextNode && lastTextNode.nodeValue?.length) {
|
|
222
|
-
return { node: lastTextNode, offset: lastTextNode.nodeValue.length };
|
|
223
|
-
}
|
|
224
|
-
return { node: blockElement, offset: 0 };
|
|
225
|
-
};
|
|
123
|
+
});
|
|
124
|
+
setCursorPositions(results);
|
|
125
|
+
}, [
|
|
126
|
+
blockEditorDocument,
|
|
127
|
+
resolveSelection,
|
|
128
|
+
overlayElement,
|
|
129
|
+
sortedUsers,
|
|
130
|
+
showOwnCursor,
|
|
131
|
+
recomputeToken
|
|
132
|
+
]);
|
|
133
|
+
return { cursors: cursorPositions, rerenderCursorsAfterDelay };
|
|
134
|
+
}
|
|
226
135
|
// Annotate the CommonJS export names for ESM import in node:
|
|
227
136
|
0 && (module.exports = {
|
|
228
137
|
useRenderCursors
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/collaborators-overlay/use-render-cursors.ts"],
|
|
4
|
-
"sourcesContent": ["import {\n\tprivateApis as coreDataPrivateApis,\n\tSelectionType,\n} from '@wordpress/core-data';\nimport { useEffect, useMemo, useState } from '@wordpress/element';\n\nimport { unlock } from '../../lock-unlock';\nimport { getAvatarUrl } from './get-avatar-url';\nimport { getAvatarBorderColor } from '../collab-sidebar/utils';\n\nconst { useActiveCollaborators, useResolvedSelection } =\n\tunlock( coreDataPrivateApis );\n\nexport interface CursorData {\n\tuserName: string;\n\tclientId: number;\n\tcolor: string;\n\tavatarUrl?: string;\n\tx: number;\n\ty: number;\n\theight: number;\n}\n\n/**\n * Custom hook that computes cursor positions for each remote user in the editor.\n *\n * @param overlayElement - The overlay element\n * @param blockEditorDocument - The block editor document\n * @param postId - The ID of the post\n * @param postType - The type of the post\n * @return An array of cursor data for rendering, and a function to trigger a delayed recompute.\n */\nexport function useRenderCursors(\n\toverlayElement: HTMLElement | null,\n\tblockEditorDocument: Document | null,\n\tpostId: number | null,\n\tpostType: string | null\n): { cursors: CursorData[]; rerenderCursorsAfterDelay: () => () => void } {\n\tconst sortedUsers = useActiveCollaborators(\n\t\tpostId ?? null,\n\t\tpostType ?? null\n\t);\n\tconst resolveSelection = useResolvedSelection(\n\t\tpostId ?? null,\n\t\tpostType ?? null\n\t);\n\n\tconst [ cursorPositions, setCursorPositions ] = useState< CursorData[] >(\n\t\t[]\n\t);\n\n\tconst computeCursors = useMemo(\n\t\t() => () => {\n\t\t\tif ( ! overlayElement || ! blockEditorDocument ) {\n\t\t\t\tsetCursorPositions( [] );\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst results: CursorData[] = [];\n\n\t\t\tsortedUsers.forEach( ( user: any ) => {\n\t\t\t\tif ( user.isMe ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst selection = user.editorState?.selection ?? {\n\t\t\t\t\ttype: SelectionType.None,\n\t\t\t\t};\n\t\t\t\tconst userName = user.collaboratorInfo.name;\n\t\t\t\tconst clientId = user.clientId;\n\t\t\t\tconst color = getAvatarBorderColor( user.collaboratorInfo.id );\n\t\t\t\tconst avatarUrl = getAvatarUrl(\n\t\t\t\t\tuser.collaboratorInfo.avatar_urls\n\t\t\t\t);\n\n\t\t\t\tlet coords: {\n\t\t\t\t\tx: number;\n\t\t\t\t\ty: number;\n\t\t\t\t\theight: number;\n\t\t\t\t} | null = null;\n\n\t\t\t\tif ( selection.type === SelectionType.None ) {\n\t\t\t\t\t// Nothing selected.\n\t\t\t\t} else if ( selection.type === SelectionType.WholeBlock ) {\n\t\t\t\t\t// Don't draw a cursor for a whole block selection.\n\t\t\t\t} else if ( selection.type === SelectionType.Cursor ) {\n\t\t\t\t\tconst { textIndex, localClientId } =\n\t\t\t\t\t\tresolveSelection( selection );\n\t\t\t\t\tif ( localClientId ) {\n\t\t\t\t\t\tcoords = getCursorPosition(\n\t\t\t\t\t\t\ttextIndex,\n\t\t\t\t\t\t\tlocalClientId,\n\t\t\t\t\t\t\tblockEditorDocument,\n\t\t\t\t\t\t\toverlayElement\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t} else if (\n\t\t\t\t\tselection.type === SelectionType.SelectionInOneBlock ||\n\t\t\t\t\tselection.type === SelectionType.SelectionInMultipleBlocks\n\t\t\t\t) {\n\t\t\t\t\tconst { textIndex, localClientId } = resolveSelection( {\n\t\t\t\t\t\ttype: SelectionType.Cursor,\n\t\t\t\t\t\tcursorPosition: selection.cursorStartPosition,\n\t\t\t\t\t} );\n\t\t\t\t\tif ( localClientId ) {\n\t\t\t\t\t\tcoords = getCursorPosition(\n\t\t\t\t\t\t\ttextIndex,\n\t\t\t\t\t\t\tlocalClientId,\n\t\t\t\t\t\t\tblockEditorDocument,\n\t\t\t\t\t\t\toverlayElement\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tif ( coords ) {\n\t\t\t\t\tresults.push( {\n\t\t\t\t\t\tuserName,\n\t\t\t\t\t\tclientId,\n\t\t\t\t\t\tcolor,\n\t\t\t\t\t\tavatarUrl,\n\t\t\t\t\t\t...coords,\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t} );\n\n\t\t\tsetCursorPositions( results );\n\t\t},\n\t\t[ blockEditorDocument, resolveSelection, overlayElement, sortedUsers ]\n\t);\n\n\tuseEffect( computeCursors, [ computeCursors ] );\n\n\tconst rerenderCursorsAfterDelay = useMemo(\n\t\t() => () => {\n\t\t\tconst timeout = setTimeout( computeCursors, 500 );\n\t\t\treturn () => clearTimeout( timeout );\n\t\t},\n\t\t[ computeCursors ]\n\t);\n\n\treturn { cursors: cursorPositions, rerenderCursorsAfterDelay };\n}\n\n/**\n * Given a selection, returns the coordinates of the cursor in the block.\n *\n * @param absolutePositionIndex - The absolute position index\n * @param blockId - The block ID\n * @param editorDocument - The editor document\n * @param overlay - The overlay element\n * @return The position of the cursor\n */\nconst getCursorPosition = (\n\tabsolutePositionIndex: number | null,\n\tblockId: string,\n\teditorDocument: Document,\n\toverlay: HTMLElement\n): { x: number; y: number; height: number } | null => {\n\tif ( absolutePositionIndex === null ) {\n\t\t// An absolute position index can be null if a cursor was set in a block that\n\t\t// has since been deleted.\n\t\t// Return null so we don't try to draw it.\n\t\treturn null;\n\t}\n\n\tconst blockElement = editorDocument.querySelector(\n\t\t`[data-block=\"${ blockId }\"]`\n\t) as HTMLElement;\n\n\tif ( ! blockElement ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\tgetOffsetPositionInBlock(\n\t\t\tblockElement,\n\t\t\tabsolutePositionIndex,\n\t\t\teditorDocument,\n\t\t\toverlay\n\t\t) ?? null\n\t);\n};\n\n/**\n * Given a block element and a character offset, returns the coordinates for drawing a visual cursor in the block.\n *\n * @param blockElement - The block element\n * @param charOffset - The character offset\n * @param editorDocument - The editor document\n * @param overlay - The overlay element\n * @return The position of the cursor\n */\nconst getOffsetPositionInBlock = (\n\tblockElement: HTMLElement,\n\tcharOffset: number,\n\teditorDocument: Document,\n\toverlay: HTMLElement\n) => {\n\tconst { node, offset } = findInnerBlockOffset(\n\t\tblockElement,\n\t\tcharOffset,\n\t\teditorDocument\n\t);\n\n\tconst cursorRange = editorDocument.createRange();\n\n\ttry {\n\t\tcursorRange.setStart( node, offset );\n\t} catch ( error ) {\n\t\treturn null;\n\t}\n\n\t// Ensure the range only represents single point in the DOM.\n\tcursorRange.collapse( true );\n\n\tconst cursorRect = cursorRange.getBoundingClientRect();\n\tconst overlayRect = overlay.getBoundingClientRect();\n\tconst blockRect = blockElement.getBoundingClientRect();\n\n\tlet cursorX = 0;\n\tlet cursorY = 0;\n\n\tif (\n\t\tcursorRect.x === 0 &&\n\t\tcursorRect.y === 0 &&\n\t\tcursorRect.width === 0 &&\n\t\tcursorRect.height === 0\n\t) {\n\t\t// This can happen for empty blocks.\n\t\tcursorX = blockRect.left - overlayRect.left;\n\t\tcursorY = blockRect.top - overlayRect.top;\n\t} else {\n\t\tcursorX = cursorRect.left - overlayRect.left;\n\t\tcursorY = cursorRect.top - overlayRect.top;\n\t}\n\n\tlet cursorHeight = cursorRect.height;\n\tif ( cursorHeight === 0 ) {\n\t\tcursorHeight =\n\t\t\tparseInt(\n\t\t\t\twindow.getComputedStyle( blockElement ).lineHeight,\n\t\t\t\t10\n\t\t\t) || blockRect.height;\n\t}\n\n\treturn {\n\t\tx: cursorX,\n\t\ty: cursorY,\n\t\theight: cursorHeight,\n\t};\n};\n\nconst MAX_NODE_OFFSET_COUNT = 1000;\n\n/**\n * Given a block element and a character offset, returns an exact inner node and offset for use in a range.\n *\n * @param blockElement - The block element\n * @param offset - The character offset\n * @param editorDocument - The editor document\n * @return The node and offset of the character at the offset\n */\nconst findInnerBlockOffset = (\n\tblockElement: HTMLElement,\n\toffset: number,\n\teditorDocument: Document\n) => {\n\tconst treeWalker = editorDocument.createTreeWalker(\n\t\tblockElement,\n\t\tNodeFilter.SHOW_TEXT | NodeFilter.SHOW_ELEMENT // eslint-disable-line no-bitwise\n\t);\n\n\tlet currentOffset = 0;\n\tlet lastTextNode: Node | null = null;\n\n\tlet node: Node | null = null;\n\tlet nodeCount = 1;\n\n\twhile ( ( node = treeWalker.nextNode() ) ) {\n\t\tnodeCount++;\n\n\t\tif ( nodeCount > MAX_NODE_OFFSET_COUNT ) {\n\t\t\t// If we've walked too many nodes, return the last text node or the beginning of the block.\n\t\t\tif ( lastTextNode ) {\n\t\t\t\treturn { node: lastTextNode, offset: 0 };\n\t\t\t}\n\t\t\treturn { node: blockElement, offset: 0 };\n\t\t}\n\n\t\tconst nodeLength = node.nodeValue?.length ?? 0;\n\n\t\tif ( node.nodeType === Node.ELEMENT_NODE ) {\n\t\t\tif ( node.nodeName === 'BR' ) {\n\t\t\t\t// Treat <br> as a single \"\\n\" character.\n\n\t\t\t\tif ( currentOffset + 1 >= offset ) {\n\t\t\t\t\t// If the <br> occurs right on the target offset, return the next text node.\n\t\t\t\t\tconst nodeAfterBr = treeWalker.nextNode();\n\n\t\t\t\t\tif ( nodeAfterBr?.nodeType === Node.TEXT_NODE ) {\n\t\t\t\t\t\treturn { node: nodeAfterBr, offset: 0 };\n\t\t\t\t\t} else if ( lastTextNode ) {\n\t\t\t\t\t\t// If there's no text node after the <br>, return the end offset of the last text node.\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\tnode: lastTextNode,\n\t\t\t\t\t\t\toffset: lastTextNode.nodeValue?.length ?? 0,\n\t\t\t\t\t\t};\n\t\t\t\t\t}\n\t\t\t\t\t// Just in case, if there's no last text node, return the beginning of the block.\n\t\t\t\t\treturn { node: blockElement, offset: 0 };\n\t\t\t\t}\n\n\t\t\t\t// The <br> is before the target offset. Count it as a single character.\n\t\t\t\tcurrentOffset += 1;\n\t\t\t\tcontinue;\n\t\t\t} else {\n\t\t\t\t// Skip other element types.\n\t\t\t\tcontinue;\n\t\t\t}\n\t\t}\n\n\t\tif ( nodeLength === 0 ) {\n\t\t\t// Skip empty nodes.\n\t\t\tcontinue;\n\t\t}\n\n\t\tif ( currentOffset + nodeLength >= offset ) {\n\t\t\t// This node exceeds the target offset. Return the node and the position of the offset within it.\n\t\t\treturn { node, offset: offset - currentOffset };\n\t\t}\n\n\t\tcurrentOffset += nodeLength;\n\n\t\tif ( node.nodeType === Node.TEXT_NODE ) {\n\t\t\tlastTextNode = node;\n\t\t}\n\t}\n\n\tif ( lastTextNode && lastTextNode.nodeValue?.length ) {\n\t\t// We didn't reach the target offset. Return the last text node's last character.\n\t\treturn { node: lastTextNode, offset: lastTextNode.nodeValue.length };\n\t}\n\n\t// We didn't find any text nodes. Return the beginning of the block.\n\treturn { node: blockElement, offset: 0 };\n};\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,
|
|
6
|
-
"names": ["coreDataPrivateApis"]
|
|
4
|
+
"sourcesContent": ["import {\n\tprivateApis as coreDataPrivateApis,\n\tSelectionType,\n\ttype PostEditorAwarenessState as ActiveCollaborator,\n} from '@wordpress/core-data';\nimport { useSelect } from '@wordpress/data';\nimport { useEffect, useState } from '@wordpress/element';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport type { ResolvedSelection } from '@wordpress/core-data';\n\nimport { unlock } from '../../lock-unlock';\nimport { getAvatarUrl } from './get-avatar-url';\nimport { getAvatarBorderColor } from '../collab-sidebar/utils';\nimport { computeSelectionVisual } from './compute-selection';\nimport { useDebouncedRecompute } from './use-debounced-recompute';\nimport type { SelectionRect } from './cursor-dom-utils';\n\nconst { useActiveCollaborators, useResolvedSelection } =\n\tunlock( coreDataPrivateApis );\n\nexport type { SelectionRect };\n\nexport interface CursorData {\n\tuserName: string;\n\tclientId: number;\n\tcolor: string;\n\tavatarUrl?: string;\n\tx: number;\n\ty: number;\n\theight: number;\n\tisMe?: boolean;\n\tselectionRects?: SelectionRect[];\n}\n\n/**\n * Custom hook that computes cursor positions for each remote user in the editor.\n *\n * @param overlayElement - The overlay element\n * @param blockEditorDocument - The block editor document\n * @param postId - The ID of the post\n * @param postType - The type of the post\n * @param delayMs - Milliseconds to wait before recomputing cursor positions.\n * @return An array of cursor data for rendering, and a function to trigger a delayed recompute.\n */\nexport function useRenderCursors(\n\toverlayElement: HTMLElement | null,\n\tblockEditorDocument: Document | null,\n\tpostId: number | null,\n\tpostType: string | null,\n\tdelayMs: number\n): { cursors: CursorData[]; rerenderCursorsAfterDelay: () => () => void } {\n\tconst sortedUsers = useActiveCollaborators(\n\t\tpostId ?? null,\n\t\tpostType ?? null\n\t);\n\tconst resolveSelection = useResolvedSelection(\n\t\tpostId ?? null,\n\t\tpostType ?? null\n\t);\n\n\tconst showOwnCursor = useSelect(\n\t\t( select ) =>\n\t\t\tselect( preferencesStore ).get( 'core', 'showCollaborationCursor' ),\n\t\t[]\n\t);\n\n\tconst [ cursorPositions, setCursorPositions ] = useState< CursorData[] >(\n\t\t[]\n\t);\n\n\t// Bump this counter to force the effect to re-run (e.g. after a layout shift).\n\tconst [ recomputeToken, rerenderCursorsAfterDelay ] =\n\t\tuseDebouncedRecompute( delayMs );\n\n\t// All DOM position computations live inside useEffect.\n\tuseEffect( () => {\n\t\tif ( ! overlayElement || ! blockEditorDocument ) {\n\t\t\tsetCursorPositions( [] );\n\t\t\treturn;\n\t\t}\n\n\t\t// Pre-compute the overlay rect once, same for every user.\n\t\tconst overlayRect = overlayElement.getBoundingClientRect();\n\t\tconst overlayContext = {\n\t\t\teditorDocument: blockEditorDocument,\n\t\t\toverlayRect,\n\t\t};\n\n\t\tconst results: CursorData[] = [];\n\n\t\tconst hasOtherCollaborators = sortedUsers.some(\n\t\t\t( u: ActiveCollaborator ) => ! u.isMe\n\t\t);\n\n\t\tsortedUsers.forEach( ( user: ActiveCollaborator ) => {\n\t\t\tif ( user.isMe && ( ! showOwnCursor || ! hasOtherCollaborators ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst selection = user.editorState?.selection ?? {\n\t\t\t\ttype: SelectionType.None,\n\t\t\t};\n\n\t\t\tlet start: ResolvedSelection = {\n\t\t\t\ttextIndex: null,\n\t\t\t\tlocalClientId: null,\n\t\t\t};\n\t\t\tlet end: ResolvedSelection | undefined;\n\n\t\t\tif ( selection.type === SelectionType.Cursor ) {\n\t\t\t\ttry {\n\t\t\t\t\tstart = resolveSelection( selection );\n\t\t\t\t} catch {\n\t\t\t\t\t// Selection may reference a stale Yjs position.\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t} else if (\n\t\t\t\tselection.type === SelectionType.SelectionInOneBlock ||\n\t\t\t\tselection.type === SelectionType.SelectionInMultipleBlocks\n\t\t\t) {\n\t\t\t\ttry {\n\t\t\t\t\tstart = resolveSelection( {\n\t\t\t\t\t\ttype: SelectionType.Cursor,\n\t\t\t\t\t\tcursorPosition: selection.cursorStartPosition,\n\t\t\t\t\t} );\n\n\t\t\t\t\tend = resolveSelection( {\n\t\t\t\t\t\ttype: SelectionType.Cursor,\n\t\t\t\t\t\tcursorPosition: selection.cursorEndPosition,\n\t\t\t\t\t} );\n\t\t\t\t} catch {\n\t\t\t\t\t// Selection may reference a stale Yjs position.\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tconst userName = user.collaboratorInfo.name;\n\t\t\tconst clientId = user.clientId;\n\t\t\tconst color = user.isMe\n\t\t\t\t? 'var(--wp-admin-theme-color)'\n\t\t\t\t: getAvatarBorderColor( user.collaboratorInfo.id );\n\t\t\tconst avatarUrl = getAvatarUrl( user.collaboratorInfo.avatar_urls );\n\n\t\t\tconst selectionVisual = computeSelectionVisual(\n\t\t\t\tselection,\n\t\t\t\tstart,\n\t\t\t\tend,\n\t\t\t\toverlayContext\n\t\t\t);\n\n\t\t\tif ( selectionVisual.coords ) {\n\t\t\t\tconst cursorData: CursorData = {\n\t\t\t\t\tuserName,\n\t\t\t\t\tclientId,\n\t\t\t\t\tcolor,\n\t\t\t\t\tavatarUrl,\n\t\t\t\t\tisMe: user.isMe,\n\t\t\t\t\t...selectionVisual.coords,\n\t\t\t\t};\n\n\t\t\t\tif ( selectionVisual.selectionRects ) {\n\t\t\t\t\tcursorData.selectionRects = selectionVisual.selectionRects;\n\t\t\t\t}\n\n\t\t\t\tresults.push( cursorData );\n\t\t\t}\n\t\t} );\n\n\t\tsetCursorPositions( results );\n\t}, [\n\t\tblockEditorDocument,\n\t\tresolveSelection,\n\t\toverlayElement,\n\t\tsortedUsers,\n\t\tshowOwnCursor,\n\t\trecomputeToken,\n\t] );\n\n\treturn { cursors: cursorPositions, rerenderCursorsAfterDelay };\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAIO;AACP,kBAA0B;AAC1B,qBAAoC;AACpC,yBAA0C;AAG1C,yBAAuB;AACvB,4BAA6B;AAC7B,mBAAqC;AACrC,+BAAuC;AACvC,qCAAsC;AAGtC,IAAM,EAAE,wBAAwB,qBAAqB,QACpD,2BAAQ,iBAAAA,WAAoB;AA0BtB,SAAS,iBACf,gBACA,qBACA,QACA,UACA,SACyE;AACzE,QAAM,cAAc;AAAA,IACnB,UAAU;AAAA,IACV,YAAY;AAAA,EACb;AACA,QAAM,mBAAmB;AAAA,IACxB,UAAU;AAAA,IACV,YAAY;AAAA,EACb;AAEA,QAAM,oBAAgB;AAAA,IACrB,CAAE,WACD,OAAQ,mBAAAC,KAAiB,EAAE,IAAK,QAAQ,yBAA0B;AAAA,IACnE,CAAC;AAAA,EACF;AAEA,QAAM,CAAE,iBAAiB,kBAAmB,QAAI;AAAA,IAC/C,CAAC;AAAA,EACF;AAGA,QAAM,CAAE,gBAAgB,yBAA0B,QACjD,sDAAuB,OAAQ;AAGhC,gCAAW,MAAM;AAChB,QAAK,CAAE,kBAAkB,CAAE,qBAAsB;AAChD,yBAAoB,CAAC,CAAE;AACvB;AAAA,IACD;AAGA,UAAM,cAAc,eAAe,sBAAsB;AACzD,UAAM,iBAAiB;AAAA,MACtB,gBAAgB;AAAA,MAChB;AAAA,IACD;AAEA,UAAM,UAAwB,CAAC;AAE/B,UAAM,wBAAwB,YAAY;AAAA,MACzC,CAAE,MAA2B,CAAE,EAAE;AAAA,IAClC;AAEA,gBAAY,QAAS,CAAE,SAA8B;AACpD,UAAK,KAAK,SAAU,CAAE,iBAAiB,CAAE,wBAA0B;AAClE;AAAA,MACD;AAEA,YAAM,YAAY,KAAK,aAAa,aAAa;AAAA,QAChD,MAAM,+BAAc;AAAA,MACrB;AAEA,UAAI,QAA2B;AAAA,QAC9B,WAAW;AAAA,QACX,eAAe;AAAA,MAChB;AACA,UAAI;AAEJ,UAAK,UAAU,SAAS,+BAAc,QAAS;AAC9C,YAAI;AACH,kBAAQ,iBAAkB,SAAU;AAAA,QACrC,QAAQ;AAEP;AAAA,QACD;AAAA,MACD,WACC,UAAU,SAAS,+BAAc,uBACjC,UAAU,SAAS,+BAAc,2BAChC;AACD,YAAI;AACH,kBAAQ,iBAAkB;AAAA,YACzB,MAAM,+BAAc;AAAA,YACpB,gBAAgB,UAAU;AAAA,UAC3B,CAAE;AAEF,gBAAM,iBAAkB;AAAA,YACvB,MAAM,+BAAc;AAAA,YACpB,gBAAgB,UAAU;AAAA,UAC3B,CAAE;AAAA,QACH,QAAQ;AAEP;AAAA,QACD;AAAA,MACD;AAEA,YAAM,WAAW,KAAK,iBAAiB;AACvC,YAAM,WAAW,KAAK;AACtB,YAAM,QAAQ,KAAK,OAChB,oCACA,mCAAsB,KAAK,iBAAiB,EAAG;AAClD,YAAM,gBAAY,oCAAc,KAAK,iBAAiB,WAAY;AAElE,YAAM,sBAAkB;AAAA,QACvB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACD;AAEA,UAAK,gBAAgB,QAAS;AAC7B,cAAM,aAAyB;AAAA,UAC9B;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA,MAAM,KAAK;AAAA,UACX,GAAG,gBAAgB;AAAA,QACpB;AAEA,YAAK,gBAAgB,gBAAiB;AACrC,qBAAW,iBAAiB,gBAAgB;AAAA,QAC7C;AAEA,gBAAQ,KAAM,UAAW;AAAA,MAC1B;AAAA,IACD,CAAE;AAEF,uBAAoB,OAAQ;AAAA,EAC7B,GAAG;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAE;AAEF,SAAO,EAAE,SAAS,iBAAiB,0BAA0B;AAC9D;",
|
|
6
|
+
"names": ["coreDataPrivateApis", "preferencesStore"]
|
|
7
7
|
}
|
|
@@ -0,0 +1,121 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
|
|
30
|
+
// packages/editor/src/components/collaborators-presence/avatar/component.tsx
|
|
31
|
+
var component_exports = {};
|
|
32
|
+
__export(component_exports, {
|
|
33
|
+
default: () => component_default
|
|
34
|
+
});
|
|
35
|
+
module.exports = __toCommonJS(component_exports);
|
|
36
|
+
var import_clsx = __toESM(require("clsx"));
|
|
37
|
+
var import_colord = require("colord");
|
|
38
|
+
var import_a11y = __toESM(require("colord/plugins/a11y"));
|
|
39
|
+
var import_components = require("@wordpress/components");
|
|
40
|
+
var import_element = require("@wordpress/element");
|
|
41
|
+
var import_use_image_loading_status = require("./use-image-loading-status.cjs");
|
|
42
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
43
|
+
(0, import_colord.extend)([import_a11y.default]);
|
|
44
|
+
var GRAY_900 = "#1e1e1e";
|
|
45
|
+
var WHITE = "#fff";
|
|
46
|
+
function Avatar({
|
|
47
|
+
className,
|
|
48
|
+
src,
|
|
49
|
+
name,
|
|
50
|
+
label,
|
|
51
|
+
variant,
|
|
52
|
+
size = "default",
|
|
53
|
+
borderColor,
|
|
54
|
+
dimmed = false,
|
|
55
|
+
statusIndicator,
|
|
56
|
+
style,
|
|
57
|
+
...props
|
|
58
|
+
}) {
|
|
59
|
+
const {
|
|
60
|
+
status: imageStatus,
|
|
61
|
+
handleLoad,
|
|
62
|
+
handleError
|
|
63
|
+
} = (0, import_use_image_loading_status.useImageLoadingStatus)(src);
|
|
64
|
+
const imageLoaded = imageStatus === "loaded";
|
|
65
|
+
const showBadge = variant === "badge" && !!name;
|
|
66
|
+
const initials = name ? name.split(/\s+/).slice(0, 2).map((word) => word[0]).join("").toUpperCase() : void 0;
|
|
67
|
+
const nameColor = (0, import_element.useMemo)(
|
|
68
|
+
() => borderColor && (0, import_colord.colord)(borderColor).isReadable(GRAY_900, {
|
|
69
|
+
level: "AA",
|
|
70
|
+
size: "normal"
|
|
71
|
+
}) ? GRAY_900 : WHITE,
|
|
72
|
+
[borderColor]
|
|
73
|
+
);
|
|
74
|
+
const customProperties = {
|
|
75
|
+
...style,
|
|
76
|
+
...borderColor ? {
|
|
77
|
+
"--editor-avatar-outline-color": borderColor,
|
|
78
|
+
"--editor-avatar-name-color": nameColor
|
|
79
|
+
} : {}
|
|
80
|
+
};
|
|
81
|
+
const avatar = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
82
|
+
"div",
|
|
83
|
+
{
|
|
84
|
+
className: (0, import_clsx.default)("editor-avatar", className, {
|
|
85
|
+
"has-avatar-border-color": !!borderColor,
|
|
86
|
+
"has-src": imageLoaded,
|
|
87
|
+
"is-badge": showBadge,
|
|
88
|
+
"is-small": size === "small",
|
|
89
|
+
"is-dimmed": dimmed
|
|
90
|
+
}),
|
|
91
|
+
style: customProperties,
|
|
92
|
+
role: name ? "img" : void 0,
|
|
93
|
+
"aria-label": name || void 0,
|
|
94
|
+
...props,
|
|
95
|
+
children: [
|
|
96
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "editor-avatar__image", children: [
|
|
97
|
+
src && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
98
|
+
"img",
|
|
99
|
+
{
|
|
100
|
+
src,
|
|
101
|
+
alt: "",
|
|
102
|
+
crossOrigin: "anonymous",
|
|
103
|
+
className: "editor-avatar__img",
|
|
104
|
+
onLoad: handleLoad,
|
|
105
|
+
onError: handleError
|
|
106
|
+
}
|
|
107
|
+
),
|
|
108
|
+
!imageLoaded && initials
|
|
109
|
+
] }),
|
|
110
|
+
dimmed && !!statusIndicator && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "editor-avatar__status-indicator", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Icon, { icon: statusIndicator }) }),
|
|
111
|
+
showBadge && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "editor-avatar__name", children: label || name })
|
|
112
|
+
]
|
|
113
|
+
}
|
|
114
|
+
);
|
|
115
|
+
if (name && (!showBadge || label)) {
|
|
116
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Tooltip, { text: name, children: avatar });
|
|
117
|
+
}
|
|
118
|
+
return avatar;
|
|
119
|
+
}
|
|
120
|
+
var component_default = Avatar;
|
|
121
|
+
//# sourceMappingURL=component.cjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/components/collaborators-presence/avatar/component.tsx"],
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport { colord, extend } from 'colord';\nimport a11yPlugin from 'colord/plugins/a11y';\n\nextend( [ a11yPlugin ] );\n\n/**\n * WordPress dependencies\n */\nimport { Icon, Tooltip } from '@wordpress/components';\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { AvatarProps } from './types';\nimport { useImageLoadingStatus } from './use-image-loading-status';\n\n// Runtime equivalents of @wordpress/base-styles tokens ($gray-900, $white).\nconst GRAY_900 = '#1e1e1e';\nconst WHITE = '#fff';\n\nfunction Avatar( {\n\tclassName,\n\tsrc,\n\tname,\n\tlabel,\n\tvariant,\n\tsize = 'default',\n\tborderColor,\n\tdimmed = false,\n\tstatusIndicator,\n\tstyle,\n\t...props\n}: AvatarProps &\n\tOmit< React.HTMLAttributes< HTMLDivElement >, keyof AvatarProps > ) {\n\tconst {\n\t\tstatus: imageStatus,\n\t\thandleLoad,\n\t\thandleError,\n\t} = useImageLoadingStatus( src );\n\tconst imageLoaded = imageStatus === 'loaded';\n\n\tconst showBadge = variant === 'badge' && !! name;\n\tconst initials = name\n\t\t? name\n\t\t\t\t.split( /\\s+/ )\n\t\t\t\t.slice( 0, 2 )\n\t\t\t\t.map( ( word ) => word[ 0 ] )\n\t\t\t\t.join( '' )\n\t\t\t\t.toUpperCase()\n\t\t: undefined;\n\tconst nameColor = useMemo(\n\t\t() =>\n\t\t\tborderColor &&\n\t\t\tcolord( borderColor ).isReadable( GRAY_900, {\n\t\t\t\tlevel: 'AA',\n\t\t\t\tsize: 'normal',\n\t\t\t} )\n\t\t\t\t? GRAY_900\n\t\t\t\t: WHITE,\n\t\t[ borderColor ]\n\t);\n\n\tconst customProperties = {\n\t\t...style,\n\t\t...( borderColor\n\t\t\t? {\n\t\t\t\t\t'--editor-avatar-outline-color': borderColor,\n\t\t\t\t\t'--editor-avatar-name-color': nameColor,\n\t\t\t }\n\t\t\t: {} ),\n\t} as React.CSSProperties;\n\n\tconst avatar = (\n\t\t<div\n\t\t\tclassName={ clsx( 'editor-avatar', className, {\n\t\t\t\t'has-avatar-border-color': !! borderColor,\n\t\t\t\t'has-src': imageLoaded,\n\t\t\t\t'is-badge': showBadge,\n\t\t\t\t'is-small': size === 'small',\n\t\t\t\t'is-dimmed': dimmed,\n\t\t\t} ) }\n\t\t\tstyle={ customProperties }\n\t\t\trole={ name ? 'img' : undefined }\n\t\t\taria-label={ name || undefined }\n\t\t\t{ ...props }\n\t\t>\n\t\t\t<span className=\"editor-avatar__image\">\n\t\t\t\t{ src && (\n\t\t\t\t\t<img\n\t\t\t\t\t\tsrc={ src }\n\t\t\t\t\t\talt=\"\"\n\t\t\t\t\t\tcrossOrigin=\"anonymous\"\n\t\t\t\t\t\tclassName=\"editor-avatar__img\"\n\t\t\t\t\t\tonLoad={ handleLoad }\n\t\t\t\t\t\tonError={ handleError }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ ! imageLoaded && initials }\n\t\t\t</span>\n\t\t\t{ dimmed && !! statusIndicator && (\n\t\t\t\t<span className=\"editor-avatar__status-indicator\">\n\t\t\t\t\t<Icon icon={ statusIndicator } />\n\t\t\t\t</span>\n\t\t\t) }\n\t\t\t{ showBadge && (\n\t\t\t\t<span className=\"editor-avatar__name\">{ label || name }</span>\n\t\t\t) }\n\t\t</div>\n\t);\n\n\tif ( name && ( ! showBadge || label ) ) {\n\t\treturn <Tooltip text={ name }>{ avatar }</Tooltip>;\n\t}\n\n\treturn avatar;\n}\n\nexport default Avatar;\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAiB;AACjB,oBAA+B;AAC/B,kBAAuB;AAOvB,wBAA8B;AAC9B,qBAAwB;AAMxB,sCAAsC;AAwEnC;AAAA,IApFH,sBAAQ,CAAE,YAAAA,OAAW,CAAE;AAevB,IAAM,WAAW;AACjB,IAAM,QAAQ;AAEd,SAAS,OAAQ;AAAA,EAChB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA,GAAG;AACJ,GACqE;AACpE,QAAM;AAAA,IACL,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,EACD,QAAI,uDAAuB,GAAI;AAC/B,QAAM,cAAc,gBAAgB;AAEpC,QAAM,YAAY,YAAY,WAAW,CAAC,CAAE;AAC5C,QAAM,WAAW,OACd,KACC,MAAO,KAAM,EACb,MAAO,GAAG,CAAE,EACZ,IAAK,CAAE,SAAU,KAAM,CAAE,CAAE,EAC3B,KAAM,EAAG,EACT,YAAY,IACb;AACH,QAAM,gBAAY;AAAA,IACjB,MACC,mBACA,sBAAQ,WAAY,EAAE,WAAY,UAAU;AAAA,MAC3C,OAAO;AAAA,MACP,MAAM;AAAA,IACP,CAAE,IACC,WACA;AAAA,IACJ,CAAE,WAAY;AAAA,EACf;AAEA,QAAM,mBAAmB;AAAA,IACxB,GAAG;AAAA,IACH,GAAK,cACF;AAAA,MACA,iCAAiC;AAAA,MACjC,8BAA8B;AAAA,IAC9B,IACA,CAAC;AAAA,EACL;AAEA,QAAM,SACL;AAAA,IAAC;AAAA;AAAA,MACA,eAAY,YAAAC,SAAM,iBAAiB,WAAW;AAAA,QAC7C,2BAA2B,CAAC,CAAE;AAAA,QAC9B,WAAW;AAAA,QACX,YAAY;AAAA,QACZ,YAAY,SAAS;AAAA,QACrB,aAAa;AAAA,MACd,CAAE;AAAA,MACF,OAAQ;AAAA,MACR,MAAO,OAAO,QAAQ;AAAA,MACtB,cAAa,QAAQ;AAAA,MACnB,GAAG;AAAA,MAEL;AAAA,qDAAC,UAAK,WAAU,wBACb;AAAA,iBACD;AAAA,YAAC;AAAA;AAAA,cACA;AAAA,cACA,KAAI;AAAA,cACJ,aAAY;AAAA,cACZ,WAAU;AAAA,cACV,QAAS;AAAA,cACT,SAAU;AAAA;AAAA,UACX;AAAA,UAEC,CAAE,eAAe;AAAA,WACpB;AAAA,QACE,UAAU,CAAC,CAAE,mBACd,4CAAC,UAAK,WAAU,mCACf,sDAAC,0BAAK,MAAO,iBAAkB,GAChC;AAAA,QAEC,aACD,4CAAC,UAAK,WAAU,uBAAwB,mBAAS,MAAM;AAAA;AAAA;AAAA,EAEzD;AAGD,MAAK,SAAU,CAAE,aAAa,QAAU;AACvC,WAAO,4CAAC,6BAAQ,MAAO,MAAS,kBAAQ;AAAA,EACzC;AAEA,SAAO;AACR;AAEA,IAAO,oBAAQ;",
|
|
6
|
+
"names": ["a11yPlugin", "clsx"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
|
|
30
|
+
// packages/editor/src/components/collaborators-presence/avatar/index.ts
|
|
31
|
+
var avatar_exports = {};
|
|
32
|
+
__export(avatar_exports, {
|
|
33
|
+
default: () => import_component.default
|
|
34
|
+
});
|
|
35
|
+
module.exports = __toCommonJS(avatar_exports);
|
|
36
|
+
var import_component = __toESM(require("./component.cjs"));
|
|
37
|
+
//# sourceMappingURL=index.cjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/components/collaborators-presence/avatar/index.ts"],
|
|
4
|
+
"sourcesContent": ["export { default } from './component';\nexport type { AvatarProps } from './types';\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAAwB;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __copyProps = (to, from, except, desc) => {
|
|
7
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
8
|
+
for (let key of __getOwnPropNames(from))
|
|
9
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
10
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
11
|
+
}
|
|
12
|
+
return to;
|
|
13
|
+
};
|
|
14
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
15
|
+
|
|
16
|
+
// packages/editor/src/components/collaborators-presence/avatar/types.ts
|
|
17
|
+
var types_exports = {};
|
|
18
|
+
module.exports = __toCommonJS(types_exports);
|
|
19
|
+
//# sourceMappingURL=types.cjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/components/collaborators-presence/avatar/types.ts"],
|
|
4
|
+
"sourcesContent": ["import type { IconType } from '@wordpress/components';\n\nexport type AvatarProps = {\n\t/**\n\t * URL of the avatar image.\n\t *\n\t * When not provided, initials derived from `name` are shown.\n\t */\n\tsrc?: string;\n\t/**\n\t * Name of the user. Used as an accessible label and to generate\n\t * initials when no image is provided.\n\t */\n\tname?: string;\n\t/**\n\t * Visible text shown in the hover badge. When not provided, `name`\n\t * is used instead. Use this to provide contextual labels like \"You\"\n\t * without affecting the accessible name or initials.\n\t */\n\tlabel?: string;\n\t/**\n\t * Specifies the avatar's visual style treatment.\n\t *\n\t * - `'badge'`: Displays a hover-expand pill that reveals the user's\n\t * name (or `label`) on hover. Requires `name` to be set.\n\t *\n\t * Leave undefined for the default circular avatar.\n\t */\n\tvariant?: 'badge';\n\t/**\n\t * Size of the avatar.\n\t *\n\t * - `'default'`: For standalone avatars and list items where the\n\t * avatar is a primary visual element (e.g. collaborator lists,\n\t * user profiles).\n\t * - `'small'`: For inline or compact contexts where space is\n\t * limited (e.g. cursor labels, toolbars, badges alongside text).\n\t *\n\t * @default 'default'\n\t */\n\tsize?: 'default' | 'small';\n\t/**\n\t * CSS color value for an accent border ring around the avatar.\n\t *\n\t * When not provided, no border is rendered and the hover badge\n\t * uses the admin theme color as its background.\n\t */\n\tborderColor?: string;\n\t/**\n\t * Whether to dim the avatar to indicate an inactive or away state.\n\t * When true, images are desaturated and faded, and initials are\n\t * reduced in opacity.\n\t *\n\t * @default false\n\t */\n\tdimmed?: boolean;\n\t/**\n\t * An icon or custom component rendered as a centered overlay on the\n\t * avatar image. Only visible when `dimmed` is true.\n\t *\n\t * Accepts any value supported by the `Icon` component: an icon from\n\t * `@wordpress/icons`, a Dashicon name string, a component, or a\n\t * JSX element.\n\t */\n\tstatusIndicator?: IconType | null;\n};\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;AAAA;AAAA;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|