@wordpress/block-library 9.34.0 → 9.35.0

package/build-module/tabs/controls.js

@@ -0,0 +1,248 @@
+// packages/block-library/src/tabs/controls.js
+import { __ } from "@wordpress/i18n";
+import { ToggleControl, PanelBody, TextControl } from "@wordpress/components";
+import { useMemo } from "@wordpress/element";
+import {
+  ContrastChecker,
+  InspectorControls,
+  __experimentalColorGradientSettingsDropdown as ColorGradientSettingsDropdown,
+  __experimentalUseMultipleOriginColorsAndGradients as useMultipleOriginColorsAndGradients
+} from "@wordpress/block-editor";
+import AddTabToolbarControl from "../tab/add-tab-toolbar-control";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function ContrastCheckerMatrix({ attributes }) {
+  const {
+    className,
+    fontSize,
+    tabActiveColor,
+    customTabActiveColor,
+    tabActiveTextColor,
+    customTabActiveTextColor,
+    tabInactiveColor,
+    customTabInactiveColor,
+    tabTextColor,
+    customTabTextColor,
+    tabHoverColor,
+    customTabHoverColor,
+    tabHoverTextColor,
+    customTabHoverTextColor
+  } = attributes;
+  const activeBackground = useMemo(() => {
+    if (className?.includes("is-style-links")) {
+      return "#fff";
+    }
+    if (tabActiveColor?.color) {
+      return tabActiveColor.color;
+    }
+    return customTabActiveColor;
+  }, [tabActiveColor, customTabActiveColor, className]);
+  const activeText = useMemo(() => {
+    if (tabActiveTextColor?.color) {
+      return tabActiveTextColor.color;
+    }
+    return customTabActiveTextColor;
+  }, [tabActiveTextColor, customTabActiveTextColor]);
+  const inactiveBackground = useMemo(() => {
+    if (className?.includes("is-style-links")) {
+      return "#fff";
+    }
+    if (tabInactiveColor?.color) {
+      return tabInactiveColor.color;
+    }
+    return customTabInactiveColor;
+  }, [tabInactiveColor, customTabInactiveColor, className]);
+  const inactiveText = useMemo(() => {
+    if (tabTextColor?.color) {
+      return tabTextColor.color;
+    }
+    return customTabTextColor;
+  }, [tabTextColor, customTabTextColor]);
+  const hoverBackground = useMemo(() => {
+    if (tabHoverColor?.color) {
+      return tabHoverColor.color;
+    }
+    return customTabHoverColor;
+  }, [tabHoverColor, customTabHoverColor]);
+  const hoverText = useMemo(() => {
+    if (tabHoverTextColor?.color) {
+      return tabHoverTextColor.color;
+    }
+    return customTabHoverTextColor;
+  }, [tabHoverTextColor, customTabHoverTextColor]);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      ContrastChecker,
+      {
+        backgroundColor: activeBackground,
+        fontSize,
+        textColor: activeText
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      ContrastChecker,
+      {
+        backgroundColor: inactiveBackground,
+        fontSize,
+        textColor: inactiveText
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      ContrastChecker,
+      {
+        backgroundColor: hoverBackground,
+        fontSize,
+        textColor: hoverText
+      }
+    )
+  ] });
+}
+function Controls({
+  attributes,
+  setAttributes,
+  clientId,
+  tabInactiveColor,
+  setTabInactiveColor,
+  tabHoverColor,
+  setTabHoverColor,
+  tabActiveColor,
+  setTabActiveColor,
+  tabTextColor,
+  setTabTextColor,
+  tabActiveTextColor,
+  setTabActiveTextColor,
+  tabHoverTextColor,
+  setTabHoverTextColor
+}) {
+  const {
+    customTabInactiveColor,
+    customTabActiveColor,
+    customTabHoverColor,
+    customTabTextColor,
+    customTabActiveTextColor,
+    customTabHoverTextColor,
+    orientation,
+    metadata = {
+      name: ""
+    }
+  } = attributes;
+  const colorSettings = useMultipleOriginColorsAndGradients();
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      AddTabToolbarControl,
+      {
+        tabsClientId: clientId,
+        attributes
+      }
+    ),
+    /* @__PURE__ */ jsx(InspectorControls, { children: /* @__PURE__ */ jsxs(PanelBody, { title: __("Tabs Settings"), children: [
+      /* @__PURE__ */ jsx(
+        ToggleControl,
+        {
+          label: __("Vertical Tabs"),
+          checked: "vertical" === orientation,
+          onChange: () => setAttributes({
+            orientation: "vertical" === orientation ? "horizontal" : "vertical"
+          }),
+          __nextHasNoMarginBottom: true
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        TextControl,
+        {
+          label: __("Tabs Title"),
+          help: __(
+            "The tabs title is used by screen readers to describe the purpose and content of the tabs."
+          ),
+          value: metadata.name,
+          placeholder: __("Tab Contents"),
+          onChange: (value) => {
+            setAttributes({
+              metadata: { ...metadata, name: value }
+            });
+          },
+          __nextHasNoMarginBottom: true,
+          __next40pxDefaultSize: true
+        }
+      )
+    ] }) }),
+    /* @__PURE__ */ jsxs(InspectorControls, { group: "color", children: [
+      /* @__PURE__ */ jsx(
+        ColorGradientSettingsDropdown,
+        {
+          settings: [
+            {
+              label: __("Tab Active Background"),
+              colorValue: tabActiveColor?.color ?? customTabActiveColor,
+              onColorChange: (value) => {
+                setTabActiveColor(value);
+                setAttributes({
+                  customTabActiveColor: value
+                });
+              }
+            },
+            {
+              label: __("Tab Active Text"),
+              colorValue: tabActiveTextColor?.color ?? customTabActiveTextColor,
+              onColorChange: (value) => {
+                setTabActiveTextColor(value);
+                setAttributes({
+                  customTabActiveTextColor: value
+                });
+              }
+            },
+            {
+              label: __("Tab Inactive Background"),
+              colorValue: tabInactiveColor?.color ?? customTabInactiveColor,
+              onColorChange: (value) => {
+                setTabInactiveColor(value);
+                setAttributes({
+                  customTabInactiveColor: value
+                });
+              }
+            },
+            {
+              label: __("Tab Inactive Text"),
+              colorValue: tabTextColor?.color ?? customTabTextColor,
+              onColorChange: (value) => {
+                setTabTextColor(value);
+                setAttributes({
+                  customTabTextColor: value
+                });
+              }
+            },
+            {
+              label: __("Tab Hover Background"),
+              colorValue: tabHoverColor?.color ?? customTabHoverColor,
+              onColorChange: (value) => {
+                setTabHoverColor(value);
+                setAttributes({
+                  customTabHoverColor: value
+                });
+              }
+            },
+            {
+              label: __("Tab Hover Text"),
+              colorValue: tabHoverTextColor?.color ?? customTabHoverTextColor,
+              onColorChange: (value) => {
+                setTabHoverTextColor(value);
+                setAttributes({
+                  customTabHoverTextColor: value
+                });
+              }
+            }
+          ],
+          panelId: clientId,
+          disableCustomColors: false,
+          __experimentalIsRenderedInSidebar: true,
+          __next40pxDefaultSize: true,
+          ...colorSettings
+        }
+      ),
+      /* @__PURE__ */ jsx(ContrastCheckerMatrix, { attributes })
+    ] })
+  ] });
+}
+export {
+  Controls as default
+};
+//# sourceMappingURL=controls.js.map

