@wordpress/block-editor 16.0.1-next.v.202607070741.0 → 16.1.0

package/build-style/style-rtl.css

@@ -164,9 +164,6 @@
 .block-editor-global-styles-background-panel__image-tools-panel-item button.components-button:hover {
   color: var(--wp-admin-theme-color);
 }
-.block-editor-global-styles-background-panel__image-tools-panel-item button.components-button:focus {
-  box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
-}
 .block-editor-global-styles-background-panel__image-tools-panel-item .block-editor-global-styles-background-panel__loading {
   height: 100%;
   position: absolute;
@@ -200,10 +197,21 @@
     transition: opacity 0.1s ease-in-out;
   }
 }
+.block-editor-global-styles-background-panel__reset.has-local-override-from-global-styles__reset {
+  position: absolute;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  top: 50%;
+  transform: translateY(-50%);
+  margin-block: 0;
+  margin-inline: 0 8px;
+  opacity: 1;
+}
 .block-editor-global-styles-background-panel__reset.block-editor-global-styles-background-panel__reset {
   border-radius: 2px;
 }
-.block-editor-global-styles-background-panel__dropdown-toggle:hover + .block-editor-global-styles-background-panel__reset, .block-editor-global-styles-background-panel__reset:focus, .block-editor-global-styles-background-panel__reset:hover {
+.block-editor-global-styles-background-panel__dropdown-toggle:hover + .block-editor-global-styles-background-panel__reset, .block-editor-global-styles-background-panel__reset:focus, .block-editor-global-styles-background-panel__reset:focus-within, .block-editor-global-styles-background-panel__reset:hover {
   opacity: 1;
 }
 @media (hover: none) {
@@ -554,7 +562,7 @@ iframe[name=editor-canvas] {
   padding: 12px 0;
 }
 .block-editor-block-lock-modal__options-all .components-checkbox-control__label {
-  font-weight: 600;
+  font-weight: var(--wpds-typography-font-weight-emphasis, 600);
 }
 
 .block-editor-block-lock-modal__checklist-item {
@@ -673,7 +681,7 @@ iframe[name=editor-canvas] {
 }
 
 .block-editor-block-card__title {
-  font-weight: 499;
+  font-weight: var(--wpds-typography-font-weight-emphasis, 600);
   display: flex;
   align-items: center;
   flex-wrap: wrap;
@@ -806,7 +814,7 @@ iframe[name=editor-canvas] {
   min-height: 18px;
 }
 .block-editor-block-draggable-chip .components-flex__item {
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
+  font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
   font-size: 13px;
 }
 
@@ -862,7 +870,7 @@ iframe[name=editor-canvas] {
   z-index: 1;
 }
 .block-editor-block-manager__category-title .components-checkbox-control__label {
-  font-weight: 600;
+  font-weight: var(--wpds-typography-font-weight-emphasis, 600);
 }
 
 .block-editor-block-manager__checklist {
@@ -995,7 +1003,7 @@ iframe[name=editor-canvas] {
   color: #757575;
   text-transform: uppercase;
   font-size: 11px;
-  font-weight: 499;
+  font-weight: var(--wpds-typography-font-weight-emphasis, 600);
 }
 
 .block-editor-block-patterns-list__list-item {
@@ -1149,7 +1157,7 @@ iframe[name=editor-canvas] {
 }
 
 .block-editor-block-quick-navigation__item {
-  font-weight: 400;
+  font-weight: var(--wpds-typography-font-weight-default, 400);
 }
 
 .block-editor-block-rename-modal {
@@ -1181,7 +1189,7 @@ iframe[name=editor-canvas] {
 }
 .block-editor-block-styles__variants button.components-button.block-editor-block-styles__item {
   color: #1e1e1e;
-  box-shadow: inset 0 0 0 1px #ddd;
+  border-color: #ddd;
   display: inline-block;
   width: calc(50% - 4px);
 }
@@ -1197,8 +1205,9 @@ iframe[name=editor-canvas] {
   color: #fff;
 }
 .block-editor-block-styles__variants button.components-button.block-editor-block-styles__item:focus, .block-editor-block-styles__variants button.components-button.block-editor-block-styles__item.is-active:focus {
-  box-shadow: inset 0 0 0 1px #fff, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
-  outline: 2px solid transparent;
+  --focus-color: var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
+  outline: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) solid var(--focus-color);
+  outline-offset: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px));
 }
 .block-editor-block-styles__variants .block-editor-block-styles__item-text {
   word-break: break-all;
@@ -1291,7 +1300,6 @@ iframe[name=editor-canvas] {
 }
 
 .block-editor-block-types-list > [role=presentation] {
-  overflow: hidden;
   display: flex;
   flex-wrap: wrap;
 }
@@ -1700,6 +1708,11 @@ iframe[name=editor-canvas] {
   min-height: 24px;
 }
 
+.block-editor-global-styles-state-control__badge-tooltip-trigger {
+  display: inline-flex;
+  max-width: 100%;
+}
+
 .block-editor-global-styles-filters-panel__dropdown,
 .block-editor-global-styles__shadow-dropdown {
   display: block;
@@ -1804,6 +1817,121 @@ iframe[name=editor-canvas] {
   }
 }
 
+.is-inherited-from-global-styles .components-base-control__label,
+.is-inherited-from-global-styles .components-input-control__label {
+  text-decoration-line: underline;
+  text-decoration-style: dotted;
+  text-decoration-thickness: 1px;
+  text-underline-offset: 0.2em;
+}
+.is-inherited-from-global-styles .block-editor-panel-color-gradient-settings__color-name,
+.is-inherited-from-global-styles .block-editor-global-styles-background-panel__inspector-media-replace-title,
+.is-inherited-from-global-styles .block-editor-panel-duotone-settings__label {
+  border-bottom: 1px dotted currentColor;
+}
+
+.has-local-override-from-global-styles {
+  position: relative;
+}
+
+.global-styles-inheritance-affordance {
+  position: absolute;
+  inset-block-start: 0;
+  inset-inline-end: 0;
+  z-index: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  pointer-events: none;
+  height: 16px;
+}
+.global-styles-inheritance-affordance--offset-toggle {
+  inset-inline-end: 32px;
+}
+.global-styles-inheritance-affordance .has-local-override-from-global-styles__reset {
+  pointer-events: auto;
+  margin-inline-start: 0 !important;
+}
+
+.has-local-override-from-global-styles__reset {
+  display: inline-flex !important;
+  align-items: center;
+  justify-content: center;
+  vertical-align: middle;
+  position: relative;
+  margin-inline-start: 6px;
+  min-width: 14px !important;
+  width: 14px !important;
+  height: 14px !important;
+  padding: 0 !important;
+  border-radius: 50% !important;
+  background: transparent !important;
+  box-shadow: none !important;
+  overflow: hidden;
+  text-transform: none;
+  letter-spacing: normal;
+  cursor: var(--wpds-cursor-control, pointer);
+}
+.has-local-override-from-global-styles__reset:hover, .has-local-override-from-global-styles__reset:focus {
+  background: transparent !important;
+}
+.has-local-override-from-global-styles__reset:hover .has-local-override-from-global-styles__dot, .has-local-override-from-global-styles__reset:focus .has-local-override-from-global-styles__dot {
+  display: none;
+}
+.has-local-override-from-global-styles__reset:hover .has-local-override-from-global-styles__reset-icon, .has-local-override-from-global-styles__reset:focus .has-local-override-from-global-styles__reset-icon {
+  display: block;
+}
+.has-local-override-from-global-styles__reset:focus-visible {
+  outline: 1.5px solid var(--wp-admin-theme-color, #007cba);
+  outline-offset: 1px;
+}
+.has-local-override-from-global-styles__reset.block-editor-panel-color-gradient-settings__reset {
+  position: absolute;
+  justify-content: center;
+  top: 50%;
+  transform: translateY(-50%);
+  margin-block: 0;
+  margin-inline-start: 0;
+  opacity: 1;
+}
+.has-local-override-from-global-styles__reset.block-editor-global-styles__shadow-editor__remove-button {
+  position: absolute;
+  justify-content: center;
+  inset-inline-end: 8px;
+  top: 50%;
+  transform: translateY(-50%);
+  margin-block: 0;
+  margin-inline-start: 0;
+  opacity: 1;
+}
+.has-local-override-from-global-styles__reset.block-editor-panel-duotone-settings__reset {
+  position: absolute;
+  justify-content: center;
+  inset-inline-end: 8px;
+  top: 50%;
+  transform: translateY(-50%);
+  margin-block: 0;
+  margin-inline-start: 0;
+  opacity: 1;
+}
+
+.has-local-override-from-global-styles__dot {
+  display: block;
+  width: 8px;
+  height: 8px;
+  background-color: var(--wp-admin-theme-color, #007cba);
+  border-radius: 50%;
+}
+
+.has-local-override-from-global-styles__reset-icon {
+  display: none;
+  position: absolute;
+  top: 50%;
+  right: 50%;
+  transform: translate(50%, -50%);
+  color: var(--wp-admin-theme-color, #007cba);
+}
+
 .block-editor-grid-visualizer.block-editor-grid-visualizer.block-editor-grid-visualizer {
   z-index: 30;
 }
@@ -2033,6 +2161,25 @@ iframe[name=editor-canvas] {
   left: 0;
 }
 
+.wp-block-image__crop-area {
+  position: relative;
+  max-width: 100%;
+  width: 100%;
+  overflow: hidden;
+}
+.wp-block-image__crop-area .reactEasyCrop_Container {
+  pointer-events: auto;
+}
+.wp-block-image__crop-area .reactEasyCrop_Container .reactEasyCrop_Image {
+  border: none;
+  border-radius: 0;
+}
+
+.wp-block-image__zoom .components-popover__content {
+  min-width: 260px;
+  overflow: visible !important;
+}
+
 .block-editor-block-types-list__list-item {
   display: block;
   width: 33.33%;
@@ -2098,15 +2245,6 @@ iframe[name=editor-canvas] {
   background: var(--wp-admin-theme-color);
   pointer-events: none;
 }
-.components-button.block-editor-block-types-list__item:not(:disabled, [aria-disabled=true]).is-active {
-  color: #fff;
-  background: #1e1e1e;
-  outline: 2px solid transparent;
-  outline-offset: -2px;
-}
-.components-button.block-editor-block-types-list__item:not(:disabled):focus {
-  box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
-}
 
 .block-editor-block-types-list__item-icon {
   padding: 12px 20px;
@@ -2281,7 +2419,7 @@ iframe[name=editor-canvas] {
   width: 100%;
 }
 .block-editor-link-control__search-item .components-menu-item__item mark {
-  font-weight: 600;
+  font-weight: var(--wpds-typography-font-weight-emphasis, 600);
   color: inherit;
   background-color: transparent;
 }
@@ -2341,7 +2479,7 @@ iframe[name=editor-canvas] {
   text-decoration: none;
 }
 .block-editor-link-control__preview .block-editor-link-control__preview-title mark {
-  font-weight: 600;
+  font-weight: var(--wpds-typography-font-weight-emphasis, 600);
   color: inherit;
   background-color: transparent;
 }
@@ -2499,7 +2637,6 @@ iframe[name=editor-canvas] {
   width: 100%;
   height: auto;
   padding: 12px;
-  box-shadow: inset 0 0 0 1px #949494;
   border-color: #949494;
 }
 
@@ -2540,7 +2677,7 @@ iframe[name=editor-canvas] {
 
 .link-preview-button__title {
   margin-top: 4px;
-  font-weight: 500;
+  font-weight: var(--wpds-typography-font-weight-emphasis, 600);
   color: #1e1e1e;
   display: block;
 }
@@ -2614,7 +2751,7 @@ iframe[name=editor-canvas] {
   color: #fff;
 }
 .block-editor-list-view-leaf.is-selected .block-editor-list-view-block-contents:focus::after {
-  box-shadow: inset 0 0 0 1px #fff, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
+  box-shadow: inset 0 0 0 1px #fff, 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
 }
 .block-editor-list-view-leaf.is-selected.is-synced .block-editor-list-view-block-contents:focus::after {
   box-shadow: inset 0 0 0 1px #fff, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-block-synced-color);
@@ -2755,16 +2892,15 @@ iframe[name=editor-canvas] {
   bottom: 0;
   right: 0;
   border-radius: inherit;
-  box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
+  box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
   z-index: 2;
   pointer-events: none;
 }
 .block-editor-list-view-leaf.has-single-cell .block-editor-list-view-block-contents:focus::after {
   left: 0;
 }
-.block-editor-list-view-leaf.is-nesting .block-editor-list-view__menu,
-.block-editor-list-view-leaf .block-editor-list-view-block__menu:focus {
-  box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
+.block-editor-list-view-leaf.is-nesting .block-editor-list-view__menu {
+  box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
   z-index: 1;
 }
 .block-editor-list-view-leaf.is-visible .block-editor-list-view-block-contents {
@@ -3119,7 +3255,7 @@ iframe[name=editor-canvas] {
 }
 
 .block-editor-multi-selection-inspector__card-title {
-  font-weight: 499;
+  font-weight: var(--wpds-typography-font-weight-emphasis, 600);
 }
 
 .block-editor-multi-selection-inspector__card .block-editor-block-icon {
@@ -3146,7 +3282,7 @@ iframe[name=editor-canvas] {
 }
 
 .block-editor-responsive-block-control__label {
-  font-weight: 600;
+  font-weight: var(--wpds-typography-font-weight-emphasis, 600);
   margin-bottom: 0.6em;
   margin-right: -3px;
 }
@@ -3225,7 +3361,7 @@ iframe[name=editor-canvas] {
 }
 .block-editor-skip-to-selected-block:focus {
   font-size: 14px;
-  font-weight: 600;
+  font-weight: var(--wpds-typography-font-weight-emphasis, 600);
   background: #f1f1f1;
   z-index: 100000;
 }
@@ -3471,10 +3607,7 @@ iframe[name=editor-canvas] {
 
 .block-editor-content-only-controls__link {
   width: 100%;
-  box-shadow: inset 0 0 0 1px #ccc;
-}
-.block-editor-content-only-controls__link:focus:not(:disabled) {
-  box-shadow: 0 0 0 currentColor inset, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
+  border-color: #ccc;
 }
 
 .block-editor-content-only-controls__link-row {
@@ -3490,12 +3623,9 @@ iframe[name=editor-canvas] {
 
 .block-editor-content-only-controls__media {
   width: 100%;
-  box-shadow: inset 0 0 0 1px #ccc;
+  border-color: #ccc;
   padding-left: 32px;
 }
-.block-editor-content-only-controls__media:focus:not(:disabled) {
-  box-shadow: 0 0 0 currentColor inset, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
-}
 
 .block-editor-content-only-controls__media-replace-flow {
   display: block;
@@ -3567,7 +3697,7 @@ iframe[name=editor-canvas] {
   margin: 0;
   background: #fff;
   color: #1e1e1e;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
+  font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
   padding: 6px 8px;
   /* Fonts smaller than 16px causes mobile safari to zoom. */
   font-size: 16px;
@@ -3590,8 +3720,8 @@ iframe[name=editor-canvas] {
   }
 }
 .block-editor-content-only-controls__rich-text:focus {
-  border-color: var(--wp-admin-theme-color, #3858e9);
-  box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color, #3858e9);
+  border-color: var(--wp-admin-theme-color);
+  box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color);
   outline: 2px solid transparent;
 }
 .block-editor-content-only-controls__rich-text::-moz-placeholder {
@@ -4003,7 +4133,7 @@ div.block-editor-bindings__panel button:hover .block-editor-bindings__item span
   background: none;
   border: none;
   padding: 0;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
+  font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
   font-size: 13px;
   line-height: 0;
 }
@@ -4139,7 +4269,7 @@ div.block-editor-bindings__panel button:hover .block-editor-bindings__item span
   color: #757575;
   text-transform: uppercase;
   font-size: 11px;
-  font-weight: 499;
+  font-weight: var(--wpds-typography-font-weight-emphasis, 600);
 }
 
 .block-editor-inserter__panel-dropdown select.components-select-control__input.components-select-control__input.components-select-control__input {
@@ -4414,7 +4544,7 @@ div.block-editor-bindings__panel button:hover .block-editor-bindings__item span
 }
 
 .components-heading.block-editor-inserter__patterns-category-panel-title {
-  font-weight: 499;
+  font-weight: var(--wpds-typography-font-weight-emphasis, 600);
 }
 
 .block-editor-inserter__patterns-explore-button.components-button,
@@ -4464,21 +4594,21 @@ div.block-editor-bindings__panel button:hover .block-editor-bindings__item span
 .block-editor-inserter__media-panel .block-editor-inserter__no-results {
   flex-grow: 1;
 }
-.block-editor-inserter__media-panel .block-editor-inserter__media-panel-attach.components-button {
-  justify-content: center;
-  padding: 16px;
-}
-.block-editor-inserter__media-panel .block-editor-inserter__media-panel-attach {
+.block-editor-inserter__media-panel .block-editor-inserter__media-panel-footer {
   flex-shrink: 0;
-  margin-top: 16px;
-  margin-bottom: 16px;
+  padding-top: 16px;
+  padding-bottom: 16px;
 }
 @media (min-width: 782px) {
-  .block-editor-inserter__media-panel .block-editor-inserter__media-panel-attach {
-    margin-right: 24px;
-    margin-left: 24px;
+  .block-editor-inserter__media-panel .block-editor-inserter__media-panel-footer {
+    padding-right: 24px;
+    padding-left: 24px;
   }
 }
+.block-editor-inserter__media-panel .block-editor-inserter__media-panel-attach.components-button {
+  justify-content: center;
+  padding: 16px;
+}
 .block-editor-inserter__media-panel .block-editor-inserter__media-panel-results {
   display: flex;
   flex-direction: column;
@@ -4495,7 +4625,7 @@ div.block-editor-bindings__panel button:hover .block-editor-bindings__item span
     animation: inserter-media-panel-pulse 1s ease-in-out infinite;
   }
 }
-.block-editor-inserter__media-panel.has-attach-footer .block-editor-inserter__media-list {
+.block-editor-inserter__media-panel.has-footer .block-editor-inserter__media-list {
   padding-bottom: 0;
 }
 
@@ -4719,7 +4849,7 @@ div.block-editor-bindings__panel button:hover .block-editor-bindings__item span
   align-items: start;
 }
 .block-editor-block-visibility-modal__options-checkbox--everywhere {
-  font-weight: 600;
+  font-weight: var(--wpds-typography-font-weight-emphasis, 600);
 }
 .block-editor-block-visibility-modal__options-icon--checked {
   fill: #ddd;