@wordpress/edit-post 8.8.7 → 8.8.8

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.
Files changed (9) hide show
  1. package/build/components/layout/index.js +151 -140
  2. package/build/components/layout/index.js.map +1 -1
  3. package/build-module/components/layout/index.js +152 -141
  4. package/build-module/components/layout/index.js.map +1 -1
  5. package/build-style/style-rtl.css +65 -29
  6. package/build-style/style.css +65 -29
  7. package/package.json +12 -12
  8. package/src/components/layout/index.js +148 -141
  9. package/src/components/layout/style.scss +83 -43
package/build-style/style-rtl.css CHANGED
@@ -183,65 +183,101 @@
183
183
 
184
184
  .edit-post-meta-boxes-main {
185
185
  filter: drop-shadow(0 -1px rgba(0, 0, 0, 0.133));
186
+ outline: 1px solid transparent;
186
187
  background-color: #fff;
187
- clear: both;
188
+ display: flex;
189
+ flex-direction: column;
190
+ overflow: hidden;
188
191
  }
189
- .edit-post-meta-boxes-main:not(details) {
190
- padding-top: 24px;
191
- }
192
- .edit-post-meta-boxes-main:is(details) > summary {
193
- cursor: pointer;
194
- color: #1e1e1e;
195
- background-color: #fff;
196
- height: 32px;
197
- line-height: 32px;
198
- font-size: 13px;
199
- padding-right: 24px;
200
- box-shadow: 0 1px #ddd;
201
- }
202
- .edit-post-meta-boxes-main:is(details)[open] > summary {
203
- position: sticky;
204
- top: 0;
205
- z-index: 1;
192
+ .edit-post-meta-boxes-main.is-resizable {
193
+ padding-block-start: 24px;
206
194
  }
207
195
 
208
- .edit-post-meta-boxes-main__resize-handle {
196
+ .edit-post-meta-boxes-main__presenter {
209
197
  display: flex;
210
- inset: 0 0 auto 0;
211
- height: 24px;
212
198
  box-shadow: 0 1px #ddd;
199
+ outline: 1px solid transparent;
200
+ position: relative;
201
+ z-index: 1;
213
202
  }
214
- .edit-post-meta-boxes-main__resize-handle > button {
203
+ .is-toggle-only > .edit-post-meta-boxes-main__presenter, .is-resizable.edit-post-meta-boxes-main .edit-post-meta-boxes-main__presenter > button {
215
204
  appearance: none;
216
- cursor: inherit;
217
- margin: auto;
218
205
  padding: 0;
219
206
  border: none;
220
207
  outline: none;
221
- background-color: #ddd;
208
+ background-color: transparent;
209
+ }
210
+ .is-toggle-only > .edit-post-meta-boxes-main__presenter {
211
+ flex-shrink: 0;
212
+ cursor: pointer;
213
+ height: 32px;
214
+ justify-content: space-between;
215
+ align-items: center;
216
+ padding-inline: 24px 12px;
217
+ }
218
+ .is-toggle-only > .edit-post-meta-boxes-main__presenter:is(:hover, :focus-visible) {
219
+ color: var(--wp-admin-theme-color);
220
+ }
221
+ .is-toggle-only > .edit-post-meta-boxes-main__presenter:focus-visible::after {
222
+ content: "";
223
+ position: absolute;
224
+ inset: var(--wp-admin-border-width-focus);
225
+ box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
226
+ outline: 2px solid transparent;
227
+ }
228
+ .is-toggle-only > .edit-post-meta-boxes-main__presenter > svg {
229
+ fill: currentColor;
230
+ }
231
+ .is-resizable.edit-post-meta-boxes-main .edit-post-meta-boxes-main__presenter {
232
+ inset: 0 0 auto;
233
+ }
234
+ .is-resizable.edit-post-meta-boxes-main .edit-post-meta-boxes-main__presenter > button {
235
+ cursor: inherit;
222
236
  width: 64px;
237
+ height: 24px;
238
+ margin: auto;
239
+ }
240
+ .is-resizable.edit-post-meta-boxes-main .edit-post-meta-boxes-main__presenter > button::before {
241
+ content: "";
242
+ background-color: #ddd;
243
+ outline: 2px solid transparent;
244
+ outline-offset: -2px;
245
+ position: absolute;
246
+ inset-block: calc(50% - 4px / 2) auto;
247
+ transform: translateX(50%);
248
+ width: inherit;
223
249
  height: 4px;
224
250
  border-radius: 2px;
225
251
  transition: width 0.3s ease-out;
226
252
  }
227
253
  @media (prefers-reduced-motion: reduce) {
228
- .edit-post-meta-boxes-main__resize-handle > button {
254
+ .is-resizable.edit-post-meta-boxes-main .edit-post-meta-boxes-main__presenter > button::before {
229
255
  transition-duration: 0s;
230
256
  transition-delay: 0s;
231
257
  }
232
258
  }
233
- .edit-post-meta-boxes-main__resize-handle:hover > button,
234
- .edit-post-meta-boxes-main__resize-handle > button:focus {
259
+ .is-resizable.edit-post-meta-boxes-main .edit-post-meta-boxes-main__presenter:is(:hover, :focus-within) > button::before {
235
260
  background-color: var(--wp-admin-theme-color);
236
261
  width: 80px;
237
262
  }
238
263
 
264
+ @media (pointer: coarse) {
265
+ .is-resizable.edit-post-meta-boxes-main {
266
+ padding-block-start: 32px;
267
+ }
268
+ .is-resizable.edit-post-meta-boxes-main .edit-post-meta-boxes-main__presenter > button {
269
+ height: 32px;
270
+ }
271
+ }
239
272
  .edit-post-meta-boxes-main__liner {
240
273
  overflow: auto;
241
- max-height: 100%;
242
274
  isolation: isolate;
243
275
  }
244
276
 
277
+ .edit-post-layout__metaboxes {
278
+ clear: both;
279
+ }
280
+
245
281
  .has-metaboxes .editor-visual-editor {
246
282
  flex: 1;
247
283
  }
package/build-style/style.css CHANGED
@@ -183,65 +183,101 @@
183
183
 
184
184
  .edit-post-meta-boxes-main {
185
185
  filter: drop-shadow(0 -1px rgba(0, 0, 0, 0.133));
186
+ outline: 1px solid transparent;
186
187
  background-color: #fff;
187
- clear: both;
188
+ display: flex;
189
+ flex-direction: column;
190
+ overflow: hidden;
188
191
  }
189
- .edit-post-meta-boxes-main:not(details) {
190
- padding-top: 24px;
191
- }
192
- .edit-post-meta-boxes-main:is(details) > summary {
193
- cursor: pointer;
194
- color: #1e1e1e;
195
- background-color: #fff;
196
- height: 32px;
197
- line-height: 32px;
198
- font-size: 13px;
199
- padding-left: 24px;
200
- box-shadow: 0 1px #ddd;
201
- }
202
- .edit-post-meta-boxes-main:is(details)[open] > summary {
203
- position: sticky;
204
- top: 0;
205
- z-index: 1;
192
+ .edit-post-meta-boxes-main.is-resizable {
193
+ padding-block-start: 24px;
206
194
  }
207
195
 
208
- .edit-post-meta-boxes-main__resize-handle {
196
+ .edit-post-meta-boxes-main__presenter {
209
197
  display: flex;
210
- inset: 0 0 auto 0;
211
- height: 24px;
212
198
  box-shadow: 0 1px #ddd;
199
+ outline: 1px solid transparent;
200
+ position: relative;
201
+ z-index: 1;
213
202
  }
214
- .edit-post-meta-boxes-main__resize-handle > button {
203
+ .is-toggle-only > .edit-post-meta-boxes-main__presenter, .is-resizable.edit-post-meta-boxes-main .edit-post-meta-boxes-main__presenter > button {
215
204
  appearance: none;
216
- cursor: inherit;
217
- margin: auto;
218
205
  padding: 0;
219
206
  border: none;
220
207
  outline: none;
221
- background-color: #ddd;
208
+ background-color: transparent;
209
+ }
210
+ .is-toggle-only > .edit-post-meta-boxes-main__presenter {
211
+ flex-shrink: 0;
212
+ cursor: pointer;
213
+ height: 32px;
214
+ justify-content: space-between;
215
+ align-items: center;
216
+ padding-inline: 24px 12px;
217
+ }
218
+ .is-toggle-only > .edit-post-meta-boxes-main__presenter:is(:hover, :focus-visible) {
219
+ color: var(--wp-admin-theme-color);
220
+ }
221
+ .is-toggle-only > .edit-post-meta-boxes-main__presenter:focus-visible::after {
222
+ content: "";
223
+ position: absolute;
224
+ inset: var(--wp-admin-border-width-focus);
225
+ box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
226
+ outline: 2px solid transparent;
227
+ }
228
+ .is-toggle-only > .edit-post-meta-boxes-main__presenter > svg {
229
+ fill: currentColor;
230
+ }
231
+ .is-resizable.edit-post-meta-boxes-main .edit-post-meta-boxes-main__presenter {
232
+ inset: 0 0 auto;
233
+ }
234
+ .is-resizable.edit-post-meta-boxes-main .edit-post-meta-boxes-main__presenter > button {
235
+ cursor: inherit;
222
236
  width: 64px;
237
+ height: 24px;
238
+ margin: auto;
239
+ }
240
+ .is-resizable.edit-post-meta-boxes-main .edit-post-meta-boxes-main__presenter > button::before {
241
+ content: "";
242
+ background-color: #ddd;
243
+ outline: 2px solid transparent;
244
+ outline-offset: -2px;
245
+ position: absolute;
246
+ inset-block: calc(50% - 4px / 2) auto;
247
+ transform: translateX(-50%);
248
+ width: inherit;
223
249
  height: 4px;
224
250
  border-radius: 2px;
225
251
  transition: width 0.3s ease-out;
226
252
  }
227
253
  @media (prefers-reduced-motion: reduce) {
228
- .edit-post-meta-boxes-main__resize-handle > button {
254
+ .is-resizable.edit-post-meta-boxes-main .edit-post-meta-boxes-main__presenter > button::before {
229
255
  transition-duration: 0s;
230
256
  transition-delay: 0s;
231
257
  }
232
258
  }
233
- .edit-post-meta-boxes-main__resize-handle:hover > button,
234
- .edit-post-meta-boxes-main__resize-handle > button:focus {
259
+ .is-resizable.edit-post-meta-boxes-main .edit-post-meta-boxes-main__presenter:is(:hover, :focus-within) > button::before {
235
260
  background-color: var(--wp-admin-theme-color);
236
261
  width: 80px;
237
262
  }
238
263
 
264
+ @media (pointer: coarse) {
265
+ .is-resizable.edit-post-meta-boxes-main {
266
+ padding-block-start: 32px;
267
+ }
268
+ .is-resizable.edit-post-meta-boxes-main .edit-post-meta-boxes-main__presenter > button {
269
+ height: 32px;
270
+ }
271
+ }
239
272
  .edit-post-meta-boxes-main__liner {
240
273
  overflow: auto;
241
- max-height: 100%;
242
274
  isolation: isolate;
243
275
  }
244
276
 
277
+ .edit-post-layout__metaboxes {
278
+ clear: both;
279
+ }
280
+
245
281
  .has-metaboxes .editor-visual-editor {
246
282
  flex: 1;
247
283
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wordpress/edit-post",
3
- "version": "8.8.7",
3
+ "version": "8.8.8",
4
4
  "description": "Edit Post module for WordPress.",
5
5
  "author": "The WordPress Contributors",
6
6
  "license": "GPL-2.0-or-later",
@@ -30,18 +30,18 @@
30
30
  "@babel/runtime": "^7.16.0",
31
31
  "@wordpress/a11y": "^4.8.2",
32
32
  "@wordpress/api-fetch": "^7.8.2",
33
- "@wordpress/block-editor": "^14.3.5",
34
- "@wordpress/block-library": "^9.8.6",
33
+ "@wordpress/block-editor": "^14.3.6",
34
+ "@wordpress/block-library": "^9.8.7",
35
35
  "@wordpress/blocks": "^13.8.4",
36
- "@wordpress/commands": "^1.8.5",
37
- "@wordpress/components": "^28.8.5",
36
+ "@wordpress/commands": "^1.8.6",
37
+ "@wordpress/components": "^28.8.6",
38
38
  "@wordpress/compose": "^7.8.3",
39
- "@wordpress/core-commands": "^1.8.5",
40
- "@wordpress/core-data": "^7.8.5",
39
+ "@wordpress/core-commands": "^1.8.6",
40
+ "@wordpress/core-data": "^7.8.6",
41
41
  "@wordpress/data": "^10.8.3",
42
42
  "@wordpress/deprecated": "^4.8.2",
43
43
  "@wordpress/dom": "^4.8.2",
44
- "@wordpress/editor": "^14.8.7",
44
+ "@wordpress/editor": "^14.8.8",
45
45
  "@wordpress/element": "^6.8.1",
46
46
  "@wordpress/hooks": "^4.8.2",
47
47
  "@wordpress/html-entities": "^4.8.1",
@@ -50,13 +50,13 @@
50
50
  "@wordpress/keyboard-shortcuts": "^5.8.3",
51
51
  "@wordpress/keycodes": "^4.8.2",
52
52
  "@wordpress/notices": "^5.8.3",
53
- "@wordpress/plugins": "^7.8.5",
54
- "@wordpress/preferences": "^4.8.5",
53
+ "@wordpress/plugins": "^7.8.6",
54
+ "@wordpress/preferences": "^4.8.6",
55
55
  "@wordpress/private-apis": "^1.8.1",
56
56
  "@wordpress/url": "^4.8.1",
57
57
  "@wordpress/viewport": "^6.8.3",
58
58
  "@wordpress/warning": "^3.8.1",
59
- "@wordpress/widgets": "^4.8.5",
59
+ "@wordpress/widgets": "^4.8.6",
60
60
  "clsx": "^2.1.1",
61
61
  "memize": "^2.1.0"
62
62
  },
@@ -67,5 +67,5 @@
67
67
  "publishConfig": {
68
68
  "access": "public"
69
69
  },
70
- "gitHead": "21b3c2e9abda74edab42455041edc6e82fccc388"
70
+ "gitHead": "b7af02f8431034ee19cdc33dd105d21705823eed"
71
71
  }