@wordpress/block-library 9.38.1-next.v.0 → 9.39.0

package/build/tabs-menu-item/block.json

@@ -0,0 +1,98 @@
+{
+	"$schema": "https://schemas.wp.org/trunk/block.json",
+	"__experimental": true,
+	"apiVersion": 3,
+	"name": "core/tabs-menu-item",
+	"title": "Tab Menu Item",
+	"description": "A single tab button in the tabs menu. Used as a template for styling all tab buttons.",
+	"version": "1.0.0",
+	"category": "design",
+	"textdomain": "default",
+	"parent": [
+		"core/tabs-menu"
+	],
+	"usesContext": [
+		"core/tabs-menu-item-index",
+		"core/tabs-menu-item-id",
+		"core/tabs-menu-item-label",
+		"core/tabs-menu-item-clientId",
+		"core/tabs-list",
+		"core/tabs-activeTabIndex",
+		"core/tabs-editorActiveTabIndex"
+	],
+	"attributes": {
+		"activeBackgroundColor": {
+			"type": "string"
+		},
+		"customActiveBackgroundColor": {
+			"type": "string"
+		},
+		"activeTextColor": {
+			"type": "string"
+		},
+		"customActiveTextColor": {
+			"type": "string"
+		},
+		"hoverBackgroundColor": {
+			"type": "string"
+		},
+		"customHoverBackgroundColor": {
+			"type": "string"
+		},
+		"hoverTextColor": {
+			"type": "string"
+		},
+		"customHoverTextColor": {
+			"type": "string"
+		}
+	},
+	"supports": {
+		"html": false,
+		"reusable": false,
+		"lock": false,
+		"color": {
+			"background": true,
+			"text": true,
+			"__experimentalDefaultControls": {
+				"background": true,
+				"text": true
+			}
+		},
+		"shadow": true,
+		"typography": {
+			"fontSize": true,
+			"__experimentalFontFamily": true,
+			"textAlign": true,
+			"__experimentalDefaultControls": {
+				"fontSize": true
+			}
+		},
+		"layout": {
+			"default": {
+				"type": "flex",
+				"orientation": "vertical",
+				"flexWrap": "nowrap"
+			},
+			"allowVerticalAlignment": true,
+			"allowJustification": true,
+			"allowSwitching": false,
+			"allowOrientation": false,
+			"allowWrap": false
+		},
+		"spacing": {
+			"padding": true,
+			"__experimentalDefaultControls": {
+				"padding": true
+			}
+		},
+		"__experimentalBorder": {
+			"radius": true,
+			"color": true,
+			"width": true,
+			"style": true
+		}
+	},
+	"editorScript": "file:./index.js",
+	"editorStyle": "file:./editor.css",
+	"style": "file:./style-index.css"
+}

package/build/tabs-menu-item/controls.cjs

