@wordpress/block-library 11.0.2-next.v.202609171837.0 → 11.1.0

package/build-module/table-of-contents/block.json

@@ -33,12 +33,18 @@
 		"anchor": true,
 		"ariaLabel": true,
 		"html": false,
+		"background": {
+			"backgroundImage": true,
+			"backgroundSize": true,
+			"gradient": true
+		},
 		"color": {
 			"text": true,
 			"background": true,
 			"gradients": true,
 			"link": true
 		},
+		"shadow": true,
 		"spacing": {
 			"margin": true,
 			"padding": true
@@ -46,6 +52,7 @@
 		"typography": {
 			"fontSize": true,
 			"lineHeight": true,
+			"textAlign": true,
 			"__experimentalFontFamily": true,
 			"__experimentalFontWeight": true,
 			"__experimentalFontStyle": true,

package/build-module/tabs/block.json

@@ -20,14 +20,31 @@
 	"supports": {
 		"align": true,
 		"anchor": true,
+		"background": {
+			"backgroundImage": true,
+			"backgroundSize": true,
+			"gradient": true,
+			"__experimentalDefaultControls": {
+				"backgroundImage": true
+			}
+		},
 		"color": {
 			"text": true,
 			"background": true,
+			"heading": true,
+			"button": true,
+			"link": true,
 			"__experimentalDefaultControls": {
 				"text": true,
 				"background": true
 			}
 		},
+		"__experimentalBorder": {
+			"color": true,
+			"radius": true,
+			"style": true,
+			"width": true
+		},
 		"layout": {
 			"allowEditing": false
 		},
@@ -38,9 +55,15 @@
 			"margin": true,
 			"padding": true
 		},
+		"shadow": true,
 		"typography": {
 			"fontSize": true,
-			"__experimentalFontFamily": true
+			"lineHeight": true,
+			"__experimentalFontFamily": true,
+			"__experimentalFontWeight": true,
+			"__experimentalFontStyle": true,
+			"__experimentalTextTransform": true,
+			"__experimentalLetterSpacing": true
 		}
 	},
 	"usesContext": [ "core/tabs-list", "core/tabs-id" ],

package/build-module/tag-cloud/block.json

@@ -36,8 +36,27 @@
 	],
 	"supports": {
 		"anchor": true,
+		"background": {
+			"backgroundImage": true,
+			"backgroundSize": true,
+			"gradient": true,
+			"__experimentalDefaultControls": {
+				"backgroundImage": true,
+				"gradient": true
+			}
+		},
 		"html": false,
 		"align": true,
+		"color": {
+			"background": true,
+			"link": true,
+			"text": false,
+			"__experimentalDefaultControls": {
+				"background": true,
+				"link": true
+			}
+		},
+		"shadow": true,
 		"spacing": {
 			"margin": true,
 			"padding": true

package/build-module/template-part/edit/selection-modal.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/template-part/edit/selection-modal.jsx"],
-  "sourcesContent": ["import { useMemo, useState } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { useDispatch } from '@wordpress/data';\nimport { __experimentalBlockPatternsList as BlockPatternsList } from '@wordpress/block-editor';\nimport {\n\tSearchControl,\n\t__experimentalHStack as HStack,\n} from '@wordpress/components';\nimport {\n\tuseAlternativeBlockPatterns,\n\tuseAlternativeTemplateParts,\n} from './utils/hooks';\nimport { mapTemplatePartToBlockPattern } from './utils/map-template-part-to-block-pattern';\nimport { searchPatterns } from '../../utils/search-patterns';\n\nexport default function TemplatePartSelectionModal( {\n\tsetAttributes,\n\tonClose,\n\ttemplatePartId = null,\n\tarea,\n\tclientId,\n} ) {\n\tconst [ searchValue, setSearchValue ] = useState( '' );\n\tconst { templateParts } = useAlternativeTemplateParts(\n\t\tarea,\n\t\ttemplatePartId\n\t);\n\n\t// We can map template parts to block patters to reuse the BlockPatternsList UI\n\tconst filteredTemplateParts = useMemo( () => {\n\t\tconst partsAsPatterns = templateParts.map( ( templatePart ) =>\n\t\t\tmapTemplatePartToBlockPattern( templatePart )\n\t\t);\n\n\t\treturn searchPatterns( partsAsPatterns, searchValue );\n\t}, [ templateParts, searchValue ] );\n\tconst blockPatterns = useAlternativeBlockPatterns( area, clientId );\n\tconst filteredBlockPatterns = useMemo( () => {\n\t\treturn searchPatterns( blockPatterns, searchValue );\n\t}, [ blockPatterns, searchValue ] );\n\n\tconst { createSuccessNotice } = useDispatch( noticesStore );\n\n\tconst onTemplatePartSelect = ( templatePart ) => {\n\t\tsetAttributes( {\n\t\t\tslug: templatePart.slug,\n\t\t\ttheme: templatePart.theme,\n\t\t\tarea: undefined,\n\t\t} );\n\t\tcreateSuccessNotice(\n\t\t\tsprintf(\n\t\t\t\t/* translators: %s: template part title. */\n\t\t\t\t__( 'Template Part \"%s\" inserted.' ),\n\t\t\t\ttemplatePart.title?.rendered || templatePart.slug\n\t\t\t),\n\t\t\t{\n\t\t\t\ttype: 'snackbar',\n\t\t\t}\n\t\t);\n\t\tonClose();\n\t};\n\n\tconst hasTemplateParts = !! filteredTemplateParts.length;\n\tconst hasBlockPatterns = !! filteredBlockPatterns.length;\n\n\treturn (\n\t\t<div className=\"block-library-template-part__selection-content\">\n\t\t\t<div className=\"block-library-template-part__selection-search\">\n\t\t\t\t<SearchControl\n\t\t\t\t\tonChange={ setSearchValue }\n\t\t\t\t\tvalue={ searchValue }\n\t\t\t\t\tlabel={ __( 'Search' ) }\n\t\t\t\t\tplaceholder={ __( 'Search' ) }\n\t\t\t\t/>\n\t\t\t</div>\n\t\t\t{ hasTemplateParts && (\n\t\t\t\t<div>\n\t\t\t\t\t<h2>{ __( 'Existing template parts' ) }</h2>\n\t\t\t\t\t<BlockPatternsList\n\t\t\t\t\t\tblockPatterns={ filteredTemplateParts }\n\t\t\t\t\t\tonClickPattern={ ( pattern ) => {\n\t\t\t\t\t\t\tonTemplatePartSelect( pattern.templatePart );\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t) }\n\n\t\t\t{ ! hasTemplateParts && ! hasBlockPatterns && (\n\t\t\t\t<HStack alignment=\"center\">\n\t\t\t\t\t<p>{ __( 'No results found.' ) }</p>\n\t\t\t\t</HStack>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n"],
+  "sourcesContent": ["import { useMemo, useState } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { useDispatch } from '@wordpress/data';\nimport { __experimentalBlockPatternsList as BlockPatternsList } from '@wordpress/block-editor';\nimport {\n\tSearchControl,\n\t__experimentalHStack as HStack,\n} from '@wordpress/components';\nimport {\n\tuseAlternativeBlockPatterns,\n\tuseAlternativeTemplateParts,\n} from './utils/hooks';\nimport { mapTemplatePartToBlockPattern } from './utils/map-template-part-to-block-pattern';\nimport { searchPatterns } from '../../utils/search-patterns';\n\nexport default function TemplatePartSelectionModal( {\n\tsetAttributes,\n\tonClose,\n\ttemplatePartId = null,\n\tarea,\n\tclientId,\n} ) {\n\tconst [ searchValue, setSearchValue ] = useState( '' );\n\tconst { templateParts } = useAlternativeTemplateParts(\n\t\tarea,\n\t\ttemplatePartId\n\t);\n\n\t// We can map template parts to block patterns to reuse the BlockPatternsList UI\n\tconst filteredTemplateParts = useMemo( () => {\n\t\tconst partsAsPatterns = templateParts.map( ( templatePart ) =>\n\t\t\tmapTemplatePartToBlockPattern( templatePart )\n\t\t);\n\n\t\treturn searchPatterns( partsAsPatterns, searchValue );\n\t}, [ templateParts, searchValue ] );\n\tconst blockPatterns = useAlternativeBlockPatterns( area, clientId );\n\tconst filteredBlockPatterns = useMemo( () => {\n\t\treturn searchPatterns( blockPatterns, searchValue );\n\t}, [ blockPatterns, searchValue ] );\n\n\tconst { createSuccessNotice } = useDispatch( noticesStore );\n\n\tconst onTemplatePartSelect = ( templatePart ) => {\n\t\tsetAttributes( {\n\t\t\tslug: templatePart.slug,\n\t\t\ttheme: templatePart.theme,\n\t\t\tarea: undefined,\n\t\t} );\n\t\tcreateSuccessNotice(\n\t\t\tsprintf(\n\t\t\t\t/* translators: %s: template part title. */\n\t\t\t\t__( 'Template Part \"%s\" inserted.' ),\n\t\t\t\ttemplatePart.title?.rendered || templatePart.slug\n\t\t\t),\n\t\t\t{\n\t\t\t\ttype: 'snackbar',\n\t\t\t}\n\t\t);\n\t\tonClose();\n\t};\n\n\tconst hasTemplateParts = !! filteredTemplateParts.length;\n\tconst hasBlockPatterns = !! filteredBlockPatterns.length;\n\n\treturn (\n\t\t<div className=\"block-library-template-part__selection-content\">\n\t\t\t<div className=\"block-library-template-part__selection-search\">\n\t\t\t\t<SearchControl\n\t\t\t\t\tonChange={ setSearchValue }\n\t\t\t\t\tvalue={ searchValue }\n\t\t\t\t\tlabel={ __( 'Search' ) }\n\t\t\t\t\tplaceholder={ __( 'Search' ) }\n\t\t\t\t/>\n\t\t\t</div>\n\t\t\t{ hasTemplateParts && (\n\t\t\t\t<div>\n\t\t\t\t\t<h2>{ __( 'Existing template parts' ) }</h2>\n\t\t\t\t\t<BlockPatternsList\n\t\t\t\t\t\tblockPatterns={ filteredTemplateParts }\n\t\t\t\t\t\tonClickPattern={ ( pattern ) => {\n\t\t\t\t\t\t\tonTemplatePartSelect( pattern.templatePart );\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t) }\n\n\t\t\t{ ! hasTemplateParts && ! hasBlockPatterns && (\n\t\t\t\t<HStack alignment=\"center\">\n\t\t\t\t\t<p>{ __( 'No results found.' ) }</p>\n\t\t\t\t</HStack>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n"],
   "mappings": ";AAAA,SAAS,SAAS,gBAAgB;AAClC,SAAS,IAAI,eAAe;AAC5B,SAAS,SAAS,oBAAoB;AACtC,SAAS,mBAAmB;AAC5B,SAAS,mCAAmC,yBAAyB;AACrE;AAAA,EACC;AAAA,EACA,wBAAwB;AAAA,OAClB;AACP;AAAA,EACC;AAAA,EACA;AAAA,OACM;AACP,SAAS,qCAAqC;AAC9C,SAAS,sBAAsB;AAuD3B,cAQA,YARA;AArDW,SAAR,2BAA6C;AAAA,EACnD;AAAA,EACA;AAAA,EACA,iBAAiB;AAAA,EACjB;AAAA,EACA;AACD,GAAI;AACH,QAAM,CAAE,aAAa,cAAe,IAAI,SAAU,EAAG;AACrD,QAAM,EAAE,cAAc,IAAI;AAAA,IACzB;AAAA,IACA;AAAA,EACD;AAGA,QAAM,wBAAwB,QAAS,MAAM;AAC5C,UAAM,kBAAkB,cAAc;AAAA,MAAK,CAAE,iBAC5C,8BAA+B,YAAa;AAAA,IAC7C;AAEA,WAAO,eAAgB,iBAAiB,WAAY;AAAA,EACrD,GAAG,CAAE,eAAe,WAAY,CAAE;AAClC,QAAM,gBAAgB,4BAA6B,MAAM,QAAS;AAClE,QAAM,wBAAwB,QAAS,MAAM;AAC5C,WAAO,eAAgB,eAAe,WAAY;AAAA,EACnD,GAAG,CAAE,eAAe,WAAY,CAAE;AAElC,QAAM,EAAE,oBAAoB,IAAI,YAAa,YAAa;AAE1D,QAAM,uBAAuB,CAAE,iBAAkB;AAChD,kBAAe;AAAA,MACd,MAAM,aAAa;AAAA,MACnB,OAAO,aAAa;AAAA,MACpB,MAAM;AAAA,IACP,CAAE;AACF;AAAA,MACC;AAAA;AAAA,QAEC,GAAI,8BAA+B;AAAA,QACnC,aAAa,OAAO,YAAY,aAAa;AAAA,MAC9C;AAAA,MACA;AAAA,QACC,MAAM;AAAA,MACP;AAAA,IACD;AACA,YAAQ;AAAA,EACT;AAEA,QAAM,mBAAmB,CAAC,CAAE,sBAAsB;AAClD,QAAM,mBAAmB,CAAC,CAAE,sBAAsB;AAElD,SACC,qBAAC,SAAI,WAAU,kDACd;AAAA,wBAAC,SAAI,WAAU,iDACd;AAAA,MAAC;AAAA;AAAA,QACA,UAAW;AAAA,QACX,OAAQ;AAAA,QACR,OAAQ,GAAI,QAAS;AAAA,QACrB,aAAc,GAAI,QAAS;AAAA;AAAA,IAC5B,GACD;AAAA,IACE,oBACD,qBAAC,SACA;AAAA,0BAAC,QAAK,aAAI,yBAA0B,GAAG;AAAA,MACvC;AAAA,QAAC;AAAA;AAAA,UACA,eAAgB;AAAA,UAChB,gBAAiB,CAAE,YAAa;AAC/B,iCAAsB,QAAQ,YAAa;AAAA,UAC5C;AAAA;AAAA,MACD;AAAA,OACD;AAAA,IAGC,CAAE,oBAAoB,CAAE,oBACzB,oBAAC,UAAO,WAAU,UACjB,8BAAC,OAAI,aAAI,mBAAoB,GAAG,GACjC;AAAA,KAEF;AAEF;",
   "names": []
 }

package/build-module/term-count/block.json

@@ -17,6 +17,11 @@
 	"supports": {
 		"anchor": true,
 		"html": false,
+		"background": {
+			"backgroundImage": true,
+			"backgroundSize": true,
+			"gradient": true
+		},
 		"color": {
 			"gradients": true,
 			"__experimentalDefaultControls": {
@@ -24,12 +29,14 @@
 				"text": true
 			}
 		},
+		"shadow": true,
 		"spacing": {
 			"padding": true
 		},
 		"typography": {
 			"fontSize": true,
 			"lineHeight": true,
+			"textAlign": true,
 			"__experimentalFontFamily": true,
 			"__experimentalFontWeight": true,
 			"__experimentalFontStyle": true,

package/build-module/term-description/block.json

@@ -11,6 +11,14 @@
 		"anchor": true,
 		"align": [ "wide", "full" ],
 		"html": false,
+		"background": {
+			"backgroundImage": true,
+			"backgroundSize": true,
+			"gradient": true,
+			"__experimentalDefaultControls": {
+				"backgroundImage": true
+			}
+		},
 		"color": {
 			"link": true,
 			"__experimentalDefaultControls": {
@@ -39,6 +47,7 @@
 		"interactivity": {
 			"clientNavigation": true
 		},
+		"shadow": true,
 		"__experimentalBorder": {
 			"radius": true,
 			"color": true,

package/build-module/term-name/block.json

@@ -25,6 +25,15 @@
 		"anchor": true,
 		"align": [ "wide", "full" ],
 		"html": false,
+		"background": {
+			"backgroundImage": true,
+			"backgroundSize": true,
+			"gradient": true,
+			"__experimentalDefaultControls": {
+				"backgroundImage": true,
+				"gradient": true
+			}
+		},
 		"color": {
 			"gradients": true,
 			"link": true,
@@ -34,6 +43,7 @@
 				"link": true
 			}
 		},
+		"shadow": true,
 		"spacing": {
 			"padding": true
 		},

package/build-module/term-template/block.json

@@ -14,6 +14,14 @@
 		"html": false,
 		"align": [ "wide", "full" ],
 		"layout": true,
+		"background": {
+			"backgroundImage": true,
+			"backgroundSize": true,
+			"gradient": true,
+			"__experimentalDefaultControls": {
+				"backgroundImage": true
+			}
+		},
 		"color": {
 			"gradients": true,
 			"link": true,
@@ -55,7 +63,8 @@
 			"color": true,
 			"width": true,
 			"style": true
-		}
+		},
+		"shadow": true
 	},
 	"style": "wp-block-term-template",
 	"editorStyle": "wp-block-term-template-editor"

package/build-module/utils/search-patterns.mjs

@@ -1,41 +1,16 @@
 // packages/block-library/src/utils/search-patterns.js
-import removeAccents from "remove-accents";
+import { privateApis as blockEditorPrivateApis } from "@wordpress/block-editor";
+import { unlock } from "../lock-unlock.mjs";
+var { normalizeString, searchItems } = unlock(blockEditorPrivateApis);
 function normalizeSearchInput(input = "") {
-  input = removeAccents(input);
-  input = input.trim().toLowerCase();
-  return input;
-}
-function getPatternSearchRank(pattern, searchValue) {
-  const normalizedSearchValue = normalizeSearchInput(searchValue);
-  const normalizedTitle = normalizeSearchInput(pattern.title);
-  let rank = 0;
-  if (normalizedSearchValue === normalizedTitle) {
-    rank += 30;
-  } else if (normalizedTitle.startsWith(normalizedSearchValue)) {
-    rank += 20;
-  } else {
-    const searchTerms = normalizedSearchValue.split(" ");
-    const hasMatchedTerms = searchTerms.every(
-      (searchTerm) => normalizedTitle.includes(searchTerm)
-    );
-    if (hasMatchedTerms) {
-      rank += 10;
-    }
-  }
-  return rank;
+  return normalizeString(input).trim();
 }
 function searchPatterns(patterns = [], searchValue = "") {
-  if (!searchValue) {
-    return patterns;
-  }
-  const rankedPatterns = patterns.map((pattern) => {
-    return [pattern, getPatternSearchRank(pattern, searchValue)];
-  }).filter(([, rank]) => rank > 0);
-  rankedPatterns.sort(([, rank1], [, rank2]) => rank2 - rank1);
-  return rankedPatterns.map(([pattern]) => pattern);
+  return searchItems(patterns, searchValue, {
+    fields: [{ get: (pattern) => pattern.title }]
+  });
 }
 export {
-  getPatternSearchRank,
   normalizeSearchInput,
   searchPatterns
 };

package/build-module/utils/search-patterns.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/utils/search-patterns.js"],
-  "sourcesContent": ["import removeAccents from 'remove-accents';\n\n/**\n * Sanitizes the search input string.\n *\n * @param {string} input The search input to normalize.\n *\n * @return {string} The normalized search input.\n */\nexport function normalizeSearchInput( input = '' ) {\n\t// Disregard diacritics.\n\tinput = removeAccents( input );\n\n\t// Trim & Lowercase.\n\tinput = input.trim().toLowerCase();\n\n\treturn input;\n}\n\n/**\n * Get the search rank for a given pattern and a specific search term.\n *\n * @param {Object} pattern     Pattern to rank\n * @param {string} searchValue Search term\n * @return {number} A pattern search rank\n */\nexport function getPatternSearchRank( pattern, searchValue ) {\n\tconst normalizedSearchValue = normalizeSearchInput( searchValue );\n\tconst normalizedTitle = normalizeSearchInput( pattern.title );\n\n\tlet rank = 0;\n\n\tif ( normalizedSearchValue === normalizedTitle ) {\n\t\trank += 30;\n\t} else if ( normalizedTitle.startsWith( normalizedSearchValue ) ) {\n\t\trank += 20;\n\t} else {\n\t\tconst searchTerms = normalizedSearchValue.split( ' ' );\n\t\tconst hasMatchedTerms = searchTerms.every( ( searchTerm ) =>\n\t\t\tnormalizedTitle.includes( searchTerm )\n\t\t);\n\n\t\t// Prefer pattern with every search word in the title.\n\t\tif ( hasMatchedTerms ) {\n\t\t\trank += 10;\n\t\t}\n\t}\n\n\treturn rank;\n}\n\n/**\n * Filters an pattern list given a search term.\n *\n * @param {Array}  patterns    Item list\n * @param {string} searchValue Search input.\n *\n * @return {Array} Filtered pattern list.\n */\nexport function searchPatterns( patterns = [], searchValue = '' ) {\n\tif ( ! searchValue ) {\n\t\treturn patterns;\n\t}\n\n\tconst rankedPatterns = patterns\n\t\t.map( ( pattern ) => {\n\t\t\treturn [ pattern, getPatternSearchRank( pattern, searchValue ) ];\n\t\t} )\n\t\t.filter( ( [ , rank ] ) => rank > 0 );\n\n\trankedPatterns.sort( ( [ , rank1 ], [ , rank2 ] ) => rank2 - rank1 );\n\treturn rankedPatterns.map( ( [ pattern ] ) => pattern );\n}\n"],
-  "mappings": ";AAAA,OAAO,mBAAmB;AASnB,SAAS,qBAAsB,QAAQ,IAAK;AAElD,UAAQ,cAAe,KAAM;AAG7B,UAAQ,MAAM,KAAK,EAAE,YAAY;AAEjC,SAAO;AACR;AASO,SAAS,qBAAsB,SAAS,aAAc;AAC5D,QAAM,wBAAwB,qBAAsB,WAAY;AAChE,QAAM,kBAAkB,qBAAsB,QAAQ,KAAM;AAE5D,MAAI,OAAO;AAEX,MAAK,0BAA0B,iBAAkB;AAChD,YAAQ;AAAA,EACT,WAAY,gBAAgB,WAAY,qBAAsB,GAAI;AACjE,YAAQ;AAAA,EACT,OAAO;AACN,UAAM,cAAc,sBAAsB,MAAO,GAAI;AACrD,UAAM,kBAAkB,YAAY;AAAA,MAAO,CAAE,eAC5C,gBAAgB,SAAU,UAAW;AAAA,IACtC;AAGA,QAAK,iBAAkB;AACtB,cAAQ;AAAA,IACT;AAAA,EACD;AAEA,SAAO;AACR;AAUO,SAAS,eAAgB,WAAW,CAAC,GAAG,cAAc,IAAK;AACjE,MAAK,CAAE,aAAc;AACpB,WAAO;AAAA,EACR;AAEA,QAAM,iBAAiB,SACrB,IAAK,CAAE,YAAa;AACpB,WAAO,CAAE,SAAS,qBAAsB,SAAS,WAAY,CAAE;AAAA,EAChE,CAAE,EACD,OAAQ,CAAE,CAAE,EAAE,IAAK,MAAO,OAAO,CAAE;AAErC,iBAAe,KAAM,CAAE,CAAE,EAAE,KAAM,GAAG,CAAE,EAAE,KAAM,MAAO,QAAQ,KAAM;AACnE,SAAO,eAAe,IAAK,CAAE,CAAE,OAAQ,MAAO,OAAQ;AACvD;",
+  "sourcesContent": ["import { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\nimport { unlock } from '../lock-unlock';\n\nconst { normalizeString, searchItems } = unlock( blockEditorPrivateApis );\n\n/**\n * Sanitizes the search input string.\n *\n * @param {string} input The search input to normalize.\n *\n * @return {string} The normalized search input.\n */\nexport function normalizeSearchInput( input = '' ) {\n\treturn normalizeString( input ).trim();\n}\n\n/**\n * Filters a pattern list given a search term.\n *\n * @param {Array}  patterns    Item list\n * @param {string} searchValue Search input.\n *\n * @return {Array} Filtered pattern list.\n */\nexport function searchPatterns( patterns = [], searchValue = '' ) {\n\treturn searchItems( patterns, searchValue, {\n\t\tfields: [ { get: ( pattern ) => pattern.title } ],\n\t} );\n}\n"],
+  "mappings": ";AAAA,SAAS,eAAe,8BAA8B;AACtD,SAAS,cAAc;AAEvB,IAAM,EAAE,iBAAiB,YAAY,IAAI,OAAQ,sBAAuB;AASjE,SAAS,qBAAsB,QAAQ,IAAK;AAClD,SAAO,gBAAiB,KAAM,EAAE,KAAK;AACtC;AAUO,SAAS,eAAgB,WAAW,CAAC,GAAG,cAAc,IAAK;AACjE,SAAO,YAAa,UAAU,aAAa;AAAA,IAC1C,QAAQ,CAAE,EAAE,KAAK,CAAE,YAAa,QAAQ,MAAM,CAAE;AAAA,EACjD,CAAE;AACH;",
   "names": []
 }

package/build-module/utils/style-state.mjs

@@ -1,9 +1,11 @@
 // packages/block-library/src/utils/style-state.js
-import { privateApis as blockEditorPrivateApis } from "@wordpress/block-editor";
+import {
+  getStyleForState,
+  setStyleForState,
+  privateApis as blockEditorPrivateApis
+} from "@wordpress/block-editor";
 import { unlock } from "../lock-unlock.mjs";
-var { cleanEmptyObject, getStyleForState, setStyleForState } = unlock(
-  blockEditorPrivateApis
-);
+var { cleanEmptyObject } = unlock(blockEditorPrivateApis);
 function getStateStyle(style, selectedState) {
   return getStyleForState(style, selectedState) || {};
 }

package/build-module/utils/style-state.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/utils/style-state.js"],
-  "sourcesContent": ["import { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\nimport { unlock } from '../lock-unlock';\n\nconst { cleanEmptyObject, getStyleForState, setStyleForState } = unlock(\n\tblockEditorPrivateApis\n);\n\nfunction getStateStyle( style, selectedState ) {\n\treturn getStyleForState( style, selectedState ) || {};\n}\n\nfunction getMappedDimensions( dimensions, dimensionKeyMap = {} ) {\n\treturn Object.fromEntries(\n\t\tObject.entries( dimensions ).map( ( [ key, value ] ) => [\n\t\t\tdimensionKeyMap[ key ] || key,\n\t\t\tvalue,\n\t\t] )\n\t);\n}\n\nfunction getControlledDimensions( dimensions, dimensionKeys ) {\n\tif ( ! dimensionKeys ) {\n\t\treturn dimensions;\n\t}\n\n\treturn Object.fromEntries(\n\t\tdimensionKeys.map( ( key ) => [ key, dimensions[ key ] ] )\n\t);\n}\n\nexport function getStyleStateKey( selectedState ) {\n\treturn [\n\t\tselectedState?.viewport || 'default',\n\t\tselectedState?.pseudo || 'default',\n\t].join( ':' );\n}\n\nexport function getStateDimensions( style, selectedState ) {\n\treturn getStateStyle( style, selectedState )?.dimensions || {};\n}\n\nexport function getActiveDimensionValue( options = {} ) {\n\tconst {\n\t\tattributes = {},\n\t\tstyle = attributes?.style,\n\t\tselectedState,\n\t\thasSelectedStyleState,\n\t\tattributeKey,\n\t\tstyleKey = attributeKey,\n\t\trootValue,\n\t} = options;\n\n\tif ( hasSelectedStyleState ) {\n\t\treturn getStateDimensions( style, selectedState )?.[ styleKey ];\n\t}\n\n\tif ( Object.hasOwn( options, 'rootValue' ) ) {\n\t\treturn rootValue;\n\t}\n\n\treturn attributes?.[ attributeKey ];\n}\n\nexport function setStateDimensions( style, selectedState, nextDimensions ) {\n\tconst stateStyle = getStateStyle( style, selectedState );\n\n\treturn setStyleForState(\n\t\tstyle,\n\t\tselectedState,\n\t\tcleanEmptyObject( {\n\t\t\t...stateStyle,\n\t\t\tdimensions: cleanEmptyObject( {\n\t\t\t\t...stateStyle?.dimensions,\n\t\t\t\t...nextDimensions,\n\t\t\t} ),\n\t\t} )\n\t);\n}\n\nexport function getDimensionUpdateAttributes( {\n\tstyle,\n\tselectedState,\n\thasSelectedStyleState,\n\tnextDimensions,\n\tdimensionKeyMap,\n\tdimensionKeys,\n} ) {\n\tconst controlledDimensions = getControlledDimensions(\n\t\tnextDimensions,\n\t\tdimensionKeys\n\t);\n\n\tif ( ! hasSelectedStyleState ) {\n\t\treturn controlledDimensions;\n\t}\n\n\treturn {\n\t\tstyle: setStateDimensions(\n\t\t\tstyle,\n\t\t\tselectedState,\n\t\t\tgetMappedDimensions( controlledDimensions, dimensionKeyMap )\n\t\t),\n\t};\n}\n\nexport function resetDimensions( style, keys ) {\n\tconst dimensionsReset = Object.fromEntries(\n\t\tkeys.map( ( key ) => [ key, undefined ] )\n\t);\n\n\treturn cleanEmptyObject( {\n\t\t...style,\n\t\tdimensions: cleanEmptyObject( {\n\t\t\t...style?.dimensions,\n\t\t\t...dimensionsReset,\n\t\t} ),\n\t} );\n}\n\nexport function resetStateDimensions( style, selectedState, keys ) {\n\treturn setStyleForState(\n\t\tstyle,\n\t\tselectedState,\n\t\tresetDimensions( getStateStyle( style, selectedState ), keys )\n\t);\n}\n\nexport function getDimensionResetAttributes( {\n\tattributes = {},\n\tstyle = attributes?.style,\n\tselectedState,\n\thasSelectedStyleState,\n\tkeys,\n\tdefaultAttributes = {},\n} ) {\n\treturn {\n\t\t...( hasSelectedStyleState\n\t\t\t? {}\n\t\t\t: { ...attributes, ...defaultAttributes } ),\n\t\tstyle: hasSelectedStyleState\n\t\t\t? resetStateDimensions( style, selectedState, keys )\n\t\t\t: resetDimensions( style, keys ),\n\t};\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import {\n\tgetStyleForState,\n\tsetStyleForState,\n\tprivateApis as blockEditorPrivateApis,\n} from '@wordpress/block-editor';\nimport { unlock } from '../lock-unlock';\n\nconst { cleanEmptyObject } = unlock( blockEditorPrivateApis );\n\nfunction getStateStyle( style, selectedState ) {\n\treturn getStyleForState( style, selectedState ) || {};\n}\n\nfunction getMappedDimensions( dimensions, dimensionKeyMap = {} ) {\n\treturn Object.fromEntries(\n\t\tObject.entries( dimensions ).map( ( [ key, value ] ) => [\n\t\t\tdimensionKeyMap[ key ] || key,\n\t\t\tvalue,\n\t\t] )\n\t);\n}\n\nfunction getControlledDimensions( dimensions, dimensionKeys ) {\n\tif ( ! dimensionKeys ) {\n\t\treturn dimensions;\n\t}\n\n\treturn Object.fromEntries(\n\t\tdimensionKeys.map( ( key ) => [ key, dimensions[ key ] ] )\n\t);\n}\n\nexport function getStyleStateKey( selectedState ) {\n\treturn [\n\t\tselectedState?.viewport || 'default',\n\t\tselectedState?.pseudo || 'default',\n\t].join( ':' );\n}\n\nexport function getStateDimensions( style, selectedState ) {\n\treturn getStateStyle( style, selectedState )?.dimensions || {};\n}\n\nexport function getActiveDimensionValue( options = {} ) {\n\tconst {\n\t\tattributes = {},\n\t\tstyle = attributes?.style,\n\t\tselectedState,\n\t\thasSelectedStyleState,\n\t\tattributeKey,\n\t\tstyleKey = attributeKey,\n\t\trootValue,\n\t} = options;\n\n\tif ( hasSelectedStyleState ) {\n\t\treturn getStateDimensions( style, selectedState )?.[ styleKey ];\n\t}\n\n\tif ( Object.hasOwn( options, 'rootValue' ) ) {\n\t\treturn rootValue;\n\t}\n\n\treturn attributes?.[ attributeKey ];\n}\n\nexport function setStateDimensions( style, selectedState, nextDimensions ) {\n\tconst stateStyle = getStateStyle( style, selectedState );\n\n\treturn setStyleForState(\n\t\tstyle,\n\t\tselectedState,\n\t\tcleanEmptyObject( {\n\t\t\t...stateStyle,\n\t\t\tdimensions: cleanEmptyObject( {\n\t\t\t\t...stateStyle?.dimensions,\n\t\t\t\t...nextDimensions,\n\t\t\t} ),\n\t\t} )\n\t);\n}\n\nexport function getDimensionUpdateAttributes( {\n\tstyle,\n\tselectedState,\n\thasSelectedStyleState,\n\tnextDimensions,\n\tdimensionKeyMap,\n\tdimensionKeys,\n} ) {\n\tconst controlledDimensions = getControlledDimensions(\n\t\tnextDimensions,\n\t\tdimensionKeys\n\t);\n\n\tif ( ! hasSelectedStyleState ) {\n\t\treturn controlledDimensions;\n\t}\n\n\treturn {\n\t\tstyle: setStateDimensions(\n\t\t\tstyle,\n\t\t\tselectedState,\n\t\t\tgetMappedDimensions( controlledDimensions, dimensionKeyMap )\n\t\t),\n\t};\n}\n\nexport function resetDimensions( style, keys ) {\n\tconst dimensionsReset = Object.fromEntries(\n\t\tkeys.map( ( key ) => [ key, undefined ] )\n\t);\n\n\treturn cleanEmptyObject( {\n\t\t...style,\n\t\tdimensions: cleanEmptyObject( {\n\t\t\t...style?.dimensions,\n\t\t\t...dimensionsReset,\n\t\t} ),\n\t} );\n}\n\nexport function resetStateDimensions( style, selectedState, keys ) {\n\treturn setStyleForState(\n\t\tstyle,\n\t\tselectedState,\n\t\tresetDimensions( getStateStyle( style, selectedState ), keys )\n\t);\n}\n\nexport function getDimensionResetAttributes( {\n\tattributes = {},\n\tstyle = attributes?.style,\n\tselectedState,\n\thasSelectedStyleState,\n\tkeys,\n\tdefaultAttributes = {},\n} ) {\n\treturn {\n\t\t...( hasSelectedStyleState\n\t\t\t? {}\n\t\t\t: { ...attributes, ...defaultAttributes } ),\n\t\tstyle: hasSelectedStyleState\n\t\t\t? resetStateDimensions( style, selectedState, keys )\n\t\t\t: resetDimensions( style, keys ),\n\t};\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/build-module/video/block.json

@@ -101,8 +101,14 @@
 		},
 		"interactivity": {
 			"clientNavigation": true
+		},
+		"shadow": {
+			"__experimentalSkipSerialization": true
 		}
 	},
+	"selectors": {
+		"shadow": ".wp-block-video video"
+	},
 	"editorStyle": "wp-block-video-editor",
 	"style": "wp-block-video"
 }