package/build-module/tabs/controls.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/tabs/controls.js"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { ToggleControl, PanelBody, TextControl } from '@wordpress/components';\nimport { useMemo } from '@wordpress/element';\nimport {\n\tContrastChecker,\n\tInspectorControls,\n\t__experimentalColorGradientSettingsDropdown as ColorGradientSettingsDropdown,\n\t__experimentalUseMultipleOriginColorsAndGradients as useMultipleOriginColorsAndGradients,\n} from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport AddTabToolbarControl from '../tab/add-tab-toolbar-control';\n\nfunction ContrastCheckerMatrix( { attributes } ) {\n\tconst {\n\t\tclassName,\n\t\tfontSize,\n\t\ttabActiveColor,\n\t\tcustomTabActiveColor,\n\t\ttabActiveTextColor,\n\t\tcustomTabActiveTextColor,\n\t\ttabInactiveColor,\n\t\tcustomTabInactiveColor,\n\t\ttabTextColor,\n\t\tcustomTabTextColor,\n\t\ttabHoverColor,\n\t\tcustomTabHoverColor,\n\t\ttabHoverTextColor,\n\t\tcustomTabHoverTextColor,\n\t} = attributes;\n\n\tconst activeBackground = useMemo( () => {\n\t\tif ( className?.includes( 'is-style-links' ) ) {\n\t\t\treturn '#fff';\n\t\t}\n\t\tif ( tabActiveColor?.color ) {\n\t\t\treturn tabActiveColor.color;\n\t\t}\n\t\treturn customTabActiveColor;\n\t}, [ tabActiveColor, customTabActiveColor, className ] );\n\n\tconst activeText = useMemo( () => {\n\t\tif ( tabActiveTextColor?.color ) {\n\t\t\treturn tabActiveTextColor.color;\n\t\t}\n\t\treturn customTabActiveTextColor;\n\t}, [ tabActiveTextColor, customTabActiveTextColor ] );\n\n\tconst inactiveBackground = useMemo( () => {\n\t\tif ( className?.includes( 'is-style-links' ) ) {\n\t\t\treturn '#fff';\n\t\t}\n\t\tif ( tabInactiveColor?.color ) {\n\t\t\treturn tabInactiveColor.color;\n\t\t}\n\t\treturn customTabInactiveColor;\n\t}, [ tabInactiveColor, customTabInactiveColor, className ] );\n\n\tconst inactiveText = useMemo( () => {\n\t\tif ( tabTextColor?.color ) {\n\t\t\treturn tabTextColor.color;\n\t\t}\n\t\treturn customTabTextColor;\n\t}, [ tabTextColor, customTabTextColor ] );\n\n\tconst hoverBackground = useMemo( () => {\n\t\tif ( tabHoverColor?.color ) {\n\t\t\treturn tabHoverColor.color;\n\t\t}\n\t\treturn customTabHoverColor;\n\t}, [ tabHoverColor, customTabHoverColor ] );\n\n\tconst hoverText = useMemo( () => {\n\t\tif ( tabHoverTextColor?.color ) {\n\t\t\treturn tabHoverTextColor.color;\n\t\t}\n\t\treturn customTabHoverTextColor;\n\t}, [ tabHoverTextColor, customTabHoverTextColor ] );\n\n\treturn (\n\t\t<>\n\t\t\t<ContrastChecker\n\t\t\t\tbackgroundColor={ activeBackground }\n\t\t\t\tfontSize={ fontSize }\n\t\t\t\ttextColor={ activeText }\n\t\t\t/>\n\t\t\t<ContrastChecker\n\t\t\t\tbackgroundColor={ inactiveBackground }\n\t\t\t\tfontSize={ fontSize }\n\t\t\t\ttextColor={ inactiveText }\n\t\t\t/>\n\t\t\t<ContrastChecker\n\t\t\t\tbackgroundColor={ hoverBackground }\n\t\t\t\tfontSize={ fontSize }\n\t\t\t\ttextColor={ hoverText }\n\t\t\t/>\n\t\t</>\n\t);\n}\n\nexport default function Controls( {\n\tattributes,\n\tsetAttributes,\n\tclientId,\n\ttabInactiveColor,\n\tsetTabInactiveColor,\n\ttabHoverColor,\n\tsetTabHoverColor,\n\ttabActiveColor,\n\tsetTabActiveColor,\n\ttabTextColor,\n\tsetTabTextColor,\n\ttabActiveTextColor,\n\tsetTabActiveTextColor,\n\ttabHoverTextColor,\n\tsetTabHoverTextColor,\n} ) {\n\tconst {\n\t\tcustomTabInactiveColor,\n\t\tcustomTabActiveColor,\n\t\tcustomTabHoverColor,\n\t\tcustomTabTextColor,\n\t\tcustomTabActiveTextColor,\n\t\tcustomTabHoverTextColor,\n\t\torientation,\n\t\tmetadata = {\n\t\t\tname: '',\n\t\t},\n\t} = attributes;\n\t/**\n\t * Get the color settings for the block.\n\t */\n\tconst colorSettings = useMultipleOriginColorsAndGradients();\n\n\treturn (\n\t\t<>\n\t\t\t<AddTabToolbarControl\n\t\t\t\ttabsClientId={ clientId }\n\t\t\t\tattributes={ attributes }\n\t\t\t/>\n\t\t\t<InspectorControls>\n\t\t\t\t<PanelBody title={ __( 'Tabs Settings' ) }>\n\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\tlabel={ __( 'Vertical Tabs' ) }\n\t\t\t\t\t\tchecked={ 'vertical' === orientation }\n\t\t\t\t\t\tonChange={ () =>\n\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\torientation:\n\t\t\t\t\t\t\t\t\t'vertical' === orientation\n\t\t\t\t\t\t\t\t\t\t? 'horizontal'\n\t\t\t\t\t\t\t\t\t\t: 'vertical',\n\t\t\t\t\t\t\t} )\n\t\t\t\t\t\t}\n\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t/>\n\t\t\t\t\t<TextControl\n\t\t\t\t\t\tlabel={ __( 'Tabs Title' ) }\n\t\t\t\t\t\thelp={ __(\n\t\t\t\t\t\t\t'The tabs title is used by screen readers to describe the purpose and content of the tabs.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tvalue={ metadata.name }\n\t\t\t\t\t\tplaceholder={ __( 'Tab Contents' ) }\n\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\tmetadata: { ...metadata, name: value },\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t/>\n\t\t\t\t</PanelBody>\n\t\t\t</InspectorControls>\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: __( 'Tab Active Background' ),\n\t\t\t\t\t\t\tcolorValue:\n\t\t\t\t\t\t\t\ttabActiveColor?.color ?? customTabActiveColor,\n\t\t\t\t\t\t\tonColorChange: ( value ) => {\n\t\t\t\t\t\t\t\tsetTabActiveColor( value );\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tcustomTabActiveColor: 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: __( 'Tab Active Text' ),\n\t\t\t\t\t\t\tcolorValue:\n\t\t\t\t\t\t\t\ttabActiveTextColor?.color ??\n\t\t\t\t\t\t\t\tcustomTabActiveTextColor,\n\t\t\t\t\t\t\tonColorChange: ( value ) => {\n\t\t\t\t\t\t\t\tsetTabActiveTextColor( value );\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tcustomTabActiveTextColor: 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: __( 'Tab Inactive Background' ),\n\t\t\t\t\t\t\tcolorValue:\n\t\t\t\t\t\t\t\ttabInactiveColor?.color ??\n\t\t\t\t\t\t\t\tcustomTabInactiveColor,\n\t\t\t\t\t\t\tonColorChange: ( value ) => {\n\t\t\t\t\t\t\t\tsetTabInactiveColor( value );\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tcustomTabInactiveColor: 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: __( 'Tab Inactive Text' ),\n\t\t\t\t\t\t\tcolorValue:\n\t\t\t\t\t\t\t\ttabTextColor?.color ?? customTabTextColor,\n\t\t\t\t\t\t\tonColorChange: ( value ) => {\n\t\t\t\t\t\t\t\tsetTabTextColor( value );\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tcustomTabTextColor: 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: __( 'Tab Hover Background' ),\n\t\t\t\t\t\t\tcolorValue:\n\t\t\t\t\t\t\t\ttabHoverColor?.color ?? customTabHoverColor,\n\t\t\t\t\t\t\tonColorChange: ( value ) => {\n\t\t\t\t\t\t\t\tsetTabHoverColor( value );\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tcustomTabHoverColor: 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: __( 'Tab Hover Text' ),\n\t\t\t\t\t\t\tcolorValue:\n\t\t\t\t\t\t\t\ttabHoverTextColor?.color ??\n\t\t\t\t\t\t\t\tcustomTabHoverTextColor,\n\t\t\t\t\t\t\tonColorChange: ( value ) => {\n\t\t\t\t\t\t\t\tsetTabHoverTextColor( value );\n\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\tcustomTabHoverTextColor: 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\t<ContrastCheckerMatrix attributes={ attributes } />\n\t\t\t</InspectorControls>\n\t\t</>\n\t);\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/build-module/tabs/edit.js