@@ -0,0 +1,247 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/block-library/src/tabs-menu-item/controls.js
+var controls_exports = {};
+__export(controls_exports, {
+  default: () => Controls
+});
+module.exports = __toCommonJS(controls_exports);
+var import_clsx = __toESM(require("clsx"));
+var import_i18n = require("@wordpress/i18n");
+var import_block_editor = require("@wordpress/block-editor");
+var import_components = require("@wordpress/components");
+var import_icons = require("@wordpress/icons");
+var import_data = require("@wordpress/data");
+var import_add_tab_toolbar_control = __toESM(require("../tab/add-tab-toolbar-control.cjs"));
+var import_remove_tab_toolbar_control = __toESM(require("../tab/remove-tab-toolbar-control.cjs"));
+var import_jsx_runtime = require("react/jsx-runtime");
+function TabBlockMover({
+  tabClientId,
+  tabIndex,
+  tabsCount,
+  tabsMenuClientId,
+  tabsClientId
+}) {
+  const {
+    moveBlocksUp,
+    moveBlocksDown,
+    updateBlockAttributes,
+    __unstableMarkNextChangeAsNotPersistent
+  } = (0, import_data.useDispatch)(import_block_editor.store);
+  const { tabPanelsClientId, orientation } = (0, import_data.useSelect)(
+    (select) => {
+      const { getBlockRootClientId, getBlockAttributes } = select(import_block_editor.store);
+      const tabsMenuAttributes = tabsMenuClientId ? getBlockAttributes(tabsMenuClientId) : null;
+      return {
+        tabPanelsClientId: getBlockRootClientId(tabClientId),
+        orientation: tabsMenuAttributes?.layout?.orientation || "horizontal"
+      };
+    },
+    [tabClientId, tabsMenuClientId]
+  );
+  const isFirst = tabIndex === 0;
+  const isLast = tabIndex === tabsCount - 1;
+  const isHorizontal = orientation === "horizontal";
+  let upIcon, downIcon, upLabel, downLabel;
+  if (isHorizontal) {
+    if ((0, import_i18n.isRTL)()) {
+      upIcon = import_icons.chevronRight;
+      downIcon = import_icons.chevronLeft;
+      upLabel = (0, import_i18n.__)("Move tab right");
+      downLabel = (0, import_i18n.__)("Move tab left");
+    } else {
+      upIcon = import_icons.chevronLeft;
+      downIcon = import_icons.chevronRight;
+      upLabel = (0, import_i18n.__)("Move tab left");
+      downLabel = (0, import_i18n.__)("Move tab right");
+    }
+  } else {
+    upIcon = import_icons.chevronUp;
+    downIcon = import_icons.chevronDown;
+    upLabel = (0, import_i18n.__)("Move tab up");
+    downLabel = (0, import_i18n.__)("Move tab down");
+  }
+  const handleMoveUp = () => {
+    moveBlocksUp([tabClientId], tabPanelsClientId);
+    if (tabsClientId) {
+      __unstableMarkNextChangeAsNotPersistent();
+      updateBlockAttributes(tabsClientId, {
+        editorActiveTabIndex: tabIndex - 1
+      });
+    }
+  };
+  const handleMoveDown = () => {
+    moveBlocksDown([tabClientId], tabPanelsClientId);
+    if (tabsClientId) {
+      __unstableMarkNextChangeAsNotPersistent();
+      updateBlockAttributes(tabsClientId, {
+        editorActiveTabIndex: tabIndex + 1
+      });
+    }
+  };
+  if (tabsCount <= 1) {
+    return null;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_block_editor.BlockControls, { group: "parent", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_components.ToolbarGroup,
+    {
+      className: (0, import_clsx.default)("block-editor-block-mover", {
+        "is-horizontal": isHorizontal
+      }),
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "block-editor-block-mover__move-button-container", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.ToolbarItem, { children: (itemProps) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_components.Button,
+          {
+            className: (0, import_clsx.default)(
+              "block-editor-block-mover-button",
+              "is-up-button"
+            ),
+            icon: upIcon,
+            label: upLabel,
+            disabled: isFirst,
+            accessibleWhenDisabled: true,
+            onClick: handleMoveUp,
+            __next40pxDefaultSize: true,
+            ...itemProps
+          }
+        ) }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.ToolbarItem, { children: (itemProps) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_components.Button,
+          {
+            className: (0, import_clsx.default)(
+              "block-editor-block-mover-button",
+              "is-down-button"
+            ),
+            icon: downIcon,
+            label: downLabel,
+            disabled: isLast,
+            accessibleWhenDisabled: true,
+            onClick: handleMoveDown,
+            __next40pxDefaultSize: true,
+            ...itemProps
+          }
+        ) })
+      ] })
+    }
+  ) });
+}
+function Controls({
+  attributes,
+  setAttributes,
+  clientId,
+  tabsClientId,
+  tabClientId,
+  tabIndex,
+  tabsCount,
+  tabsMenuClientId,
+  activeBackgroundColor,
+  setActiveBackgroundColor,
+  activeTextColor,
+  setActiveTextColor,
+  hoverBackgroundColor,
+  setHoverBackgroundColor,
+  hoverTextColor,
+  setHoverTextColor
+}) {
+  const {
+    customActiveBackgroundColor,
+    customActiveTextColor,
+    customHoverBackgroundColor,
+    customHoverTextColor
+  } = attributes;
+  const colorSettings = (0, import_block_editor.__experimentalUseMultipleOriginColorsAndGradients)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      TabBlockMover,
+      {
+        tabClientId,
+        tabIndex,
+        tabsCount,
+        tabsMenuClientId,
+        tabsClientId
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_add_tab_toolbar_control.default, { tabsClientId }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_remove_tab_toolbar_control.default, { tabsClientId }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_block_editor.InspectorControls, { group: "color", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_block_editor.__experimentalColorGradientSettingsDropdown,
+      {
+        settings: [
+          {
+            label: (0, import_i18n.__)("Active Background"),
+            colorValue: activeBackgroundColor?.color ?? customActiveBackgroundColor,
+            onColorChange: (value) => {
+              setActiveBackgroundColor(value);
+              setAttributes({
+                customActiveBackgroundColor: value
+              });
+            }
+          },
+          {
+            label: (0, import_i18n.__)("Active Text"),
+            colorValue: activeTextColor?.color ?? customActiveTextColor,
+            onColorChange: (value) => {
+              setActiveTextColor(value);
+              setAttributes({
+                customActiveTextColor: value
+              });
+            }
+          },
+          {
+            label: (0, import_i18n.__)("Hover Background"),
+            colorValue: hoverBackgroundColor?.color ?? customHoverBackgroundColor,
+            onColorChange: (value) => {
+              setHoverBackgroundColor(value);
+              setAttributes({
+                customHoverBackgroundColor: value
+              });
+            }
+          },
+          {
+            label: (0, import_i18n.__)("Hover Text"),
+            colorValue: hoverTextColor?.color ?? customHoverTextColor,
+            onColorChange: (value) => {
+              setHoverTextColor(value);
+              setAttributes({
+                customHoverTextColor: value
+              });
+            }
+          }
+        ],
+        panelId: clientId,
+        disableCustomColors: false,
+        __experimentalIsRenderedInSidebar: true,
+        __next40pxDefaultSize: true,
+        ...colorSettings
+      }
+    ) })
+  ] });
+}
+//# sourceMappingURL=controls.cjs.map