package/build-module/video/edit.mjs

@@ -13,7 +13,8 @@ import {
   MediaPlaceholder,
   MediaReplaceFlow,
   useBlockProps,
-  useBlockEditingMode
+  useBlockEditingMode,
+  __experimentalGetShadowClassesAndStyles as getShadowClassesAndStyles
 } from "@wordpress/block-editor";
 import { useRef, useEffect, useState } from "@wordpress/element";
 import { __ } from "@wordpress/i18n";
@@ -31,7 +32,6 @@ import TracksEditor from "./tracks-editor.mjs";
 import Tracks from "./tracks.mjs";
 import { Caption } from "../utils/caption.mjs";
 import PosterImage from "../utils/poster-image.mjs";
-import { isGifVariation } from "./variations.mjs";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 var ALLOWED_MEDIA_TYPES = ["video"];
 function VideoEdit({
@@ -43,9 +43,24 @@ function VideoEdit({
   onReplace
 }) {
   const videoPlayer = useRef();
-  const { id, controls, poster, src, tracks, width, height } = attributes;
-  const isGif = isGifVariation(attributes);
+  const {
+    id,
+    controls,
+    poster,
+    src,
+    tracks,
+    width,
+    height,
+    autoplay,
+    loop,
+    muted,
+    playsInline
+  } = attributes;
   const aspectRatio = width && height ? `${width} / ${height}` : void 0;
+  const videoStyle = {
+    ...aspectRatio && { aspectRatio },
+    ...getShadowClassesAndStyles(attributes).style
+  };
   const [temporaryURL, setTemporaryURL] = useState(attributes.blob);
   const dropdownMenuProps = useToolsPanelDropdownMenuProps();
   const blockEditingMode = useBlockEditingMode();
@@ -61,12 +76,6 @@ function VideoEdit({
       videoPlayer.current.load();
     }
   }, [poster]);
-  useEffect(() => {
-    if (isGif) {
-      videoPlayer.current?.play().catch(() => {
-      });
-    }
-  }, [isGif, src, poster]);
   function onSelectVideo(media) {
     if (!media || !media.url) {
       setAttributes({
@@ -177,7 +186,7 @@ function VideoEdit({
         }
       ) })
     ] }),
-    !isGif && /* @__PURE__ */ jsx(InspectorControls, { children: /* @__PURE__ */ jsxs(
+    /* @__PURE__ */ jsx(InspectorControls, { children: /* @__PURE__ */ jsxs(
       ToolsPanel,
       {
         label: __("Settings"),
@@ -222,13 +231,13 @@ function VideoEdit({
           poster,
           src: src || temporaryURL,
           ref: videoPlayer,
-          autoPlay: isGif,
-          loop: isGif,
-          muted: isGif,
-          playsInline: isGif,
+          autoPlay: autoplay,
+          loop,
+          muted,
+          playsInline,
           width,
           height,
-          style: aspectRatio ? { aspectRatio } : void 0,
+          style: Object.keys(videoStyle).length ? videoStyle : void 0,
           children: /* @__PURE__ */ jsx(Tracks, { tracks })
         }
       ),

package/build-module/video/edit.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/video/edit.jsx"],
-  "sourcesContent": ["import clsx from 'clsx';\nimport { isBlobURL } from '@wordpress/blob';\nimport {\n\tSpinner,\n\tPlaceholder,\n\t__experimentalToolsPanel as ToolsPanel,\n} from '@wordpress/components';\nimport {\n\tBlockControls,\n\tBlockIcon,\n\tInspectorControls,\n\tMediaPlaceholder,\n\tMediaReplaceFlow,\n\tuseBlockProps,\n\tuseBlockEditingMode,\n} from '@wordpress/block-editor';\nimport { useRef, useEffect, useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { useDispatch } from '@wordpress/data';\nimport { video as icon } from '@wordpress/icons';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { prependHTTPS } from '@wordpress/url';\nimport { createUpgradedEmbedBlock } from '../embed/util';\nimport {\n\tuseUploadMediaFromBlobURL,\n\tuseToolsPanelDropdownMenuProps,\n} from '../utils/hooks';\nimport VideoCommonSettings from './edit-common-settings';\nimport TracksEditor from './tracks-editor';\nimport Tracks from './tracks';\nimport { Caption } from '../utils/caption';\nimport PosterImage from '../utils/poster-image';\nimport { isGifVariation } from './variations';\n\nconst ALLOWED_MEDIA_TYPES = [ 'video' ];\n\nfunction VideoEdit( {\n\tisSelected: isSingleSelected,\n\tattributes,\n\tclassName,\n\tsetAttributes,\n\tinsertBlocksAfter,\n\tonReplace,\n} ) {\n\tconst videoPlayer = useRef();\n\tconst { id, controls, poster, src, tracks, width, height } = attributes;\n\tconst isGif = isGifVariation( attributes );\n\t// Give the <video> an explicit (non-`auto`) aspect ratio derived from the\n\t// stored dimensions. The width/height attributes alone only yield\n\t// `aspect-ratio: auto W/H`, whose `auto` keyword defers to the element's\n\t// natural ratio while the poster/metadata load - during which Chrome briefly\n\t// computes a runaway height (tens of thousands of pixels) before settling.\n\t// That spike is what reads as a duplicated image during the GIF-to-video\n\t// swap. A non-`auto` ratio governs the box height throughout the load.\n\tconst aspectRatio =\n\t\twidth && height ? `${ width } / ${ height }` : undefined;\n\tconst [ temporaryURL, setTemporaryURL ] = useState( attributes.blob );\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\tconst blockEditingMode = useBlockEditingMode();\n\tconst hasNonContentControls = blockEditingMode === 'default';\n\n\tuseUploadMediaFromBlobURL( {\n\t\turl: temporaryURL,\n\t\tallowedTypes: ALLOWED_MEDIA_TYPES,\n\t\tonChange: onSelectVideo,\n\t\tonError: onUploadError,\n\t} );\n\n\tuseEffect( () => {\n\t\t// Placeholder may be rendered.\n\t\tif ( videoPlayer.current ) {\n\t\t\tvideoPlayer.current.load();\n\t\t}\n\t}, [ poster ] );\n\n\t// The GIF variation plays like an animated GIF in the editor (the playback\n\t// attributes are applied to the preview <video> below). Regular videos do\n\t// not autoplay in the editor, so only nudge GIFs into playing after a\n\t// source change in case the muted autoplay did not start on its own.\n\tuseEffect( () => {\n\t\tif ( isGif ) {\n\t\t\t// Browsers allow muted videos to be played programmatically.\n\t\t\tvideoPlayer.current?.play().catch( () => {} );\n\t\t}\n\t}, [ isGif, src, poster ] );\n\n\t// TODO: Whether the video was obtained from the media library or was provided by URL, obtain the `videoWidth` and `videoHeight` of the video once its metadata has loaded and persist in the block attributes.\n\tfunction onSelectVideo( media ) {\n\t\tif ( ! media || ! media.url ) {\n\t\t\t// In this case there was an error\n\t\t\t// previous attributes should be removed\n\t\t\t// because they may be temporary blob urls.\n\t\t\tsetAttributes( {\n\t\t\t\tsrc: undefined,\n\t\t\t\tid: undefined,\n\t\t\t\tposter: undefined,\n\t\t\t\tcaption: undefined,\n\t\t\t\tblob: undefined,\n\t\t\t} );\n\t\t\tsetTemporaryURL();\n\t\t\treturn;\n\t\t}\n\n\t\tif ( isBlobURL( media.url ) ) {\n\t\t\tsetTemporaryURL( media.url );\n\t\t\treturn;\n\t\t}\n\n\t\t// Sets the block's attribute and updates the edit component from the\n\t\t// selected media.\n\t\tsetAttributes( {\n\t\t\tblob: undefined,\n\t\t\tsrc: media.url,\n\t\t\tid: media.id,\n\t\t\tposter:\n\t\t\t\tmedia.image?.src !== media.icon ? media.image?.src : undefined,\n\t\t\tcaption: media.caption,\n\t\t} );\n\t\tsetTemporaryURL();\n\t}\n\n\tfunction onSelectURL( newSrc ) {\n\t\tif ( newSrc !== src ) {\n\t\t\tconst url = prependHTTPS( newSrc );\n\t\t\t// Check if there's an embed block that handles this URL.\n\t\t\tconst embedBlock = createUpgradedEmbedBlock( {\n\t\t\t\tattributes: { url },\n\t\t\t} );\n\t\t\tif ( undefined !== embedBlock && onReplace ) {\n\t\t\t\tonReplace( embedBlock );\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tsetAttributes( {\n\t\t\t\tblob: undefined,\n\t\t\t\tsrc: url,\n\t\t\t\tid: undefined,\n\t\t\t\tposter: undefined,\n\t\t\t} );\n\t\t\tsetTemporaryURL();\n\t\t}\n\t}\n\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\tfunction onUploadError( message ) {\n\t\tcreateErrorNotice( message, { type: 'snackbar' } );\n\t}\n\n\t// Much of this description is duplicated from MediaPlaceholder.\n\tconst placeholder = ( content ) => {\n\t\treturn (\n\t\t\t<Placeholder\n\t\t\t\tclassName=\"block-editor-media-placeholder\"\n\t\t\t\twithIllustration={ ! isSingleSelected }\n\t\t\t\ticon={ icon }\n\t\t\t\tlabel={ __( 'Video' ) }\n\t\t\t\tinstructions={ __(\n\t\t\t\t\t'Drag and drop a video, upload, or choose from your library.'\n\t\t\t\t) }\n\t\t\t>\n\t\t\t\t{ content }\n\t\t\t</Placeholder>\n\t\t);\n\t};\n\n\tconst classes = clsx( className, {\n\t\t'is-transient': !! temporaryURL,\n\t} );\n\n\tconst blockProps = useBlockProps( {\n\t\tclassName: classes,\n\t} );\n\n\tif ( ! src && ! temporaryURL ) {\n\t\treturn (\n\t\t\t<div { ...blockProps }>\n\t\t\t\t<MediaPlaceholder\n\t\t\t\t\ticon={ <BlockIcon icon={ icon } /> }\n\t\t\t\t\tonSelect={ onSelectVideo }\n\t\t\t\t\tonSelectURL={ onSelectURL }\n\t\t\t\t\taccept=\"video/*\"\n\t\t\t\t\tallowedTypes={ ALLOWED_MEDIA_TYPES }\n\t\t\t\t\tvalue={ attributes }\n\t\t\t\t\tonError={ onUploadError }\n\t\t\t\t\tplaceholder={ placeholder }\n\t\t\t\t/>\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{ isSingleSelected && (\n\t\t\t\t<>\n\t\t\t\t\t<BlockControls>\n\t\t\t\t\t\t<TracksEditor\n\t\t\t\t\t\t\ttracks={ tracks }\n\t\t\t\t\t\t\tonChange={ ( newTracks ) => {\n\t\t\t\t\t\t\t\tsetAttributes( { tracks: newTracks } );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</BlockControls>\n\t\t\t\t\t<BlockControls group=\"other\">\n\t\t\t\t\t\t<MediaReplaceFlow\n\t\t\t\t\t\t\tmediaId={ id }\n\t\t\t\t\t\t\tmediaURL={ src }\n\t\t\t\t\t\t\tallowedTypes={ ALLOWED_MEDIA_TYPES }\n\t\t\t\t\t\t\taccept=\"video/*\"\n\t\t\t\t\t\t\tonSelect={ onSelectVideo }\n\t\t\t\t\t\t\tonSelectURL={ onSelectURL }\n\t\t\t\t\t\t\tonError={ onUploadError }\n\t\t\t\t\t\t\tonReset={ () => onSelectVideo( undefined ) }\n\t\t\t\t\t\t\tvariant=\"toolbar\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</BlockControls>\n\t\t\t\t</>\n\t\t\t) }\n\t\t\t{ ! isGif && (\n\t\t\t\t<InspectorControls>\n\t\t\t\t\t<ToolsPanel\n\t\t\t\t\t\tlabel={ __( 'Settings' ) }\n\t\t\t\t\t\tresetAll={ () => {\n\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\tautoplay: false,\n\t\t\t\t\t\t\t\tcontrols: true,\n\t\t\t\t\t\t\t\tloop: false,\n\t\t\t\t\t\t\t\tmuted: false,\n\t\t\t\t\t\t\t\tplaysInline: false,\n\t\t\t\t\t\t\t\tpreload: 'metadata',\n\t\t\t\t\t\t\t\tposter: undefined,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t\t\t\t>\n\t\t\t\t\t\t<VideoCommonSettings\n\t\t\t\t\t\t\tsetAttributes={ setAttributes }\n\t\t\t\t\t\t\tattributes={ attributes }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<PosterImage\n\t\t\t\t\t\t\tposter={ poster }\n\t\t\t\t\t\t\tonChange={ ( posterImage ) =>\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tposter: posterImage?.url,\n\t\t\t\t\t\t\t\t} )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</ToolsPanel>\n\t\t\t\t</InspectorControls>\n\t\t\t) }\n\t\t\t<figure { ...blockProps }>\n\t\t\t\t<video\n\t\t\t\t\tcontrols={ controls }\n\t\t\t\t\tinert={ ! isSingleSelected ? 'true' : undefined }\n\t\t\t\t\tposter={ poster }\n\t\t\t\t\tsrc={ src || temporaryURL }\n\t\t\t\t\tref={ videoPlayer }\n\t\t\t\t\tautoPlay={ isGif }\n\t\t\t\t\tloop={ isGif }\n\t\t\t\t\tmuted={ isGif }\n\t\t\t\t\tplaysInline={ isGif }\n\t\t\t\t\twidth={ width }\n\t\t\t\t\theight={ height }\n\t\t\t\t\tstyle={ aspectRatio ? { aspectRatio } : undefined }\n\t\t\t\t>\n\t\t\t\t\t<Tracks tracks={ tracks } />\n\t\t\t\t</video>\n\t\t\t\t{ !! temporaryURL && <Spinner /> }\n\t\t\t\t<Caption\n\t\t\t\t\tattributes={ attributes }\n\t\t\t\t\tsetAttributes={ setAttributes }\n\t\t\t\t\tisSelected={ isSingleSelected }\n\t\t\t\t\tinsertBlocksAfter={ insertBlocksAfter }\n\t\t\t\t\tlabel={ __( 'Video caption text' ) }\n\t\t\t\t\tshowToolbarButton={\n\t\t\t\t\t\tisSingleSelected && hasNonContentControls\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t</figure>\n\t\t</>\n\t);\n}\n\nexport default VideoEdit;\n"],
-  "mappings": "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",
+  "sourcesContent": ["import clsx from 'clsx';\nimport { isBlobURL } from '@wordpress/blob';\nimport {\n\tSpinner,\n\tPlaceholder,\n\t__experimentalToolsPanel as ToolsPanel,\n} from '@wordpress/components';\nimport {\n\tBlockControls,\n\tBlockIcon,\n\tInspectorControls,\n\tMediaPlaceholder,\n\tMediaReplaceFlow,\n\tuseBlockProps,\n\tuseBlockEditingMode,\n\t__experimentalGetShadowClassesAndStyles as getShadowClassesAndStyles,\n} from '@wordpress/block-editor';\nimport { useRef, useEffect, useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { useDispatch } from '@wordpress/data';\nimport { video as icon } from '@wordpress/icons';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { prependHTTPS } from '@wordpress/url';\nimport { createUpgradedEmbedBlock } from '../embed/util';\nimport {\n\tuseUploadMediaFromBlobURL,\n\tuseToolsPanelDropdownMenuProps,\n} from '../utils/hooks';\nimport VideoCommonSettings from './edit-common-settings';\nimport TracksEditor from './tracks-editor';\nimport Tracks from './tracks';\nimport { Caption } from '../utils/caption';\nimport PosterImage from '../utils/poster-image';\n\nconst ALLOWED_MEDIA_TYPES = [ 'video' ];\n\nfunction VideoEdit( {\n\tisSelected: isSingleSelected,\n\tattributes,\n\tclassName,\n\tsetAttributes,\n\tinsertBlocksAfter,\n\tonReplace,\n} ) {\n\tconst videoPlayer = useRef();\n\tconst {\n\t\tid,\n\t\tcontrols,\n\t\tposter,\n\t\tsrc,\n\t\ttracks,\n\t\twidth,\n\t\theight,\n\t\tautoplay,\n\t\tloop,\n\t\tmuted,\n\t\tplaysInline,\n\t} = attributes;\n\t// Give the <video> an explicit (non-`auto`) aspect ratio derived from the\n\t// stored dimensions. The width/height attributes alone only yield\n\t// `aspect-ratio: auto W/H`, whose `auto` keyword defers to the element's\n\t// natural ratio while the poster/metadata load - during which Chrome briefly\n\t// computes a runaway height (tens of thousands of pixels) before settling.\n\t// That spike is what reads as a duplicated image during the GIF-to-video\n\t// swap. A non-`auto` ratio governs the box height throughout the load.\n\tconst aspectRatio =\n\t\twidth && height ? `${ width } / ${ height }` : undefined;\n\tconst videoStyle = {\n\t\t...( aspectRatio && { aspectRatio } ),\n\t\t...getShadowClassesAndStyles( attributes ).style,\n\t};\n\tconst [ temporaryURL, setTemporaryURL ] = useState( attributes.blob );\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\tconst blockEditingMode = useBlockEditingMode();\n\tconst hasNonContentControls = blockEditingMode === 'default';\n\n\tuseUploadMediaFromBlobURL( {\n\t\turl: temporaryURL,\n\t\tallowedTypes: ALLOWED_MEDIA_TYPES,\n\t\tonChange: onSelectVideo,\n\t\tonError: onUploadError,\n\t} );\n\n\tuseEffect( () => {\n\t\t// Placeholder may be rendered.\n\t\tif ( videoPlayer.current ) {\n\t\t\tvideoPlayer.current.load();\n\t\t}\n\t}, [ poster ] );\n\t// TODO: Whether the video was obtained from the media library or was provided by URL, obtain the `videoWidth` and `videoHeight` of the video once its metadata has loaded and persist in the block attributes.\n\tfunction onSelectVideo( media ) {\n\t\tif ( ! media || ! media.url ) {\n\t\t\t// In this case there was an error\n\t\t\t// previous attributes should be removed\n\t\t\t// because they may be temporary blob urls.\n\t\t\tsetAttributes( {\n\t\t\t\tsrc: undefined,\n\t\t\t\tid: undefined,\n\t\t\t\tposter: undefined,\n\t\t\t\tcaption: undefined,\n\t\t\t\tblob: undefined,\n\t\t\t} );\n\t\t\tsetTemporaryURL();\n\t\t\treturn;\n\t\t}\n\n\t\tif ( isBlobURL( media.url ) ) {\n\t\t\tsetTemporaryURL( media.url );\n\t\t\treturn;\n\t\t}\n\n\t\t// Sets the block's attribute and updates the edit component from the\n\t\t// selected media.\n\t\tsetAttributes( {\n\t\t\tblob: undefined,\n\t\t\tsrc: media.url,\n\t\t\tid: media.id,\n\t\t\tposter:\n\t\t\t\tmedia.image?.src !== media.icon ? media.image?.src : undefined,\n\t\t\tcaption: media.caption,\n\t\t} );\n\t\tsetTemporaryURL();\n\t}\n\n\tfunction onSelectURL( newSrc ) {\n\t\tif ( newSrc !== src ) {\n\t\t\tconst url = prependHTTPS( newSrc );\n\t\t\t// Check if there's an embed block that handles this URL.\n\t\t\tconst embedBlock = createUpgradedEmbedBlock( {\n\t\t\t\tattributes: { url },\n\t\t\t} );\n\t\t\tif ( undefined !== embedBlock && onReplace ) {\n\t\t\t\tonReplace( embedBlock );\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tsetAttributes( {\n\t\t\t\tblob: undefined,\n\t\t\t\tsrc: url,\n\t\t\t\tid: undefined,\n\t\t\t\tposter: undefined,\n\t\t\t} );\n\t\t\tsetTemporaryURL();\n\t\t}\n\t}\n\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\tfunction onUploadError( message ) {\n\t\tcreateErrorNotice( message, { type: 'snackbar' } );\n\t}\n\n\t// Much of this description is duplicated from MediaPlaceholder.\n\tconst placeholder = ( content ) => {\n\t\treturn (\n\t\t\t<Placeholder\n\t\t\t\tclassName=\"block-editor-media-placeholder\"\n\t\t\t\twithIllustration={ ! isSingleSelected }\n\t\t\t\ticon={ icon }\n\t\t\t\tlabel={ __( 'Video' ) }\n\t\t\t\tinstructions={ __(\n\t\t\t\t\t'Drag and drop a video, upload, or choose from your library.'\n\t\t\t\t) }\n\t\t\t>\n\t\t\t\t{ content }\n\t\t\t</Placeholder>\n\t\t);\n\t};\n\n\tconst classes = clsx( className, {\n\t\t'is-transient': !! temporaryURL,\n\t} );\n\n\tconst blockProps = useBlockProps( {\n\t\tclassName: classes,\n\t} );\n\n\tif ( ! src && ! temporaryURL ) {\n\t\treturn (\n\t\t\t<div { ...blockProps }>\n\t\t\t\t<MediaPlaceholder\n\t\t\t\t\ticon={ <BlockIcon icon={ icon } /> }\n\t\t\t\t\tonSelect={ onSelectVideo }\n\t\t\t\t\tonSelectURL={ onSelectURL }\n\t\t\t\t\taccept=\"video/*\"\n\t\t\t\t\tallowedTypes={ ALLOWED_MEDIA_TYPES }\n\t\t\t\t\tvalue={ attributes }\n\t\t\t\t\tonError={ onUploadError }\n\t\t\t\t\tplaceholder={ placeholder }\n\t\t\t\t/>\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{ isSingleSelected && (\n\t\t\t\t<>\n\t\t\t\t\t<BlockControls>\n\t\t\t\t\t\t<TracksEditor\n\t\t\t\t\t\t\ttracks={ tracks }\n\t\t\t\t\t\t\tonChange={ ( newTracks ) => {\n\t\t\t\t\t\t\t\tsetAttributes( { tracks: newTracks } );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</BlockControls>\n\t\t\t\t\t<BlockControls group=\"other\">\n\t\t\t\t\t\t<MediaReplaceFlow\n\t\t\t\t\t\t\tmediaId={ id }\n\t\t\t\t\t\t\tmediaURL={ src }\n\t\t\t\t\t\t\tallowedTypes={ ALLOWED_MEDIA_TYPES }\n\t\t\t\t\t\t\taccept=\"video/*\"\n\t\t\t\t\t\t\tonSelect={ onSelectVideo }\n\t\t\t\t\t\t\tonSelectURL={ onSelectURL }\n\t\t\t\t\t\t\tonError={ onUploadError }\n\t\t\t\t\t\t\tonReset={ () => onSelectVideo( undefined ) }\n\t\t\t\t\t\t\tvariant=\"toolbar\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</BlockControls>\n\t\t\t\t</>\n\t\t\t) }\n\t\t\t<InspectorControls>\n\t\t\t\t<ToolsPanel\n\t\t\t\t\tlabel={ __( 'Settings' ) }\n\t\t\t\t\tresetAll={ () => {\n\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\tautoplay: false,\n\t\t\t\t\t\t\tcontrols: true,\n\t\t\t\t\t\t\tloop: false,\n\t\t\t\t\t\t\tmuted: false,\n\t\t\t\t\t\t\tplaysInline: false,\n\t\t\t\t\t\t\tpreload: 'metadata',\n\t\t\t\t\t\t\tposter: undefined,\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t\t\t>\n\t\t\t\t\t<VideoCommonSettings\n\t\t\t\t\t\tsetAttributes={ setAttributes }\n\t\t\t\t\t\tattributes={ attributes }\n\t\t\t\t\t/>\n\t\t\t\t\t<PosterImage\n\t\t\t\t\t\tposter={ poster }\n\t\t\t\t\t\tonChange={ ( posterImage ) =>\n\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\tposter: posterImage?.url,\n\t\t\t\t\t\t\t} )\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanel>\n\t\t\t</InspectorControls>\n\t\t\t<figure { ...blockProps }>\n\t\t\t\t<video\n\t\t\t\t\tcontrols={ controls }\n\t\t\t\t\tinert={ ! isSingleSelected ? 'true' : undefined }\n\t\t\t\t\tposter={ poster }\n\t\t\t\t\tsrc={ src || temporaryURL }\n\t\t\t\t\tref={ videoPlayer }\n\t\t\t\t\tautoPlay={ autoplay }\n\t\t\t\t\tloop={ loop }\n\t\t\t\t\tmuted={ muted }\n\t\t\t\t\tplaysInline={ playsInline }\n\t\t\t\t\twidth={ width }\n\t\t\t\t\theight={ height }\n\t\t\t\t\tstyle={\n\t\t\t\t\t\tObject.keys( videoStyle ).length\n\t\t\t\t\t\t\t? videoStyle\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t<Tracks tracks={ tracks } />\n\t\t\t\t</video>\n\t\t\t\t{ !! temporaryURL && <Spinner /> }\n\t\t\t\t<Caption\n\t\t\t\t\tattributes={ attributes }\n\t\t\t\t\tsetAttributes={ setAttributes }\n\t\t\t\t\tisSelected={ isSingleSelected }\n\t\t\t\t\tinsertBlocksAfter={ insertBlocksAfter }\n\t\t\t\t\tlabel={ __( 'Video caption text' ) }\n\t\t\t\t\tshowToolbarButton={\n\t\t\t\t\t\tisSingleSelected && hasNonContentControls\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t</figure>\n\t\t</>\n\t);\n}\n\nexport default VideoEdit;\n"],
+  "mappings": "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",
   "names": []
 }

package/build-module/video/index.mjs

@@ -7,7 +7,6 @@ import edit from "./edit.mjs";
 import metadata from "./block.json";
 import save from "./save.mjs";
 import transforms from "./transforms.mjs";
-import variations from "./variations.mjs";
 var { name } = metadata;
 var settings = {
   icon,
@@ -19,7 +18,6 @@ var settings = {
     }
   },
   transforms,
-  variations,
   deprecated,
   edit,
   save

package/build-module/video/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/video/index.js"],
-  "sourcesContent": ["import { __ } from '@wordpress/i18n';\nimport { video as icon } from '@wordpress/icons';\nimport initBlock from '../utils/init-block';\nimport deprecated from './deprecated';\nimport edit from './edit';\nimport metadata from './block.json';\nimport save from './save';\nimport transforms from './transforms';\nimport variations from './variations';\n\nconst { name } = metadata;\n\nexport { metadata, name };\n\nexport const settings = {\n\ticon,\n\texample: {\n\t\tattributes: {\n\t\t\tsrc: 'https://upload.wikimedia.org/wikipedia/commons/c/ca/Wood_thrush_in_Central_Park_switch_sides_%2816510%29.webm',\n\t\t\t// translators: Caption accompanying a video of the wood thrush singing, which serves as an example for the Video block.\n\t\t\tcaption: __( 'Wood thrush singing in Central Park, NYC.' ),\n\t\t},\n\t},\n\ttransforms,\n\tvariations,\n\tdeprecated,\n\tedit,\n\tsave,\n};\n\nexport const init = () => initBlock( { name, metadata, settings } );\n"],
-  "mappings": ";AAAA,SAAS,UAAU;AACnB,SAAS,SAAS,YAAY;AAC9B,OAAO,eAAe;AACtB,OAAO,gBAAgB;AACvB,OAAO,UAAU;AACjB,OAAO,cAAc;AACrB,OAAO,UAAU;AACjB,OAAO,gBAAgB;AACvB,OAAO,gBAAgB;AAEvB,IAAM,EAAE,KAAK,IAAI;AAIV,IAAM,WAAW;AAAA,EACvB;AAAA,EACA,SAAS;AAAA,IACR,YAAY;AAAA,MACX,KAAK;AAAA;AAAA,MAEL,SAAS,GAAI,2CAA4C;AAAA,IAC1D;AAAA,EACD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD;AAEO,IAAM,OAAO,MAAM,UAAW,EAAE,MAAM,UAAU,SAAS,CAAE;",
+  "sourcesContent": ["import { __ } from '@wordpress/i18n';\nimport { video as icon } from '@wordpress/icons';\nimport initBlock from '../utils/init-block';\nimport deprecated from './deprecated';\nimport edit from './edit';\nimport metadata from './block.json';\nimport save from './save';\nimport transforms from './transforms';\n\nconst { name } = metadata;\n\nexport { metadata, name };\n\nexport const settings = {\n\ticon,\n\texample: {\n\t\tattributes: {\n\t\t\tsrc: 'https://upload.wikimedia.org/wikipedia/commons/c/ca/Wood_thrush_in_Central_Park_switch_sides_%2816510%29.webm',\n\t\t\t// translators: Caption accompanying a video of the wood thrush singing, which serves as an example for the Video block.\n\t\t\tcaption: __( 'Wood thrush singing in Central Park, NYC.' ),\n\t\t},\n\t},\n\ttransforms,\n\tdeprecated,\n\tedit,\n\tsave,\n};\n\nexport const init = () => initBlock( { name, metadata, settings } );\n"],
+  "mappings": ";AAAA,SAAS,UAAU;AACnB,SAAS,SAAS,YAAY;AAC9B,OAAO,eAAe;AACtB,OAAO,gBAAgB;AACvB,OAAO,UAAU;AACjB,OAAO,cAAc;AACrB,OAAO,UAAU;AACjB,OAAO,gBAAgB;AAEvB,IAAM,EAAE,KAAK,IAAI;AAIV,IAAM,WAAW;AAAA,EACvB;AAAA,EACA,SAAS;AAAA,IACR,YAAY;AAAA,MACX,KAAK;AAAA;AAAA,MAEL,SAAS,GAAI,2CAA4C;AAAA,IAC1D;AAAA,EACD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD;AAEO,IAAM,OAAO,MAAM,UAAW,EAAE,MAAM,UAAU,SAAS,CAAE;",
   "names": []
 }

package/build-module/video/save.mjs

@@ -2,7 +2,8 @@
 import {
   RichText,
   useBlockProps,
-  __experimentalGetElementClassName
+  __experimentalGetElementClassName,
+  __experimentalGetShadowClassesAndStyles as getShadowClassesAndStyles
 } from "@wordpress/block-editor";
 import Tracks from "./tracks.mjs";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -22,6 +23,10 @@ function save({ attributes }) {
     height
   } = attributes;
   const aspectRatio = width && height ? `${width} / ${height}` : void 0;
+  const videoStyle = {
+    ...aspectRatio && { aspectRatio },
+    ...getShadowClassesAndStyles(attributes).style
+  };
   return /* @__PURE__ */ jsxs("figure", { ...useBlockProps.save(), children: [
     src && /* @__PURE__ */ jsx(
       "video",
@@ -36,7 +41,7 @@ function save({ attributes }) {
         playsInline,
         width,
         height,
-        style: aspectRatio ? { aspectRatio } : void 0,
+        style: Object.keys(videoStyle).length ? videoStyle : void 0,
         children: /* @__PURE__ */ jsx(Tracks, { tracks })
       }
     ),

package/build-module/video/save.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/video/save.jsx"],
-  "sourcesContent": ["import {\n\tRichText,\n\tuseBlockProps,\n\t__experimentalGetElementClassName,\n} from '@wordpress/block-editor';\nimport Tracks from './tracks';\n\nexport default function save( { attributes } ) {\n\tconst {\n\t\tautoplay,\n\t\tcaption,\n\t\tcontrols,\n\t\tloop,\n\t\tmuted,\n\t\tposter,\n\t\tpreload,\n\t\tsrc,\n\t\tplaysInline,\n\t\ttracks,\n\t\twidth,\n\t\theight,\n\t} = attributes;\n\t// Match the editor: an explicit (non-`auto`) aspect ratio keeps the\n\t// converted GIF video from briefly blowing up to a runaway height while the\n\t// poster/metadata load, which would otherwise flash on the front end and\n\t// cause layout shift. The width/height attributes only yield\n\t// `aspect-ratio: auto W/H`, whose `auto` keyword is unreliable during load.\n\tconst aspectRatio =\n\t\twidth && height ? `${ width } / ${ height }` : undefined;\n\treturn (\n\t\t<figure { ...useBlockProps.save() }>\n\t\t\t{ src && (\n\t\t\t\t<video\n\t\t\t\t\tautoPlay={ autoplay }\n\t\t\t\t\tcontrols={ controls }\n\t\t\t\t\tloop={ loop }\n\t\t\t\t\tmuted={ muted }\n\t\t\t\t\tposter={ poster }\n\t\t\t\t\tpreload={ preload !== 'metadata' ? preload : undefined }\n\t\t\t\t\tsrc={ src }\n\t\t\t\t\tplaysInline={ playsInline }\n\t\t\t\t\twidth={ width }\n\t\t\t\t\theight={ height }\n\t\t\t\t\tstyle={ aspectRatio ? { aspectRatio } : undefined }\n\t\t\t\t>\n\t\t\t\t\t<Tracks tracks={ tracks } />\n\t\t\t\t</video>\n\t\t\t) }\n\t\t\t{ ! RichText.isEmpty( caption ) && (\n\t\t\t\t<RichText.Content\n\t\t\t\t\tclassName={ __experimentalGetElementClassName( 'caption' ) }\n\t\t\t\t\ttagName=\"figcaption\"\n\t\t\t\t\tvalue={ caption }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</figure>\n\t);\n}\n"],
-  "mappings": ";AAAA;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,OAAO,YAAY;AAyBjB,SAeG,KAfH;AAvBa,SAAR,KAAuB,EAAE,WAAW,GAAI;AAC9C,QAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,IAAI;AAMJ,QAAM,cACL,SAAS,SAAS,GAAI,KAAM,MAAO,MAAO,KAAK;AAChD,SACC,qBAAC,YAAS,GAAG,cAAc,KAAK,GAC7B;AAAA,WACD;AAAA,MAAC;AAAA;AAAA,QACA,UAAW;AAAA,QACX;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,SAAU,YAAY,aAAa,UAAU;AAAA,QAC7C;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,OAAQ,cAAc,EAAE,YAAY,IAAI;AAAA,QAExC,8BAAC,UAAO,QAAkB;AAAA;AAAA,IAC3B;AAAA,IAEC,CAAE,SAAS,QAAS,OAAQ,KAC7B;AAAA,MAAC,SAAS;AAAA,MAAT;AAAA,QACA,WAAY,kCAAmC,SAAU;AAAA,QACzD,SAAQ;AAAA,QACR,OAAQ;AAAA;AAAA,IACT;AAAA,KAEF;AAEF;",
+  "sourcesContent": ["import {\n\tRichText,\n\tuseBlockProps,\n\t__experimentalGetElementClassName,\n\t__experimentalGetShadowClassesAndStyles as getShadowClassesAndStyles,\n} from '@wordpress/block-editor';\nimport Tracks from './tracks';\n\nexport default function save( { attributes } ) {\n\tconst {\n\t\tautoplay,\n\t\tcaption,\n\t\tcontrols,\n\t\tloop,\n\t\tmuted,\n\t\tposter,\n\t\tpreload,\n\t\tsrc,\n\t\tplaysInline,\n\t\ttracks,\n\t\twidth,\n\t\theight,\n\t} = attributes;\n\t// Match the editor: an explicit (non-`auto`) aspect ratio keeps the\n\t// converted GIF video from briefly blowing up to a runaway height while the\n\t// poster/metadata load, which would otherwise flash on the front end and\n\t// cause layout shift. The width/height attributes only yield\n\t// `aspect-ratio: auto W/H`, whose `auto` keyword is unreliable during load.\n\tconst aspectRatio =\n\t\twidth && height ? `${ width } / ${ height }` : undefined;\n\tconst videoStyle = {\n\t\t...( aspectRatio && { aspectRatio } ),\n\t\t...getShadowClassesAndStyles( attributes ).style,\n\t};\n\treturn (\n\t\t<figure { ...useBlockProps.save() }>\n\t\t\t{ src && (\n\t\t\t\t<video\n\t\t\t\t\tautoPlay={ autoplay }\n\t\t\t\t\tcontrols={ controls }\n\t\t\t\t\tloop={ loop }\n\t\t\t\t\tmuted={ muted }\n\t\t\t\t\tposter={ poster }\n\t\t\t\t\tpreload={ preload !== 'metadata' ? preload : undefined }\n\t\t\t\t\tsrc={ src }\n\t\t\t\t\tplaysInline={ playsInline }\n\t\t\t\t\twidth={ width }\n\t\t\t\t\theight={ height }\n\t\t\t\t\tstyle={\n\t\t\t\t\t\tObject.keys( videoStyle ).length\n\t\t\t\t\t\t\t? videoStyle\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t<Tracks tracks={ tracks } />\n\t\t\t\t</video>\n\t\t\t) }\n\t\t\t{ ! RichText.isEmpty( caption ) && (\n\t\t\t\t<RichText.Content\n\t\t\t\t\tclassName={ __experimentalGetElementClassName( 'caption' ) }\n\t\t\t\t\ttagName=\"figcaption\"\n\t\t\t\t\tvalue={ caption }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</figure>\n\t);\n}\n"],
+  "mappings": ";AAAA;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA,2CAA2C;AAAA,OACrC;AACP,OAAO,YAAY;AA6BjB,SAmBG,KAnBH;AA3Ba,SAAR,KAAuB,EAAE,WAAW,GAAI;AAC9C,QAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,IAAI;AAMJ,QAAM,cACL,SAAS,SAAS,GAAI,KAAM,MAAO,MAAO,KAAK;AAChD,QAAM,aAAa;AAAA,IAClB,GAAK,eAAe,EAAE,YAAY;AAAA,IAClC,GAAG,0BAA2B,UAAW,EAAE;AAAA,EAC5C;AACA,SACC,qBAAC,YAAS,GAAG,cAAc,KAAK,GAC7B;AAAA,WACD;AAAA,MAAC;AAAA;AAAA,QACA,UAAW;AAAA,QACX;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,SAAU,YAAY,aAAa,UAAU;AAAA,QAC7C;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,OACC,OAAO,KAAM,UAAW,EAAE,SACvB,aACA;AAAA,QAGJ,8BAAC,UAAO,QAAkB;AAAA;AAAA,IAC3B;AAAA,IAEC,CAAE,SAAS,QAAS,OAAQ,KAC7B;AAAA,MAAC,SAAS;AAAA,MAAT;AAAA,QACA,WAAY,kCAAmC,SAAU;AAAA,QACzD,SAAQ;AAAA,QACR,OAAQ;AAAA;AAAA,IACT;AAAA,KAEF;AAEF;",
   "names": []
 }