@wordpress/block-library 9.31.1-next.f56bd8138.0 → 9.32.0

package/build-style/accordion-panel/style-rtl.css

@@ -0,0 +1,140 @@
+/**
+ * Colors
+ */
+/**
+ * Breakpoints & Media Queries
+ */
+/**
+ * Colors
+ */
+/**
+ * SCSS Variables.
+ *
+ * Please use variables from this sheet to ensure consistency across the UI.
+ * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
+ * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
+ */
+/**
+ * Fonts & basic variables.
+ */
+/**
+ * Typography
+ */
+/**
+ * Grid System.
+ * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
+ */
+/**
+ * Radius scale.
+ */
+/**
+ * Elevation scale.
+ */
+/**
+ * Dimensions.
+ */
+/**
+ * Mobile specific styles
+ */
+/**
+ * Editor styles.
+ */
+/**
+ * Block & Editor UI.
+ */
+/**
+ * Block paddings.
+ */
+/**
+ * React Native specific.
+ * These variables do not appear to be used anywhere else.
+ */
+/**
+ * Colors
+ */
+/**
+ * SCSS Variables.
+ *
+ * Please use variables from this sheet to ensure consistency across the UI.
+ * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
+ * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
+ */
+/**
+ * Fonts & basic variables.
+ */
+/**
+ * Typography
+ */
+/**
+ * Grid System.
+ * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
+ */
+/**
+ * Radius scale.
+ */
+/**
+ * Elevation scale.
+ */
+/**
+ * Dimensions.
+ */
+/**
+ * Mobile specific styles
+ */
+/**
+ * Editor styles.
+ */
+/**
+ * Block & Editor UI.
+ */
+/**
+ * Block paddings.
+ */
+/**
+ * React Native specific.
+ * These variables do not appear to be used anywhere else.
+ */
+/**
+ * Breakpoints & Media Queries
+ */
+/**
+*  Converts a hex value into the rgb equivalent.
+*
+* @param {string} hex - the hexadecimal value to convert
+* @return {string} comma separated rgb values
+*/
+/**
+ * Long content fade mixin
+ *
+ * Creates a fading overlay to signify that the content is longer
+ * than the space allows.
+ */
+/**
+ * Typography
+ */
+/**
+ * Breakpoint mixins
+ */
+/**
+ * Focus styles.
+ */
+/**
+ * Applies editor left position to the selector passed as argument
+ */
+/**
+ * Styles that are reused verbatim in a few places
+ */
+/**
+ * Allows users to opt-out of animations via OS-level preferences.
+ */
+/**
+ * Reset default styles for JavaScript UI based pages.
+ * This is a WP-admin agnostic reset
+ */
+/**
+ * Reset the WP Admin page styles for Gutenberg-like pages.
+ */
+.wp-block-accordion-panel[inert], .wp-block-accordion-panel[aria-hidden=true] {
+  display: none;
+  margin-block-start: 0;
+}

package/build-style/accordion-panel/style.css

@@ -0,0 +1,140 @@
+/**
+ * Colors
+ */
+/**
+ * Breakpoints & Media Queries
+ */
+/**
+ * Colors
+ */
+/**
+ * SCSS Variables.
+ *
+ * Please use variables from this sheet to ensure consistency across the UI.
+ * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
+ * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
+ */
+/**
+ * Fonts & basic variables.
+ */
+/**
+ * Typography
+ */
+/**
+ * Grid System.
+ * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
+ */
+/**
+ * Radius scale.
+ */
+/**
+ * Elevation scale.
+ */
+/**
+ * Dimensions.
+ */
+/**
+ * Mobile specific styles
+ */
+/**
+ * Editor styles.
+ */
+/**
+ * Block & Editor UI.
+ */
+/**
+ * Block paddings.
+ */
+/**
+ * React Native specific.
+ * These variables do not appear to be used anywhere else.
+ */
+/**
+ * Colors
+ */
+/**
+ * SCSS Variables.
+ *
+ * Please use variables from this sheet to ensure consistency across the UI.
+ * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
+ * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
+ */
+/**
+ * Fonts & basic variables.
+ */
+/**
+ * Typography
+ */
+/**
+ * Grid System.
+ * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
+ */
+/**
+ * Radius scale.
+ */
+/**
+ * Elevation scale.
+ */
+/**
+ * Dimensions.
+ */
+/**
+ * Mobile specific styles
+ */
+/**
+ * Editor styles.
+ */
+/**
+ * Block & Editor UI.
+ */
+/**
+ * Block paddings.
+ */
+/**
+ * React Native specific.
+ * These variables do not appear to be used anywhere else.
+ */
+/**
+ * Breakpoints & Media Queries
+ */
+/**
+*  Converts a hex value into the rgb equivalent.
+*
+* @param {string} hex - the hexadecimal value to convert
+* @return {string} comma separated rgb values
+*/
+/**
+ * Long content fade mixin
+ *
+ * Creates a fading overlay to signify that the content is longer
+ * than the space allows.
+ */
+/**
+ * Typography
+ */
+/**
+ * Breakpoint mixins
+ */
+/**
+ * Focus styles.
+ */
+/**
+ * Applies editor left position to the selector passed as argument
+ */
+/**
+ * Styles that are reused verbatim in a few places
+ */
+/**
+ * Allows users to opt-out of animations via OS-level preferences.
+ */
+/**
+ * Reset default styles for JavaScript UI based pages.
+ * This is a WP-admin agnostic reset
+ */
+/**
+ * Reset the WP Admin page styles for Gutenberg-like pages.
+ */
+.wp-block-accordion-panel[inert], .wp-block-accordion-panel[aria-hidden=true] {
+  display: none;
+  margin-block-start: 0;
+}