package/build/tabs-menu-item/controls.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/tabs-menu-item/controls.js"],
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __, isRTL } from '@wordpress/i18n';\nimport {\n\tBlockControls,\n\tInspectorControls,\n\tstore as blockEditorStore,\n\t__experimentalColorGradientSettingsDropdown as ColorGradientSettingsDropdown,\n\t__experimentalUseMultipleOriginColorsAndGradients as useMultipleOriginColorsAndGradients,\n} from '@wordpress/block-editor';\nimport { ToolbarGroup, ToolbarItem, Button } from '@wordpress/components';\nimport {\n\tchevronLeft,\n\tchevronRight,\n\tchevronUp,\n\tchevronDown,\n} from '@wordpress/icons';\nimport { useDispatch, useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport AddTabToolbarControl from '../tab/add-tab-toolbar-control';\nimport RemoveTabToolbarControl from '../tab/remove-tab-toolbar-control';\n\nfunction TabBlockMover( {\n\ttabClientId,\n\ttabIndex,\n\ttabsCount,\n\ttabsMenuClientId,\n\ttabsClientId,\n} ) {\n\tconst {\n\t\tmoveBlocksUp,\n\t\tmoveBlocksDown,\n\t\tupdateBlockAttributes,\n\t\t__unstableMarkNextChangeAsNotPersistent,\n\t} = useDispatch( blockEditorStore );\n\n\tconst { tabPanelsClientId, orientation } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlockRootClientId, getBlockAttributes } =\n\t\t\t\tselect( blockEditorStore );\n\t\t\t// Get orientation directly from the tabs-menu block's layout attribute.\n\t\t\t// This is more reliable than getBlockListSettings which is set asynchronously.\n\t\t\tconst tabsMenuAttributes = tabsMenuClientId\n\t\t\t\t? getBlockAttributes( tabsMenuClientId )\n\t\t\t\t: null;\n\t\t\treturn {\n\t\t\t\ttabPanelsClientId: getBlockRootClientId( tabClientId ),\n\t\t\t\torientation:\n\t\t\t\t\ttabsMenuAttributes?.layout?.orientation || 'horizontal',\n\t\t\t};\n\t\t},\n\t\t[ tabClientId, tabsMenuClientId ]\n\t);\n\n\tconst isFirst = tabIndex === 0;\n\tconst isLast = tabIndex === tabsCount - 1;\n\tconst isHorizontal = orientation === 'horizontal';\n\n\t// Icons and labels based on orientation (respects RTL for horizontal)\n\tlet upIcon, downIcon, upLabel, downLabel;\n\tif ( isHorizontal ) {\n\t\tif ( isRTL() ) {\n\t\t\tupIcon = chevronRight;\n\t\t\tdownIcon = chevronLeft;\n\t\t\tupLabel = __( 'Move tab right' );\n\t\t\tdownLabel = __( 'Move tab left' );\n\t\t} else {\n\t\t\tupIcon = chevronLeft;\n\t\t\tdownIcon = chevronRight;\n\t\t\tupLabel = __( 'Move tab left' );\n\t\t\tdownLabel = __( 'Move tab right' );\n\t\t}\n\t} else {\n\t\tupIcon = chevronUp;\n\t\tdownIcon = chevronDown;\n\t\tupLabel = __( 'Move tab up' );\n\t\tdownLabel = __( 'Move tab down' );\n\t}\n\n\t// Handle moving tab and updating active index to follow the moved tab\n\tconst handleMoveUp = () => {\n\t\tmoveBlocksUp( [ tabClientId ], tabPanelsClientId );\n\t\t// Update editorActiveTabIndex to follow the moved tab\n\t\tif ( tabsClientId ) {\n\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\tupdateBlockAttributes( tabsClientId, {\n\t\t\t\teditorActiveTabIndex: tabIndex - 1,\n\t\t\t} );\n\t\t}\n\t};\n\n\tconst handleMoveDown = () => {\n\t\tmoveBlocksDown( [ tabClientId ], tabPanelsClientId );\n\t\t// Update editorActiveTabIndex to follow the moved tab\n\t\tif ( tabsClientId ) {\n\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\tupdateBlockAttributes( tabsClientId, {\n\t\t\t\teditorActiveTabIndex: tabIndex + 1,\n\t\t\t} );\n\t\t}\n\t};\n\n\t// Don't render if only one tab\n\tif ( tabsCount <= 1 ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<BlockControls group=\"parent\">\n\t\t\t<ToolbarGroup\n\t\t\t\tclassName={ clsx( 'block-editor-block-mover', {\n\t\t\t\t\t'is-horizontal': isHorizontal,\n\t\t\t\t} ) }\n\t\t\t>\n\t\t\t\t<div className=\"block-editor-block-mover__move-button-container\">\n\t\t\t\t\t<ToolbarItem>\n\t\t\t\t\t\t{ ( itemProps ) => (\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t\t'block-editor-block-mover-button',\n\t\t\t\t\t\t\t\t\t'is-up-button'\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\ticon={ upIcon }\n\t\t\t\t\t\t\t\tlabel={ upLabel }\n\t\t\t\t\t\t\t\tdisabled={ isFirst }\n\t\t\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t\t\tonClick={ handleMoveUp }\n\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t{ ...itemProps }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</ToolbarItem>\n\t\t\t\t\t<ToolbarItem>\n\t\t\t\t\t\t{ ( itemProps ) => (\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t\t'block-editor-block-mover-button',\n\t\t\t\t\t\t\t\t\t'is-down-button'\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\ticon={ downIcon }\n\t\t\t\t\t\t\t\tlabel={ downLabel }\n\t\t\t\t\t\t\t\tdisabled={ isLast }\n\t\t\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t\t\tonClick={ handleMoveDown }\n\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t{ ...itemProps }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</ToolbarItem>\n\t\t\t\t</div>\n\t\t\t</ToolbarGroup>\n\t\t</BlockControls>\n\t);\n}\n\nexport default function Controls( {\n\tattributes,\n\tsetAttributes,\n\tclientId,\n\ttabsClientId,\n\ttabClientId,\n\ttabIndex,\n\ttabsCount,\n\ttabsMenuClientId,\n\tactiveBackgroundColor,\n\tsetActiveBackgroundColor,\n\tactiveTextColor,\n\tsetActiveTextColor,\n\thoverBackgroundColor,\n\tsetHoverBackgroundColor,\n\thoverTextColor,\n\tsetHoverTextColor,\n} ) {\n\tconst {\n\t\tcustomActiveBackgroundColor,\n\t\tcustomActiveTextColor,\n\t\tcustomHoverBackgroundColor,\n\t\tcustomHoverTextColor,\n\t} = attributes;\n\n\tconst colorSettings = useMultipleOriginColorsAndGradients();\n\n\treturn (\n\t\t<>\n\t\t\t<TabBlockMover\n\t\t\t\ttabClientId={ tabClientId }\n\t\t\t\ttabIndex={ tabIndex }\n\t\t\t\ttabsCount={ tabsCount }\n\t\t\t\ttabsMenuClientId={ tabsMenuClientId }\n\t\t\t\ttabsClientId={ tabsClientId }\n\t\t\t/>\n\t\t\t<AddTabToolbarControl tabsClientId={ tabsClientId } />\n\t\t\t<RemoveTabToolbarControl tabsClientId={ tabsClientId } />\n\t\t\t<InspectorControls group=\"color\">\n\t\t\t\t<ColorGradientSettingsDropdown\n\t\t\t\t\tsettings={ [\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tlabel: __( 'Active Background' ),\n\t\t\t\t\t\t\tcolorValue:\n\t\t\t\t\t\t\t\tactiveBackgroundColor?.color ??\n\t\t\t\t\t\t\t\tcustomActiveBackgroundColor,\n\t\t\t\t\t\t\tonColorChange: ( value ) => {\n\t\t\t\t\t\t\t\tsetActiveBackgroundColor( value );\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tcustomActiveBackgroundColor: value,\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\t{\n\t\t\t\t\t\t\tlabel: __( 'Active Text' ),\n\t\t\t\t\t\t\tcolorValue:\n\t\t\t\t\t\t\t\tactiveTextColor?.color ?? customActiveTextColor,\n\t\t\t\t\t\t\tonColorChange: ( value ) => {\n\t\t\t\t\t\t\t\tsetActiveTextColor( value );\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tcustomActiveTextColor: value,\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\t{\n\t\t\t\t\t\t\tlabel: __( 'Hover Background' ),\n\t\t\t\t\t\t\tcolorValue:\n\t\t\t\t\t\t\t\thoverBackgroundColor?.color ??\n\t\t\t\t\t\t\t\tcustomHoverBackgroundColor,\n\t\t\t\t\t\t\tonColorChange: ( value ) => {\n\t\t\t\t\t\t\t\tsetHoverBackgroundColor( value );\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tcustomHoverBackgroundColor: value,\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\t{\n\t\t\t\t\t\t\tlabel: __( 'Hover Text' ),\n\t\t\t\t\t\t\tcolorValue:\n\t\t\t\t\t\t\t\thoverTextColor?.color ?? customHoverTextColor,\n\t\t\t\t\t\t\tonColorChange: ( value ) => {\n\t\t\t\t\t\t\t\tsetHoverTextColor( value );\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tcustomHoverTextColor: value,\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] }\n\t\t\t\t\tpanelId={ clientId }\n\t\t\t\t\tdisableCustomColors={ false }\n\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t{ ...colorSettings }\n\t\t\t\t/>\n\t\t\t</InspectorControls>\n\t\t</>\n\t);\n}\n"],
+  "mappings": "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",
+  "names": ["blockEditorStore", "clsx", "useMultipleOriginColorsAndGradients", "AddTabToolbarControl", "RemoveTabToolbarControl", "ColorGradientSettingsDropdown"]
+}