@@ -0,0 +1,90 @@
+// packages/block-library/src/tabs/edit.js
+import clsx from "clsx";
+import {
+  useBlockProps,
+  useInnerBlocksProps,
+  withColors
+} from "@wordpress/block-editor";
+import StyleEngine from "./style-engine";
+import Controls from "./controls";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var TABS_TEMPLATE = [["core/tab", {}]];
+var DEFAULT_BLOCK = {
+  name: "core/tab",
+  attributesToCopy: ["className", "fontFamily", "fontSize"]
+};
+function Edit({
+  clientId,
+  attributes,
+  setAttributes,
+  tabInactiveColor,
+  setTabInactiveColor,
+  tabHoverColor,
+  setTabHoverColor,
+  tabActiveColor,
+  setTabActiveColor,
+  tabTextColor,
+  setTabTextColor,
+  tabActiveTextColor,
+  setTabActiveTextColor,
+  tabHoverTextColor,
+  setTabHoverTextColor
+}) {
+  const { style, orientation } = attributes;
+  const blockProps = useBlockProps({
+    className: clsx(
+      "vertical" === orientation ? "is-vertical" : "is-horizontal"
+    ),
+    style: {
+      ...style
+    }
+  });
+  const innerBlockProps = useInnerBlocksProps(blockProps, {
+    defaultBlock: DEFAULT_BLOCK,
+    directInsert: true,
+    __experimentalCaptureToolbars: true,
+    clientId,
+    orientation,
+    template: TABS_TEMPLATE,
+    renderAppender: false
+    // Appender is rendered by individual tab blocks.
+  });
+  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("div", { ...innerBlockProps, children: [
+    innerBlockProps.children,
+    /* @__PURE__ */ jsx(StyleEngine, { attributes, clientId }),
+    /* @__PURE__ */ jsx(
+      Controls,
+      {
+        ...{
+          clientId,
+          attributes,
+          setAttributes,
+          tabInactiveColor,
+          setTabInactiveColor,
+          tabHoverColor,
+          setTabHoverColor,
+          tabActiveColor,
+          setTabActiveColor,
+          tabTextColor,
+          setTabTextColor,
+          tabActiveTextColor,
+          setTabActiveTextColor,
+          tabHoverTextColor,
+          setTabHoverTextColor
+        }
+      }
+    )
+  ] }) });
+}
+var edit_default = withColors(
+  "tabInactiveColor",
+  "tabHoverColor",
+  "tabActiveColor",
+  "tabTextColor",
+  "tabActiveTextColor",
+  "tabHoverTextColor"
+)(Edit);
+export {
+  edit_default as default
+};
+//# sourceMappingURL=edit.js.map

