@wordpress/components 30.5.1-next.f56bd8138.0 → 30.6.1-next.b8c8708f3.0

package/build-module/tab-panel/index.js

@@ -1,96 +1,44 @@
-/**
- * External dependencies
- */
-import * as Ariakit from '@ariakit/react';
-import clsx from 'clsx';
-/**
- * WordPress dependencies
- */
-import { forwardRef, useEffect, useLayoutEffect, useCallback } from '@wordpress/element';
-import { useInstanceId, usePrevious } from '@wordpress/compose';
-import { isRTL } from '@wordpress/i18n';
-
-/**
- * Internal dependencies
- */
-
-import Button from '../button';
+import * as Ariakit from "@ariakit/react";
+import clsx from "clsx";
+import { forwardRef, useEffect, useLayoutEffect, useCallback } from "@wordpress/element";
+import { useInstanceId, usePrevious } from "@wordpress/compose";
+import { isRTL } from "@wordpress/i18n";
+import Button from "../button";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-// Separate the actual tab name from the instance ID. This is
-// necessary because Ariakit internally uses the element ID when
-// a new tab is selected, but our implementation looks specifically
-// for the tab name to be passed to the `onSelect` callback.
-const extractTabName = id => {
-  if (typeof id === 'undefined' || id === null) {
+const extractTabName = (id) => {
+  if (typeof id === "undefined" || id === null) {
     return;
   }
   return id.match(/^tab-panel-[0-9]*-(.*)/)?.[1];
 };
-
-/**
- * TabPanel is an ARIA-compliant tabpanel.
- *
- * TabPanels organize content across different screens, data sets, and interactions.
- * It has two sections: a list of tabs, and the view to show when tabs are chosen.
- *
- * ```jsx
- * import { TabPanel } from '@wordpress/components';
- *
- * const onSelect = ( tabName ) => {
- *   console.log( 'Selecting tab', tabName );
- * };
- *
- * const MyTabPanel = () => (
- *   <TabPanel
- *     className="my-tab-panel"
- *     activeClass="active-tab"
- *     onSelect={ onSelect }
- *     tabs={ [
- *       {
- *         name: 'tab1',
- *         title: 'Tab 1',
- *         className: 'tab-one',
- *       },
- *       {
- *         name: 'tab2',
- *         title: 'Tab 2',
- *         className: 'tab-two',
- *       },
- *     ] }
- *   >
- *     { ( tab ) => <p>{ tab.title }</p> }
- *   </TabPanel>
- * );
- * ```
- */
 const UnforwardedTabPanel = ({
   className,
   children,
   tabs,
   selectOnMove = true,
   initialTabName,
-  orientation = 'horizontal',
-  activeClass = 'is-active',
+  orientation = "horizontal",
+  activeClass = "is-active",
   onSelect
 }, ref) => {
-  const instanceId = useInstanceId(TabPanel, 'tab-panel');
-  const prependInstanceId = useCallback(tabName => {
-    if (typeof tabName === 'undefined') {
+  const instanceId = useInstanceId(TabPanel, "tab-panel");
+  const prependInstanceId = useCallback((tabName) => {
+    if (typeof tabName === "undefined") {
       return;
     }
     return `${instanceId}-${tabName}`;
   }, [instanceId]);
   const tabStore = Ariakit.useTabStore({
-    setSelectedId: newTabValue => {
-      if (typeof newTabValue === 'undefined' || newTabValue === null) {
+    setSelectedId: (newTabValue) => {
+      if (typeof newTabValue === "undefined" || newTabValue === null) {
         return;
       }
-      const newTab = tabs.find(t => prependInstanceId(t.name) === newTabValue);
+      const newTab = tabs.find((t) => prependInstanceId(t.name) === newTabValue);
       if (newTab?.disabled || newTab === selectedTab) {
         return;
       }
       const simplifiedTabName = extractTabName(newTabValue);
-      if (typeof simplifiedTabName === 'undefined') {
+      if (typeof simplifiedTabName === "undefined") {
         return;
       }
       onSelect?.(simplifiedTabName);
@@ -100,76 +48,60 @@ const UnforwardedTabPanel = ({
     defaultSelectedId: prependInstanceId(initialTabName),
     rtl: isRTL()
   });
-  const selectedTabName = extractTabName(Ariakit.useStoreState(tabStore, 'selectedId'));
-  const setTabStoreSelectedId = useCallback(tabName => {
-    tabStore.setState('selectedId', prependInstanceId(tabName));
+  const selectedTabName = extractTabName(Ariakit.useStoreState(tabStore, "selectedId"));
+  const setTabStoreSelectedId = useCallback((tabName) => {
+    tabStore.setState("selectedId", prependInstanceId(tabName));
   }, [prependInstanceId, tabStore]);
   const selectedTab = tabs.find(({
     name
   }) => name === selectedTabName);
   const previousSelectedTabName = usePrevious(selectedTabName);
-
-  // Ensure `onSelect` is called when the initial tab is selected.
   useEffect(() => {
     if (previousSelectedTabName !== selectedTabName && selectedTabName === initialTabName && !!selectedTabName) {
       onSelect?.(selectedTabName);
     }
   }, [selectedTabName, initialTabName, onSelect, previousSelectedTabName]);
-
-  // Handle selecting the initial tab.
   useLayoutEffect(() => {
-    // If there's a selected tab, don't override it.
     if (selectedTab) {
       return;
     }
-    const initialTab = tabs.find(tab => tab.name === initialTabName);
-    // Wait for the denoted initial tab to be declared before making a
-    // selection. This ensures that if a tab is declared lazily it can
-    // still receive initial selection.
+    const initialTab = tabs.find((tab) => tab.name === initialTabName);
     if (initialTabName && !initialTab) {
       return;
     }
     if (initialTab && !initialTab.disabled) {
-      // Select the initial tab if it's not disabled.
       setTabStoreSelectedId(initialTab.name);
     } else {
-      // Fallback to the first enabled tab when the initial tab is
-      // disabled or it can't be found.
-      const firstEnabledTab = tabs.find(tab => !tab.disabled);
+      const firstEnabledTab = tabs.find((tab) => !tab.disabled);
       if (firstEnabledTab) {
         setTabStoreSelectedId(firstEnabledTab.name);
       }
     }
   }, [tabs, selectedTab, initialTabName, instanceId, setTabStoreSelectedId]);
-
-  // Handle the currently selected tab becoming disabled.
   useEffect(() => {
-    // This effect only runs when the selected tab is defined and becomes disabled.
     if (!selectedTab?.disabled) {
       return;
     }
-    const firstEnabledTab = tabs.find(tab => !tab.disabled);
-    // If the currently selected tab becomes disabled, select the first enabled tab.
-    // (if there is one).
+    const firstEnabledTab = tabs.find((tab) => !tab.disabled);
     if (firstEnabledTab) {
       setTabStoreSelectedId(firstEnabledTab.name);
     }
   }, [tabs, selectedTab?.disabled, setTabStoreSelectedId, instanceId]);
-  return /*#__PURE__*/_jsxs("div", {
-    className: className,
-    ref: ref,
-    children: [/*#__PURE__*/_jsx(Ariakit.TabList, {
+  return /* @__PURE__ */ _jsxs("div", {
+    className,
+    ref,
+    children: [/* @__PURE__ */ _jsx(Ariakit.TabList, {
       store: tabStore,
       className: "components-tab-panel__tabs",
-      children: tabs.map(tab => {
-        return /*#__PURE__*/_jsx(Ariakit.Tab, {
+      children: tabs.map((tab) => {
+        return /* @__PURE__ */ _jsx(Ariakit.Tab, {
           id: prependInstanceId(tab.name),
-          className: clsx('components-tab-panel__tabs-item', tab.className, {
+          className: clsx("components-tab-panel__tabs-item", tab.className, {
             [activeClass]: tab.name === selectedTabName
           }),
           disabled: tab.disabled,
           "aria-controls": `${prependInstanceId(tab.name)}-view`,
-          render: /*#__PURE__*/_jsx(Button, {
+          render: /* @__PURE__ */ _jsx(Button, {
             __next40pxDefaultSize: true,
             icon: tab.icon,
             label: tab.icon && tab.title,
@@ -178,7 +110,7 @@ const UnforwardedTabPanel = ({
           children: !tab.icon && tab.title
         }, tab.name);
       })
-    }), selectedTab && /*#__PURE__*/_jsx(Ariakit.TabPanel, {
+    }), selectedTab && /* @__PURE__ */ _jsx(Ariakit.TabPanel, {
       id: `${prependInstanceId(selectedTab.name)}-view`,
       store: tabStore,
       tabId: prependInstanceId(selectedTab.name),
@@ -187,6 +119,10 @@ const UnforwardedTabPanel = ({
     })]
   });
 };
-export const TabPanel = forwardRef(UnforwardedTabPanel);
-export default TabPanel;
-//# sourceMappingURL=index.js.map
+const TabPanel = forwardRef(UnforwardedTabPanel);
+var tab_panel_default = TabPanel;
+export {
+  TabPanel,
+  tab_panel_default as default
+};
+//# sourceMappingURL=index.js.map

package/build-module/tab-panel/index.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["Ariakit","clsx","forwardRef","useEffect","useLayoutEffect","useCallback","useInstanceId","usePrevious","isRTL","Button","jsx","_jsx","jsxs","_jsxs","extractTabName","id","match","UnforwardedTabPanel","className","children","tabs","selectOnMove","initialTabName","orientation","activeClass","onSelect","ref","instanceId","TabPanel","prependInstanceId","tabName","tabStore","useTabStore","setSelectedId","newTabValue","newTab","find","t","name","disabled","selectedTab","simplifiedTabName","defaultSelectedId","rtl","selectedTabName","useStoreState","setTabStoreSelectedId","setState","previousSelectedTabName","initialTab","tab","firstEnabledTab","TabList","store","map","Tab","render","__next40pxDefaultSize","icon","label","title","showTooltip","tabId"],"sources":["@wordpress/components/src/tab-panel/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\nimport clsx from 'clsx';\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tforwardRef,\n\tuseEffect,\n\tuseLayoutEffect,\n\tuseCallback,\n} from '@wordpress/element';\nimport { useInstanceId, usePrevious } from '@wordpress/compose';\nimport { isRTL } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\n\nimport Button from '../button';\nimport type { TabPanelProps } from './types';\nimport type { WordPressComponentProps } from '../context';\n\n// Separate the actual tab name from the instance ID. This is\n// necessary because Ariakit internally uses the element ID when\n// a new tab is selected, but our implementation looks specifically\n// for the tab name to be passed to the `onSelect` callback.\nconst extractTabName = ( id: string | undefined | null ) => {\n\tif ( typeof id === 'undefined' || id === null ) {\n\t\treturn;\n\t}\n\treturn id.match( /^tab-panel-[0-9]*-(.*)/ )?.[ 1 ];\n};\n\n/**\n * TabPanel is an ARIA-compliant tabpanel.\n *\n * TabPanels organize content across different screens, data sets, and interactions.\n * It has two sections: a list of tabs, and the view to show when tabs are chosen.\n *\n * ```jsx\n * import { TabPanel } from '@wordpress/components';\n *\n * const onSelect = ( tabName ) => {\n *   console.log( 'Selecting tab', tabName );\n * };\n *\n * const MyTabPanel = () => (\n *   <TabPanel\n *     className=\"my-tab-panel\"\n *     activeClass=\"active-tab\"\n *     onSelect={ onSelect }\n *     tabs={ [\n *       {\n *         name: 'tab1',\n *         title: 'Tab 1',\n *         className: 'tab-one',\n *       },\n *       {\n *         name: 'tab2',\n *         title: 'Tab 2',\n *         className: 'tab-two',\n *       },\n *     ] }\n *   >\n *     { ( tab ) => <p>{ tab.title }</p> }\n *   </TabPanel>\n * );\n * ```\n */\nconst UnforwardedTabPanel = (\n\t{\n\t\tclassName,\n\t\tchildren,\n\t\ttabs,\n\t\tselectOnMove = true,\n\t\tinitialTabName,\n\t\torientation = 'horizontal',\n\t\tactiveClass = 'is-active',\n\t\tonSelect,\n\t}: WordPressComponentProps< TabPanelProps, 'div', false >,\n\tref: ForwardedRef< any >\n) => {\n\tconst instanceId = useInstanceId( TabPanel, 'tab-panel' );\n\n\tconst prependInstanceId = useCallback(\n\t\t( tabName: string | undefined ) => {\n\t\t\tif ( typeof tabName === 'undefined' ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\treturn `${ instanceId }-${ tabName }`;\n\t\t},\n\t\t[ instanceId ]\n\t);\n\n\tconst tabStore = Ariakit.useTabStore( {\n\t\tsetSelectedId: ( newTabValue ) => {\n\t\t\tif ( typeof newTabValue === 'undefined' || newTabValue === null ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst newTab = tabs.find(\n\t\t\t\t( t ) => prependInstanceId( t.name ) === newTabValue\n\t\t\t);\n\t\t\tif ( newTab?.disabled || newTab === selectedTab ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst simplifiedTabName = extractTabName( newTabValue );\n\t\t\tif ( typeof simplifiedTabName === 'undefined' ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tonSelect?.( simplifiedTabName );\n\t\t},\n\t\torientation,\n\t\tselectOnMove,\n\t\tdefaultSelectedId: prependInstanceId( initialTabName ),\n\t\trtl: isRTL(),\n\t} );\n\n\tconst selectedTabName = extractTabName(\n\t\tAriakit.useStoreState( tabStore, 'selectedId' )\n\t);\n\n\tconst setTabStoreSelectedId = useCallback(\n\t\t( tabName: string ) => {\n\t\t\ttabStore.setState( 'selectedId', prependInstanceId( tabName ) );\n\t\t},\n\t\t[ prependInstanceId, tabStore ]\n\t);\n\n\tconst selectedTab = tabs.find( ( { name } ) => name === selectedTabName );\n\n\tconst previousSelectedTabName = usePrevious( selectedTabName );\n\n\t// Ensure `onSelect` is called when the initial tab is selected.\n\tuseEffect( () => {\n\t\tif (\n\t\t\tpreviousSelectedTabName !== selectedTabName &&\n\t\t\tselectedTabName === initialTabName &&\n\t\t\t!! selectedTabName\n\t\t) {\n\t\t\tonSelect?.( selectedTabName );\n\t\t}\n\t}, [ selectedTabName, initialTabName, onSelect, previousSelectedTabName ] );\n\n\t// Handle selecting the initial tab.\n\tuseLayoutEffect( () => {\n\t\t// If there's a selected tab, don't override it.\n\t\tif ( selectedTab ) {\n\t\t\treturn;\n\t\t}\n\t\tconst initialTab = tabs.find( ( tab ) => tab.name === initialTabName );\n\t\t// Wait for the denoted initial tab to be declared before making a\n\t\t// selection. This ensures that if a tab is declared lazily it can\n\t\t// still receive initial selection.\n\t\tif ( initialTabName && ! initialTab ) {\n\t\t\treturn;\n\t\t}\n\t\tif ( initialTab && ! initialTab.disabled ) {\n\t\t\t// Select the initial tab if it's not disabled.\n\t\t\tsetTabStoreSelectedId( initialTab.name );\n\t\t} else {\n\t\t\t// Fallback to the first enabled tab when the initial tab is\n\t\t\t// disabled or it can't be found.\n\t\t\tconst firstEnabledTab = tabs.find( ( tab ) => ! tab.disabled );\n\t\t\tif ( firstEnabledTab ) {\n\t\t\t\tsetTabStoreSelectedId( firstEnabledTab.name );\n\t\t\t}\n\t\t}\n\t}, [\n\t\ttabs,\n\t\tselectedTab,\n\t\tinitialTabName,\n\t\tinstanceId,\n\t\tsetTabStoreSelectedId,\n\t] );\n\n\t// Handle the currently selected tab becoming disabled.\n\tuseEffect( () => {\n\t\t// This effect only runs when the selected tab is defined and becomes disabled.\n\t\tif ( ! selectedTab?.disabled ) {\n\t\t\treturn;\n\t\t}\n\t\tconst firstEnabledTab = tabs.find( ( tab ) => ! tab.disabled );\n\t\t// If the currently selected tab becomes disabled, select the first enabled tab.\n\t\t// (if there is one).\n\t\tif ( firstEnabledTab ) {\n\t\t\tsetTabStoreSelectedId( firstEnabledTab.name );\n\t\t}\n\t}, [ tabs, selectedTab?.disabled, setTabStoreSelectedId, instanceId ] );\n\treturn (\n\t\t<div className={ className } ref={ ref }>\n\t\t\t<Ariakit.TabList\n\t\t\t\tstore={ tabStore }\n\t\t\t\tclassName=\"components-tab-panel__tabs\"\n\t\t\t>\n\t\t\t\t{ tabs.map( ( tab ) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<Ariakit.Tab\n\t\t\t\t\t\t\tkey={ tab.name }\n\t\t\t\t\t\t\tid={ prependInstanceId( tab.name ) }\n\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t'components-tab-panel__tabs-item',\n\t\t\t\t\t\t\t\ttab.className,\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t[ activeClass ]:\n\t\t\t\t\t\t\t\t\t\ttab.name === selectedTabName,\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tdisabled={ tab.disabled }\n\t\t\t\t\t\t\taria-controls={ `${ prependInstanceId(\n\t\t\t\t\t\t\t\ttab.name\n\t\t\t\t\t\t\t) }-view` }\n\t\t\t\t\t\t\trender={\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t\ticon={ tab.icon }\n\t\t\t\t\t\t\t\t\tlabel={ tab.icon && tab.title }\n\t\t\t\t\t\t\t\t\tshowTooltip={ !! tab.icon }\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\t{ ! tab.icon && tab.title }\n\t\t\t\t\t\t</Ariakit.Tab>\n\t\t\t\t\t);\n\t\t\t\t} ) }\n\t\t\t</Ariakit.TabList>\n\t\t\t{ selectedTab && (\n\t\t\t\t<Ariakit.TabPanel\n\t\t\t\t\tid={ `${ prependInstanceId( selectedTab.name ) }-view` }\n\t\t\t\t\tstore={ tabStore }\n\t\t\t\t\ttabId={ prependInstanceId( selectedTab.name ) }\n\t\t\t\t\tclassName=\"components-tab-panel__tab-content\"\n\t\t\t\t>\n\t\t\t\t\t{ children( selectedTab ) }\n\t\t\t\t</Ariakit.TabPanel>\n\t\t\t) }\n\t\t</div>\n\t);\n};\n\nexport const TabPanel = forwardRef( UnforwardedTabPanel );\nexport default TabPanel;\n"],"mappings":"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","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../src/tab-panel/index.tsx"],
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\nimport clsx from 'clsx';\n/**\n * WordPress dependencies\n */\nimport { forwardRef, useEffect, useLayoutEffect, useCallback } from '@wordpress/element';\nimport { useInstanceId, usePrevious } from '@wordpress/compose';\nimport { isRTL } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\n\nimport Button from '../button';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\n// Separate the actual tab name from the instance ID. This is\n// necessary because Ariakit internally uses the element ID when\n// a new tab is selected, but our implementation looks specifically\n// for the tab name to be passed to the `onSelect` callback.\nconst extractTabName = id => {\n  if (typeof id === 'undefined' || id === null) {\n    return;\n  }\n  return id.match(/^tab-panel-[0-9]*-(.*)/)?.[1];\n};\n\n/**\n * TabPanel is an ARIA-compliant tabpanel.\n *\n * TabPanels organize content across different screens, data sets, and interactions.\n * It has two sections: a list of tabs, and the view to show when tabs are chosen.\n *\n * ```jsx\n * import { TabPanel } from '@wordpress/components';\n *\n * const onSelect = ( tabName ) => {\n *   console.log( 'Selecting tab', tabName );\n * };\n *\n * const MyTabPanel = () => (\n *   <TabPanel\n *     className=\"my-tab-panel\"\n *     activeClass=\"active-tab\"\n *     onSelect={ onSelect }\n *     tabs={ [\n *       {\n *         name: 'tab1',\n *         title: 'Tab 1',\n *         className: 'tab-one',\n *       },\n *       {\n *         name: 'tab2',\n *         title: 'Tab 2',\n *         className: 'tab-two',\n *       },\n *     ] }\n *   >\n *     { ( tab ) => <p>{ tab.title }</p> }\n *   </TabPanel>\n * );\n * ```\n */\nconst UnforwardedTabPanel = ({\n  className,\n  children,\n  tabs,\n  selectOnMove = true,\n  initialTabName,\n  orientation = 'horizontal',\n  activeClass = 'is-active',\n  onSelect\n}, ref) => {\n  const instanceId = useInstanceId(TabPanel, 'tab-panel');\n  const prependInstanceId = useCallback(tabName => {\n    if (typeof tabName === 'undefined') {\n      return;\n    }\n    return `${instanceId}-${tabName}`;\n  }, [instanceId]);\n  const tabStore = Ariakit.useTabStore({\n    setSelectedId: newTabValue => {\n      if (typeof newTabValue === 'undefined' || newTabValue === null) {\n        return;\n      }\n      const newTab = tabs.find(t => prependInstanceId(t.name) === newTabValue);\n      if (newTab?.disabled || newTab === selectedTab) {\n        return;\n      }\n      const simplifiedTabName = extractTabName(newTabValue);\n      if (typeof simplifiedTabName === 'undefined') {\n        return;\n      }\n      onSelect?.(simplifiedTabName);\n    },\n    orientation,\n    selectOnMove,\n    defaultSelectedId: prependInstanceId(initialTabName),\n    rtl: isRTL()\n  });\n  const selectedTabName = extractTabName(Ariakit.useStoreState(tabStore, 'selectedId'));\n  const setTabStoreSelectedId = useCallback(tabName => {\n    tabStore.setState('selectedId', prependInstanceId(tabName));\n  }, [prependInstanceId, tabStore]);\n  const selectedTab = tabs.find(({\n    name\n  }) => name === selectedTabName);\n  const previousSelectedTabName = usePrevious(selectedTabName);\n\n  // Ensure `onSelect` is called when the initial tab is selected.\n  useEffect(() => {\n    if (previousSelectedTabName !== selectedTabName && selectedTabName === initialTabName && !!selectedTabName) {\n      onSelect?.(selectedTabName);\n    }\n  }, [selectedTabName, initialTabName, onSelect, previousSelectedTabName]);\n\n  // Handle selecting the initial tab.\n  useLayoutEffect(() => {\n    // If there's a selected tab, don't override it.\n    if (selectedTab) {\n      return;\n    }\n    const initialTab = tabs.find(tab => tab.name === initialTabName);\n    // Wait for the denoted initial tab to be declared before making a\n    // selection. This ensures that if a tab is declared lazily it can\n    // still receive initial selection.\n    if (initialTabName && !initialTab) {\n      return;\n    }\n    if (initialTab && !initialTab.disabled) {\n      // Select the initial tab if it's not disabled.\n      setTabStoreSelectedId(initialTab.name);\n    } else {\n      // Fallback to the first enabled tab when the initial tab is\n      // disabled or it can't be found.\n      const firstEnabledTab = tabs.find(tab => !tab.disabled);\n      if (firstEnabledTab) {\n        setTabStoreSelectedId(firstEnabledTab.name);\n      }\n    }\n  }, [tabs, selectedTab, initialTabName, instanceId, setTabStoreSelectedId]);\n\n  // Handle the currently selected tab becoming disabled.\n  useEffect(() => {\n    // This effect only runs when the selected tab is defined and becomes disabled.\n    if (!selectedTab?.disabled) {\n      return;\n    }\n    const firstEnabledTab = tabs.find(tab => !tab.disabled);\n    // If the currently selected tab becomes disabled, select the first enabled tab.\n    // (if there is one).\n    if (firstEnabledTab) {\n      setTabStoreSelectedId(firstEnabledTab.name);\n    }\n  }, [tabs, selectedTab?.disabled, setTabStoreSelectedId, instanceId]);\n  return /*#__PURE__*/_jsxs(\"div\", {\n    className: className,\n    ref: ref,\n    children: [/*#__PURE__*/_jsx(Ariakit.TabList, {\n      store: tabStore,\n      className: \"components-tab-panel__tabs\",\n      children: tabs.map(tab => {\n        return /*#__PURE__*/_jsx(Ariakit.Tab, {\n          id: prependInstanceId(tab.name),\n          className: clsx('components-tab-panel__tabs-item', tab.className, {\n            [activeClass]: tab.name === selectedTabName\n          }),\n          disabled: tab.disabled,\n          \"aria-controls\": `${prependInstanceId(tab.name)}-view`,\n          render: /*#__PURE__*/_jsx(Button, {\n            __next40pxDefaultSize: true,\n            icon: tab.icon,\n            label: tab.icon && tab.title,\n            showTooltip: !!tab.icon\n          }),\n          children: !tab.icon && tab.title\n        }, tab.name);\n      })\n    }), selectedTab && /*#__PURE__*/_jsx(Ariakit.TabPanel, {\n      id: `${prependInstanceId(selectedTab.name)}-view`,\n      store: tabStore,\n      tabId: prependInstanceId(selectedTab.name),\n      className: \"components-tab-panel__tab-content\",\n      children: children(selectedTab)\n    })]\n  });\n};\nexport const TabPanel = forwardRef(UnforwardedTabPanel);\nexport default TabPanel;"],
+  "mappings": "AAGA,YAAY,aAAa;AACzB,OAAO,UAAU;AAIjB,SAAS,YAAY,WAAW,iBAAiB,mBAAmB;AACpE,SAAS,eAAe,mBAAmB;AAC3C,SAAS,aAAa;AAMtB,OAAO,YAAY;AACnB,SAAS,OAAO,MAAM,QAAQ,aAAa;AAK3C,MAAM,iBAAiB,QAAM;AAC3B,MAAI,OAAO,OAAO,eAAe,OAAO,MAAM;AAC5C;AAAA,EACF;AACA,SAAO,GAAG,MAAM,wBAAwB,IAAI,CAAC;AAC/C;AAsCA,MAAM,sBAAsB,CAAC;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AAAA,EACf;AAAA,EACA,cAAc;AAAA,EACd,cAAc;AAAA,EACd;AACF,GAAG,QAAQ;AACT,QAAM,aAAa,cAAc,UAAU,WAAW;AACtD,QAAM,oBAAoB,YAAY,aAAW;AAC/C,QAAI,OAAO,YAAY,aAAa;AAClC;AAAA,IACF;AACA,WAAO,GAAG,UAAU,IAAI,OAAO;AAAA,EACjC,GAAG,CAAC,UAAU,CAAC;AACf,QAAM,WAAW,QAAQ,YAAY;AAAA,IACnC,eAAe,iBAAe;AAC5B,UAAI,OAAO,gBAAgB,eAAe,gBAAgB,MAAM;AAC9D;AAAA,MACF;AACA,YAAM,SAAS,KAAK,KAAK,OAAK,kBAAkB,EAAE,IAAI,MAAM,WAAW;AACvE,UAAI,QAAQ,YAAY,WAAW,aAAa;AAC9C;AAAA,MACF;AACA,YAAM,oBAAoB,eAAe,WAAW;AACpD,UAAI,OAAO,sBAAsB,aAAa;AAC5C;AAAA,MACF;AACA,iBAAW,iBAAiB;AAAA,IAC9B;AAAA,IACA;AAAA,IACA;AAAA,IACA,mBAAmB,kBAAkB,cAAc;AAAA,IACnD,KAAK,MAAM;AAAA,EACb,CAAC;AACD,QAAM,kBAAkB,eAAe,QAAQ,cAAc,UAAU,YAAY,CAAC;AACpF,QAAM,wBAAwB,YAAY,aAAW;AACnD,aAAS,SAAS,cAAc,kBAAkB,OAAO,CAAC;AAAA,EAC5D,GAAG,CAAC,mBAAmB,QAAQ,CAAC;AAChC,QAAM,cAAc,KAAK,KAAK,CAAC;AAAA,IAC7B;AAAA,EACF,MAAM,SAAS,eAAe;AAC9B,QAAM,0BAA0B,YAAY,eAAe;AAG3D,YAAU,MAAM;AACd,QAAI,4BAA4B,mBAAmB,oBAAoB,kBAAkB,CAAC,CAAC,iBAAiB;AAC1G,iBAAW,eAAe;AAAA,IAC5B;AAAA,EACF,GAAG,CAAC,iBAAiB,gBAAgB,UAAU,uBAAuB,CAAC;AAGvE,kBAAgB,MAAM;AAEpB,QAAI,aAAa;AACf;AAAA,IACF;AACA,UAAM,aAAa,KAAK,KAAK,SAAO,IAAI,SAAS,cAAc;AAI/D,QAAI,kBAAkB,CAAC,YAAY;AACjC;AAAA,IACF;AACA,QAAI,cAAc,CAAC,WAAW,UAAU;AAEtC,4BAAsB,WAAW,IAAI;AAAA,IACvC,OAAO;AAGL,YAAM,kBAAkB,KAAK,KAAK,SAAO,CAAC,IAAI,QAAQ;AACtD,UAAI,iBAAiB;AACnB,8BAAsB,gBAAgB,IAAI;AAAA,MAC5C;AAAA,IACF;AAAA,EACF,GAAG,CAAC,MAAM,aAAa,gBAAgB,YAAY,qBAAqB,CAAC;AAGzE,YAAU,MAAM;AAEd,QAAI,CAAC,aAAa,UAAU;AAC1B;AAAA,IACF;AACA,UAAM,kBAAkB,KAAK,KAAK,SAAO,CAAC,IAAI,QAAQ;AAGtD,QAAI,iBAAiB;AACnB,4BAAsB,gBAAgB,IAAI;AAAA,IAC5C;AAAA,EACF,GAAG,CAAC,MAAM,aAAa,UAAU,uBAAuB,UAAU,CAAC;AACnE,SAAoB,sBAAM,OAAO;AAAA,IAC/B;AAAA,IACA;AAAA,IACA,UAAU,CAAc,qBAAK,QAAQ,SAAS;AAAA,MAC5C,OAAO;AAAA,MACP,WAAW;AAAA,MACX,UAAU,KAAK,IAAI,SAAO;AACxB,eAAoB,qBAAK,QAAQ,KAAK;AAAA,UACpC,IAAI,kBAAkB,IAAI,IAAI;AAAA,UAC9B,WAAW,KAAK,mCAAmC,IAAI,WAAW;AAAA,YAChE,CAAC,WAAW,GAAG,IAAI,SAAS;AAAA,UAC9B,CAAC;AAAA,UACD,UAAU,IAAI;AAAA,UACd,iBAAiB,GAAG,kBAAkB,IAAI,IAAI,CAAC;AAAA,UAC/C,QAAqB,qBAAK,QAAQ;AAAA,YAChC,uBAAuB;AAAA,YACvB,MAAM,IAAI;AAAA,YACV,OAAO,IAAI,QAAQ,IAAI;AAAA,YACvB,aAAa,CAAC,CAAC,IAAI;AAAA,UACrB,CAAC;AAAA,UACD,UAAU,CAAC,IAAI,QAAQ,IAAI;AAAA,QAC7B,GAAG,IAAI,IAAI;AAAA,MACb,CAAC;AAAA,IACH,CAAC,GAAG,eAA4B,qBAAK,QAAQ,UAAU;AAAA,MACrD,IAAI,GAAG,kBAAkB,YAAY,IAAI,CAAC;AAAA,MAC1C,OAAO;AAAA,MACP,OAAO,kBAAkB,YAAY,IAAI;AAAA,MACzC,WAAW;AAAA,MACX,UAAU,SAAS,WAAW;AAAA,IAChC,CAAC,CAAC;AAAA,EACJ,CAAC;AACH;AACO,MAAM,WAAW,WAAW,mBAAmB;AACtD,IAAO,oBAAQ;",
+  "names": []
+}

package/build-module/tab-panel/types.js

@@ -1,2 +1 @@
-export {};
-//# sourceMappingURL=types.js.map
+//# sourceMappingURL=types.js.map

package/build-module/tab-panel/types.js.map

@@ -1 +1,7 @@
-{"version":3,"names":[],"sources":["@wordpress/components/src/tab-panel/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactNode } from 'react';\n\n/**\n * Internal dependencies\n */\nimport type { IconType } from '../icon';\n\ntype Tab = {\n\t/**\n\t * The key of the tab.\n\t */\n\tname: string;\n\t/**\n\t * The label of the tab.\n\t */\n\ttitle: string;\n\t/**\n\t * The class name to apply to the tab button.\n\t */\n\tclassName?: string;\n\t/**\n\t * The icon used for the tab button.\n\t */\n\ticon?: IconType;\n\t/**\n\t * Determines if the tab button should be disabled.\n\t */\n\tdisabled?: boolean;\n} & Record< any, any >;\n\nexport type TabPanelProps = {\n\t/**\n\t * The class name to add to the active tab.\n\t *\n\t * @default 'is-active'\n\t */\n\tactiveClass?: string;\n\t/**\n\t * A function which renders the tabviews given the selected tab.\n\t * The function is passed the active tab object as an argument as defined by the tabs prop.\n\t */\n\tchildren: ( tab: Tab ) => ReactNode;\n\t/**\n\t * The class name to give to the outer container for the TabPanel.\n\t */\n\tclassName?: string;\n\t/**\n\t * The name of the tab to be selected upon mounting of component.\n\t * If this prop is not set, the first tab will be selected by default.\n\t */\n\tinitialTabName?: string;\n\t/**\n\t * The function called when a tab has been selected.\n\t * It is passed the `tabName` as an argument.\n\t */\n\tonSelect?: ( tabName: string ) => void;\n\t/**\n\t * The orientation of the tablist.\n\t *\n\t * @default `horizontal`\n\t */\n\torientation?: 'horizontal' | 'vertical';\n\t/**\n\t * Array of tab objects. Each tab object should contain at least a `name` and a `title`.\n\t */\n\ttabs: Tab[];\n\t/**\n\t * When `true`, the tab will be selected when receiving focus (automatic tab\n\t * activation). When `false`, the tab will be selected only when clicked\n\t * (manual tab activation). See the official W3C docs for more info.\n\t * .\n\t *\n\t * @default true\n\t *\n\t * @see https://www.w3.org/WAI/ARIA/apg/patterns/tabpanel/\n\t */\n\tselectOnMove?: boolean;\n};\n"],"mappings":"","ignoreList":[]}
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

package/build-module/tabs/context.js

@@ -1,13 +1,9 @@
-/**
- * WordPress dependencies
- */
-import { createContext, useContext } from '@wordpress/element';
-
-/**
- * Internal dependencies
- */
-
-export const TabsContext = createContext(undefined);
-TabsContext.displayName = 'TabsContext';
-export const useTabsContext = () => useContext(TabsContext);
-//# sourceMappingURL=context.js.map
+import { createContext, useContext } from "@wordpress/element";
+const TabsContext = createContext(void 0);
+TabsContext.displayName = "TabsContext";
+const useTabsContext = () => useContext(TabsContext);
+export {
+  TabsContext,
+  useTabsContext
+};
+//# sourceMappingURL=context.js.map

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

@@ -1 +1,7 @@
-{"version":3,"names":["createContext","useContext","TabsContext","undefined","displayName","useTabsContext"],"sources":["@wordpress/components/src/tabs/context.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createContext, useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { TabsContextProps } from './types';\n\nexport const TabsContext = createContext< TabsContextProps >( undefined );\nTabsContext.displayName = 'TabsContext';\n\nexport const useTabsContext = () => useContext( TabsContext );\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,aAAa,EAAEC,UAAU,QAAQ,oBAAoB;;AAE9D;AACA;AACA;;AAGA,OAAO,MAAMC,WAAW,GAAGF,aAAa,CAAsBG,SAAU,CAAC;AACzED,WAAW,CAACE,WAAW,GAAG,aAAa;AAEvC,OAAO,MAAMC,cAAc,GAAGA,CAAA,KAAMJ,UAAU,CAAEC,WAAY,CAAC","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../src/tabs/context.ts"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { createContext, useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\n\nexport const TabsContext = createContext(undefined);\nTabsContext.displayName = 'TabsContext';\nexport const useTabsContext = () => useContext(TabsContext);"],
+  "mappings": "AAGA,SAAS,eAAe,kBAAkB;AAMnC,MAAM,cAAc,cAAc,MAAS;AAClD,YAAY,cAAc;AACnB,MAAM,iBAAiB,MAAM,WAAW,WAAW;",
+  "names": []
+}

package/build-module/tabs/docs-manifest.json

@@ -0,0 +1,22 @@
+{
+	"$schema": "../../schemas/docs-manifest.json",
+	"displayName": "Tabs",
+	"filePath": "./index.tsx",
+	"subcomponents": [
+		{
+			"displayName": "TabList",
+			"preferredDisplayName": "Tabs.TabList",
+			"filePath": "./tablist.tsx"
+		},
+		{
+			"displayName": "Tab",
+			"preferredDisplayName": "Tabs.Tab",
+			"filePath": "./tab.tsx"
+		},
+		{
+			"displayName": "TabPanel",
+			"preferredDisplayName": "Tabs.TabPanel",
+			"filePath": "./tabpanel.tsx"
+		}
+	]
+}

package/build-module/tabs/index.js

@@ -1,45 +1,22 @@
-/**
- * External dependencies
- */
-import * as Ariakit from '@ariakit/react';
-
-/**
- * WordPress dependencies
- */
-import { useInstanceId } from '@wordpress/compose';
-import { useEffect, useMemo } from '@wordpress/element';
-import { isRTL } from '@wordpress/i18n';
-
-/**
- * Internal dependencies
- */
-
-import { TabsContext } from './context';
-import { Tab } from './tab';
-import { TabList } from './tablist';
-import { TabPanel } from './tabpanel';
+import * as Ariakit from "@ariakit/react";
+import { useInstanceId } from "@wordpress/compose";
+import { useEffect, useMemo } from "@wordpress/element";
+import { isRTL } from "@wordpress/i18n";
+import { TabsContext } from "./context";
+import { Tab } from "./tab";
+import { TabList } from "./tablist";
+import { TabPanel } from "./tabpanel";
 import { jsx as _jsx } from "react/jsx-runtime";
 function externalToInternalTabId(externalId, instanceId) {
   return externalId && `${instanceId}-${externalId}`;
 }
 function internalToExternalTabId(internalId, instanceId) {
-  return typeof internalId === 'string' ? internalId.replace(`${instanceId}-`, '') : internalId;
+  return typeof internalId === "string" ? internalId.replace(`${instanceId}-`, "") : internalId;
 }
-
-/**
- * Tabs is a collection of React components that combine to render
- * an [ARIA-compliant tabs pattern](https://www.w3.org/WAI/ARIA/apg/patterns/tabs/).
- *
- * Tabs organizes content across different screens, data sets, and interactions.
- * It has two sections: a list of tabs, and the view to show when a tab is chosen.
- *
- * `Tabs` itself is a wrapper component and context provider.
- * It is responsible for managing the state of the tabs, and rendering one instance of the `Tabs.TabList` component and one or more instances of the `Tab.TabPanel` component.
- */
-export const Tabs = Object.assign(function Tabs({
+const Tabs = Object.assign(function Tabs2({
   selectOnMove = true,
   defaultTabId,
-  orientation = 'horizontal',
+  orientation = "horizontal",
   onSelect,
   children,
   selectedTabId,
@@ -47,17 +24,17 @@ export const Tabs = Object.assign(function Tabs({
   defaultActiveTabId,
   onActiveTabIdChange
 }) {
-  const instanceId = useInstanceId(Tabs, 'tabs');
+  const instanceId = useInstanceId(Tabs2, "tabs");
   const store = Ariakit.useTabStore({
     selectOnMove,
     orientation,
     defaultSelectedId: externalToInternalTabId(defaultTabId, instanceId),
-    setSelectedId: newSelectedId => {
+    setSelectedId: (newSelectedId) => {
       onSelect?.(internalToExternalTabId(newSelectedId, instanceId));
     },
     selectedId: externalToInternalTabId(selectedTabId, instanceId),
     defaultActiveId: externalToInternalTabId(defaultActiveTabId, instanceId),
-    setActiveId: newActiveId => {
+    setActiveId: (newActiveId) => {
       onActiveTabIdChange?.(internalToExternalTabId(newActiveId, instanceId));
     },
     activeId: externalToInternalTabId(activeTabId, instanceId),
@@ -73,14 +50,9 @@ export const Tabs = Object.assign(function Tabs({
   useEffect(() => {
     requestAnimationFrame(() => {
       const focusedElement = items?.[0]?.element?.ownerDocument.activeElement;
-      if (!focusedElement || !items.some(item => focusedElement === item.element)) {
-        return; // Return early if no tabs are focused.
+      if (!focusedElement || !items.some((item) => focusedElement === item.element)) {
+        return;
       }
-
-      // If, after ariakit re-computes the active tab, that tab doesn't match
-      // the currently focused tab, then we force an update to ariakit to avoid
-      // any mismatches, especially when navigating to previous/next tab with
-      // arrow keys.
       if (activeId !== focusedElement.id) {
         setActiveId(focusedElement.id);
       }
@@ -90,9 +62,9 @@ export const Tabs = Object.assign(function Tabs({
     store,
     instanceId
   }), [store, instanceId]);
-  return /*#__PURE__*/_jsx(TabsContext.Provider, {
+  return /* @__PURE__ */ _jsx(TabsContext.Provider, {
     value: contextValue,
-    children: children
+    children
   });
 }, {
   /**
@@ -102,7 +74,7 @@ export const Tabs = Object.assign(function Tabs({
    * overridden with CSS targeting `[aria-selected="true"]`.
    */
   Tab: Object.assign(Tab, {
-    displayName: 'Tabs.Tab'
+    displayName: "Tabs.Tab"
   }),
   /**
    * A wrapper component for the `Tab` components.
@@ -110,16 +82,19 @@ export const Tabs = Object.assign(function Tabs({
    * It is responsible for rendering the list of tabs.
    */
   TabList: Object.assign(TabList, {
-    displayName: 'Tabs.TabList'
+    displayName: "Tabs.TabList"
   }),
   /**
    * Renders the content to display for a single tab once that tab is selected.
    */
   TabPanel: Object.assign(TabPanel, {
-    displayName: 'Tabs.TabPanel'
+    displayName: "Tabs.TabPanel"
   }),
   Context: Object.assign(TabsContext, {
-    displayName: 'Tabs.Context'
+    displayName: "Tabs.Context"
   })
 });
-//# sourceMappingURL=index.js.map
+export {
+  Tabs
+};
+//# sourceMappingURL=index.js.map

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

@@ -1 +1,7 @@
-{"version":3,"names":["Ariakit","useInstanceId","useEffect","useMemo","isRTL","TabsContext","Tab","TabList","TabPanel","jsx","_jsx","externalToInternalTabId","externalId","instanceId","internalToExternalTabId","internalId","replace","Tabs","Object","assign","selectOnMove","defaultTabId","orientation","onSelect","children","selectedTabId","activeTabId","defaultActiveTabId","onActiveTabIdChange","store","useTabStore","defaultSelectedId","setSelectedId","newSelectedId","selectedId","defaultActiveId","setActiveId","newActiveId","activeId","rtl","items","useStoreState","requestAnimationFrame","focusedElement","element","ownerDocument","activeElement","some","item","id","contextValue","Provider","value","displayName","Context"],"sources":["@wordpress/components/src/tabs/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { useEffect, useMemo } from '@wordpress/element';\nimport { isRTL } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport type { TabsProps } from './types';\nimport { TabsContext } from './context';\nimport { Tab } from './tab';\nimport { TabList } from './tablist';\nimport { TabPanel } from './tabpanel';\n\nfunction externalToInternalTabId(\n\texternalId: string | undefined | null,\n\tinstanceId: string\n) {\n\treturn externalId && `${ instanceId }-${ externalId }`;\n}\n\nfunction internalToExternalTabId(\n\tinternalId: string | undefined | null,\n\tinstanceId: string\n) {\n\treturn typeof internalId === 'string'\n\t\t? internalId.replace( `${ instanceId }-`, '' )\n\t\t: internalId;\n}\n\n/**\n * Tabs is a collection of React components that combine to render\n * an [ARIA-compliant tabs pattern](https://www.w3.org/WAI/ARIA/apg/patterns/tabs/).\n *\n * Tabs organizes content across different screens, data sets, and interactions.\n * It has two sections: a list of tabs, and the view to show when a tab is chosen.\n *\n * `Tabs` itself is a wrapper component and context provider.\n * It is responsible for managing the state of the tabs, and rendering one instance of the `Tabs.TabList` component and one or more instances of the `Tab.TabPanel` component.\n */\nexport const Tabs = Object.assign(\n\tfunction Tabs( {\n\t\tselectOnMove = true,\n\t\tdefaultTabId,\n\t\torientation = 'horizontal',\n\t\tonSelect,\n\t\tchildren,\n\t\tselectedTabId,\n\t\tactiveTabId,\n\t\tdefaultActiveTabId,\n\t\tonActiveTabIdChange,\n\t}: TabsProps ) {\n\t\tconst instanceId = useInstanceId( Tabs, 'tabs' );\n\t\tconst store = Ariakit.useTabStore( {\n\t\t\tselectOnMove,\n\t\t\torientation,\n\t\t\tdefaultSelectedId: externalToInternalTabId(\n\t\t\t\tdefaultTabId,\n\t\t\t\tinstanceId\n\t\t\t),\n\t\t\tsetSelectedId: ( newSelectedId ) => {\n\t\t\t\tonSelect?.(\n\t\t\t\t\tinternalToExternalTabId( newSelectedId, instanceId )\n\t\t\t\t);\n\t\t\t},\n\t\t\tselectedId: externalToInternalTabId( selectedTabId, instanceId ),\n\t\t\tdefaultActiveId: externalToInternalTabId(\n\t\t\t\tdefaultActiveTabId,\n\t\t\t\tinstanceId\n\t\t\t),\n\t\t\tsetActiveId: ( newActiveId ) => {\n\t\t\t\tonActiveTabIdChange?.(\n\t\t\t\t\tinternalToExternalTabId( newActiveId, instanceId )\n\t\t\t\t);\n\t\t\t},\n\t\t\tactiveId: externalToInternalTabId( activeTabId, instanceId ),\n\t\t\trtl: isRTL(),\n\t\t} );\n\n\t\tconst { items, activeId } = Ariakit.useStoreState( store );\n\t\tconst { setActiveId } = store;\n\n\t\tuseEffect( () => {\n\t\t\trequestAnimationFrame( () => {\n\t\t\t\tconst focusedElement =\n\t\t\t\t\titems?.[ 0 ]?.element?.ownerDocument.activeElement;\n\n\t\t\t\tif (\n\t\t\t\t\t! focusedElement ||\n\t\t\t\t\t! items.some( ( item ) => focusedElement === item.element )\n\t\t\t\t) {\n\t\t\t\t\treturn; // Return early if no tabs are focused.\n\t\t\t\t}\n\n\t\t\t\t// If, after ariakit re-computes the active tab, that tab doesn't match\n\t\t\t\t// the currently focused tab, then we force an update to ariakit to avoid\n\t\t\t\t// any mismatches, especially when navigating to previous/next tab with\n\t\t\t\t// arrow keys.\n\t\t\t\tif ( activeId !== focusedElement.id ) {\n\t\t\t\t\tsetActiveId( focusedElement.id );\n\t\t\t\t}\n\t\t\t} );\n\t\t}, [ activeId, items, setActiveId ] );\n\n\t\tconst contextValue = useMemo(\n\t\t\t() => ( {\n\t\t\t\tstore,\n\t\t\t\tinstanceId,\n\t\t\t} ),\n\t\t\t[ store, instanceId ]\n\t\t);\n\n\t\treturn (\n\t\t\t<TabsContext.Provider value={ contextValue }>\n\t\t\t\t{ children }\n\t\t\t</TabsContext.Provider>\n\t\t);\n\t},\n\t{\n\t\t/**\n\t\t * Renders a single tab.\n\t\t *\n\t\t * The currently active tab receives default styling that can be\n\t\t * overridden with CSS targeting `[aria-selected=\"true\"]`.\n\t\t */\n\t\tTab: Object.assign( Tab, {\n\t\t\tdisplayName: 'Tabs.Tab',\n\t\t} ),\n\t\t/**\n\t\t * A wrapper component for the `Tab` components.\n\t\t *\n\t\t * It is responsible for rendering the list of tabs.\n\t\t */\n\t\tTabList: Object.assign( TabList, {\n\t\t\tdisplayName: 'Tabs.TabList',\n\t\t} ),\n\t\t/**\n\t\t * Renders the content to display for a single tab once that tab is selected.\n\t\t */\n\t\tTabPanel: Object.assign( TabPanel, {\n\t\t\tdisplayName: 'Tabs.TabPanel',\n\t\t} ),\n\t\tContext: Object.assign( TabsContext, {\n\t\t\tdisplayName: 'Tabs.Context',\n\t\t} ),\n\t}\n);\n"],"mappings":"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","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../src/tabs/index.tsx"],
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { useEffect, useMemo } from '@wordpress/element';\nimport { isRTL } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\n\nimport { TabsContext } from './context';\nimport { Tab } from './tab';\nimport { TabList } from './tablist';\nimport { TabPanel } from './tabpanel';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nfunction externalToInternalTabId(externalId, instanceId) {\n  return externalId && `${instanceId}-${externalId}`;\n}\nfunction internalToExternalTabId(internalId, instanceId) {\n  return typeof internalId === 'string' ? internalId.replace(`${instanceId}-`, '') : internalId;\n}\n\n/**\n * Tabs is a collection of React components that combine to render\n * an [ARIA-compliant tabs pattern](https://www.w3.org/WAI/ARIA/apg/patterns/tabs/).\n *\n * Tabs organizes content across different screens, data sets, and interactions.\n * It has two sections: a list of tabs, and the view to show when a tab is chosen.\n *\n * `Tabs` itself is a wrapper component and context provider.\n * It is responsible for managing the state of the tabs, and rendering one instance of the `Tabs.TabList` component and one or more instances of the `Tab.TabPanel` component.\n */\nexport const Tabs = Object.assign(function Tabs({\n  selectOnMove = true,\n  defaultTabId,\n  orientation = 'horizontal',\n  onSelect,\n  children,\n  selectedTabId,\n  activeTabId,\n  defaultActiveTabId,\n  onActiveTabIdChange\n}) {\n  const instanceId = useInstanceId(Tabs, 'tabs');\n  const store = Ariakit.useTabStore({\n    selectOnMove,\n    orientation,\n    defaultSelectedId: externalToInternalTabId(defaultTabId, instanceId),\n    setSelectedId: newSelectedId => {\n      onSelect?.(internalToExternalTabId(newSelectedId, instanceId));\n    },\n    selectedId: externalToInternalTabId(selectedTabId, instanceId),\n    defaultActiveId: externalToInternalTabId(defaultActiveTabId, instanceId),\n    setActiveId: newActiveId => {\n      onActiveTabIdChange?.(internalToExternalTabId(newActiveId, instanceId));\n    },\n    activeId: externalToInternalTabId(activeTabId, instanceId),\n    rtl: isRTL()\n  });\n  const {\n    items,\n    activeId\n  } = Ariakit.useStoreState(store);\n  const {\n    setActiveId\n  } = store;\n  useEffect(() => {\n    requestAnimationFrame(() => {\n      const focusedElement = items?.[0]?.element?.ownerDocument.activeElement;\n      if (!focusedElement || !items.some(item => focusedElement === item.element)) {\n        return; // Return early if no tabs are focused.\n      }\n\n      // If, after ariakit re-computes the active tab, that tab doesn't match\n      // the currently focused tab, then we force an update to ariakit to avoid\n      // any mismatches, especially when navigating to previous/next tab with\n      // arrow keys.\n      if (activeId !== focusedElement.id) {\n        setActiveId(focusedElement.id);\n      }\n    });\n  }, [activeId, items, setActiveId]);\n  const contextValue = useMemo(() => ({\n    store,\n    instanceId\n  }), [store, instanceId]);\n  return /*#__PURE__*/_jsx(TabsContext.Provider, {\n    value: contextValue,\n    children: children\n  });\n}, {\n  /**\n   * Renders a single tab.\n   *\n   * The currently active tab receives default styling that can be\n   * overridden with CSS targeting `[aria-selected=\"true\"]`.\n   */\n  Tab: Object.assign(Tab, {\n    displayName: 'Tabs.Tab'\n  }),\n  /**\n   * A wrapper component for the `Tab` components.\n   *\n   * It is responsible for rendering the list of tabs.\n   */\n  TabList: Object.assign(TabList, {\n    displayName: 'Tabs.TabList'\n  }),\n  /**\n   * Renders the content to display for a single tab once that tab is selected.\n   */\n  TabPanel: Object.assign(TabPanel, {\n    displayName: 'Tabs.TabPanel'\n  }),\n  Context: Object.assign(TabsContext, {\n    displayName: 'Tabs.Context'\n  })\n});"],
+  "mappings": "AAGA,YAAY,aAAa;AAKzB,SAAS,qBAAqB;AAC9B,SAAS,WAAW,eAAe;AACnC,SAAS,aAAa;AAMtB,SAAS,mBAAmB;AAC5B,SAAS,WAAW;AACpB,SAAS,eAAe;AACxB,SAAS,gBAAgB;AACzB,SAAS,OAAO,YAAY;AAC5B,SAAS,wBAAwB,YAAY,YAAY;AACvD,SAAO,cAAc,GAAG,UAAU,IAAI,UAAU;AAClD;AACA,SAAS,wBAAwB,YAAY,YAAY;AACvD,SAAO,OAAO,eAAe,WAAW,WAAW,QAAQ,GAAG,UAAU,KAAK,EAAE,IAAI;AACrF;AAYO,MAAM,OAAO,OAAO,OAAO,SAASA,MAAK;AAAA,EAC9C,eAAe;AAAA,EACf;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAG;AACD,QAAM,aAAa,cAAcA,OAAM,MAAM;AAC7C,QAAM,QAAQ,QAAQ,YAAY;AAAA,IAChC;AAAA,IACA;AAAA,IACA,mBAAmB,wBAAwB,cAAc,UAAU;AAAA,IACnE,eAAe,mBAAiB;AAC9B,iBAAW,wBAAwB,eAAe,UAAU,CAAC;AAAA,IAC/D;AAAA,IACA,YAAY,wBAAwB,eAAe,UAAU;AAAA,IAC7D,iBAAiB,wBAAwB,oBAAoB,UAAU;AAAA,IACvE,aAAa,iBAAe;AAC1B,4BAAsB,wBAAwB,aAAa,UAAU,CAAC;AAAA,IACxE;AAAA,IACA,UAAU,wBAAwB,aAAa,UAAU;AAAA,IACzD,KAAK,MAAM;AAAA,EACb,CAAC;AACD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,EACF,IAAI,QAAQ,cAAc,KAAK;AAC/B,QAAM;AAAA,IACJ;AAAA,EACF,IAAI;AACJ,YAAU,MAAM;AACd,0BAAsB,MAAM;AAC1B,YAAM,iBAAiB,QAAQ,CAAC,GAAG,SAAS,cAAc;AAC1D,UAAI,CAAC,kBAAkB,CAAC,MAAM,KAAK,UAAQ,mBAAmB,KAAK,OAAO,GAAG;AAC3E;AAAA,MACF;AAMA,UAAI,aAAa,eAAe,IAAI;AAClC,oBAAY,eAAe,EAAE;AAAA,MAC/B;AAAA,IACF,CAAC;AAAA,EACH,GAAG,CAAC,UAAU,OAAO,WAAW,CAAC;AACjC,QAAM,eAAe,QAAQ,OAAO;AAAA,IAClC;AAAA,IACA;AAAA,EACF,IAAI,CAAC,OAAO,UAAU,CAAC;AACvB,SAAoB,qBAAK,YAAY,UAAU;AAAA,IAC7C,OAAO;AAAA,IACP;AAAA,EACF,CAAC;AACH,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOD,KAAK,OAAO,OAAO,KAAK;AAAA,IACtB,aAAa;AAAA,EACf,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAMD,SAAS,OAAO,OAAO,SAAS;AAAA,IAC9B,aAAa;AAAA,EACf,CAAC;AAAA;AAAA;AAAA;AAAA,EAID,UAAU,OAAO,OAAO,UAAU;AAAA,IAChC,aAAa;AAAA,EACf,CAAC;AAAA,EACD,SAAS,OAAO,OAAO,aAAa;AAAA,IAClC,aAAa;AAAA,EACf,CAAC;AACH,CAAC;",
+  "names": ["Tabs"]
+}