@wordpress/editor 14.36.1-next.738bb1424.0 → 14.36.1-next.8fd3f8831.0

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/private-apis.cjs +1 -1
  2. package/build/private-apis.cjs.map +2 -2
  3. package/build-module/private-apis.js +5 -5
  4. package/build-module/private-apis.js.map +2 -2
  5. package/build-style/style-rtl.css +242 -11
  6. package/build-style/style.css +245 -10
  7. package/package.json +40 -40
  8. package/src/components/post-featured-image/style.scss +2 -0
  9. package/src/private-apis.js +5 -5
package/build/private-apis.cjs CHANGED
@@ -33,6 +33,7 @@ __export(private_apis_exports, {
33
33
  privateApis: () => privateApis
34
34
  });
35
35
  module.exports = __toCommonJS(private_apis_exports);
36
+ var import_fields = require("@wordpress/fields");
36
37
  var interfaceApis = __toESM(require("@wordpress/interface"), 1);
37
38
  var import_lock_unlock = require("./lock-unlock.cjs");
38
39
  var import_entities_saved_states = require("./components/entities-saved-states/index.cjs");
@@ -46,7 +47,6 @@ var import_post_fields = __toESM(require("./components/post-fields/index.cjs"),
46
47
  var import_tools_more_menu_group = __toESM(require("./components/more-menu/tools-more-menu-group.cjs"), 1);
47
48
  var import_view_more_menu_group = __toESM(require("./components/more-menu/view-more-menu-group.cjs"), 1);
48
49
  var import_resizable_editor = __toESM(require("./components/resizable-editor/index.cjs"), 1);
49
- var import_fields = require("@wordpress/fields");
50
50
  var import_api = require("./bindings/api.cjs");
51
51
  var import_get_template_info = require("./utils/get-template-info.cjs");
52
52
  var import_global_styles = __toESM(require("./components/global-styles/index.cjs"), 1);
package/build/private-apis.cjs.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../src/private-apis.js"],
4
- "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport * as interfaceApis from '@wordpress/interface';\n\n/**\n * Internal dependencies\n */\nimport { lock } from './lock-unlock';\nimport { EntitiesSavedStatesExtensible } from './components/entities-saved-states';\nimport BackButton from './components/header/back-button';\nimport Editor from './components/editor';\nimport PluginPostExcerpt from './components/post-excerpt/plugin';\nimport PostCardPanel from './components/post-card-panel';\nimport PreferencesModal from './components/preferences-modal';\nimport { usePostActions } from './components/post-actions/actions';\nimport usePostFields from './components/post-fields';\nimport ToolsMoreMenuGroup from './components/more-menu/tools-more-menu-group';\nimport ViewMoreMenuGroup from './components/more-menu/view-more-menu-group';\nimport ResizableEditor from './components/resizable-editor';\nimport {\n\tCreateTemplatePartModal,\n\tpatternTitleField,\n\ttemplateTitleField,\n} from '@wordpress/fields';\nimport { registerCoreBlockBindingsSources } from './bindings/api';\nimport { getTemplateInfo } from './utils/get-template-info';\nimport GlobalStylesUIWrapper from './components/global-styles';\nimport { StyleBookPreview } from './components/style-book';\nimport { useGlobalStyles, useStyle } from './components/global-styles/hooks';\nimport { GlobalStylesActionMenu } from './components/global-styles/menu';\nimport {\n\tuseGenerateBlockPath,\n\tuseRestoreBlockFromPath,\n} from './utils/block-selection-path';\n\nconst { store: interfaceStore, ...remainingInterfaceApis } = interfaceApis;\n\nexport const privateApis = {};\nlock( privateApis, {\n\tCreateTemplatePartModal,\n\tpatternTitleField,\n\ttemplateTitleField,\n\tBackButton,\n\tEntitiesSavedStatesExtensible,\n\tEditor,\n\tPluginPostExcerpt,\n\tPostCardPanel,\n\tPreferencesModal,\n\tusePostActions,\n\tusePostFields,\n\tToolsMoreMenuGroup,\n\tViewMoreMenuGroup,\n\tResizableEditor,\n\tregisterCoreBlockBindingsSources,\n\tgetTemplateInfo,\n\t// Global Styles\n\tGlobalStylesUIWrapper,\n\tGlobalStylesActionMenu,\n\tStyleBookPreview,\n\tuseGlobalStyles,\n\tuseStyle,\n\t// Block selection\n\tuseGenerateBlockPath,\n\tuseRestoreBlockFromPath,\n\t// This is a temporary private API while we're updating the site editor to use EditorProvider.\n\tinterfaceStore,\n\t...remainingInterfaceApis,\n} );\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,oBAA+B;AAK/B,yBAAqB;AACrB,mCAA8C;AAC9C,yBAAuB;AACvB,oBAAmB;AACnB,oBAA8B;AAC9B,6BAA0B;AAC1B,+BAA6B;AAC7B,qBAA+B;AAC/B,yBAA0B;AAC1B,mCAA+B;AAC/B,kCAA8B;AAC9B,8BAA4B;AAC5B,oBAIO;AACP,iBAAiD;AACjD,+BAAgC;AAChC,2BAAkC;AAClC,wBAAiC;AACjC,mBAA0C;AAC1C,kBAAuC;AACvC,kCAGO;AAEP,IAAM,EAAE,OAAO,gBAAgB,GAAG,uBAAuB,IAAI;AAEtD,IAAM,cAAc,CAAC;AAAA,IAC5B,yBAAM,aAAa;AAAA,EAClB;AAAA,EACA;AAAA,EACA;AAAA,EACA,+BAAAA;AAAA,EACA;AAAA,EACA,sBAAAC;AAAA,EACA,iCAAAC;AAAA,EACA,sCAAAC;AAAA,EACA,2CAAAC;AAAA,EACA;AAAA,EACA,kCAAAC;AAAA,EACA,iDAAAC;AAAA,EACA,+CAAAC;AAAA,EACA,yCAAAC;AAAA,EACA;AAAA,EACA;AAAA;AAAA,EAEA,4CAAAC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA,EAEA;AAAA,EACA;AAAA;AAAA,EAEA;AAAA,EACA,GAAG;AACJ,CAAE;",
4
+ "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tCreateTemplatePartModal,\n\tpatternTitleField,\n\ttemplateTitleField,\n} from '@wordpress/fields';\nimport * as interfaceApis from '@wordpress/interface';\n\n/**\n * Internal dependencies\n */\nimport { lock } from './lock-unlock';\nimport { EntitiesSavedStatesExtensible } from './components/entities-saved-states';\nimport BackButton from './components/header/back-button';\nimport Editor from './components/editor';\nimport PluginPostExcerpt from './components/post-excerpt/plugin';\nimport PostCardPanel from './components/post-card-panel';\nimport PreferencesModal from './components/preferences-modal';\nimport { usePostActions } from './components/post-actions/actions';\nimport usePostFields from './components/post-fields';\nimport ToolsMoreMenuGroup from './components/more-menu/tools-more-menu-group';\nimport ViewMoreMenuGroup from './components/more-menu/view-more-menu-group';\nimport ResizableEditor from './components/resizable-editor';\nimport { registerCoreBlockBindingsSources } from './bindings/api';\nimport { getTemplateInfo } from './utils/get-template-info';\nimport GlobalStylesUIWrapper from './components/global-styles';\nimport { StyleBookPreview } from './components/style-book';\nimport { useGlobalStyles, useStyle } from './components/global-styles/hooks';\nimport { GlobalStylesActionMenu } from './components/global-styles/menu';\nimport {\n\tuseGenerateBlockPath,\n\tuseRestoreBlockFromPath,\n} from './utils/block-selection-path';\n\nconst { store: interfaceStore, ...remainingInterfaceApis } = interfaceApis;\n\nexport const privateApis = {};\nlock( privateApis, {\n\tCreateTemplatePartModal,\n\tpatternTitleField,\n\ttemplateTitleField,\n\tBackButton,\n\tEntitiesSavedStatesExtensible,\n\tEditor,\n\tPluginPostExcerpt,\n\tPostCardPanel,\n\tPreferencesModal,\n\tusePostActions,\n\tusePostFields,\n\tToolsMoreMenuGroup,\n\tViewMoreMenuGroup,\n\tResizableEditor,\n\tregisterCoreBlockBindingsSources,\n\tgetTemplateInfo,\n\t// Global Styles\n\tGlobalStylesUIWrapper,\n\tGlobalStylesActionMenu,\n\tStyleBookPreview,\n\tuseGlobalStyles,\n\tuseStyle,\n\t// Block selection\n\tuseGenerateBlockPath,\n\tuseRestoreBlockFromPath,\n\t// This is a temporary private API while we're updating the site editor to use EditorProvider.\n\tinterfaceStore,\n\t...remainingInterfaceApis,\n} );\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,oBAIO;AACP,oBAA+B;AAK/B,yBAAqB;AACrB,mCAA8C;AAC9C,yBAAuB;AACvB,oBAAmB;AACnB,oBAA8B;AAC9B,6BAA0B;AAC1B,+BAA6B;AAC7B,qBAA+B;AAC/B,yBAA0B;AAC1B,mCAA+B;AAC/B,kCAA8B;AAC9B,8BAA4B;AAC5B,iBAAiD;AACjD,+BAAgC;AAChC,2BAAkC;AAClC,wBAAiC;AACjC,mBAA0C;AAC1C,kBAAuC;AACvC,kCAGO;AAEP,IAAM,EAAE,OAAO,gBAAgB,GAAG,uBAAuB,IAAI;AAEtD,IAAM,cAAc,CAAC;AAAA,IAC5B,yBAAM,aAAa;AAAA,EAClB;AAAA,EACA;AAAA,EACA;AAAA,EACA,+BAAAA;AAAA,EACA;AAAA,EACA,sBAAAC;AAAA,EACA,iCAAAC;AAAA,EACA,sCAAAC;AAAA,EACA,2CAAAC;AAAA,EACA;AAAA,EACA,kCAAAC;AAAA,EACA,iDAAAC;AAAA,EACA,+CAAAC;AAAA,EACA,yCAAAC;AAAA,EACA;AAAA,EACA;AAAA;AAAA,EAEA,4CAAAC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA,EAEA;AAAA,EACA;AAAA;AAAA,EAEA;AAAA,EACA,GAAG;AACJ,CAAE;",
6
6
  "names": ["BackButton", "Editor", "PluginPostExcerpt", "PostCardPanel", "PreferencesModal", "usePostFields", "ToolsMoreMenuGroup", "ViewMoreMenuGroup", "ResizableEditor", "GlobalStylesUIWrapper"]
7
7
  }
package/build-module/private-apis.js CHANGED
@@ -1,4 +1,9 @@
1
1
  // packages/editor/src/private-apis.js
2
+ import {
3
+ CreateTemplatePartModal,
4
+ patternTitleField,
5
+ templateTitleField
6
+ } from "@wordpress/fields";
2
7
  import * as interfaceApis from "@wordpress/interface";
3
8
  import { lock } from "./lock-unlock.js";
4
9
  import { EntitiesSavedStatesExtensible } from "./components/entities-saved-states/index.js";
@@ -12,11 +17,6 @@ import usePostFields from "./components/post-fields/index.js";
12
17
  import ToolsMoreMenuGroup from "./components/more-menu/tools-more-menu-group.js";