package/build-module/tabs/edit.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/tabs/edit.js"],
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseBlockProps,\n\tuseInnerBlocksProps,\n\twithColors,\n} from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport StyleEngine from './style-engine';\nimport Controls from './controls';\n\nconst TABS_TEMPLATE = [ [ 'core/tab', {} ] ];\n\nconst DEFAULT_BLOCK = {\n\tname: 'core/tab',\n\tattributesToCopy: [ 'className', 'fontFamily', 'fontSize' ],\n};\n\nfunction Edit( {\n\tclientId,\n\tattributes,\n\tsetAttributes,\n\ttabInactiveColor,\n\tsetTabInactiveColor,\n\ttabHoverColor,\n\tsetTabHoverColor,\n\ttabActiveColor,\n\tsetTabActiveColor,\n\ttabTextColor,\n\tsetTabTextColor,\n\ttabActiveTextColor,\n\tsetTabActiveTextColor,\n\ttabHoverTextColor,\n\tsetTabHoverTextColor,\n} ) {\n\tconst { style, orientation } = attributes;\n\n\t/**\n\t * Block props for the tabs container.\n\t */\n\tconst blockProps = useBlockProps( {\n\t\tclassName: clsx(\n\t\t\t'vertical' === orientation ? 'is-vertical' : 'is-horizontal'\n\t\t),\n\t\tstyle: {\n\t\t\t...style,\n\t\t},\n\t} );\n\n\t/**\n\t * Innerblocks props for the tabs list.\n\t */\n\tconst innerBlockProps = useInnerBlocksProps( blockProps, {\n\t\tdefaultBlock: DEFAULT_BLOCK,\n\t\tdirectInsert: true,\n\t\t__experimentalCaptureToolbars: true,\n\t\tclientId,\n\t\torientation,\n\t\ttemplate: TABS_TEMPLATE,\n\t\trenderAppender: false, // Appender is rendered by individual tab blocks.\n\t} );\n\n\treturn (\n\t\t<>\n\t\t\t<div { ...innerBlockProps }>\n\t\t\t\t{ innerBlockProps.children }\n\t\t\t\t<StyleEngine attributes={ attributes } clientId={ clientId } />\n\t\t\t\t<Controls\n\t\t\t\t\t{ ...{\n\t\t\t\t\t\tclientId,\n\t\t\t\t\t\tattributes,\n\t\t\t\t\t\tsetAttributes,\n\t\t\t\t\t\ttabInactiveColor,\n\t\t\t\t\t\tsetTabInactiveColor,\n\t\t\t\t\t\ttabHoverColor,\n\t\t\t\t\t\tsetTabHoverColor,\n\t\t\t\t\t\ttabActiveColor,\n\t\t\t\t\t\tsetTabActiveColor,\n\t\t\t\t\t\ttabTextColor,\n\t\t\t\t\t\tsetTabTextColor,\n\t\t\t\t\t\ttabActiveTextColor,\n\t\t\t\t\t\tsetTabActiveTextColor,\n\t\t\t\t\t\ttabHoverTextColor,\n\t\t\t\t\t\tsetTabHoverTextColor,\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t</div>\n\t\t</>\n\t);\n}\n\nexport default withColors(\n\t'tabInactiveColor',\n\t'tabHoverColor',\n\t'tabActiveColor',\n\t'tabTextColor',\n\t'tabActiveTextColor',\n\t'tabHoverTextColor'\n)( Edit );\n"],
+  "mappings": ";AAGA,OAAO,UAAU;AAKjB;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,OACM;AAKP,OAAO,iBAAiB;AACxB,OAAO,cAAc;AAsDnB,mBAGE,KAFD,YADD;AApDF,IAAM,gBAAgB,CAAE,CAAE,YAAY,CAAC,CAAE,CAAE;AAE3C,IAAM,gBAAgB;AAAA,EACrB,MAAM;AAAA,EACN,kBAAkB,CAAE,aAAa,cAAc,UAAW;AAC3D;AAEA,SAAS,KAAM;AAAA,EACd;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;AACD,GAAI;AACH,QAAM,EAAE,OAAO,YAAY,IAAI;AAK/B,QAAM,aAAa,cAAe;AAAA,IACjC,WAAW;AAAA,MACV,eAAe,cAAc,gBAAgB;AAAA,IAC9C;AAAA,IACA,OAAO;AAAA,MACN,GAAG;AAAA,IACJ;AAAA,EACD,CAAE;AAKF,QAAM,kBAAkB,oBAAqB,YAAY;AAAA,IACxD,cAAc;AAAA,IACd,cAAc;AAAA,IACd,+BAA+B;AAAA,IAC/B;AAAA,IACA;AAAA,IACA,UAAU;AAAA,IACV,gBAAgB;AAAA;AAAA,EACjB,CAAE;AAEF,SACC,gCACC,+BAAC,SAAM,GAAG,iBACP;AAAA,oBAAgB;AAAA,IAClB,oBAAC,eAAY,YAA0B,UAAsB;AAAA,IAC7D;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,UACJ;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACD;AAAA;AAAA,IACD;AAAA,KACD,GACD;AAEF;AAEA,IAAO,eAAQ;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,EAAG,IAAK;",
+  "names": []
+}

package/build-module/tabs/icon.js

@@ -0,0 +1,24 @@
+// packages/block-library/src/tabs/icon.js
+import { SVG, Path } from "@wordpress/components";
+import { jsx } from "react/jsx-runtime";
+var icon_default = /* @__PURE__ */ jsx(
+  SVG,
+  {
+    width: "24",
+    height: "24",
+    viewBox: "0 0 24 24",
+    xmlns: "http://www.w3.org/2000/svg",
+    children: /* @__PURE__ */ jsx(
+      Path,
+      {
+        fillRule: "evenodd",
+        clipRule: "evenodd",
+        d: "M5.2998 4.8501C4.60945 4.8501 4.0498 5.40974 4.0498 6.1001V10.3501H11.3498V6.1001C11.3498 5.40974 10.7902 4.8501 10.0998 4.8501H5.2998ZM14.2002 10.3501V7.1001H18.5002V10.3501H20.0002V6.8501C20.0002 6.15974 19.4406 5.6001 18.7502 5.6001H13.9502C13.2598 5.6001 12.7002 6.15974 12.7002 6.8501V10.3501H14.2002ZM20 12.6001H4V14.1001H20V12.6001ZM14 17.1001H4V18.6001H14V17.1001Z"
+      }
+    )
+  }
+);
+export {
+  icon_default as default
+};
+//# sourceMappingURL=icon.js.map

package/build-module/tabs/icon.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/tabs/icon.js"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { SVG, Path } from '@wordpress/components';\n\nexport default (\n\t<SVG\n\t\twidth=\"24\"\n\t\theight=\"24\"\n\t\tviewBox=\"0 0 24 24\"\n\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t>\n\t\t<Path\n\t\t\tfillRule=\"evenodd\"\n\t\t\tclipRule=\"evenodd\"\n\t\t\td=\"M5.2998 4.8501C4.60945 4.8501 4.0498 5.40974 4.0498 6.1001V10.3501H11.3498V6.1001C11.3498 5.40974 10.7902 4.8501 10.0998 4.8501H5.2998ZM14.2002 10.3501V7.1001H18.5002V10.3501H20.0002V6.8501C20.0002 6.15974 19.4406 5.6001 18.7502 5.6001H13.9502C13.2598 5.6001 12.7002 6.15974 12.7002 6.8501V10.3501H14.2002ZM20 12.6001H4V14.1001H20V12.6001ZM14 17.1001H4V18.6001H14V17.1001Z\"\n\t\t/>\n\t</SVG>\n);\n"],
+  "mappings": ";AAGA,SAAS,KAAK,YAAY;AASxB;AAPF,IAAO,eACN;AAAA,EAAC;AAAA;AAAA,IACA,OAAM;AAAA,IACN,QAAO;AAAA,IACP,SAAQ;AAAA,IACR,OAAM;AAAA,IAEN;AAAA,MAAC;AAAA;AAAA,QACA,UAAS;AAAA,QACT,UAAS;AAAA,QACT,GAAE;AAAA;AAAA,IACH;AAAA;AACD;",
+  "names": []
+}