package/build-style/style-rtl.css

@@ -135,23 +135,27 @@
 /**
  * Reset the WP Admin page styles for Gutenberg-like pages.
  */
-.wp-block-accordion {
-  box-sizing: border-box;
-}
-
-.wp-block-accordion-content {
+.wp-block-accordion-item {
   display: grid;
   grid-template-rows: max-content 0fr;
+  /* Add transitions only for users who do not prefer reduced motion */
 }
-
-.wp-block-accordion-content.is-open {
+.wp-block-accordion-item.is-open {
   grid-template-rows: max-content 1fr;
 }
-.wp-block-accordion-content.is-open > .wp-block-accordion-header .accordion-content__toggle-icon {
+.wp-block-accordion-item.is-open > .wp-block-accordion-heading .wp-block-accordion-heading__toggle-icon {
   transform: rotate(-45deg);
 }
+@media (prefers-reduced-motion: no-preference) {
+  .wp-block-accordion-item {
+    transition: grid-template-rows 0.3s ease-out;
+  }
+  .wp-block-accordion-item > .wp-block-accordion-heading .wp-block-accordion-heading__toggle-icon {
+    transition: transform 0.2s ease-in-out;
+  }
+}
 
-.accordion-content__toggle {
+.wp-block-accordion-heading__toggle {
   font-family: inherit;
   font-size: inherit;
   font-weight: inherit;
@@ -165,7 +169,6 @@
   color: inherit;
   padding: var(--wp--preset--spacing--20, 1em) 0;
   cursor: pointer;
-  outline: none;
   overflow: hidden;
   display: flex;
   align-items: center;
@@ -173,12 +176,18 @@
   position: relative;
   width: 100%;
 }
+.wp-block-accordion-heading__toggle:not(:focus-visible) {
+  outline: none;
+}
+.wp-block-accordion-heading__toggle:hover .wp-block-accordion-heading__toggle-title {
+  text-decoration: underline;
+}
 
-.accordion-content__toggle-title {
+.wp-block-accordion-heading__toggle-title {
   flex: 1;
 }
 
-.accordion-content__toggle-icon {
+.wp-block-accordion-heading__toggle-icon {
   width: 1.2em;
   height: 1.2em;
   display: flex;
@@ -186,39 +195,11 @@
   justify-content: center;
 }
 
-.is-layout-flow > .wp-block-accordion-panel,
-.wp-block-accordion-panel {
-  overflow: hidden;
-}
-
-.wp-block-accordion-panel[inert],
-.wp-block-accordion-panel[aria-hidden=true] {
+.wp-block-accordion-panel[inert], .wp-block-accordion-panel[aria-hidden=true] {
+  display: none;
   margin-block-start: 0;
 }
 
-.accordion-panel__wrapper {
-  padding-bottom: var(--wp--preset--spacing--20, 1em);
-}
-
-/* No icon block style */
-.is-style-no-icon .accordion-content__toggle-icon {
-  background-color: unset;
-}
-
-.accordion-content__toggle:focus-visible {
-  outline: 2px solid -webkit-focus-ring-color;
-  outline-offset: 2px;
-}
-
-/* Add transitions only for users who do not prefer reduced motion */
-@media (prefers-reduced-motion: no-preference) {
-  .wp-block-accordion-content .accordion-content__toggle-icon {
-    transition: transform 0.2s ease-in-out;
-  }
-  .wp-block-accordion-content {
-    transition: grid-template-rows 0.3s ease-out;
-  }
-}
 .wp-block-archives {
   box-sizing: border-box;
 }

package/build-style/style.css

@@ -135,23 +135,27 @@
 /**
  * Reset the WP Admin page styles for Gutenberg-like pages.
  */
-.wp-block-accordion {
-  box-sizing: border-box;
-}
-
-.wp-block-accordion-content {
+.wp-block-accordion-item {
   display: grid;
   grid-template-rows: max-content 0fr;
+  /* Add transitions only for users who do not prefer reduced motion */
 }
-
-.wp-block-accordion-content.is-open {
+.wp-block-accordion-item.is-open {
   grid-template-rows: max-content 1fr;
 }
-.wp-block-accordion-content.is-open > .wp-block-accordion-header .accordion-content__toggle-icon {
+.wp-block-accordion-item.is-open > .wp-block-accordion-heading .wp-block-accordion-heading__toggle-icon {
   transform: rotate(45deg);
 }
+@media (prefers-reduced-motion: no-preference) {
+  .wp-block-accordion-item {
+    transition: grid-template-rows 0.3s ease-out;
+  }
+  .wp-block-accordion-item > .wp-block-accordion-heading .wp-block-accordion-heading__toggle-icon {
+    transition: transform 0.2s ease-in-out;
+  }
+}
 
-.accordion-content__toggle {
+.wp-block-accordion-heading__toggle {
   font-family: inherit;
   font-size: inherit;
   font-weight: inherit;
@@ -165,7 +169,6 @@
   color: inherit;
   padding: var(--wp--preset--spacing--20, 1em) 0;
   cursor: pointer;
-  outline: none;
   overflow: hidden;
   display: flex;
   align-items: center;
@@ -173,12 +176,18 @@
   position: relative;
   width: 100%;
 }
+.wp-block-accordion-heading__toggle:not(:focus-visible) {
+  outline: none;
+}
+.wp-block-accordion-heading__toggle:hover .wp-block-accordion-heading__toggle-title {
+  text-decoration: underline;
+}
 
-.accordion-content__toggle-title {
+.wp-block-accordion-heading__toggle-title {
   flex: 1;
 }
 
-.accordion-content__toggle-icon {
+.wp-block-accordion-heading__toggle-icon {
   width: 1.2em;
   height: 1.2em;
   display: flex;
@@ -186,39 +195,11 @@
   justify-content: center;
 }
 
-.is-layout-flow > .wp-block-accordion-panel,
-.wp-block-accordion-panel {
-  overflow: hidden;
-}
-
-.wp-block-accordion-panel[inert],
-.wp-block-accordion-panel[aria-hidden=true] {
+.wp-block-accordion-panel[inert], .wp-block-accordion-panel[aria-hidden=true] {
+  display: none;
   margin-block-start: 0;
 }
 
-.accordion-panel__wrapper {
-  padding-bottom: var(--wp--preset--spacing--20, 1em);
-}
-
-/* No icon block style */
-.is-style-no-icon .accordion-content__toggle-icon {
-  background-color: unset;
-}
-
-.accordion-content__toggle:focus-visible {
-  outline: 2px solid -webkit-focus-ring-color;
-  outline-offset: 2px;
-}
-
-/* Add transitions only for users who do not prefer reduced motion */
-@media (prefers-reduced-motion: no-preference) {
-  .wp-block-accordion-content .accordion-content__toggle-icon {
-    transition: transform 0.2s ease-in-out;
-  }
-  .wp-block-accordion-content {
-    transition: grid-template-rows 0.3s ease-out;
-  }
-}
 .wp-block-archives {
   box-sizing: border-box;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/block-library",
-	"version": "9.31.1-next.f56bd8138.0",
+	"version": "9.32.0",
 	"description": "Block library for the WordPress editor.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -42,39 +42,39 @@
 	],
 	"dependencies": {
 		"@babel/runtime": "7.25.7",
-		"@wordpress/a11y": "^4.31.1-next.f56bd8138.0",
-		"@wordpress/api-fetch": "^7.31.1-next.f56bd8138.0",
-		"@wordpress/autop": "^4.31.1-next.f56bd8138.0",
-		"@wordpress/blob": "^4.31.1-next.f56bd8138.0",
-		"@wordpress/block-editor": "^15.4.1-next.f56bd8138.0",
-		"@wordpress/blocks": "^15.4.1-next.f56bd8138.0",
-		"@wordpress/components": "^30.5.1-next.f56bd8138.0",
-		"@wordpress/compose": "^7.31.1-next.f56bd8138.0",
-		"@wordpress/core-data": "^7.31.1-next.f56bd8138.0",
-		"@wordpress/data": "^10.31.1-next.f56bd8138.0",
-		"@wordpress/date": "^5.31.1-next.f56bd8138.0",
-		"@wordpress/deprecated": "^4.31.1-next.f56bd8138.0",
-		"@wordpress/dom": "^4.31.1-next.f56bd8138.0",
-		"@wordpress/element": "^6.31.1-next.f56bd8138.0",
-		"@wordpress/escape-html": "^3.31.1-next.f56bd8138.0",
-		"@wordpress/hooks": "^4.31.1-next.f56bd8138.0",
-		"@wordpress/html-entities": "^4.31.1-next.f56bd8138.0",
-		"@wordpress/i18n": "^6.4.1-next.f56bd8138.0",
-		"@wordpress/icons": "^10.31.1-next.f56bd8138.0",
-		"@wordpress/interactivity": "^6.31.1-next.f56bd8138.0",
-		"@wordpress/interactivity-router": "^2.31.1-next.f56bd8138.0",
-		"@wordpress/keyboard-shortcuts": "^5.31.1-next.f56bd8138.0",
-		"@wordpress/keycodes": "^4.31.1-next.f56bd8138.0",
-		"@wordpress/notices": "^5.31.1-next.f56bd8138.0",
-		"@wordpress/patterns": "^2.31.1-next.f56bd8138.0",
-		"@wordpress/primitives": "^4.31.1-next.f56bd8138.0",
-		"@wordpress/private-apis": "^1.31.1-next.f56bd8138.0",
-		"@wordpress/reusable-blocks": "^5.31.1-next.f56bd8138.0",
-		"@wordpress/rich-text": "^7.31.1-next.f56bd8138.0",
-		"@wordpress/server-side-render": "^6.7.1-next.f56bd8138.0",
-		"@wordpress/url": "^4.31.1-next.f56bd8138.0",
-		"@wordpress/viewport": "^6.31.1-next.f56bd8138.0",
-		"@wordpress/wordcount": "^4.31.1-next.f56bd8138.0",
+		"@wordpress/a11y": "^4.32.0",
+		"@wordpress/api-fetch": "^7.32.0",
+		"@wordpress/autop": "^4.32.0",
+		"@wordpress/blob": "^4.32.0",
+		"@wordpress/block-editor": "^15.5.0",
+		"@wordpress/blocks": "^15.5.0",
+		"@wordpress/components": "^30.5.0",
+		"@wordpress/compose": "^7.32.0",
+		"@wordpress/core-data": "^7.32.0",
+		"@wordpress/data": "^10.32.0",
+		"@wordpress/date": "^5.32.0",
+		"@wordpress/deprecated": "^4.32.0",
+		"@wordpress/dom": "^4.32.0",
+		"@wordpress/element": "^6.32.0",
+		"@wordpress/escape-html": "^3.32.0",
+		"@wordpress/hooks": "^4.32.0",
+		"@wordpress/html-entities": "^4.32.0",
+		"@wordpress/i18n": "^6.5.0",
+		"@wordpress/icons": "^10.32.0",
+		"@wordpress/interactivity": "^6.32.0",
+		"@wordpress/interactivity-router": "^2.32.0",
+		"@wordpress/keyboard-shortcuts": "^5.32.0",
+		"@wordpress/keycodes": "^4.32.0",
+		"@wordpress/notices": "^5.32.0",
+		"@wordpress/patterns": "^2.32.0",
+		"@wordpress/primitives": "^4.32.0",
+		"@wordpress/private-apis": "^1.32.0",
+		"@wordpress/reusable-blocks": "^5.32.0",
+		"@wordpress/rich-text": "^7.32.0",
+		"@wordpress/server-side-render": "^6.8.0",
+		"@wordpress/url": "^4.32.0",
+		"@wordpress/viewport": "^6.32.0",
+		"@wordpress/wordcount": "^4.32.0",
 		"change-case": "^4.1.2",
 		"clsx": "^2.1.1",
 		"colord": "^2.7.0",
@@ -92,5 +92,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "ea4a281fd857f48338877590de8c8eb9b9a8cef4"
+	"gitHead": "a030b4c0e0695239b942c7dc18511782b64f10ed"
 }

package/src/accordion/block.json

@@ -4,7 +4,7 @@
 	"name": "core/accordion",
 	"title": "Accordion",
 	"category": "design",
-	"description": "Displays a group of accordion headers and associated expandable content.",
+	"description": "Displays a group of accordion headings and associated expandable content.",
 	"example": {},
 	"__experimental": true,
 	"supports": {
@@ -67,14 +67,21 @@
 		"autoclose": {
 			"type": "boolean",
 			"default": false
+		},
+		"headingLevel": {
+			"type": "number",
+			"default": 3
+		},
+		"levelOptions": {
+			"type": "array"
 		}
 	},
 	"providesContext": {
 		"core/accordion-icon-position": "iconPosition",
-		"core/accordion-show-icon": "showIcon"
+		"core/accordion-show-icon": "showIcon",
+		"core/accordion-heading-level": "headingLevel"
 	},
-	"allowedBlocks": [ "core/accordion-content" ],
+	"allowedBlocks": [ "core/accordion-item" ],
 	"textdomain": "default",
-	"style": "wp-block-accordion",
 	"viewScriptModule": "@wordpress/block-library/accordion/view"
 }