13
18
  import ViewMoreMenuGroup from "./components/more-menu/view-more-menu-group.js";
14
19
  import ResizableEditor from "./components/resizable-editor/index.js";
15
- import {
16
- CreateTemplatePartModal,
17
- patternTitleField,
18
- templateTitleField
19
- } from "@wordpress/fields";
20
20
  import { registerCoreBlockBindingsSources } from "./bindings/api.js";
21
21
  import { getTemplateInfo } from "./utils/get-template-info.js";
22
22
  import GlobalStylesUIWrapper from "./components/global-styles/index.js";
package/build-module/private-apis.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../src/private-apis.js"],
4
- "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport * as interfaceApis from '@wordpress/interface';\n\n/**\n * Internal dependencies\n */\nimport { lock } from './lock-unlock';\nimport { EntitiesSavedStatesExtensible } from './components/entities-saved-states';\nimport BackButton from './components/header/back-button';\nimport Editor from './components/editor';\nimport PluginPostExcerpt from './components/post-excerpt/plugin';\nimport PostCardPanel from './components/post-card-panel';\nimport PreferencesModal from './components/preferences-modal';\nimport { usePostActions } from './components/post-actions/actions';\nimport usePostFields from './components/post-fields';\nimport ToolsMoreMenuGroup from './components/more-menu/tools-more-menu-group';\nimport ViewMoreMenuGroup from './components/more-menu/view-more-menu-group';\nimport ResizableEditor from './components/resizable-editor';\nimport {\n\tCreateTemplatePartModal,\n\tpatternTitleField,\n\ttemplateTitleField,\n} from '@wordpress/fields';\nimport { registerCoreBlockBindingsSources } from './bindings/api';\nimport { getTemplateInfo } from './utils/get-template-info';\nimport GlobalStylesUIWrapper from './components/global-styles';\nimport { StyleBookPreview } from './components/style-book';\nimport { useGlobalStyles, useStyle } from './components/global-styles/hooks';\nimport { GlobalStylesActionMenu } from './components/global-styles/menu';\nimport {\n\tuseGenerateBlockPath,\n\tuseRestoreBlockFromPath,\n} from './utils/block-selection-path';\n\nconst { store: interfaceStore, ...remainingInterfaceApis } = interfaceApis;\n\nexport const privateApis = {};\nlock( privateApis, {\n\tCreateTemplatePartModal,\n\tpatternTitleField,\n\ttemplateTitleField,\n\tBackButton,\n\tEntitiesSavedStatesExtensible,\n\tEditor,\n\tPluginPostExcerpt,\n\tPostCardPanel,\n\tPreferencesModal,\n\tusePostActions,\n\tusePostFields,\n\tToolsMoreMenuGroup,\n\tViewMoreMenuGroup,\n\tResizableEditor,\n\tregisterCoreBlockBindingsSources,\n\tgetTemplateInfo,\n\t// Global Styles\n\tGlobalStylesUIWrapper,\n\tGlobalStylesActionMenu,\n\tStyleBookPreview,\n\tuseGlobalStyles,\n\tuseStyle,\n\t// Block selection\n\tuseGenerateBlockPath,\n\tuseRestoreBlockFromPath,\n\t// This is a temporary private API while we're updating the site editor to use EditorProvider.\n\tinterfaceStore,\n\t...remainingInterfaceApis,\n} );\n"],
5
- "mappings": ";AAGA,YAAY,mBAAmB;AAK/B,SAAS,YAAY;AACrB,SAAS,qCAAqC;AAC9C,OAAO,gBAAgB;AACvB,OAAO,YAAY;AACnB,OAAO,uBAAuB;AAC9B,OAAO,mBAAmB;AAC1B,OAAO,sBAAsB;AAC7B,SAAS,sBAAsB;AAC/B,OAAO,mBAAmB;AAC1B,OAAO,wBAAwB;AAC/B,OAAO,uBAAuB;AAC9B,OAAO,qBAAqB;AAC5B;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,wCAAwC;AACjD,SAAS,uBAAuB;AAChC,OAAO,2BAA2B;AAClC,SAAS,wBAAwB;AACjC,SAAS,iBAAiB,gBAAgB;AAC1C,SAAS,8BAA8B;AACvC;AAAA,EACC;AAAA,EACA;AAAA,OACM;AAEP,IAAM,EAAE,OAAO,gBAAgB,GAAG,uBAAuB,IAAI;AAEtD,IAAM,cAAc,CAAC;AAC5B,KAAM,aAAa;AAAA,EAClB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA,EAEA;AAAA,EACA;AAAA;AAAA,EAEA;AAAA,EACA,GAAG;AACJ,CAAE;",
4
+ "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tCreateTemplatePartModal,\n\tpatternTitleField,\n\ttemplateTitleField,\n} from '@wordpress/fields';\nimport * as interfaceApis from '@wordpress/interface';\n\n/**\n * Internal dependencies\n */\nimport { lock } from './lock-unlock';\nimport { EntitiesSavedStatesExtensible } from './components/entities-saved-states';\nimport BackButton from './components/header/back-button';\nimport Editor from './components/editor';\nimport PluginPostExcerpt from './components/post-excerpt/plugin';\nimport PostCardPanel from './components/post-card-panel';\nimport PreferencesModal from './components/preferences-modal';\nimport { usePostActions } from './components/post-actions/actions';\nimport usePostFields from './components/post-fields';\nimport ToolsMoreMenuGroup from './components/more-menu/tools-more-menu-group';\nimport ViewMoreMenuGroup from './components/more-menu/view-more-menu-group';\nimport ResizableEditor from './components/resizable-editor';\nimport { registerCoreBlockBindingsSources } from './bindings/api';\nimport { getTemplateInfo } from './utils/get-template-info';\nimport GlobalStylesUIWrapper from './components/global-styles';\nimport { StyleBookPreview } from './components/style-book';\nimport { useGlobalStyles, useStyle } from './components/global-styles/hooks';\nimport { GlobalStylesActionMenu } from './components/global-styles/menu';\nimport {\n\tuseGenerateBlockPath,\n\tuseRestoreBlockFromPath,\n} from './utils/block-selection-path';\n\nconst { store: interfaceStore, ...remainingInterfaceApis } = interfaceApis;\n\nexport const privateApis = {};\nlock( privateApis, {\n\tCreateTemplatePartModal,\n\tpatternTitleField,\n\ttemplateTitleField,\n\tBackButton,\n\tEntitiesSavedStatesExtensible,\n\tEditor,\n\tPluginPostExcerpt,\n\tPostCardPanel,\n\tPreferencesModal,\n\tusePostActions,\n\tusePostFields,\n\tToolsMoreMenuGroup,\n\tViewMoreMenuGroup,\n\tResizableEditor,\n\tregisterCoreBlockBindingsSources,\n\tgetTemplateInfo,\n\t// Global Styles\n\tGlobalStylesUIWrapper,\n\tGlobalStylesActionMenu,\n\tStyleBookPreview,\n\tuseGlobalStyles,\n\tuseStyle,\n\t// Block selection\n\tuseGenerateBlockPath,\n\tuseRestoreBlockFromPath,\n\t// This is a temporary private API while we're updating the site editor to use EditorProvider.\n\tinterfaceStore,\n\t...remainingInterfaceApis,\n} );\n"],
5
+ "mappings": ";AAGA;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,YAAY,mBAAmB;AAK/B,SAAS,YAAY;AACrB,SAAS,qCAAqC;AAC9C,OAAO,gBAAgB;AACvB,OAAO,YAAY;AACnB,OAAO,uBAAuB;AAC9B,OAAO,mBAAmB;AAC1B,OAAO,sBAAsB;AAC7B,SAAS,sBAAsB;AAC/B,OAAO,mBAAmB;AAC1B,OAAO,wBAAwB;AAC/B,OAAO,uBAAuB;AAC9B,OAAO,qBAAqB;AAC5B,SAAS,wCAAwC;AACjD,SAAS,uBAAuB;AAChC,OAAO,2BAA2B;AAClC,SAAS,wBAAwB;AACjC,SAAS,iBAAiB,gBAAgB;AAC1C,SAAS,8BAA8B;AACvC;AAAA,EACC;AAAA,EACA;AAAA,OACM;AAEP,IAAM,EAAE,OAAO,gBAAgB,GAAG,uBAAuB,IAAI;AAEtD,IAAM,cAAc,CAAC;AAC5B,KAAM,aAAa;AAAA,EAClB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA,EAEA;AAAA,EACA;AAAA;AAAA,EAEA;AAAA,EACA,GAAG;AACJ,CAAE;",
6
6
  "names": []
7
7
  }
package/build-style/style-rtl.css CHANGED
@@ -84,6 +84,10 @@
84
84
  /**
85
85
  * Reset the WP Admin page styles for Gutenberg-like pages.
86
86
  */