package/build-module/tabs/index.js

@@ -0,0 +1,20 @@
+// packages/block-library/src/tabs/index.js
+import initBlock from "../utils/init-block";
+import edit from "./edit";
+import save from "./save";
+import icon from "./icon";
+import metadata from "./block.json";
+var { name } = metadata;
+var settings = {
+  icon,
+  edit,
+  save
+};
+var init = () => initBlock({ name, metadata, settings });
+export {
+  init,
+  metadata,
+  name,
+  settings
+};
+//# sourceMappingURL=index.js.map

package/build-module/tabs/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/tabs/index.js"],
+  "sourcesContent": ["/**\n * Internal dependencies\n */\nimport initBlock from '../utils/init-block';\nimport edit from './edit';\nimport save from './save';\nimport icon from './icon';\n\nimport metadata from './block.json';\n\nconst { name } = metadata;\n\nexport { metadata, name };\n\nexport const settings = {\n\ticon,\n\tedit,\n\tsave,\n};\n\nexport const init = () => initBlock( { name, metadata, settings } );\n"],
+  "mappings": ";AAGA,OAAO,eAAe;AACtB,OAAO,UAAU;AACjB,OAAO,UAAU;AACjB,OAAO,UAAU;AAEjB,OAAO,cAAc;AAErB,IAAM,EAAE,KAAK,IAAI;AAIV,IAAM,WAAW;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AACD;AAEO,IAAM,OAAO,MAAM,UAAW,EAAE,MAAM,UAAU,SAAS,CAAE;",
+  "names": []
+}

