@atlaskit/native-embeds-common 2.2.4 → 2.2.5

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 CHANGED
@@ -1,5 +1,12 @@
1
1
  # @atlaskit/native-embeds-common
2
2
 
3
+ ## 2.2.5
4
+
5
+ ### Patch Changes
6
+
7
+ - [`98f123ee15575`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/98f123ee15575) -
8
+ [ux] Align native embed placeholders in edit mode on first paint
9
+
3
10
  ## 2.2.4
4
11
 
5
12
  ### Patch Changes
package/compass.yml CHANGED
@@ -1,7 +1,7 @@
1
1
  configVersion: 1
2
2
  id: ari:cloud:compass:a436116f-02ce-4520-8fbb-7301462a1674:component/c5751cc6-3513-4070-9deb-af31e86aed34/e056e542-a3ce-4443-88d3-ad37895abc0c
3
3
  name: '@atlaskit/native-embeds-common'
4
- ownerId: ari:cloud:identity::team/ebf6925a-b776-4f99-92b6-6f529449f814 # Eng - Create - Native Content Types - Team Silky (Stacey Douglas)
4
+ ownerId: ari:cloud:identity::team/9a858481-de73-4f94-a602-0df4cdf7b1fe # Whiteboards
5
5
  labels:
6
6
  - platform-code
7
7
  - platform-afm
@@ -16,7 +16,7 @@ links:
16
16
  url: https://bitbucket.org/atlassian/atlassian-frontend-monorepo/src/master
17
17
  - name: Slack Channel
18
18
  type: CHAT_CHANNEL
19
- url: https://atlassian.enterprise.slack.com/archives/C05BWLL499U # #native-content-types-eng
19
+ url: https://atlassian.enterprise.slack.com/archives/C0A0XRWTWSU # #proj-cc-wb-db-native-embeds
20
20
  - name: Native Embeds Common
21
21
  type: REPOSITORY
22
22
  url: https://bitbucket.org/atlassian/atlassian-frontend-monorepo/src/master/platform/packages/native-embeds/native-embeds-common
@@ -63,6 +63,18 @@ var nativeEmbedAlignmentStyles = exports.nativeEmbedAlignmentStyles = (0, _react
63
63
  width: 'fit-content !important',
64
64
  maxWidth: '100cqw'
65
65
  },
66
+ // The editor loading path intentionally keeps its outer extension container at 100% width.
67
+ // Align the already-sized placeholder frame within that container until the native embed UI
68
+ // mounts and takes ownership of the outer wrapper's persisted width.
69
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Target the editor loading frame through its shared placeholder metadata
70
+ '[data-native-embed-initial-placeholder="true"][data-native-embed-alignment="center"] > [data-testid="native-embed-initial-placeholder"]': {
71
+ marginLeft: 'auto',
72
+ marginRight: 'auto'
73
+ },
74
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Target the editor loading frame through its shared placeholder metadata
75
+ '[data-native-embed-initial-placeholder="true"][data-native-embed-alignment="right"] > [data-testid="native-embed-initial-placeholder"]': {
76
+ marginLeft: 'auto'
77
+ },
66
78
  // Some renderer variants omit data-top-level even for top-level extensions. Mirror the native
67
79
  // embed runtime's DOM nesting detection instead: table cells/headers, expands, layouts, enclosing
68
80
  // extensions, sync blocks, and panels clamp the placeholder to the immediate containing node.
@@ -56,6 +56,18 @@ export const nativeEmbedAlignmentStyles = css({
56
56
  width: 'fit-content !important',
57
57
  maxWidth: '100cqw'
58
58
  },
59
+ // The editor loading path intentionally keeps its outer extension container at 100% width.
60
+ // Align the already-sized placeholder frame within that container until the native embed UI
61
+ // mounts and takes ownership of the outer wrapper's persisted width.
62
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Target the editor loading frame through its shared placeholder metadata
63
+ '[data-native-embed-initial-placeholder="true"][data-native-embed-alignment="center"] > [data-testid="native-embed-initial-placeholder"]': {
64
+ marginLeft: 'auto',
65
+ marginRight: 'auto'
66
+ },
67
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Target the editor loading frame through its shared placeholder metadata
68
+ '[data-native-embed-initial-placeholder="true"][data-native-embed-alignment="right"] > [data-testid="native-embed-initial-placeholder"]': {
69
+ marginLeft: 'auto'
70
+ },
59
71
  // Some renderer variants omit data-top-level even for top-level extensions. Mirror the native
60
72
  // embed runtime's DOM nesting detection instead: table cells/headers, expands, layouts, enclosing
61
73
  // extensions, sync blocks, and panels clamp the placeholder to the immediate containing node.
@@ -56,6 +56,18 @@ export var nativeEmbedAlignmentStyles = css({
56
56
  width: 'fit-content !important',
57
57
  maxWidth: '100cqw'
58
58
  },
59
+ // The editor loading path intentionally keeps its outer extension container at 100% width.
60
+ // Align the already-sized placeholder frame within that container until the native embed UI
61
+ // mounts and takes ownership of the outer wrapper's persisted width.
62
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Target the editor loading frame through its shared placeholder metadata
63
+ '[data-native-embed-initial-placeholder="true"][data-native-embed-alignment="center"] > [data-testid="native-embed-initial-placeholder"]': {
64
+ marginLeft: 'auto',
65
+ marginRight: 'auto'
66
+ },
67
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Target the editor loading frame through its shared placeholder metadata
68
+ '[data-native-embed-initial-placeholder="true"][data-native-embed-alignment="right"] > [data-testid="native-embed-initial-placeholder"]': {
69
+ marginLeft: 'auto'
70
+ },
59
71
  // Some renderer variants omit data-top-level even for top-level extensions. Mirror the native
60
72
  // embed runtime's DOM nesting detection instead: table cells/headers, expands, layouts, enclosing
61
73
  // extensions, sync blocks, and panels clamp the placeholder to the immediate containing node.
package/package.json CHANGED
@@ -17,16 +17,16 @@
17
17
  "atlaskit:src": "src/index.ts",
18
18
  "dependencies": {
19
19
  "@atlaskit/button": "^24.3.0",
20
- "@atlaskit/editor-common": "^116.35.0",
20
+ "@atlaskit/editor-common": "^116.39.0",
21
21
  "@atlaskit/editor-plugin-local-id": "^10.1.0",
22
22
  "@atlaskit/editor-prosemirror": "^8.0.0",
23
23
  "@atlaskit/heading": "^6.2.0",
24
24
  "@atlaskit/icon": "^37.1.0",
25
- "@atlaskit/primitives": "^22.1.0",
26
- "@atlaskit/tokens": "^16.2.0",
25
+ "@atlaskit/primitives": "^22.2.0",
26
+ "@atlaskit/tokens": "^16.3.0",
27
27
  "@atlassian/afm-i18n-platform-native-embeds-native-embeds-common": "1.7.0",
28
28
  "@babel/runtime": "^7.0.0",
29
- "@compiled/react": "^0.22.2",
29
+ "@compiled/react": "^1.0.0",
30
30
  "@emotion/react": "^11.7.1"
31
31
  },
32
32
  "peerDependencies": {
@@ -82,7 +82,7 @@
82
82
  }
83
83
  },
84
84
  "name": "@atlaskit/native-embeds-common",
85
- "version": "2.2.4",
85
+ "version": "2.2.5",
86
86
  "description": "A shared package for native embeds to be used across experiences and plugin",
87
87
  "author": "Atlassian Pty Ltd",
88
88
  "license": "Apache-2.0",