87
+ /**
88
+ * Creates a checkerboard pattern background to indicate transparency.
89
+ * @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
90
+ */
87
91
  :root {
88
92
  --wp-block-synced-color: #7a00df;
89
93
  --wp-block-synced-color--rgb: 122, 0, 223;
@@ -188,6 +192,10 @@
188
192
  /**
189
193
  * Reset the WP Admin page styles for Gutenberg-like pages.
190
194
  */
195
+ /**
196
+ * Creates a checkerboard pattern background to indicate transparency.
197
+ * @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
198
+ */
191
199
  .admin-ui-page {
192
200
  display: flex;
193
201
  height: 100%;
@@ -361,6 +369,10 @@
361
369
  /**
362
370
  * Reset the WP Admin page styles for Gutenberg-like pages.
363
371
  */
372
+ /**
373
+ * Creates a checkerboard pattern background to indicate transparency.
374
+ * @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
375
+ */
364
376
  .interface-complementary-area {
365
377
  background: #fff;
366
378
  color: #1e1e1e;
@@ -780,6 +792,10 @@ body.is-fullscreen-mode .interface-interface-skeleton {
780
792
  /**
781
793
  * Reset the WP Admin page styles for Gutenberg-like pages.
782
794
  */
795
+ /**
796
+ * Creates a checkerboard pattern background to indicate transparency.
797
+ * @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
798
+ */
783
799
  @media (min-width: 782px) {
784
800
  .font-library-modal.font-library-modal {
785
801
  width: 65vw;
@@ -1325,8 +1341,8 @@ button.font-library__upload-area {
1325
1341
  border: #ddd 1px solid;
1326
1342
  border-radius: 2px;
1327
1343
  overflow: auto;
1328
- background-image: repeating-linear-gradient(-45deg, #f5f5f5 25%, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 75%, #f5f5f5 0, #f5f5f5), repeating-linear-gradient(-45deg, #f5f5f5 25%, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 75%, #f5f5f5 0, #f5f5f5);
1329
- background-position: 100% 0, right 8px top 8px;
1344
+ background-image: repeating-linear-gradient(45deg, #e0e0e0 25%, transparent 25%, transparent 75%, #e0e0e0 75%, #e0e0e0), repeating-linear-gradient(45deg, #e0e0e0 25%, transparent 25%, transparent 75%, #e0e0e0 75%, #e0e0e0);
1345
+ background-position: 0 0, 8px 8px;
1330
1346
  background-size: 16px 16px;
1331
1347
  }
1332
1348
 
@@ -1464,6 +1480,209 @@ button.font-library__upload-area {
1464
1480
  padding: 16px;
1465
1481
  }
1466
1482
 
1483
+ /* -------------------------------------------
1484
+ * Autogenerated by ⛋ Terrazzo. DO NOT EDIT!
1485
+ * ------------------------------------------- */
1486
+ :root {
1487
+ --wpds-border-radius-surface-lg: 8px; /* Large radius for surfaces */
1488
+ --wpds-border-radius-surface-md: 4px; /* Medium radius for surfaces */
1489
+ --wpds-border-radius-surface-sm: 2px; /* Small radius for surfaces */
1490
+ --wpds-border-radius-surface-xs: 1px; /* Extra small radius for surfaces */
1491
+ --wpds-border-width-interactive-focus: 2px; /* Border width for focus ring */
1492
+ --wpds-border-width-surface-lg: 8px; /* Large width for surfaces */
1493
+ --wpds-border-width-surface-md: 4px; /* Medium width for surfaces */
1494
+ --wpds-border-width-surface-sm: 2px; /* Small width for surfaces */
1495
+ --wpds-border-width-surface-xs: 1px; /* Extra small width for surfaces */
1496
+ --wpds-color-bg-interactive-brand: #00000000; /* Background color for interactive elements with brand tone and normal emphasis. */
1497
+ --wpds-color-bg-interactive-brand-active: #f6f8fd; /* Background color for interactive elements with brand tone and normal emphasis that are hovered, focused, or active. */
1498
+ --wpds-color-bg-interactive-brand-disabled: #e2e2e2; /* Background color for interactive elements with brand tone and normal emphasis, in their disabled state. */
1499
+ --wpds-color-bg-interactive-brand-strong: #3858e9; /* Background color for interactive elements with brand tone and strong emphasis. */
1500
+ --wpds-color-bg-interactive-brand-strong-active: #2e49d9; /* Background color for interactive elements with brand tone and strong emphasis that are hovered, focused, or active. */
1501
+ --wpds-color-bg-interactive-brand-strong-disabled: #d2d2d2; /* Background color for interactive elements with brand tone and strong emphasis, in their disabled state. */
1502
+ --wpds-color-bg-interactive-brand-weak: #00000000; /* Background color for interactive elements with brand tone and weak emphasis. */
1503
+ --wpds-color-bg-interactive-brand-weak-active: #e6eaf4; /* Background color for interactive elements with brand tone and weak emphasis that are hovered, focused, or active. */
1504
+ --wpds-color-bg-interactive-brand-weak-disabled: #e2e2e2; /* Background color for interactive elements with brand tone and weak emphasis, in their disabled state. */
1505
+ --wpds-color-bg-interactive-error: #00000000; /* Background color for interactive elements with error tone and normal emphasis. */
1506
+ --wpds-color-bg-interactive-error-active: #fff6f4; /* Background color for interactive elements with error tone and normal emphasis that are hovered, focused, or active. */
1507
+ --wpds-color-bg-interactive-error-disabled: #e2e2e2; /* Background color for interactive elements with error tone and normal emphasis, in their disabled state. */
1508
+ --wpds-color-bg-interactive-error-strong: #cc1818; /* Background color for interactive elements with error tone and strong emphasis. */
1509
+ --wpds-color-bg-interactive-error-strong-active: #b90000; /* Background color for interactive elements with error tone and strong emphasis that are hovered, focused, or active. */
1510
+ --wpds-color-bg-interactive-error-strong-disabled: #d2d2d2; /* Background color for interactive elements with error tone and strong emphasis, in their disabled state. */
1511
+ --wpds-color-bg-interactive-error-weak: #00000000; /* Background color for interactive elements with error tone and weak emphasis. */
1512
+ --wpds-color-bg-interactive-error-weak-active: #f6e6e3; /* Background color for interactive elements with error tone and weak emphasis that are hovered, focused, or active. */
1513
+ --wpds-color-bg-interactive-error-weak-disabled: #e2e2e2; /* Background color for interactive elements with error tone and weak emphasis, in their disabled state. */
1514
+ --wpds-color-bg-interactive-neutral: #00000000; /* Background color for interactive elements with neutral tone and normal emphasis. */
1515
+ --wpds-color-bg-interactive-neutral-active: #eaeaea; /* Background color for interactive elements with neutral tone and normal emphasis that are hovered, focused, or active. */
1516
+ --wpds-color-bg-interactive-neutral-disabled: #e2e2e2; /* Background color for interactive elements with neutral tone and normal emphasis, in their disabled state. */
1517
+ --wpds-color-bg-interactive-neutral-strong: #2d2d2d; /* Background color for interactive elements with neutral tone and strong emphasis. */
1518
+ --wpds-color-bg-interactive-neutral-strong-active: #1e1e1e; /* Background color for interactive elements with neutral tone and strong emphasis that are hovered, focused, or active. */
1519
+ --wpds-color-bg-interactive-neutral-strong-disabled: #d2d2d2; /* Background color for interactive elements with neutral tone and strong emphasis, in their disabled state. */
1520
+ --wpds-color-bg-interactive-neutral-weak: #00000000; /* Background color for interactive elements with neutral tone and weak emphasis. */
1521
+ --wpds-color-bg-interactive-neutral-weak-active: #eaeaea; /* Background color for interactive elements with neutral tone and weak emphasis that are hovered, focused, or active. */
1522
+ --wpds-color-bg-interactive-neutral-weak-disabled: #e2e2e2; /* Background color for interactive elements with neutral tone and weak emphasis, in their disabled state. */
1523
+ --wpds-color-bg-surface-brand: #ecf0f9; /* Background color for surfaces with brand tone and normal emphasis. */
1524
+ --wpds-color-bg-surface-caution: #fee994; /* Background color for surfaces with caution tone and normal emphasis. */
1525
+ --wpds-color-bg-surface-caution-weak: #fff9c9; /* Background color for surfaces with caution tone and weak emphasis. */
1526
+ --wpds-color-bg-surface-error: #f6e6e3; /* Background color for surfaces with error tone and normal emphasis. */
1527
+ --wpds-color-bg-surface-error-weak: #fff6f4; /* Background color for surfaces with error tone and weak emphasis. */
1528
+ --wpds-color-bg-surface-info: #deebfa; /* Background color for surfaces with info tone and normal emphasis. */
1529
+ --wpds-color-bg-surface-info-weak: #f3f9ff; /* Background color for surfaces with info tone and weak emphasis. */
1530
+ --wpds-color-bg-surface-neutral: #f8f8f8; /* Background color for surfaces with normal emphasis. */
1531
+ --wpds-color-bg-surface-neutral-strong: #ffffff; /* Background color for surfaces with strong emphasis. */
1532
+ --wpds-color-bg-surface-neutral-weak: #f0f0f0; /* Background color for surfaces with weak emphasis. */
1533
+ --wpds-color-bg-surface-success: #c5f7cc; /* Background color for surfaces with success tone and normal emphasis. */
1534
+ --wpds-color-bg-surface-success-weak: #eaffed; /* Background color for surfaces with success tone and weak emphasis. */
1535
+ --wpds-color-bg-surface-warning: #fde6bd; /* Background color for surfaces with warning tone and normal emphasis. */
1536
+ --wpds-color-bg-surface-warning-weak: #fff7e0; /* Background color for surfaces with warning tone and weak emphasis. */
1537
+ --wpds-color-bg-thumb-brand: #3858e9; /* Background color for thumbs with a brand tone and normal emphasis (eg. slider thumb and filled track). */
1538
+ --wpds-color-bg-thumb-brand-active: #3858e9; /* Background color for thumbs with a brand tone and normal emphasis (eg. slider thumb and filled track) that are hovered, focused, or active. */
1539
+ --wpds-color-bg-thumb-brand-disabled: #d8d8d8; /* Background color for thumbs with a brand tone and normal emphasis (eg. slider thumb and filled track), in their disabled state. */
1540
+ --wpds-color-bg-thumb-neutral-weak: #8a8a8a; /* Background color for thumbs with a neutral tone and weak emphasis (eg. scrollbar thumb). */
1541
+ --wpds-color-bg-thumb-neutral-weak-active: #6c6c6c; /* Background color for thumbs with a neutral tone and weak emphasis (eg. scrollbar thumb) that are hovered, focused, or active. */
1542
+ --wpds-color-bg-track-neutral: #d8d8d8; /* Background color for tracks with a neutral tone and normal emphasis (eg. slider or progressbar track). */
1543
+ --wpds-color-bg-track-neutral-weak: #e0e0e0; /* Background color for tracks with a neutral tone and weak emphasis (eg. scrollbar track). */
1544
+ --wpds-color-fg-content-caution: #281d00; /* Foreground color for content like text with caution tone and normal emphasis. */
1545
+ --wpds-color-fg-content-caution-weak: #826a00; /* Foreground color for content like text with caution tone and weak emphasis. */
1546
+ --wpds-color-fg-content-error: #470000; /* Foreground color for content like text with error tone and normal emphasis. */
1547
+ --wpds-color-fg-content-error-weak: #cc1818; /* Foreground color for content like text with error tone and weak emphasis. */
1548
+ --wpds-color-fg-content-info: #001b4f; /* Foreground color for content like text with info tone and normal emphasis. */
1549
+ --wpds-color-fg-content-info-weak: #006bd7; /* Foreground color for content like text with info tone and weak emphasis. */
1550
+ --wpds-color-fg-content-neutral: #1e1e1e; /* Foreground color for content like text with normal emphasis. */
1551
+ --wpds-color-fg-content-neutral-weak: #6d6d6d; /* Foreground color for content like text with weak emphasis. */
1552
+ --wpds-color-fg-content-success: #002900; /* Foreground color for content like text with success tone and normal emphasis. */
1553
+ --wpds-color-fg-content-success-weak: #007f30; /* Foreground color for content like text with success tone and weak emphasis. */
1554
+ --wpds-color-fg-content-warning: #2e1900; /* Foreground color for content like text with warning tone and normal emphasis. */
1555
+ --wpds-color-fg-content-warning-weak: #926300; /* Foreground color for content like text with warning tone and weak emphasis. */
1556
+ --wpds-color-fg-interactive-brand: #3858e9; /* Foreground color for interactive elements with brand tone and normal emphasis. */
1557
+ --wpds-color-fg-interactive-brand-active: #3858e9; /* Foreground color for interactive elements with brand tone and normal emphasis that are hovered, focused, or active. */
1558
+ --wpds-color-fg-interactive-brand-disabled: #8a8a8a; /* Foreground color for interactive elements with brand tone and normal emphasis, in their disabled state. */
1559
+ --wpds-color-fg-interactive-brand-strong: #eff0f2; /* Foreground color for interactive elements with brand tone and strong emphasis. */
1560
+ --wpds-color-fg-interactive-brand-strong-active: #eff0f2; /* Foreground color for interactive elements with brand tone and strong emphasis that are hovered, focused, or active. */
1561
+ --wpds-color-fg-interactive-brand-strong-disabled: #6d6d6d; /* Foreground color for interactive elements with brand tone and strong emphasis, in their disabled state. */
1562
+ --wpds-color-fg-interactive-error: #cc1818; /* Foreground color for interactive elements with error tone and normal emphasis. */
1563
+ --wpds-color-fg-interactive-error-active: #cc1818; /* Foreground color for interactive elements with error tone and normal emphasis that are hovered, focused, or active. */
1564
+ --wpds-color-fg-interactive-error-disabled: #8a8a8a; /* Foreground color for interactive elements with error tone and normal emphasis, in their disabled state. */
1565
+ --wpds-color-fg-interactive-error-strong: #f2efef; /* Foreground color for interactive elements with error tone and strong emphasis. */
1566
+ --wpds-color-fg-interactive-error-strong-active: #f2efef; /* Foreground color for interactive elements with error tone and strong emphasis that are hovered, focused, or active. */
1567
+ --wpds-color-fg-interactive-error-strong-disabled: #6d6d6d; /* Foreground color for interactive elements with error tone and strong emphasis, in their disabled state. */
1568
+ --wpds-color-fg-interactive-neutral: #1e1e1e; /* Foreground color for interactive elements with neutral tone and normal emphasis. */
1569
+ --wpds-color-fg-interactive-neutral-active: #1e1e1e; /* Foreground color for interactive elements with neutral tone and normal emphasis that are hovered, focused, or active. */
1570
+ --wpds-color-fg-interactive-neutral-disabled: #8a8a8a; /* Foreground color for interactive elements with neutral tone and normal emphasis, in their disabled state. */
1571
+ --wpds-color-fg-interactive-neutral-strong: #f0f0f0; /* Foreground color for interactive elements with neutral tone and strong emphasis. */
1572
+ --wpds-color-fg-interactive-neutral-strong-active: #f0f0f0; /* Foreground color for interactive elements with neutral tone and strong emphasis that are hovered, focused, or active. */
1573
+ --wpds-color-fg-interactive-neutral-strong-disabled: #6d6d6d; /* Foreground color for interactive elements with neutral tone and strong emphasis, in their disabled state. */
1574
+ --wpds-color-fg-interactive-neutral-weak: #6d6d6d; /* Foreground color for interactive elements with neutral tone and weak emphasis. */
1575
+ --wpds-color-fg-interactive-neutral-weak-disabled: #8a8a8a; /* Foreground color for interactive elements with neutral tone and weak emphasis, in their disabled state. */
1576
+ --wpds-color-stroke-focus-brand: #3858e9; /* Accessible stroke color applied to focus rings. */
1577
+ --wpds-color-stroke-interactive-brand: #3858e9; /* Accessible stroke color used for interactive brand-toned elements with normal emphasis. */
1578
+ --wpds-color-stroke-interactive-brand-active: #2337c8; /* Accessible stroke color used for interactive brand-toned elements with normal emphasis that are hovered, focused, or active. */
1579
+ --wpds-color-stroke-interactive-error: #cc1818; /* Accessible stroke color used for interactive error-toned elements with normal emphasis. */
1580
+ --wpds-color-stroke-interactive-error-active: #9d0000; /* Accessible stroke color used for interactive error-toned elements with normal emphasis that are hovered, focused, or active. */
1581
+ --wpds-color-stroke-interactive-error-strong: #cc1818; /* Accessible stroke color used for interactive error-toned elements with strong emphasis. */
1582
+ --wpds-color-stroke-interactive-neutral: #8a8a8a; /* Accessible stroke color used for interactive neutrally-toned elements with normal emphasis. */
1583
+ --wpds-color-stroke-interactive-neutral-active: #6c6c6c; /* Accessible stroke color used for interactive neutrally-toned elements with normal emphasis that are hovered, focused, or active. */
1584
+ --wpds-color-stroke-interactive-neutral-disabled: #d8d8d8; /* Accessible stroke color used for interactive neutrally-toned elements with normal emphasis, in their disabled state. */
1585
+ --wpds-color-stroke-interactive-neutral-strong: #6c6c6c; /* Accessible stroke color used for interactive neutrally-toned elements with strong emphasis. */
1586
+ --wpds-color-stroke-surface-brand: #a3b1d4; /* Decorative stroke color used to define brand-toned surface boundaries with normal emphasis. */
1587
+ --wpds-color-stroke-surface-brand-strong: #3858e9; /* Decorative stroke color used to define brand-toned surface boundaries with strong emphasis. */
1588
+ --wpds-color-stroke-surface-error: #daa39b; /* Decorative stroke color used to define error-toned surface boundaries with normal emphasis. */
1589
+ --wpds-color-stroke-surface-error-strong: #cc1818; /* Decorative stroke color used to define error-toned surface boundaries with strong emphasis. */
1590
+ --wpds-color-stroke-surface-info: #9fbcdc; /* Decorative stroke color used to define info-toned surface boundaries with normal emphasis. */
1591
+ --wpds-color-stroke-surface-info-strong: #006bd7; /* Decorative stroke color used to define info-toned surface boundaries with strong emphasis. */
1592
+ --wpds-color-stroke-surface-neutral: #d8d8d8; /* Decorative stroke color used to define neutrally-toned surface boundaries with normal emphasis. */
1593
+ --wpds-color-stroke-surface-neutral-strong: #8a8a8a; /* Decorative stroke color used to define neutrally-toned surface boundaries with strong emphasis. */
1594
+ --wpds-color-stroke-surface-neutral-weak: #e0e0e0; /* Decorative stroke color used to define neutrally-toned surface boundaries with weak emphasis. */
1595
+ --wpds-color-stroke-surface-success: #8ac894; /* Decorative stroke color used to define success-toned surface boundaries with normal emphasis. */
1596
+ --wpds-color-stroke-surface-success-strong: #007f30; /* Decorative stroke color used to define success-toned surface boundaries with strong emphasis. */
1597
+ --wpds-color-stroke-surface-warning: #d0b381; /* Decorative stroke color used to define warning-toned surface boundaries with normal emphasis. */
1598
+ --wpds-color-stroke-surface-warning-strong: #926300; /* Decorative stroke color used to define warning-toned surface boundaries with strong emphasis. */
1599
+ --wpds-dimension-base: 4px; /* Base dimension unit */
1600
+ --wpds-dimension-gap-2xs: 4px; /* 2x extra small gap */
1601
+ --wpds-dimension-gap-lg: 24px; /* Large gap */
1602
+ --wpds-dimension-gap-md: 16px; /* Medium gap */
1603
+ --wpds-dimension-gap-sm: 12px; /* Small gap */
1604
+ --wpds-dimension-gap-xl: 40px; /* Extra large gap */
1605
+ --wpds-dimension-gap-xs: 8px; /* Extra small gap */
1606
+ --wpds-dimension-padding-surface-2xs: 4px; /* 2x extra small spacing for surfaces */
1607
+ --wpds-dimension-padding-surface-lg: 32px; /* Large spacing for surfaces */
1608
+ --wpds-dimension-padding-surface-md: 24px; /* Medium spacing for surfaces */
1609
+ --wpds-dimension-padding-surface-sm: 16px; /* Small spacing for surfaces */
1610
+ --wpds-dimension-padding-surface-xs: 8px; /* Extra small spacing for surfaces */
1611
+ --wpds-elevation-large: 0 5px 15px 0 #00000014, 0 15px 27px 0 #00000012,
1612
+ 0 30px 36px 0 #0000000a, 0 50px 43px 0 #00000005; /* For components that confirm decisions or handle necessary interruptions. Example: Modals. */
1613
+ --wpds-elevation-medium: 0 2px 3px 0 #0000000d, 0 4px 5px 0 #0000000a,
1614
+ 0 12px 12px 0 #00000008, 0 16px 16px 0 #00000005; /* For components that offer additional actions. Example: Menus, Command Palette */
1615
+ --wpds-elevation-small: 0 1px 2px 0 #0000000d, 0 2px 3px 0 #0000000a,
1616
+ 0 6px 6px 0 #00000008, 0 8px 8px 0 #00000005; /* For components that provide contextual feedback without being intrusive. Generally non-interruptive. Example: Tooltips, Snackbar. */
1617
+ --wpds-elevation-x-small: 0 1px 1px 0 #00000008, 0 1px 2px 0 #00000005,
1618
+ 0 3px 3px 0 #00000005, 0 4px 4px 0 #00000003; /* For sections and containers that group related content and controls, which may overlap other content. Example: Preview Frame. */
1619
+ --wpds-font-family-body: -apple-system, system-ui, "Segoe UI", "Roboto",
1620
+ "Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", sans-serif; /* Body font family */
1621
+ --wpds-font-family-heading: -apple-system, system-ui, "Segoe UI", "Roboto",
1622
+ "Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", sans-serif; /* Headings font family */
1623
+ --wpds-font-family-mono: "Menlo", "Consolas", monaco, monospace; /* Monospace font family */
1624
+ --wpds-font-line-height-2x-large: 40px; /* 2X large line height */
1625
+ --wpds-font-line-height-large: 28px; /* Large line height */
1626
+ --wpds-font-line-height-medium: 24px; /* Medium line height */
1627
+ --wpds-font-line-height-small: 20px; /* Small line height */
1628
+ --wpds-font-line-height-x-large: 32px; /* Extra large line height */
1629
+ --wpds-font-line-height-x-small: 16px; /* Extra small line height */
1630
+ --wpds-font-size-2x-large: 32px; /* 2X large font size */
1631
+ --wpds-font-size-large: 15px; /* Large font size */
1632
+ --wpds-font-size-medium: 13px; /* Medium font size */
1633
+ --wpds-font-size-small: 12px; /* Small font size */
1634
+ --wpds-font-size-x-large: 20px; /* Extra large font size */
1635
+ --wpds-font-size-x-small: 11px; /* Extra small font size */
1636
+ }
1637
+
1638
+ [data-wpds-theme-provider-id][data-wpds-density=default] {
1639
+ --wpds-dimension-base: 4px; /* Base dimension unit */
1640
+ --wpds-dimension-gap-2xs: 4px; /* 2x extra small gap */
1641
+ --wpds-dimension-gap-lg: 24px; /* Large gap */
1642
+ --wpds-dimension-gap-md: 16px; /* Medium gap */
1643
+ --wpds-dimension-gap-sm: 12px; /* Small gap */
1644
+ --wpds-dimension-gap-xl: 40px; /* Extra large gap */
1645
+ --wpds-dimension-gap-xs: 8px; /* Extra small gap */
1646
+ --wpds-dimension-padding-surface-2xs: 4px; /* 2x extra small spacing for surfaces */
1647
+ --wpds-dimension-padding-surface-lg: 32px; /* Large spacing for surfaces */
1648
+ --wpds-dimension-padding-surface-md: 24px; /* Medium spacing for surfaces */
1649
+ --wpds-dimension-padding-surface-sm: 16px; /* Small spacing for surfaces */
1650
+ --wpds-dimension-padding-surface-xs: 8px; /* Extra small spacing for surfaces */
1651
+ }
1652
+
1653
+ [data-wpds-theme-provider-id][data-wpds-density=compact] {
1654
+ --wpds-dimension-gap-2xs: 4px; /* 2x extra small gap */
1655
+ --wpds-dimension-gap-lg: 20px; /* Large gap */
1656
+ --wpds-dimension-gap-md: 12px; /* Medium gap */
1657
+ --wpds-dimension-gap-sm: 8px; /* Small gap */
1658
+ --wpds-dimension-gap-xl: 32px; /* Extra large gap */
1659
+ --wpds-dimension-gap-xs: 4px; /* Extra small gap */
1660
+ --wpds-dimension-padding-surface-2xs: 4px; /* 2x extra small spacing for surfaces */
1661
+ --wpds-dimension-padding-surface-lg: 24px; /* Large spacing for surfaces */
1662
+ --wpds-dimension-padding-surface-md: 20px; /* Medium spacing for surfaces */
1663
+ --wpds-dimension-padding-surface-sm: 12px; /* Small spacing for surfaces */
1664
+ --wpds-dimension-padding-surface-xs: 4px; /* Extra small spacing for surfaces */
1665
+ }
1666
+
1667
+ [data-wpds-theme-provider-id][data-wpds-density=comfortable] {
1668
+ --wpds-dimension-gap-2xs: 8px; /* 2x extra small gap */
1669
+ --wpds-dimension-gap-lg: 32px; /* Large gap */
1670
+ --wpds-dimension-gap-md: 20px; /* Medium gap */
1671
+ --wpds-dimension-gap-sm: 16px; /* Small gap */
1672
+ --wpds-dimension-gap-xl: 48px; /* Extra large gap */
1673
+ --wpds-dimension-gap-xs: 12px; /* Extra small gap */
1674
+ --wpds-dimension-padding-surface-2xs: 8px; /* 2x extra small spacing for surfaces */
1675
+ --wpds-dimension-padding-surface-lg: 40px; /* Large spacing for surfaces */
1676
+ --wpds-dimension-padding-surface-md: 32px; /* Medium spacing for surfaces */
1677
+ --wpds-dimension-padding-surface-sm: 20px; /* Small spacing for surfaces */
1678
+ --wpds-dimension-padding-surface-xs: 12px; /* Extra small spacing for surfaces */
1679
+ }
1680
+
1681
+ @media (min-resolution: 192dpi) {
1682
+ :root {
1683
+ --wpds-border-width-interactive-focus: 1.5px; /* Border width for focus ring */
1684
+ }
1685
+ }
1467
1686
  /**
1468
1687
  * Colors
1469
1688
  */
@@ -1549,6 +1768,10 @@ button.font-library__upload-area {
1549
1768
  /**
1550
1769
  * Reset the WP Admin page styles for Gutenberg-like pages.
1551
1770
  */
1771
+ /**
1772
+ * Creates a checkerboard pattern background to indicate transparency.
1773
+ * @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
1774
+ */
1552
1775
  .dataviews-wrapper,
1553
1776
  .dataviews-picker-wrapper {
1554
1777
  height: 100%;
@@ -2319,15 +2542,6 @@ button.font-library__upload-area {
2319
2542
  z-index: 1000001;
2320
2543
  }
2321
2544
 
2322
- .dataviews-picker-footer__bulk-selection {
2323
- align-self: flex-start;
2324
- height: 32px;
2325
- }
2326
-
2327
- .dataviews-picker-footer__actions {
2328
- align-self: flex-end;
2329
- }
2330
-
2331
2545
  .dataviews-selection-checkbox {
2332
2546
  --checkbox-input-size: 24px;
2333
2547
  }
@@ -3205,6 +3419,7 @@ div.dataviews-view-list {
3205
3419
  .dataviews-view-picker-grid .dataviews-view-picker-grid__media {
3206
3420
  width: 100%;
3207
3421
  aspect-ratio: 1/1;
3422
+ min-height: 0;
3208
3423
  background-color: #fff;
3209
3424
  border-radius: 4px;
3210
3425
  position: relative;
@@ -3539,6 +3754,15 @@ div.dataviews-view-list {
3539
3754
  justify-content: space-between;
3540
3755
  }
3541
3756
 
3757
+ .dataviews-picker-footer__bulk-selection {
3758
+ align-self: flex-start;
3759
+ height: 32px;
3760
+ }
3761
+
3762
+ .dataviews-picker-footer__actions {
3763
+ align-self: flex-end;
3764
+ }
3765
+
3542
3766
  .dataviews-controls__datetime {
3543
3767
  border: none;
3544
3768
  padding: 0;
@@ -3555,6 +3779,10 @@ div.dataviews-view-list {
3555
3779
  -webkit-appearance: none;
3556
3780
  }
3557
3781
 
3782
+ .dataviews-controls__date-range-inputs > * {
3783
+ min-width: 0;
3784
+ }
3785
+
3558
3786
  .dataviews-controls__date-preset {
3559
3787
  border: 1px solid #ddd;
3560
3788
  }
@@ -5086,6 +5314,9 @@ div.dataviews-view-list {
5086
5314
  .editor-post-featured-image__preview {
5087
5315
  height: auto !important;
5088
5316
  outline: 1px solid rgba(0, 0, 0, 0.1);
5317
+ background-image: repeating-linear-gradient(45deg, #e0e0e0 25%, transparent 25%, transparent 75%, #e0e0e0 75%, #e0e0e0), repeating-linear-gradient(45deg, #e0e0e0 25%, transparent 25%, transparent 75%, #e0e0e0 75%, #e0e0e0);
5318
+ background-position: 0 0, 12px 12px;
5319
+ background-size: 24px 24px;
5089
5320
  }
5090
5321
  .editor-post-featured-image__preview .editor-post-featured-image__preview-image {
5091
5322
  object-fit: cover;
package/build-style/style.css CHANGED
@@ -84,6 +84,10 @@
84
84
  /**
85
85
  * Reset the WP Admin page styles for Gutenberg-like pages.
86
86
  */
87
+ /**
88
+ * Creates a checkerboard pattern background to indicate transparency.
89
+ * @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
90
+ */
87
91
  :root {
88
92
  --wp-block-synced-color: #7a00df;
89
93
  --wp-block-synced-color--rgb: 122, 0, 223;
@@ -188,6 +192,10 @@
188
192
  /**
189
193
  * Reset the WP Admin page styles for Gutenberg-like pages.
190
194
  */
195
+ /**
196
+ * Creates a checkerboard pattern background to indicate transparency.
197
+ * @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
198
+ */
191
199
  .admin-ui-page {
192
200
  display: flex;
193
201
  height: 100%;
@@ -361,6 +369,10 @@
361
369
  /**
362
370
  * Reset the WP Admin page styles for Gutenberg-like pages.
363
371
  */
372
+ /**
373
+ * Creates a checkerboard pattern background to indicate transparency.
374
+ * @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
375
+ */
364
376
  .interface-complementary-area {
365
377
  background: #fff;
366
378
  color: #1e1e1e;
@@ -780,6 +792,10 @@ body.is-fullscreen-mode .interface-interface-skeleton {
780
792
  /**
781
793
  * Reset the WP Admin page styles for Gutenberg-like pages.
782
794
  */
795
+ /**
796
+ * Creates a checkerboard pattern background to indicate transparency.
797
+ * @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
798
+ */
783
799
  @media (min-width: 782px) {
784
800
  .font-library-modal.font-library-modal {
785
801
  width: 65vw;
@@ -1325,8 +1341,10 @@ button.font-library__upload-area {
1325
1341
  border: #ddd 1px solid;
1326
1342
  border-radius: 2px;
1327
1343
  overflow: auto;
1328
- background-image: repeating-linear-gradient(45deg, #f5f5f5 25%, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 75%, #f5f5f5 0, #f5f5f5), repeating-linear-gradient(45deg, #f5f5f5 25%, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 75%, #f5f5f5 0, #f5f5f5);
1344
+ /*rtl:begin:ignore*/
1345
+ background-image: repeating-linear-gradient(45deg, #e0e0e0 25%, transparent 25%, transparent 75%, #e0e0e0 75%, #e0e0e0), repeating-linear-gradient(45deg, #e0e0e0 25%, transparent 25%, transparent 75%, #e0e0e0 75%, #e0e0e0);
1329
1346
  background-position: 0 0, 8px 8px;
1347
+ /*rtl:end:ignore*/
1330
1348
  background-size: 16px 16px;
1331
1349
  }
1332
1350
 
@@ -1465,6 +1483,209 @@ button.font-library__upload-area {
1465
1483
  padding: 16px;
1466
1484
  }
1467
1485
 
1486
+ /* -------------------------------------------
1487
+ * Autogenerated by ⛋ Terrazzo. DO NOT EDIT!
1488
+ * ------------------------------------------- */
1489
+ :root {
1490
+ --wpds-border-radius-surface-lg: 8px; /* Large radius for surfaces */
1491
+ --wpds-border-radius-surface-md: 4px; /* Medium radius for surfaces */
1492
+ --wpds-border-radius-surface-sm: 2px; /* Small radius for surfaces */
1493
+ --wpds-border-radius-surface-xs: 1px; /* Extra small radius for surfaces */
1494
+ --wpds-border-width-interactive-focus: 2px; /* Border width for focus ring */
1495
+ --wpds-border-width-surface-lg: 8px; /* Large width for surfaces */
1496
+ --wpds-border-width-surface-md: 4px; /* Medium width for surfaces */
1497
+ --wpds-border-width-surface-sm: 2px; /* Small width for surfaces */
1498
+ --wpds-border-width-surface-xs: 1px; /* Extra small width for surfaces */
1499
+ --wpds-color-bg-interactive-brand: #00000000; /* Background color for interactive elements with brand tone and normal emphasis. */
1500
+ --wpds-color-bg-interactive-brand-active: #f6f8fd; /* Background color for interactive elements with brand tone and normal emphasis that are hovered, focused, or active. */
1501
+ --wpds-color-bg-interactive-brand-disabled: #e2e2e2; /* Background color for interactive elements with brand tone and normal emphasis, in their disabled state. */
1502
+ --wpds-color-bg-interactive-brand-strong: #3858e9; /* Background color for interactive elements with brand tone and strong emphasis. */
1503
+ --wpds-color-bg-interactive-brand-strong-active: #2e49d9; /* Background color for interactive elements with brand tone and strong emphasis that are hovered, focused, or active. */
1504
+ --wpds-color-bg-interactive-brand-strong-disabled: #d2d2d2; /* Background color for interactive elements with brand tone and strong emphasis, in their disabled state. */
1505
+ --wpds-color-bg-interactive-brand-weak: #00000000; /* Background color for interactive elements with brand tone and weak emphasis. */
1506
+ --wpds-color-bg-interactive-brand-weak-active: #e6eaf4; /* Background color for interactive elements with brand tone and weak emphasis that are hovered, focused, or active. */
1507
+ --wpds-color-bg-interactive-brand-weak-disabled: #e2e2e2; /* Background color for interactive elements with brand tone and weak emphasis, in their disabled state. */
1508
+ --wpds-color-bg-interactive-error: #00000000; /* Background color for interactive elements with error tone and normal emphasis. */
1509
+ --wpds-color-bg-interactive-error-active: #fff6f4; /* Background color for interactive elements with error tone and normal emphasis that are hovered, focused, or active. */
1510
+ --wpds-color-bg-interactive-error-disabled: #e2e2e2; /* Background color for interactive elements with error tone and normal emphasis, in their disabled state. */
1511
+ --wpds-color-bg-interactive-error-strong: #cc1818; /* Background color for interactive elements with error tone and strong emphasis. */
1512
+ --wpds-color-bg-interactive-error-strong-active: #b90000; /* Background color for interactive elements with error tone and strong emphasis that are hovered, focused, or active. */
1513
+ --wpds-color-bg-interactive-error-strong-disabled: #d2d2d2; /* Background color for interactive elements with error tone and strong emphasis, in their disabled state. */
1514
+ --wpds-color-bg-interactive-error-weak: #00000000; /* Background color for interactive elements with error tone and weak emphasis. */
1515
+ --wpds-color-bg-interactive-error-weak-active: #f6e6e3; /* Background color for interactive elements with error tone and weak emphasis that are hovered, focused, or active. */
1516
+ --wpds-color-bg-interactive-error-weak-disabled: #e2e2e2; /* Background color for interactive elements with error tone and weak emphasis, in their disabled state. */
1517
+ --wpds-color-bg-interactive-neutral: #00000000; /* Background color for interactive elements with neutral tone and normal emphasis. */
1518
+ --wpds-color-bg-interactive-neutral-active: #eaeaea; /* Background color for interactive elements with neutral tone and normal emphasis that are hovered, focused, or active. */
1519
+ --wpds-color-bg-interactive-neutral-disabled: #e2e2e2; /* Background color for interactive elements with neutral tone and normal emphasis, in their disabled state. */
1520
+ --wpds-color-bg-interactive-neutral-strong: #2d2d2d; /* Background color for interactive elements with neutral tone and strong emphasis. */
1521
+ --wpds-color-bg-interactive-neutral-strong-active: #1e1e1e; /* Background color for interactive elements with neutral tone and strong emphasis that are hovered, focused, or active. */
1522
+ --wpds-color-bg-interactive-neutral-strong-disabled: #d2d2d2; /* Background color for interactive elements with neutral tone and strong emphasis, in their disabled state. */
1523
+ --wpds-color-bg-interactive-neutral-weak: #00000000; /* Background color for interactive elements with neutral tone and weak emphasis. */
1524
+ --wpds-color-bg-interactive-neutral-weak-active: #eaeaea; /* Background color for interactive elements with neutral tone and weak emphasis that are hovered, focused, or active. */
1525
+ --wpds-color-bg-interactive-neutral-weak-disabled: #e2e2e2; /* Background color for interactive elements with neutral tone and weak emphasis, in their disabled state. */
1526
+ --wpds-color-bg-surface-brand: #ecf0f9; /* Background color for surfaces with brand tone and normal emphasis. */
1527
+ --wpds-color-bg-surface-caution: #fee994; /* Background color for surfaces with caution tone and normal emphasis. */
1528
+ --wpds-color-bg-surface-caution-weak: #fff9c9; /* Background color for surfaces with caution tone and weak emphasis. */
1529
+ --wpds-color-bg-surface-error: #f6e6e3; /* Background color for surfaces with error tone and normal emphasis. */
1530
+ --wpds-color-bg-surface-error-weak: #fff6f4; /* Background color for surfaces with error tone and weak emphasis. */
1531
+ --wpds-color-bg-surface-info: #deebfa; /* Background color for surfaces with info tone and normal emphasis. */
1532
+ --wpds-color-bg-surface-info-weak: #f3f9ff; /* Background color for surfaces with info tone and weak emphasis. */
1533
+ --wpds-color-bg-surface-neutral: #f8f8f8; /* Background color for surfaces with normal emphasis. */
1534
+ --wpds-color-bg-surface-neutral-strong: #ffffff; /* Background color for surfaces with strong emphasis. */
1535
+ --wpds-color-bg-surface-neutral-weak: #f0f0f0; /* Background color for surfaces with weak emphasis. */
1536
+ --wpds-color-bg-surface-success: #c5f7cc; /* Background color for surfaces with success tone and normal emphasis. */
1537
+ --wpds-color-bg-surface-success-weak: #eaffed; /* Background color for surfaces with success tone and weak emphasis. */
1538
+ --wpds-color-bg-surface-warning: #fde6bd; /* Background color for surfaces with warning tone and normal emphasis. */
1539
+ --wpds-color-bg-surface-warning-weak: #fff7e0; /* Background color for surfaces with warning tone and weak emphasis. */
1540
+ --wpds-color-bg-thumb-brand: #3858e9; /* Background color for thumbs with a brand tone and normal emphasis (eg. slider thumb and filled track). */
1541
+ --wpds-color-bg-thumb-brand-active: #3858e9; /* Background color for thumbs with a brand tone and normal emphasis (eg. slider thumb and filled track) that are hovered, focused, or active. */
1542
+ --wpds-color-bg-thumb-brand-disabled: #d8d8d8; /* Background color for thumbs with a brand tone and normal emphasis (eg. slider thumb and filled track), in their disabled state. */
1543
+ --wpds-color-bg-thumb-neutral-weak: #8a8a8a; /* Background color for thumbs with a neutral tone and weak emphasis (eg. scrollbar thumb). */
1544
+ --wpds-color-bg-thumb-neutral-weak-active: #6c6c6c; /* Background color for thumbs with a neutral tone and weak emphasis (eg. scrollbar thumb) that are hovered, focused, or active. */
1545
+ --wpds-color-bg-track-neutral: #d8d8d8; /* Background color for tracks with a neutral tone and normal emphasis (eg. slider or progressbar track). */
1546
+ --wpds-color-bg-track-neutral-weak: #e0e0e0; /* Background color for tracks with a neutral tone and weak emphasis (eg. scrollbar track). */
1547
+ --wpds-color-fg-content-caution: #281d00; /* Foreground color for content like text with caution tone and normal emphasis. */
1548
+ --wpds-color-fg-content-caution-weak: #826a00; /* Foreground color for content like text with caution tone and weak emphasis. */
1549
+ --wpds-color-fg-content-error: #470000; /* Foreground color for content like text with error tone and normal emphasis. */
1550
+ --wpds-color-fg-content-error-weak: #cc1818; /* Foreground color for content like text with error tone and weak emphasis. */
1551
+ --wpds-color-fg-content-info: #001b4f; /* Foreground color for content like text with info tone and normal emphasis. */
1552
+ --wpds-color-fg-content-info-weak: #006bd7; /* Foreground color for content like text with info tone and weak emphasis. */
1553
+ --wpds-color-fg-content-neutral: #1e1e1e; /* Foreground color for content like text with normal emphasis. */
1554
+ --wpds-color-fg-content-neutral-weak: #6d6d6d; /* Foreground color for content like text with weak emphasis. */
1555
+ --wpds-color-fg-content-success: #002900; /* Foreground color for content like text with success tone and normal emphasis. */
1556
+ --wpds-color-fg-content-success-weak: #007f30; /* Foreground color for content like text with success tone and weak emphasis. */
1557
+ --wpds-color-fg-content-warning: #2e1900; /* Foreground color for content like text with warning tone and normal emphasis. */
1558
+ --wpds-color-fg-content-warning-weak: #926300; /* Foreground color for content like text with warning tone and weak emphasis. */
1559
+ --wpds-color-fg-interactive-brand: #3858e9; /* Foreground color for interactive elements with brand tone and normal emphasis. */
1560
+ --wpds-color-fg-interactive-brand-active: #3858e9; /* Foreground color for interactive elements with brand tone and normal emphasis that are hovered, focused, or active. */
1561
+ --wpds-color-fg-interactive-brand-disabled: #8a8a8a; /* Foreground color for interactive elements with brand tone and normal emphasis, in their disabled state. */
1562
+ --wpds-color-fg-interactive-brand-strong: #eff0f2; /* Foreground color for interactive elements with brand tone and strong emphasis. */
1563
+ --wpds-color-fg-interactive-brand-strong-active: #eff0f2; /* Foreground color for interactive elements with brand tone and strong emphasis that are hovered, focused, or active. */
1564
+ --wpds-color-fg-interactive-brand-strong-disabled: #6d6d6d; /* Foreground color for interactive elements with brand tone and strong emphasis, in their disabled state. */
1565
+ --wpds-color-fg-interactive-error: #cc1818; /* Foreground color for interactive elements with error tone and normal emphasis. */
1566
+ --wpds-color-fg-interactive-error-active: #cc1818; /* Foreground color for interactive elements with error tone and normal emphasis that are hovered, focused, or active. */
1567
+ --wpds-color-fg-interactive-error-disabled: #8a8a8a; /* Foreground color for interactive elements with error tone and normal emphasis, in their disabled state. */
1568
+ --wpds-color-fg-interactive-error-strong: #f2efef; /* Foreground color for interactive elements with error tone and strong emphasis. */
1569
+ --wpds-color-fg-interactive-error-strong-active: #f2efef; /* Foreground color for interactive elements with error tone and strong emphasis that are hovered, focused, or active. */
1570
+ --wpds-color-fg-interactive-error-strong-disabled: #6d6d6d; /* Foreground color for interactive elements with error tone and strong emphasis, in their disabled state. */
1571
+ --wpds-color-fg-interactive-neutral: #1e1e1e; /* Foreground color for interactive elements with neutral tone and normal emphasis. */
1572
+ --wpds-color-fg-interactive-neutral-active: #1e1e1e; /* Foreground color for interactive elements with neutral tone and normal emphasis that are hovered, focused, or active. */
1573
+ --wpds-color-fg-interactive-neutral-disabled: #8a8a8a; /* Foreground color for interactive elements with neutral tone and normal emphasis, in their disabled state. */
1574
+ --wpds-color-fg-interactive-neutral-strong: #f0f0f0; /* Foreground color for interactive elements with neutral tone and strong emphasis. */
1575
+ --wpds-color-fg-interactive-neutral-strong-active: #f0f0f0; /* Foreground color for interactive elements with neutral tone and strong emphasis that are hovered, focused, or active. */
1576
+ --wpds-color-fg-interactive-neutral-strong-disabled: #6d6d6d; /* Foreground color for interactive elements with neutral tone and strong emphasis, in their disabled state. */
1577
+ --wpds-color-fg-interactive-neutral-weak: #6d6d6d; /* Foreground color for interactive elements with neutral tone and weak emphasis. */
1578
+ --wpds-color-fg-interactive-neutral-weak-disabled: #8a8a8a; /* Foreground color for interactive elements with neutral tone and weak emphasis, in their disabled state. */
1579
+ --wpds-color-stroke-focus-brand: #3858e9; /* Accessible stroke color applied to focus rings. */
1580
+ --wpds-color-stroke-interactive-brand: #3858e9; /* Accessible stroke color used for interactive brand-toned elements with normal emphasis. */
1581
+ --wpds-color-stroke-interactive-brand-active: #2337c8; /* Accessible stroke color used for interactive brand-toned elements with normal emphasis that are hovered, focused, or active. */
1582
+ --wpds-color-stroke-interactive-error: #cc1818; /* Accessible stroke color used for interactive error-toned elements with normal emphasis. */
1583
+ --wpds-color-stroke-interactive-error-active: #9d0000; /* Accessible stroke color used for interactive error-toned elements with normal emphasis that are hovered, focused, or active. */
1584
+ --wpds-color-stroke-interactive-error-strong: #cc1818; /* Accessible stroke color used for interactive error-toned elements with strong emphasis. */
1585
+ --wpds-color-stroke-interactive-neutral: #8a8a8a; /* Accessible stroke color used for interactive neutrally-toned elements with normal emphasis. */
1586
+ --wpds-color-stroke-interactive-neutral-active: #6c6c6c; /* Accessible stroke color used for interactive neutrally-toned elements with normal emphasis that are hovered, focused, or active. */
1587
+ --wpds-color-stroke-interactive-neutral-disabled: #d8d8d8; /* Accessible stroke color used for interactive neutrally-toned elements with normal emphasis, in their disabled state. */
1588
+ --wpds-color-stroke-interactive-neutral-strong: #6c6c6c; /* Accessible stroke color used for interactive neutrally-toned elements with strong emphasis. */
1589
+ --wpds-color-stroke-surface-brand: #a3b1d4; /* Decorative stroke color used to define brand-toned surface boundaries with normal emphasis. */
1590
+ --wpds-color-stroke-surface-brand-strong: #3858e9; /* Decorative stroke color used to define brand-toned surface boundaries with strong emphasis. */
1591
+ --wpds-color-stroke-surface-error: #daa39b; /* Decorative stroke color used to define error-toned surface boundaries with normal emphasis. */
1592
+ --wpds-color-stroke-surface-error-strong: #cc1818; /* Decorative stroke color used to define error-toned surface boundaries with strong emphasis. */
1593
+ --wpds-color-stroke-surface-info: #9fbcdc; /* Decorative stroke color used to define info-toned surface boundaries with normal emphasis. */
1594
+ --wpds-color-stroke-surface-info-strong: #006bd7; /* Decorative stroke color used to define info-toned surface boundaries with strong emphasis. */
1595
+ --wpds-color-stroke-surface-neutral: #d8d8d8; /* Decorative stroke color used to define neutrally-toned surface boundaries with normal emphasis. */
1596
+ --wpds-color-stroke-surface-neutral-strong: #8a8a8a; /* Decorative stroke color used to define neutrally-toned surface boundaries with strong emphasis. */
1597
+ --wpds-color-stroke-surface-neutral-weak: #e0e0e0; /* Decorative stroke color used to define neutrally-toned surface boundaries with weak emphasis. */
1598
+ --wpds-color-stroke-surface-success: #8ac894; /* Decorative stroke color used to define success-toned surface boundaries with normal emphasis. */
1599
+ --wpds-color-stroke-surface-success-strong: #007f30; /* Decorative stroke color used to define success-toned surface boundaries with strong emphasis. */
1600
+ --wpds-color-stroke-surface-warning: #d0b381; /* Decorative stroke color used to define warning-toned surface boundaries with normal emphasis. */
1601
+ --wpds-color-stroke-surface-warning-strong: #926300; /* Decorative stroke color used to define warning-toned surface boundaries with strong emphasis. */
1602
+ --wpds-dimension-base: 4px; /* Base dimension unit */
1603
+ --wpds-dimension-gap-2xs: 4px; /* 2x extra small gap */
1604
+ --wpds-dimension-gap-lg: 24px; /* Large gap */
1605
+ --wpds-dimension-gap-md: 16px; /* Medium gap */
1606
+ --wpds-dimension-gap-sm: 12px; /* Small gap */
1607
+ --wpds-dimension-gap-xl: 40px; /* Extra large gap */
1608
+ --wpds-dimension-gap-xs: 8px; /* Extra small gap */
1609
+ --wpds-dimension-padding-surface-2xs: 4px; /* 2x extra small spacing for surfaces */
1610
+ --wpds-dimension-padding-surface-lg: 32px; /* Large spacing for surfaces */
1611
+ --wpds-dimension-padding-surface-md: 24px; /* Medium spacing for surfaces */
1612
+ --wpds-dimension-padding-surface-sm: 16px; /* Small spacing for surfaces */
1613
+ --wpds-dimension-padding-surface-xs: 8px; /* Extra small spacing for surfaces */
1614
+ --wpds-elevation-large: 0 5px 15px 0 #00000014, 0 15px 27px 0 #00000012,
1615
+ 0 30px 36px 0 #0000000a, 0 50px 43px 0 #00000005; /* For components that confirm decisions or handle necessary interruptions. Example: Modals. */
1616
+ --wpds-elevation-medium: 0 2px 3px 0 #0000000d, 0 4px 5px 0 #0000000a,
1617
+ 0 12px 12px 0 #00000008, 0 16px 16px 0 #00000005; /* For components that offer additional actions. Example: Menus, Command Palette */
1618
+ --wpds-elevation-small: 0 1px 2px 0 #0000000d, 0 2px 3px 0 #0000000a,
1619
+ 0 6px 6px 0 #00000008, 0 8px 8px 0 #00000005; /* For components that provide contextual feedback without being intrusive. Generally non-interruptive. Example: Tooltips, Snackbar. */
1620
+ --wpds-elevation-x-small: 0 1px 1px 0 #00000008, 0 1px 2px 0 #00000005,
1621
+ 0 3px 3px 0 #00000005, 0 4px 4px 0 #00000003; /* For sections and containers that group related content and controls, which may overlap other content. Example: Preview Frame. */
1622
+ --wpds-font-family-body: -apple-system, system-ui, "Segoe UI", "Roboto",
1623
+ "Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", sans-serif; /* Body font family */
1624
+ --wpds-font-family-heading: -apple-system, system-ui, "Segoe UI", "Roboto",
1625
+ "Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", sans-serif; /* Headings font family */
1626
+ --wpds-font-family-mono: "Menlo", "Consolas", monaco, monospace; /* Monospace font family */
1627
+ --wpds-font-line-height-2x-large: 40px; /* 2X large line height */
1628
+ --wpds-font-line-height-large: 28px; /* Large line height */
1629
+ --wpds-font-line-height-medium: 24px; /* Medium line height */
1630
+ --wpds-font-line-height-small: 20px; /* Small line height */
1631
+ --wpds-font-line-height-x-large: 32px; /* Extra large line height */
1632
+ --wpds-font-line-height-x-small: 16px; /* Extra small line height */
1633
+ --wpds-font-size-2x-large: 32px; /* 2X large font size */
1634
+ --wpds-font-size-large: 15px; /* Large font size */
1635
+ --wpds-font-size-medium: 13px; /* Medium font size */
1636
+ --wpds-font-size-small: 12px; /* Small font size */
1637
+ --wpds-font-size-x-large: 20px; /* Extra large font size */
1638
+ --wpds-font-size-x-small: 11px; /* Extra small font size */
1639
+ }
1640
+
1641
+ [data-wpds-theme-provider-id][data-wpds-density=default] {
1642
+ --wpds-dimension-base: 4px; /* Base dimension unit */
1643
+ --wpds-dimension-gap-2xs: 4px; /* 2x extra small gap */
1644
+ --wpds-dimension-gap-lg: 24px; /* Large gap */
1645
+ --wpds-dimension-gap-md: 16px; /* Medium gap */
1646
+ --wpds-dimension-gap-sm: 12px; /* Small gap */
1647
+ --wpds-dimension-gap-xl: 40px; /* Extra large gap */
1648
+ --wpds-dimension-gap-xs: 8px; /* Extra small gap */
1649
+ --wpds-dimension-padding-surface-2xs: 4px; /* 2x extra small spacing for surfaces */
1650
+ --wpds-dimension-padding-surface-lg: 32px; /* Large spacing for surfaces */
1651
+ --wpds-dimension-padding-surface-md: 24px; /* Medium spacing for surfaces */
1652
+ --wpds-dimension-padding-surface-sm: 16px; /* Small spacing for surfaces */
1653
+ --wpds-dimension-padding-surface-xs: 8px; /* Extra small spacing for surfaces */
1654
+ }
1655
+
1656
+ [data-wpds-theme-provider-id][data-wpds-density=compact] {
1657
+ --wpds-dimension-gap-2xs: 4px; /* 2x extra small gap */
1658
+ --wpds-dimension-gap-lg: 20px; /* Large gap */
1659
+ --wpds-dimension-gap-md: 12px; /* Medium gap */
1660
+ --wpds-dimension-gap-sm: 8px; /* Small gap */
1661
+ --wpds-dimension-gap-xl: 32px; /* Extra large gap */
1662
+ --wpds-dimension-gap-xs: 4px; /* Extra small gap */
1663
+ --wpds-dimension-padding-surface-2xs: 4px; /* 2x extra small spacing for surfaces */
1664
+ --wpds-dimension-padding-surface-lg: 24px; /* Large spacing for surfaces */
1665
+ --wpds-dimension-padding-surface-md: 20px; /* Medium spacing for surfaces */
1666
+ --wpds-dimension-padding-surface-sm: 12px; /* Small spacing for surfaces */
1667
+ --wpds-dimension-padding-surface-xs: 4px; /* Extra small spacing for surfaces */
1668
+ }
1669
+
1670
+ [data-wpds-theme-provider-id][data-wpds-density=comfortable] {
1671
+ --wpds-dimension-gap-2xs: 8px; /* 2x extra small gap */
1672
+ --wpds-dimension-gap-lg: 32px; /* Large gap */
1673
+ --wpds-dimension-gap-md: 20px; /* Medium gap */
1674
+ --wpds-dimension-gap-sm: 16px; /* Small gap */
1675
+ --wpds-dimension-gap-xl: 48px; /* Extra large gap */
1676
+ --wpds-dimension-gap-xs: 12px; /* Extra small gap */
1677
+ --wpds-dimension-padding-surface-2xs: 8px; /* 2x extra small spacing for surfaces */
1678
+ --wpds-dimension-padding-surface-lg: 40px; /* Large spacing for surfaces */
1679
+ --wpds-dimension-padding-surface-md: 32px; /* Medium spacing for surfaces */
1680
+ --wpds-dimension-padding-surface-sm: 20px; /* Small spacing for surfaces */
1681
+ --wpds-dimension-padding-surface-xs: 12px; /* Extra small spacing for surfaces */
1682
+ }
1683
+
1684
+ @media (min-resolution: 192dpi) {
1685
+ :root {
1686
+ --wpds-border-width-interactive-focus: 1.5px; /* Border width for focus ring */
1687
+ }
1688
+ }
1468
1689
  /**
1469
1690
  * Colors
1470
1691
  */
@@ -1550,6 +1771,10 @@ button.font-library__upload-area {
1550
1771
  /**
1551
1772
  * Reset the WP Admin page styles for Gutenberg-like pages.
1552
1773
  */
1774
+ /**
1775
+ * Creates a checkerboard pattern background to indicate transparency.
1776
+ * @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
1777
+ */
1553
1778
  .dataviews-wrapper,
1554
1779
  .dataviews-picker-wrapper {
1555
1780
  height: 100%;
@@ -2320,15 +2545,6 @@ button.font-library__upload-area {
2320
2545
  z-index: 1000001;
2321
2546
  }
2322
2547
 
2323
- .dataviews-picker-footer__bulk-selection {
2324
- align-self: flex-start;
2325
- height: 32px;
2326
- }
2327
-
2328
- .dataviews-picker-footer__actions {
2329
- align-self: flex-end;
2330
- }
2331
-
2332
2548
  .dataviews-selection-checkbox {
2333
2549
  --checkbox-input-size: 24px;
2334
2550
  }
@@ -3206,6 +3422,7 @@ div.dataviews-view-list {
3206
3422
  .dataviews-view-picker-grid .dataviews-view-picker-grid__media {
3207
3423
  width: 100%;
3208
3424
  aspect-ratio: 1/1;
3425
+ min-height: 0;
3209
3426
  background-color: #fff;
3210
3427
  border-radius: 4px;
3211
3428
  position: relative;
@@ -3540,6 +3757,15 @@ div.dataviews-view-list {
3540
3757
  justify-content: space-between;
3541
3758
  }
3542
3759
 
3760
+ .dataviews-picker-footer__bulk-selection {
3761
+ align-self: flex-start;
3762
+ height: 32px;
3763
+ }
3764
+
3765
+ .dataviews-picker-footer__actions {
3766
+ align-self: flex-end;
3767
+ }
3768
+
3543
3769
  .dataviews-controls__datetime {
3544
3770
  border: none;
3545
3771
  padding: 0;
@@ -3556,6 +3782,10 @@ div.dataviews-view-list {
3556
3782
  -webkit-appearance: none;
3557
3783
  }
3558
3784
 
3785
+ .dataviews-controls__date-range-inputs > * {
3786
+ min-width: 0;
3787
+ }
3788
+
3559
3789
  .dataviews-controls__date-preset {
3560
3790
  border: 1px solid #ddd;
3561
3791
  }
@@ -5087,6 +5317,11 @@ div.dataviews-view-list {
5087
5317
  .editor-post-featured-image__preview {
5088
5318
  height: auto !important;
5089
5319
  outline: 1px solid rgba(0, 0, 0, 0.1);
5320
+ /*rtl:begin:ignore*/
5321
+ background-image: repeating-linear-gradient(45deg, #e0e0e0 25%, transparent 25%, transparent 75%, #e0e0e0 75%, #e0e0e0), repeating-linear-gradient(45deg, #e0e0e0 25%, transparent 25%, transparent 75%, #e0e0e0 75%, #e0e0e0);
5322
+ background-position: 0 0, 12px 12px;
5323
+ /*rtl:end:ignore*/
5324
+ background-size: 24px 24px;
5090
5325
  }
5091
5326
  .editor-post-featured-image__preview .editor-post-featured-image__preview-image {
5092
5327
  object-fit: cover;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wordpress/editor",
3
- "version": "14.36.1-next.738bb1424.0",
3
+ "version": "14.36.1-next.8fd3f8831.0",
4
4
  "description": "Enhanced block editor for WordPress posts.",
5
5
  "author": "The WordPress Contributors",
6
6
  "license": "GPL-2.0-or-later",
@@ -62,44 +62,44 @@
62
62
  ],
63
63
  "dependencies": {
64
64
  "@floating-ui/react-dom": "2.0.8",
65
- "@wordpress/a11y": "^4.36.1-next.738bb1424.0",
66
- "@wordpress/api-fetch": "^7.36.1-next.738bb1424.0",
67
- "@wordpress/base-styles": "^6.12.1-next.738bb1424.0",
68
- "@wordpress/blob": "^4.36.1-next.738bb1424.0",
69
- "@wordpress/block-editor": "^15.9.1-next.738bb1424.0",
70
- "@wordpress/blocks": "^15.9.1-next.738bb1424.0",
71
- "@wordpress/commands": "^1.36.1-next.738bb1424.0",
72
- "@wordpress/components": "^31.0.1-next.738bb1424.0",
73
- "@wordpress/compose": "^7.36.1-next.738bb1424.0",
74
- "@wordpress/core-data": "^7.36.1-next.738bb1424.0",
75
- "@wordpress/data": "^10.36.1-next.738bb1424.0",
76
- "@wordpress/dataviews": "^11.1.1-next.738bb1424.0",
77
- "@wordpress/date": "^5.36.1-next.738bb1424.0",
78
- "@wordpress/deprecated": "^4.36.1-next.738bb1424.0",
79
- "@wordpress/dom": "^4.36.1-next.738bb1424.0",
80
- "@wordpress/element": "^6.36.1-next.738bb1424.0",
81
- "@wordpress/fields": "^0.28.1-next.738bb1424.0",
82
- "@wordpress/global-styles-engine": "^1.3.1-next.738bb1424.0",
83
- "@wordpress/global-styles-ui": "^1.3.1-next.738bb1424.0",
84
- "@wordpress/hooks": "^4.36.1-next.738bb1424.0",
85
- "@wordpress/html-entities": "^4.36.1-next.738bb1424.0",
86
- "@wordpress/i18n": "^6.9.1-next.738bb1424.0",
87
- "@wordpress/icons": "^11.3.1-next.738bb1424.0",
88
- "@wordpress/interface": "^9.21.1-next.738bb1424.0",
89
- "@wordpress/keyboard-shortcuts": "^5.36.1-next.738bb1424.0",
90
- "@wordpress/keycodes": "^4.36.1-next.738bb1424.0",
91
- "@wordpress/media-utils": "^5.36.1-next.738bb1424.0",
92
- "@wordpress/notices": "^5.36.1-next.738bb1424.0",
93
- "@wordpress/patterns": "^2.36.1-next.738bb1424.0",
94
- "@wordpress/plugins": "^7.36.1-next.738bb1424.0",
95
- "@wordpress/preferences": "^4.36.1-next.738bb1424.0",
96
- "@wordpress/private-apis": "^1.36.1-next.738bb1424.0",
97
- "@wordpress/reusable-blocks": "^5.36.1-next.738bb1424.0",
98
- "@wordpress/rich-text": "^7.36.1-next.738bb1424.0",
99
- "@wordpress/server-side-render": "^6.12.1-next.738bb1424.0",
100
- "@wordpress/url": "^4.36.1-next.738bb1424.0",
101
- "@wordpress/warning": "^3.36.1-next.738bb1424.0",
102
- "@wordpress/wordcount": "^4.36.1-next.738bb1424.0",
65
+ "@wordpress/a11y": "^4.36.1-next.8fd3f8831.0",
66
+ "@wordpress/api-fetch": "^7.36.1-next.8fd3f8831.0",
67
+ "@wordpress/base-styles": "^6.12.1-next.8fd3f8831.0",
68
+ "@wordpress/blob": "^4.36.1-next.8fd3f8831.0",
69
+ "@wordpress/block-editor": "^15.9.1-next.8fd3f8831.0",
70
+ "@wordpress/blocks": "^15.9.1-next.8fd3f8831.0",
71
+ "@wordpress/commands": "^1.36.1-next.8fd3f8831.0",
72
+ "@wordpress/components": "^31.0.1-next.8fd3f8831.0",
73
+ "@wordpress/compose": "^7.36.1-next.8fd3f8831.0",
74
+ "@wordpress/core-data": "^7.36.1-next.8fd3f8831.0",
75
+ "@wordpress/data": "^10.36.1-next.8fd3f8831.0",
76
+ "@wordpress/dataviews": "^11.1.1-next.8fd3f8831.0",
77
+ "@wordpress/date": "^5.36.1-next.8fd3f8831.0",
78
+ "@wordpress/deprecated": "^4.36.1-next.8fd3f8831.0",
79
+ "@wordpress/dom": "^4.36.1-next.8fd3f8831.0",
80
+ "@wordpress/element": "^6.36.1-next.8fd3f8831.0",
81
+ "@wordpress/fields": "^0.28.1-next.8fd3f8831.0",
82
+ "@wordpress/global-styles-engine": "^1.3.1-next.8fd3f8831.0",
83
+ "@wordpress/global-styles-ui": "^1.3.1-next.8fd3f8831.0",
84
+ "@wordpress/hooks": "^4.36.1-next.8fd3f8831.0",
85
+ "@wordpress/html-entities": "^4.36.1-next.8fd3f8831.0",
86
+ "@wordpress/i18n": "^6.9.1-next.8fd3f8831.0",
87
+ "@wordpress/icons": "^11.3.1-next.8fd3f8831.0",
88
+ "@wordpress/interface": "^9.21.1-next.8fd3f8831.0",
89
+ "@wordpress/keyboard-shortcuts": "^5.36.1-next.8fd3f8831.0",
90
+ "@wordpress/keycodes": "^4.36.1-next.8fd3f8831.0",
91
+ "@wordpress/media-utils": "^5.36.1-next.8fd3f8831.0",
92
+ "@wordpress/notices": "^5.36.1-next.8fd3f8831.0",
93
+ "@wordpress/patterns": "^2.36.1-next.8fd3f8831.0",
94
+ "@wordpress/plugins": "^7.36.1-next.8fd3f8831.0",
95
+ "@wordpress/preferences": "^4.36.1-next.8fd3f8831.0",
96
+ "@wordpress/private-apis": "^1.36.1-next.8fd3f8831.0",
97
+ "@wordpress/reusable-blocks": "^5.36.1-next.8fd3f8831.0",
98
+ "@wordpress/rich-text": "^7.36.1-next.8fd3f8831.0",
99
+ "@wordpress/server-side-render": "^6.12.1-next.8fd3f8831.0",
100
+ "@wordpress/url": "^4.36.1-next.8fd3f8831.0",
101
+ "@wordpress/warning": "^3.36.1-next.8fd3f8831.0",
102
+ "@wordpress/wordcount": "^4.36.1-next.8fd3f8831.0",
103
103
  "change-case": "^4.1.2",
104
104
  "client-zip": "^2.4.5",
105
105
  "clsx": "^2.1.1",
@@ -117,5 +117,5 @@
117
117
  "publishConfig": {
118
118
  "access": "public"
119
119
  },
120
- "gitHead": "ab1b004c0d61c295aa34bc86ea07f979343983ce"
120
+ "gitHead": "e582b351bc4c4b8734bb087f63a3beec9875c3c7"
121
121
  }
package/src/components/post-featured-image/style.scss CHANGED
@@ -1,5 +1,6 @@
1
1
  @use "@wordpress/base-styles/colors" as *;
2
2
  @use "@wordpress/base-styles/variables" as *;
3
+ @use "@wordpress/base-styles/mixins" as *;
3
4
 
4
5
  .editor-post-featured-image {
5
6
  padding: 0;
@@ -65,6 +66,7 @@
65
66
  .editor-post-featured-image__preview {
66
67
  height: auto !important;
67
68
  outline: $border-width solid rgba($black, 0.1);
69
+ @include checkerboard-background( 12px );
68
70
 
69
71
  .editor-post-featured-image__preview-image {
70
72
  object-fit: cover;
package/src/private-apis.js CHANGED
@@ -1,6 +1,11 @@
1
1
  /**
2
2
  * WordPress dependencies
3
3
  */
4
+ import {
5
+ CreateTemplatePartModal,
6
+ patternTitleField,
7
+ templateTitleField,
8
+ } from '@wordpress/fields';
4
9
  import * as interfaceApis from '@wordpress/interface';
5
10
 
6
11
  /**
@@ -18,11 +23,6 @@ import usePostFields from './components/post-fields';
18
23
  import ToolsMoreMenuGroup from './components/more-menu/tools-more-menu-group';
19
24
  import ViewMoreMenuGroup from './components/more-menu/view-more-menu-group';
20
25
  import ResizableEditor from './components/resizable-editor';
21
- import {
22
- CreateTemplatePartModal,
23
- patternTitleField,
24
- templateTitleField,
25
- } from '@wordpress/fields';
26
26
  import { registerCoreBlockBindingsSources } from './bindings/api';
27
27
  import { getTemplateInfo } from './utils/get-template-info';
28
28
  import GlobalStylesUIWrapper from './components/global-styles';