package/build-module/tabs/init.js

@@ -0,0 +1,7 @@
+// packages/block-library/src/tabs/init.js
+import { init } from "./";
+var init_default = init();
+export {
+  init_default as default
+};
+//# sourceMappingURL=init.js.map

package/build-module/tabs/init.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/tabs/init.js"],
+  "sourcesContent": ["/**\n * Internal dependencies\n */\nimport { init } from './';\n\nexport default init();\n"],
+  "mappings": ";AAGA,SAAS,YAAY;AAErB,IAAO,eAAQ,KAAK;",
+  "names": []
+}

package/build-module/tabs/save.js

@@ -0,0 +1,17 @@
+// packages/block-library/src/tabs/save.js
+import { useBlockProps, useInnerBlocksProps } from "@wordpress/block-editor";
+import { jsx, jsxs } from "react/jsx-runtime";
+function Save({ attributes }) {
+  const blockProps = useBlockProps.save();
+  const innerBlocksProps = useInnerBlocksProps.save({});
+  const title = attributes?.metadata?.name || "Tab Contents";
+  return /* @__PURE__ */ jsxs("div", { ...blockProps, children: [
+    /* @__PURE__ */ jsx("h3", { className: "tabs__title", children: title }),
+    /* @__PURE__ */ jsx("ul", { className: "tabs__list" }),
+    innerBlocksProps.children
+  ] });
+}
+export {
+  Save as default
+};
+//# sourceMappingURL=save.js.map

package/build-module/tabs/save.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/tabs/save.js"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useBlockProps, useInnerBlocksProps } from '@wordpress/block-editor';\n\nexport default function Save( { attributes } ) {\n\t// eslint-disable-next-line react-compiler/react-compiler\n\tconst blockProps = useBlockProps.save();\n\n\t// eslint-disable-next-line react-compiler/react-compiler\n\tconst innerBlocksProps = useInnerBlocksProps.save( {} );\n\n\tconst title = attributes?.metadata?.name || 'Tab Contents';\n\n\treturn (\n\t\t<div { ...blockProps }>\n\t\t\t<h3 className=\"tabs__title\">{ title }</h3>\n\t\t\t<ul className=\"tabs__list\"></ul>\n\t\t\t{ innerBlocksProps.children }\n\t\t</div>\n\t);\n}\n"],
+  "mappings": ";AAGA,SAAS,eAAe,2BAA2B;AAYjD,SACC,KADD;AAVa,SAAR,KAAuB,EAAE,WAAW,GAAI;AAE9C,QAAM,aAAa,cAAc,KAAK;AAGtC,QAAM,mBAAmB,oBAAoB,KAAM,CAAC,CAAE;AAEtD,QAAM,QAAQ,YAAY,UAAU,QAAQ;AAE5C,SACC,qBAAC,SAAM,GAAG,YACT;AAAA,wBAAC,QAAG,WAAU,eAAgB,iBAAO;AAAA,IACrC,oBAAC,QAAG,WAAU,cAAa;AAAA,IACzB,iBAAiB;AAAA,KACpB;AAEF;",
+  "names": []
+}

package/build-module/tabs/style-engine.js