package/build/tabs-menu-item/edit.cjs

@@ -0,0 +1,272 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/block-library/src/tabs-menu-item/edit.js
+var edit_exports = {};
+__export(edit_exports, {
+  default: () => edit_default
+});
+module.exports = __toCommonJS(edit_exports);
+var import_clsx = __toESM(require("clsx"));
+var import_i18n = require("@wordpress/i18n");
+var import_block_editor = require("@wordpress/block-editor");
+var import_data = require("@wordpress/data");
+var import_html_entities = require("@wordpress/html-entities");
+var import_element = require("@wordpress/element");
+var import_slug_from_label = __toESM(require("../tab/slug-from-label.cjs"));
+var import_controls = __toESM(require("./controls.cjs"));
+var import_jsx_runtime = require("react/jsx-runtime");
+var { requestAnimationFrame, cancelAnimationFrame } = window;
+function StaticLabel({ label, index }) {
+  if (label) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_element.RawHTML, { children: (0, import_html_entities.decodeEntities)(label) }) });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: (0, import_i18n.sprintf)(
+    /* translators: %d is the tab index + 1 */
+    (0, import_i18n.__)("Tab %d"),
+    index + 1
+  ) });
+}
+function Edit({
+  attributes,
+  setAttributes,
+  context,
+  clientId,
+  activeBackgroundColor,
+  setActiveBackgroundColor,
+  activeTextColor,
+  setActiveTextColor,
+  hoverBackgroundColor,
+  setHoverBackgroundColor,
+  hoverTextColor,
+  setHoverTextColor,
+  __unstableLayoutClassNames: layoutClassNames
+}) {
+  const tabIndex = context["core/tabs-menu-item-index"] ?? 0;
+  const tabId = context["core/tabs-menu-item-id"] ?? "";
+  const tabLabel = context["core/tabs-menu-item-label"] ?? "";
+  const tabClientId = context["core/tabs-menu-item-clientId"] ?? "";
+  const contextTabsList = context["core/tabs-list"];
+  const tabsList = (0, import_element.useMemo)(
+    () => contextTabsList || [],
+    [contextTabsList]
+  );
+  const activeTabIndex = context["core/tabs-activeTabIndex"] ?? 0;
+  const editorActiveTabIndex = context["core/tabs-editorActiveTabIndex"];
+  const effectiveActiveIndex = (0, import_element.useMemo)(() => {
+    return editorActiveTabIndex ?? activeTabIndex;
+  }, [editorActiveTabIndex, activeTabIndex]);
+  const isActiveTab = tabIndex === effectiveActiveIndex;
+  const { __unstableMarkNextChangeAsNotPersistent } = (0, import_data.useDispatch)(import_block_editor.store);
+  const focusRef = (0, import_element.useRef)();
+  const labelElementRef = (0, import_element.useRef)(null);
+  const [isEditing, setIsEditing] = (0, import_element.useState)(false);
+  const [editingLabel, setEditingLabel] = (0, import_element.useState)("");
+  const { tabsClientId, tabsMenuClientId, selectedTabClientId } = (0, import_data.useSelect)(
+    (select) => {
+      const {
+        getBlockRootClientId,
+        getSelectedBlockClientIds,
+        hasSelectedInnerBlock
+      } = select(import_block_editor.store);
+      const _tabsMenuClientId = getBlockRootClientId(clientId);
+      const _tabsClientId = _tabsMenuClientId ? getBlockRootClientId(_tabsMenuClientId) : null;
+      const selectedIds = getSelectedBlockClientIds();
+      let selectedTab = null;
+      for (const tab of tabsList) {
+        if (selectedIds.includes(tab.clientId) || hasSelectedInnerBlock(tab.clientId, true)) {
+          selectedTab = tab.clientId;
+          break;
+        }
+      }
+      return {
+        tabsClientId: _tabsClientId,
+        tabsMenuClientId: _tabsMenuClientId,
+        selectedTabClientId: selectedTab
+      };
+    },
+    [clientId, tabsList]
+  );
+  const isSelectedTab = tabClientId === selectedTabClientId;
+  const { updateBlockAttributes } = (0, import_data.useDispatch)(import_block_editor.store);
+  const handleLabelChange = (0, import_element.useCallback)(
+    (newLabel) => {
+      if (tabClientId) {
+        updateBlockAttributes(tabClientId, {
+          label: newLabel,
+          anchor: (0, import_slug_from_label.default)(newLabel, tabIndex)
+        });
+      }
+    },
+    [updateBlockAttributes, tabClientId, tabIndex]
+  );
+  const handleTabClick = (0, import_element.useCallback)(
+    (event) => {
+      event.preventDefault();
+      if (tabsClientId && tabIndex !== effectiveActiveIndex) {
+        __unstableMarkNextChangeAsNotPersistent();
+        updateBlockAttributes(tabsClientId, {
+          editorActiveTabIndex: tabIndex
+        });
+      }
+      if (isEditing) {
+      }
+    },
+    [
+      isEditing,
+      tabsClientId,
+      tabIndex,
+      effectiveActiveIndex,
+      updateBlockAttributes,
+      __unstableMarkNextChangeAsNotPersistent
+    ]
+  );
+  const labelRef = (0, import_element.useCallback)(
+    (node) => {
+      labelElementRef.current = node;
+      if (node && isEditing) {
+        const animationId = requestAnimationFrame(() => {
+          if (node) {
+            node.focus();
+          }
+        });
+        focusRef.current = animationId;
+      }
+    },
+    [isEditing]
+  );
+  (0, import_element.useEffect)(() => {
+    return () => {
+      if (focusRef.current) {
+        cancelAnimationFrame(focusRef.current);
+      }
+    };
+  }, []);
+  const customColorStyles = (0, import_element.useMemo)(() => {
+    const styles = {};
+    const activeBg = activeBackgroundColor?.color || attributes.customActiveBackgroundColor;
+    const activeText = activeTextColor?.color || attributes.customActiveTextColor;
+    const hoverBg = hoverBackgroundColor?.color || attributes.customHoverBackgroundColor;
+    const hoverText = hoverTextColor?.color || attributes.customHoverTextColor;
+    if (activeBg) {
+      styles["--custom-tab-active-color"] = activeBg;
+    }
+    if (activeText) {
+      styles["--custom-tab-active-text-color"] = activeText;
+    }
+    if (hoverBg) {
+      styles["--custom-tab-hover-color"] = hoverBg;
+    }
+    if (hoverText) {
+      styles["--custom-tab-hover-text-color"] = hoverText;
+    }
+    return styles;
+  }, [
+    activeBackgroundColor?.color,
+    attributes.customActiveBackgroundColor,
+    activeTextColor?.color,
+    attributes.customActiveTextColor,
+    hoverBackgroundColor?.color,
+    attributes.customHoverBackgroundColor,
+    hoverTextColor?.color,
+    attributes.customHoverTextColor
+  ]);
+  const tabPanelId = tabId || `tab-${tabIndex}`;
+  const tabLabelId = `${tabPanelId}--tab`;
+  const blockProps = (0, import_block_editor.useBlockProps)({
+    className: (0, import_clsx.default)(layoutClassNames, {
+      "is-active": isActiveTab,
+      "is-selected": isSelectedTab
+    }),
+    style: customColorStyles,
+    "aria-controls": tabPanelId,
+    "aria-selected": isActiveTab,
+    id: tabLabelId,
+    role: "tab",
+    tabIndex: isActiveTab ? 0 : -1,
+    onClick: handleTabClick,
+    onDoubleClick: () => {
+      setIsEditing(true);
+      setEditingLabel(tabLabel || "");
+    }
+  });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_controls.default,
+      {
+        ...{
+          attributes,
+          setAttributes,
+          clientId,
+          tabsClientId,
+          tabClientId,
+          tabIndex,
+          tabsCount: tabsList.length,
+          tabsMenuClientId,
+          activeBackgroundColor,
+          setActiveBackgroundColor,
+          activeTextColor,
+          setActiveTextColor,
+          hoverBackgroundColor,
+          setHoverBackgroundColor,
+          hoverTextColor,
+          setHoverTextColor
+        }
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { ...blockProps, children: isEditing ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_block_editor.RichText,
+      {
+        ref: labelRef,
+        tagName: "span",
+        withoutInteractiveFormatting: true,
+        placeholder: (0, import_i18n.sprintf)(
+          /* translators: %d is the tab index + 1 */
+          (0, import_i18n.__)("Tab %d\u2026"),
+          tabIndex + 1
+        ),
+        value: (0, import_html_entities.decodeEntities)(editingLabel),
+        onChange: (value) => {
+          setEditingLabel(value);
+          handleLabelChange(value);
+        },
+        onBlur: () => {
+          setIsEditing(false);
+        }
+      }
+    ) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StaticLabel, { label: tabLabel, index: tabIndex }) })
+  ] });
+}
+var edit_default = (0, import_block_editor.withColors)(
+  "activeBackgroundColor",
+  "activeTextColor",
+  "hoverBackgroundColor",
+  "hoverTextColor"
+)(Edit);
+//# sourceMappingURL=edit.cjs.map