@@ -0,0 +1,79 @@
+// packages/block-library/src/tabs/style-engine.js
+import {
+  __experimentalGetGapCSSValue as getGapCSSValue,
+  useStyleOverride
+} from "@wordpress/block-editor";
+function getGapStyles({ attributes }) {
+  const { style, orientation } = attributes || {};
+  const { spacing } = style || {};
+  const { blockGap } = spacing || {};
+  const fallbackValue = `var( --wp--style--tabs-gap-default, var( --wp--style--block-gap, 0.5em ) )`;
+  let listGapValue = fallbackValue;
+  let gapValue = fallbackValue;
+  if (!!blockGap) {
+    listGapValue = typeof blockGap === "string" ? getGapCSSValue(blockGap) : getGapCSSValue(blockGap?.left) || fallbackValue;
+    gapValue = typeof blockGap === "string" ? getGapCSSValue(blockGap) : getGapCSSValue(blockGap?.top) || fallbackValue;
+  }
+  if (orientation === "vertical") {
+    const _listGapValue = listGapValue;
+    const _gapValue = gapValue;
+    listGapValue = _gapValue;
+    gapValue = _listGapValue;
+  }
+  const gapMap = {
+    "--wp--style--unstable-tabs-list-gap": listGapValue === "0" ? "0px" : listGapValue,
+    "--wp--style--unstable-tabs-gap": gapValue
+  };
+  return gapMap;
+}
+function getColorStyles({ attributes }) {
+  const {
+    customTabInactiveColor,
+    customTabHoverColor,
+    customTabActiveColor,
+    customTabTextColor,
+    customTabActiveTextColor,
+    customTabHoverTextColor
+  } = attributes || {};
+  function getColorValue(color) {
+    if (!color) {
+      return null;
+    }
+    if (typeof color === "object" && color.slug) {
+      return `var(--wp--preset--color--${color.slug})`;
+    }
+    return color;
+  }
+  const colorVarMap = {
+    "--custom-tab-inactive-color": getColorValue(customTabInactiveColor),
+    "--custom-tab-active-color": getColorValue(customTabActiveColor),
+    "--custom-tab-hover-color": getColorValue(customTabHoverColor),
+    "--custom-tab-text-color": getColorValue(customTabTextColor),
+    "--custom-tab-active-text-color": getColorValue(
+      customTabActiveTextColor
+    ),
+    "--custom-tab-hover-text-color": getColorValue(
+      customTabHoverTextColor
+    )
+  };
+  return colorVarMap;
+}
+function StyleEngine({ attributes, clientId }) {
+  const gapVarMap = getGapStyles({ attributes });
+  const colorVarMap = getColorStyles({ attributes });
+  const styleVarMap = {
+    ...gapVarMap,
+    ...colorVarMap
+  };
+  const declarations = Object.entries(styleVarMap).filter(([, value]) => !!value).map(([name, value]) => `	${name}: ${value};`).join("\n");
+  useStyleOverride({
+    css: clientId ? `#block-${clientId} {
+${declarations}
+}` : ""
+  });
+  return null;
+}
+export {
+  StyleEngine as default
+};
+//# sourceMappingURL=style-engine.js.map

package/build-module/tabs/style-engine.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/tabs/style-engine.js"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalGetGapCSSValue as getGapCSSValue,\n\tuseStyleOverride,\n} from '@wordpress/block-editor';\n\n/**\n * Gets the gap styles for the tab block.\n * @param {Object} props\n * @param {Object} props.attributes Block attributes\n * @return {Object} CSS custom properties for gap styles\n */\nfunction getGapStyles( { attributes } ) {\n\tconst { style, orientation } = attributes || {};\n\tconst { spacing } = style || {};\n\tconst { blockGap } = spacing || {};\n\t//--wp--style--tabs-list-gap-default should be used by themes that want to set a default\n\t// gap on the tabs list.\n\tconst fallbackValue = `var( --wp--style--tabs-gap-default, var( --wp--style--block-gap, 0.5em ) )`;\n\tlet listGapValue = fallbackValue;\n\tlet gapValue = fallbackValue;\n\n\t// Check for a value.\n\tif ( !! blockGap ) {\n\t\tlistGapValue =\n\t\t\ttypeof blockGap === 'string'\n\t\t\t\t? getGapCSSValue( blockGap )\n\t\t\t\t: getGapCSSValue( blockGap?.left ) || fallbackValue;\n\t\tgapValue =\n\t\t\ttypeof blockGap === 'string'\n\t\t\t\t? getGapCSSValue( blockGap )\n\t\t\t\t: getGapCSSValue( blockGap?.top ) || fallbackValue;\n\t}\n\n\tif ( orientation === 'vertical' ) {\n\t\tconst _listGapValue = listGapValue;\n\t\tconst _gapValue = gapValue;\n\t\tlistGapValue = _gapValue;\n\t\tgapValue = _listGapValue;\n\t}\n\n\t// The unstable tabs list gap calculation requires a real value (such as `0px`) and not `0`.\n\tconst gapMap = {\n\t\t'--wp--style--unstable-tabs-list-gap':\n\t\t\tlistGapValue === '0' ? '0px' : listGapValue,\n\t\t'--wp--style--unstable-tabs-gap': gapValue,\n\t};\n\n\treturn gapMap;\n}\n\n/**\n * Gets the color styles for the tab block.\n *\n * @param {Object} props\n * @param {Object} props.attributes Block attributes\n * @return {Object} CSS custom properties for color styles\n */\nfunction getColorStyles( { attributes } ) {\n\tconst {\n\t\tcustomTabInactiveColor,\n\t\tcustomTabHoverColor,\n\t\tcustomTabActiveColor,\n\t\tcustomTabTextColor,\n\t\tcustomTabActiveTextColor,\n\t\tcustomTabHoverTextColor,\n\t} = attributes || {};\n\n\t// Helper to normalize color objects (preset { slug } vs direct value).\n\tfunction getColorValue( color ) {\n\t\tif ( ! color ) {\n\t\t\treturn null;\n\t\t}\n\t\tif ( typeof color === 'object' && color.slug ) {\n\t\t\treturn `var(--wp--preset--color--${ color.slug })`;\n\t\t}\n\t\treturn color;\n\t}\n\n\tconst colorVarMap = {\n\t\t'--custom-tab-inactive-color': getColorValue( customTabInactiveColor ),\n\t\t'--custom-tab-active-color': getColorValue( customTabActiveColor ),\n\t\t'--custom-tab-hover-color': getColorValue( customTabHoverColor ),\n\t\t'--custom-tab-text-color': getColorValue( customTabTextColor ),\n\t\t'--custom-tab-active-text-color': getColorValue(\n\t\t\tcustomTabActiveTextColor\n\t\t),\n\t\t'--custom-tab-hover-text-color': getColorValue(\n\t\t\tcustomTabHoverTextColor\n\t\t),\n\t};\n\n\treturn colorVarMap;\n}\n\n/**\n * Injects color CSS custom properties for the tabs block, mirroring the pattern\n * used by gap-styles (scoped to `#block-{ clientId }`). This replaces the prior\n * inline-style object return value approach so that these values participate in\n * style engine cascade like other dynamic style overrides.\n *\n * @param {Object} props\n * @param {Object} props.attributes Block attributes\n * @param {string} props.clientId   Block client ID\n * @return {null} No UI output\n */\nexport default function StyleEngine( { attributes, clientId } ) {\n\tconst gapVarMap = getGapStyles( { attributes } );\n\tconst colorVarMap = getColorStyles( { attributes } );\n\n\tconst styleVarMap = {\n\t\t...gapVarMap,\n\t\t...colorVarMap,\n\t};\n\n\t// Build scoped CSS only for defined values to avoid unnecessary empty declarations.\n\tconst declarations = Object.entries( styleVarMap )\n\t\t.filter( ( [ , value ] ) => !! value )\n\t\t.map( ( [ name, value ] ) => `\\t${ name }: ${ value };` )\n\t\t.join( '\\n' );\n\n\tuseStyleOverride( {\n\t\tcss: clientId ? `#block-${ clientId } {\\n${ declarations }\\n}` : '',\n\t} );\n\n\treturn null;\n}\n"],
+  "mappings": ";AAGA;AAAA,EACC,gCAAgC;AAAA,EAChC;AAAA,OACM;AAQP,SAAS,aAAc,EAAE,WAAW,GAAI;AACvC,QAAM,EAAE,OAAO,YAAY,IAAI,cAAc,CAAC;AAC9C,QAAM,EAAE,QAAQ,IAAI,SAAS,CAAC;AAC9B,QAAM,EAAE,SAAS,IAAI,WAAW,CAAC;AAGjC,QAAM,gBAAgB;AACtB,MAAI,eAAe;AACnB,MAAI,WAAW;AAGf,MAAK,CAAC,CAAE,UAAW;AAClB,mBACC,OAAO,aAAa,WACjB,eAAgB,QAAS,IACzB,eAAgB,UAAU,IAAK,KAAK;AACxC,eACC,OAAO,aAAa,WACjB,eAAgB,QAAS,IACzB,eAAgB,UAAU,GAAI,KAAK;AAAA,EACxC;AAEA,MAAK,gBAAgB,YAAa;AACjC,UAAM,gBAAgB;AACtB,UAAM,YAAY;AAClB,mBAAe;AACf,eAAW;AAAA,EACZ;AAGA,QAAM,SAAS;AAAA,IACd,uCACC,iBAAiB,MAAM,QAAQ;AAAA,IAChC,kCAAkC;AAAA,EACnC;AAEA,SAAO;AACR;AASA,SAAS,eAAgB,EAAE,WAAW,GAAI;AACzC,QAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,IAAI,cAAc,CAAC;AAGnB,WAAS,cAAe,OAAQ;AAC/B,QAAK,CAAE,OAAQ;AACd,aAAO;AAAA,IACR;AACA,QAAK,OAAO,UAAU,YAAY,MAAM,MAAO;AAC9C,aAAO,4BAA6B,MAAM,IAAK;AAAA,IAChD;AACA,WAAO;AAAA,EACR;AAEA,QAAM,cAAc;AAAA,IACnB,+BAA+B,cAAe,sBAAuB;AAAA,IACrE,6BAA6B,cAAe,oBAAqB;AAAA,IACjE,4BAA4B,cAAe,mBAAoB;AAAA,IAC/D,2BAA2B,cAAe,kBAAmB;AAAA,IAC7D,kCAAkC;AAAA,MACjC;AAAA,IACD;AAAA,IACA,iCAAiC;AAAA,MAChC;AAAA,IACD;AAAA,EACD;AAEA,SAAO;AACR;AAae,SAAR,YAA8B,EAAE,YAAY,SAAS,GAAI;AAC/D,QAAM,YAAY,aAAc,EAAE,WAAW,CAAE;AAC/C,QAAM,cAAc,eAAgB,EAAE,WAAW,CAAE;AAEnD,QAAM,cAAc;AAAA,IACnB,GAAG;AAAA,IACH,GAAG;AAAA,EACJ;AAGA,QAAM,eAAe,OAAO,QAAS,WAAY,EAC/C,OAAQ,CAAE,CAAE,EAAE,KAAM,MAAO,CAAC,CAAE,KAAM,EACpC,IAAK,CAAE,CAAE,MAAM,KAAM,MAAO,IAAM,IAAK,KAAM,KAAM,GAAI,EACvD,KAAM,IAAK;AAEb,mBAAkB;AAAA,IACjB,KAAK,WAAW,UAAW,QAAS;AAAA,EAAQ,YAAa;AAAA,KAAQ;AAAA,EAClE,CAAE;AAEF,SAAO;AACR;",
+  "names": []
+}