package/build/tabs-menu-item/edit.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/tabs-menu-item/edit.js"],
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport {\n\tuseBlockProps,\n\twithColors,\n\tstore as blockEditorStore,\n\tRichText,\n} from '@wordpress/block-editor';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { decodeEntities } from '@wordpress/html-entities';\nimport {\n\tRawHTML,\n\tuseRef,\n\tuseCallback,\n\tuseState,\n\tuseEffect,\n\tuseMemo,\n} from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport slugFromLabel from '../tab/slug-from-label';\nimport Controls from './controls';\n\nconst { requestAnimationFrame, cancelAnimationFrame } = window;\n\nfunction StaticLabel( { label, index } ) {\n\tif ( label ) {\n\t\treturn (\n\t\t\t<span>\n\t\t\t\t<RawHTML>{ decodeEntities( label ) }</RawHTML>\n\t\t\t</span>\n\t\t);\n\t}\n\treturn (\n\t\t<span>\n\t\t\t{ sprintf(\n\t\t\t\t/* translators: %d is the tab index + 1 */\n\t\t\t\t__( 'Tab %d' ),\n\t\t\t\tindex + 1\n\t\t\t) }\n\t\t</span>\n\t);\n}\n\nfunction Edit( {\n\tattributes,\n\tsetAttributes,\n\tcontext,\n\tclientId,\n\tactiveBackgroundColor,\n\tsetActiveBackgroundColor,\n\tactiveTextColor,\n\tsetActiveTextColor,\n\thoverBackgroundColor,\n\tsetHoverBackgroundColor,\n\thoverTextColor,\n\tsetHoverTextColor,\n\t__unstableLayoutClassNames: layoutClassNames,\n} ) {\n\t// Context from tabs-menu (per-item context via BlockContextProvider)\n\tconst tabIndex = context[ 'core/tabs-menu-item-index' ] ?? 0;\n\tconst tabId = context[ 'core/tabs-menu-item-id' ] ?? '';\n\tconst tabLabel = context[ 'core/tabs-menu-item-label' ] ?? '';\n\tconst tabClientId = context[ 'core/tabs-menu-item-clientId' ] ?? '';\n\n\t// Context from parent tabs block, memoized to prevent unnecessary re-renders.\n\tconst contextTabsList = context[ 'core/tabs-list' ];\n\tconst tabsList = useMemo(\n\t\t() => contextTabsList || [],\n\t\t[ contextTabsList ]\n\t);\n\tconst activeTabIndex = context[ 'core/tabs-activeTabIndex' ] ?? 0;\n\tconst editorActiveTabIndex = context[ 'core/tabs-editorActiveTabIndex' ];\n\n\t// Memoize effectiveActiveIndex to ensure it updates when context changes\n\tconst effectiveActiveIndex = useMemo( () => {\n\t\treturn editorActiveTabIndex ?? activeTabIndex;\n\t}, [ editorActiveTabIndex, activeTabIndex ] );\n\n\tconst isActiveTab = tabIndex === effectiveActiveIndex;\n\n\tconst { __unstableMarkNextChangeAsNotPersistent } =\n\t\tuseDispatch( blockEditorStore );\n\tconst focusRef = useRef();\n\tconst labelElementRef = useRef( null );\n\tconst [ isEditing, setIsEditing ] = useState( false );\n\tconst [ editingLabel, setEditingLabel ] = useState( '' );\n\n\t// Get parent tabs clientId for updating editorActiveTabIndex\n\tconst { tabsClientId, tabsMenuClientId, selectedTabClientId } = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetBlockRootClientId,\n\t\t\t\tgetSelectedBlockClientIds,\n\t\t\t\thasSelectedInnerBlock,\n\t\t\t} = select( blockEditorStore );\n\t\t\t// tabs-menu-item -> tabs-menu -> tabs\n\t\t\tconst _tabsMenuClientId = getBlockRootClientId( clientId );\n\t\t\tconst _tabsClientId = _tabsMenuClientId\n\t\t\t\t? getBlockRootClientId( _tabsMenuClientId )\n\t\t\t\t: null;\n\n\t\t\tconst selectedIds = getSelectedBlockClientIds();\n\n\t\t\t// Find if any tab is selected\n\t\t\tlet selectedTab = null;\n\t\t\tfor ( const tab of tabsList ) {\n\t\t\t\tif (\n\t\t\t\t\tselectedIds.includes( tab.clientId ) ||\n\t\t\t\t\thasSelectedInnerBlock( tab.clientId, true )\n\t\t\t\t) {\n\t\t\t\t\tselectedTab = tab.clientId;\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\treturn {\n\t\t\t\ttabsClientId: _tabsClientId,\n\t\t\t\ttabsMenuClientId: _tabsMenuClientId,\n\t\t\t\tselectedTabClientId: selectedTab,\n\t\t\t};\n\t\t},\n\t\t[ clientId, tabsList ]\n\t);\n\n\tconst isSelectedTab = tabClientId === selectedTabClientId;\n\n\t// Update tab label in the tab block\n\tconst { updateBlockAttributes } = useDispatch( blockEditorStore );\n\n\tconst handleLabelChange = useCallback(\n\t\t( newLabel ) => {\n\t\t\tif ( tabClientId ) {\n\t\t\t\tupdateBlockAttributes( tabClientId, {\n\t\t\t\t\tlabel: newLabel,\n\t\t\t\t\tanchor: slugFromLabel( newLabel, tabIndex ),\n\t\t\t\t} );\n\t\t\t}\n\t\t},\n\t\t[ updateBlockAttributes, tabClientId, tabIndex ]\n\t);\n\n\t// Update editor active tab index on parent tabs block when tab is clicked\n\tconst handleTabClick = useCallback(\n\t\t( event ) => {\n\t\t\tevent.preventDefault();\n\n\t\t\t// Update the parent tabs block's editorActiveTabIndex (ephemeral, not persisted)\n\t\t\tif ( tabsClientId && tabIndex !== effectiveActiveIndex ) {\n\t\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\t\tupdateBlockAttributes( tabsClientId, {\n\t\t\t\t\teditorActiveTabIndex: tabIndex,\n\t\t\t\t} );\n\t\t\t}\n\n\t\t\t// Don't select block if we're editing this tab's label\n\t\t\tif ( isEditing ) {\n\t\t\t}\n\t\t},\n\t\t[\n\t\t\tisEditing,\n\t\t\ttabsClientId,\n\t\t\ttabIndex,\n\t\t\teffectiveActiveIndex,\n\t\t\tupdateBlockAttributes,\n\t\t\t__unstableMarkNextChangeAsNotPersistent,\n\t\t]\n\t);\n\n\t// Callback ref for label RichText\n\tconst labelRef = useCallback(\n\t\t( node ) => {\n\t\t\tlabelElementRef.current = node;\n\t\t\tif ( node && isEditing ) {\n\t\t\t\tconst animationId = requestAnimationFrame( () => {\n\t\t\t\t\tif ( node ) {\n\t\t\t\t\t\tnode.focus();\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t\tfocusRef.current = animationId;\n\t\t\t}\n\t\t},\n\t\t[ isEditing ]\n\t);\n\n\t// Cleanup animation frames\n\tuseEffect( () => {\n\t\treturn () => {\n\t\t\tif ( focusRef.current ) {\n\t\t\t\tcancelAnimationFrame( focusRef.current );\n\t\t\t}\n\t\t};\n\t}, [] );\n\n\t// Build CSS custom properties for active/hover color states\n\tconst customColorStyles = useMemo( () => {\n\t\tconst styles = {};\n\n\t\t// Active/hover colors from custom attributes\n\t\tconst activeBg =\n\t\t\tactiveBackgroundColor?.color ||\n\t\t\tattributes.customActiveBackgroundColor;\n\t\tconst activeText =\n\t\t\tactiveTextColor?.color || attributes.customActiveTextColor;\n\t\tconst hoverBg =\n\t\t\thoverBackgroundColor?.color ||\n\t\t\tattributes.customHoverBackgroundColor;\n\t\tconst hoverText =\n\t\t\thoverTextColor?.color || attributes.customHoverTextColor;\n\n\t\tif ( activeBg ) {\n\t\t\tstyles[ '--custom-tab-active-color' ] = activeBg;\n\t\t}\n\t\tif ( activeText ) {\n\t\t\tstyles[ '--custom-tab-active-text-color' ] = activeText;\n\t\t}\n\t\tif ( hoverBg ) {\n\t\t\tstyles[ '--custom-tab-hover-color' ] = hoverBg;\n\t\t}\n\t\tif ( hoverText ) {\n\t\t\tstyles[ '--custom-tab-hover-text-color' ] = hoverText;\n\t\t}\n\n\t\treturn styles;\n\t}, [\n\t\tactiveBackgroundColor?.color,\n\t\tattributes.customActiveBackgroundColor,\n\t\tactiveTextColor?.color,\n\t\tattributes.customActiveTextColor,\n\t\thoverBackgroundColor?.color,\n\t\tattributes.customHoverBackgroundColor,\n\t\thoverTextColor?.color,\n\t\tattributes.customHoverTextColor,\n\t] );\n\n\tconst tabPanelId = tabId || `tab-${ tabIndex }`;\n\tconst tabLabelId = `${ tabPanelId }--tab`;\n\n\t// Use blockProps for core style engine support\n\tconst blockProps = useBlockProps( {\n\t\tclassName: clsx( layoutClassNames, {\n\t\t\t'is-active': isActiveTab,\n\t\t\t'is-selected': isSelectedTab,\n\t\t} ),\n\t\tstyle: customColorStyles,\n\t\t'aria-controls': tabPanelId,\n\t\t'aria-selected': isActiveTab,\n\t\tid: tabLabelId,\n\t\trole: 'tab',\n\t\ttabIndex: isActiveTab ? 0 : -1,\n\t\tonClick: handleTabClick,\n\t\tonDoubleClick: () => {\n\t\t\tsetIsEditing( true );\n\t\t\tsetEditingLabel( tabLabel || '' );\n\t\t},\n\t} );\n\n\treturn (\n\t\t<>\n\t\t\t<Controls\n\t\t\t\t{ ...{\n\t\t\t\t\tattributes,\n\t\t\t\t\tsetAttributes,\n\t\t\t\t\tclientId,\n\t\t\t\t\ttabsClientId,\n\t\t\t\t\ttabClientId,\n\t\t\t\t\ttabIndex,\n\t\t\t\t\ttabsCount: tabsList.length,\n\t\t\t\t\ttabsMenuClientId,\n\t\t\t\t\tactiveBackgroundColor,\n\t\t\t\t\tsetActiveBackgroundColor,\n\t\t\t\t\tactiveTextColor,\n\t\t\t\t\tsetActiveTextColor,\n\t\t\t\t\thoverBackgroundColor,\n\t\t\t\t\tsetHoverBackgroundColor,\n\t\t\t\t\thoverTextColor,\n\t\t\t\t\tsetHoverTextColor,\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t<div { ...blockProps }>\n\t\t\t\t{ isEditing ? (\n\t\t\t\t\t<RichText\n\t\t\t\t\t\tref={ labelRef }\n\t\t\t\t\t\ttagName=\"span\"\n\t\t\t\t\t\twithoutInteractiveFormatting\n\t\t\t\t\t\tplaceholder={ sprintf(\n\t\t\t\t\t\t\t/* translators: %d is the tab index + 1 */\n\t\t\t\t\t\t\t__( 'Tab %d\u2026' ),\n\t\t\t\t\t\t\ttabIndex + 1\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tvalue={ decodeEntities( editingLabel ) }\n\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\tsetEditingLabel( value );\n\t\t\t\t\t\t\thandleLabelChange( value );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonBlur={ () => {\n\t\t\t\t\t\t\tsetIsEditing( false );\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t) : (\n\t\t\t\t\t<StaticLabel label={ tabLabel } index={ tabIndex } />\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</>\n\t);\n}\n\nexport default withColors(\n\t'activeBackgroundColor',\n\t'activeTextColor',\n\t'hoverBackgroundColor',\n\t'hoverTextColor'\n)( Edit );\n"],
+  "mappings": "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",
+  "names": ["blockEditorStore", "slugFromLabel", "clsx", "Controls"]
+}