@atlaskit/tabs 18.3.5 → 19.0.0

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @atlaskit/tabs
 
+## 19.0.0
+
+### Major Changes
+
+- [`38f89455de21d`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/38f89455de21d) -
+  Removes `@atlaskit/tabs/hooks` entrypoint from public API. Use the hook exports from
+  `@atlaskit/tabs` directly.
+
+  Removes redundant utility files, split-out multi-export modules and restructures internal files.
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 18.3.5
 
 ### Patch Changes

package/dist/cjs/components/tab-list.js

@@ -1,6 +1,7 @@
-/* tab-list.tsx generated by @compiled/babel-plugin v0.38.1 */
+/* tab-list.tsx generated by @compiled/babel-plugin v0.39.1 */
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
@@ -11,8 +12,8 @@ var _react = _interopRequireWildcard(require("react"));
 var React = _react;
 var _runtime = require("@compiled/react/runtime");
 var _colors = require("@atlaskit/theme/colors");
-var _hooks = require("../hooks");
-var _context = require("../internal/context");
+var _tabContext = require("../internal/tab-context");
+var _useTabList2 = _interopRequireDefault(require("../use-tab-list"));
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 var baseStyles = null;
 var tabListStyles = null;
@@ -28,7 +29,7 @@ var tabListStyles = null;
  */
 var TabList = function TabList(_ref) {
   var children = _ref.children;
-  var _useTabList = (0, _hooks.useTabList)(),
+  var _useTabList = (0, _useTabList2.default)(),
     tabsId = _useTabList.tabsId,
     selected = _useTabList.selected,
     onChange = _useTabList.onChange;
@@ -77,7 +78,7 @@ var TabList = function TabList(_ref) {
     var tab = _ref2.tab,
       isSelected = _ref2.isSelected,
       index = _ref2.index;
-    return /*#__PURE__*/React.createElement(_context.TabContext.Provider, {
+    return /*#__PURE__*/React.createElement(_tabContext.TabContext.Provider, {
       value: {
         onClick: function onClick() {
           return onChange(index);

package/dist/cjs/components/tab-panel.js

@@ -1,5 +1,6 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
@@ -7,7 +8,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _compiled = require("@atlaskit/primitives/compiled");
-var _hooks = require("../hooks");
+var _useTabPanel2 = _interopRequireDefault(require("../use-tab-panel"));
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 // Note this is not being memoized as children is an unstable reference
 /**
@@ -22,7 +23,7 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
 var TabPanel = function TabPanel(_ref) {
   var children = _ref.children,
     testId = _ref.testId;
-  var _useTabPanel = (0, _hooks.useTabPanel)(),
+  var _useTabPanel = (0, _useTabPanel2.default)(),
     role = _useTabPanel.role,
     id = _useTabPanel.id,
     hidden = _useTabPanel.hidden,

package/dist/cjs/components/tab.js

@@ -1,5 +1,6 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
@@ -7,7 +8,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _compiled = require("@atlaskit/primitives/compiled");
-var _hooks = require("../hooks");
+var _useTab2 = _interopRequireDefault(require("../use-tab"));
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 /**
  * __Tab__
@@ -21,7 +22,7 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
 var Tab = /*#__PURE__*/(0, _react.forwardRef)(function Tab(_ref, ref) {
   var children = _ref.children,
     testId = _ref.testId;
-  var _useTab = (0, _hooks.useTab)(),
+  var _useTab = (0, _useTab2.default)(),
     onClick = _useTab.onClick,
     id = _useTab.id,
     ariaControls = _useTab['aria-controls'],

package/dist/cjs/components/tabs.js

@@ -1,4 +1,4 @@
-/* tabs.tsx generated by @compiled/babel-plugin v0.38.1 */
+/* tabs.tsx generated by @compiled/babel-plugin v0.39.1 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
@@ -15,7 +15,8 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _toArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toArray"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _usePlatformLeafEventHandler = require("@atlaskit/analytics-next/usePlatformLeafEventHandler");
-var _context = require("../internal/context");
+var _tabListContext = require("../internal/tab-list-context");
+var _tabPanelContext = require("../internal/tab-panel-context");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -33,7 +34,7 @@ var getTabPanelWithContext = function getTabPanelWithContext(_ref) {
     tabsId = _ref.tabsId;
   return (
     // Ensure tabPanel exists in case it has been removed
-    tabPanel && /*#__PURE__*/React.createElement(_context.TabPanelContext.Provider, {
+    tabPanel && /*#__PURE__*/React.createElement(_tabPanelContext.TabPanelContext.Provider, {
       value: {
         role: 'tabpanel',
         id: "".concat(tabsId, "-").concat(index, "-tab"),
@@ -114,7 +115,7 @@ var Tabs = function Tabs(props) {
   return /*#__PURE__*/React.createElement("div", {
     "data-testid": testId,
     className: (0, _runtime.ax)(["_1e0c1txw _p12f1osq _1tkeidpf _i0dl1osq _2lx21bp4 _16jlkb7n", "_1c3y1txw _ftfaidpf _18i0kb7n _185bglyw"])
-  }, /*#__PURE__*/React.createElement(_context.TabListContext.Provider, {
+  }, /*#__PURE__*/React.createElement(_tabListContext.TabListContext.Provider, {
     value: {
       selected: selected,
       onChange: onChangeAnalytics,

package/dist/cjs/index.js

@@ -31,17 +31,18 @@ Object.defineProperty(exports, "default", {
 Object.defineProperty(exports, "useTab", {
   enumerable: true,
   get: function get() {
-    return _hooks.useTab;
+    return _useTab.default;
   }
 });
 Object.defineProperty(exports, "useTabPanel", {
   enumerable: true,
   get: function get() {
-    return _hooks.useTabPanel;
+    return _useTabPanel.default;
   }
 });
 var _tabs = _interopRequireDefault(require("./components/tabs"));
 var _tabPanel = _interopRequireDefault(require("./components/tab-panel"));
 var _tab = _interopRequireDefault(require("./components/tab"));
 var _tabList = _interopRequireDefault(require("./components/tab-list"));
-var _hooks = require("./hooks");
+var _useTab = _interopRequireDefault(require("./use-tab"));
+var _useTabPanel = _interopRequireDefault(require("./use-tab-panel"));

package/dist/cjs/internal/tab-context.js

@@ -0,0 +1,10 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TabContext = void 0;
+var _react = require("react");
+/* eslint-disable @repo/internal/react/require-jsdoc */
+
+var TabContext = exports.TabContext = /*#__PURE__*/(0, _react.createContext)(null);

package/dist/cjs/internal/tab-list-context.js

@@ -0,0 +1,10 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TabListContext = void 0;
+var _react = require("react");
+/* eslint-disable @repo/internal/react/require-jsdoc */
+
+var TabListContext = exports.TabListContext = /*#__PURE__*/(0, _react.createContext)(null);

package/dist/cjs/internal/tab-panel-context.js

@@ -0,0 +1,10 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TabPanelContext = void 0;
+var _react = require("react");
+/* eslint-disable @repo/internal/react/require-jsdoc */
+
+var TabPanelContext = exports.TabPanelContext = /*#__PURE__*/(0, _react.createContext)(null);

package/dist/cjs/use-tab-list.js

@@ -0,0 +1,20 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useTabList;
+var _react = require("react");
+var _tabListContext = require("./internal/tab-list-context");
+// TODO: Fill in the hook {description}.
+/**
+ * {description}.
+ */
+function useTabList() {
+  var tabListData = (0, _react.useContext)(_tabListContext.TabListContext);
+  if (tabListData === null || typeof tabListData === 'undefined') {
+    throw Error('@atlaskit/tabs: A TabList must have a Tabs parent.');
+  }
+  return tabListData;
+}
+;

package/dist/cjs/use-tab-panel.js

@@ -0,0 +1,20 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useTabPanel;
+var _react = require("react");
+var _tabPanelContext = require("./internal/tab-panel-context");
+// TODO: Fill in the hook {description}.
+/**
+ * {description}.
+ */
+function useTabPanel() {
+  var tabPanelData = (0, _react.useContext)(_tabPanelContext.TabPanelContext);
+  if (tabPanelData === null || typeof tabPanelData === 'undefined') {
+    throw Error('@atlaskit/tabs:  A TabPanel must have a Tabs parent.');
+  }
+  return tabPanelData;
+}
+;

package/dist/cjs/use-tab.js

@@ -0,0 +1,20 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useTab;
+var _react = require("react");
+var _tabContext = require("./internal/tab-context");
+// TODO: Fill in the hook {description}.
+/**
+ * {description}.
+ */
+function useTab() {
+  var tabData = (0, _react.useContext)(_tabContext.TabContext);
+  if (tabData == null || typeof tabData === 'undefined') {
+    throw Error('@atlaskit/tabs: A Tab must have a TabList parent.');
+  }
+  return tabData;
+}
+;

package/dist/es2019/components/tab-list.js

@@ -1,11 +1,11 @@
-/* tab-list.tsx generated by @compiled/babel-plugin v0.38.1 */
+/* tab-list.tsx generated by @compiled/babel-plugin v0.39.1 */
 import "./tab-list.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
 import { Children, createRef, useCallback } from 'react';
 import { B400, B500, N30, N500 } from '@atlaskit/theme/colors';
-import { useTabList } from '../hooks';
-import { TabContext } from '../internal/context';
+import { TabContext } from '../internal/tab-context';
+import useTabList from '../use-tab-list';
 const baseStyles = null;
 const tabListStyles = null;
 

package/dist/es2019/components/tab-panel.js

@@ -1,6 +1,7 @@
 import React, { Fragment } from 'react';
 import { Focusable } from '@atlaskit/primitives/compiled';
-import { useTabPanel } from '../hooks';
+import useTabPanel from '../use-tab-panel';
+
 // Note this is not being memoized as children is an unstable reference
 /**
  * __TabPanel__

package/dist/es2019/components/tab.js

@@ -1,6 +1,7 @@
 import React, { forwardRef } from 'react';
 import { Focusable, Text } from '@atlaskit/primitives/compiled';
-import { useTab } from '../hooks';
+import useTab from '../use-tab';
+
 /**
  * __Tab__
  *

package/dist/es2019/components/tabs.js

@@ -1,10 +1,11 @@
-/* tabs.tsx generated by @compiled/babel-plugin v0.38.1 */
+/* tabs.tsx generated by @compiled/babel-plugin v0.39.1 */
 import "./tabs.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
 import { Children, Fragment, useCallback, useRef, useState } from 'react';
 import { usePlatformLeafEventHandler } from '@atlaskit/analytics-next/usePlatformLeafEventHandler';
-import { TabListContext, TabPanelContext } from '../internal/context';
+import { TabListContext } from '../internal/tab-list-context';
+import { TabPanelContext } from '../internal/tab-panel-context';
 const baseStyles = null;
 const tabsStyles = null;
 const analyticsAttributes = {

package/dist/es2019/index.js

@@ -2,4 +2,5 @@ export { default } from './components/tabs';
 export { default as TabPanel } from './components/tab-panel';
 export { default as Tab } from './components/tab';
 export { default as TabList } from './components/tab-list';
-export { useTab, useTabPanel } from './hooks';
+export { default as useTab } from './use-tab';
+export { default as useTabPanel } from './use-tab-panel';

package/dist/es2019/internal/tab-context.js

@@ -0,0 +1,3 @@
+/* eslint-disable @repo/internal/react/require-jsdoc */
+import { createContext } from 'react';
+export const TabContext = /*#__PURE__*/createContext(null);

package/dist/es2019/internal/tab-list-context.js

@@ -0,0 +1,3 @@
+/* eslint-disable @repo/internal/react/require-jsdoc */
+import { createContext } from 'react';
+export const TabListContext = /*#__PURE__*/createContext(null);

package/dist/es2019/internal/{context.js → tab-panel-context.js}

@@ -1,5 +1,3 @@
 /* eslint-disable @repo/internal/react/require-jsdoc */
 import { createContext } from 'react';
-export const TabContext = /*#__PURE__*/createContext(null);
-export const TabListContext = /*#__PURE__*/createContext(null);
 export const TabPanelContext = /*#__PURE__*/createContext(null);

package/dist/es2019/use-tab-list.js

@@ -0,0 +1,15 @@
+import { useContext } from 'react';
+import { TabListContext } from './internal/tab-list-context';
+
+// TODO: Fill in the hook {description}.
+/**
+ * {description}.
+ */
+export default function useTabList() {
+  const tabListData = useContext(TabListContext);
+  if (tabListData === null || typeof tabListData === 'undefined') {
+    throw Error('@atlaskit/tabs: A TabList must have a Tabs parent.');
+  }
+  return tabListData;
+}
+;

package/dist/es2019/use-tab-panel.js

@@ -0,0 +1,15 @@
+import { useContext } from 'react';
+import { TabPanelContext } from './internal/tab-panel-context';
+
+// TODO: Fill in the hook {description}.
+/**
+ * {description}.
+ */
+export default function useTabPanel() {
+  const tabPanelData = useContext(TabPanelContext);
+  if (tabPanelData === null || typeof tabPanelData === 'undefined') {
+    throw Error('@atlaskit/tabs:  A TabPanel must have a Tabs parent.');
+  }
+  return tabPanelData;
+}
+;

package/dist/es2019/use-tab.js

@@ -0,0 +1,15 @@
+import { useContext } from 'react';
+import { TabContext } from './internal/tab-context';
+
+// TODO: Fill in the hook {description}.
+/**
+ * {description}.
+ */
+export default function useTab() {
+  const tabData = useContext(TabContext);
+  if (tabData == null || typeof tabData === 'undefined') {
+    throw Error('@atlaskit/tabs: A Tab must have a TabList parent.');
+  }
+  return tabData;
+}
+;

package/dist/esm/components/tab-list.js

@@ -1,11 +1,11 @@
-/* tab-list.tsx generated by @compiled/babel-plugin v0.38.1 */
+/* tab-list.tsx generated by @compiled/babel-plugin v0.39.1 */
 import "./tab-list.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
 import { Children, createRef, useCallback } from 'react';
 import { B400, B500, N30, N500 } from '@atlaskit/theme/colors';
-import { useTabList } from '../hooks';
-import { TabContext } from '../internal/context';
+import { TabContext } from '../internal/tab-context';
+import useTabList from '../use-tab-list';
 var baseStyles = null;
 var tabListStyles = null;
 

package/dist/esm/components/tab-panel.js

@@ -1,6 +1,7 @@
 import React, { Fragment } from 'react';
 import { Focusable } from '@atlaskit/primitives/compiled';
-import { useTabPanel } from '../hooks';
+import useTabPanel from '../use-tab-panel';
+
 // Note this is not being memoized as children is an unstable reference
 /**
  * __TabPanel__

package/dist/esm/components/tab.js

@@ -1,6 +1,7 @@
 import React, { forwardRef } from 'react';
 import { Focusable, Text } from '@atlaskit/primitives/compiled';
-import { useTab } from '../hooks';
+import useTab from '../use-tab';
+
 /**
  * __Tab__
  *

package/dist/esm/components/tabs.js

@@ -1,4 +1,4 @@
-/* tabs.tsx generated by @compiled/babel-plugin v0.38.1 */
+/* tabs.tsx generated by @compiled/babel-plugin v0.39.1 */
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _toArray from "@babel/runtime/helpers/toArray";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
@@ -9,7 +9,8 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import { Children, Fragment, useCallback, useRef, useState } from 'react';
 import { usePlatformLeafEventHandler } from '@atlaskit/analytics-next/usePlatformLeafEventHandler';
-import { TabListContext, TabPanelContext } from '../internal/context';
+import { TabListContext } from '../internal/tab-list-context';
+import { TabPanelContext } from '../internal/tab-panel-context';
 var baseStyles = null;
 var tabsStyles = null;
 var analyticsAttributes = {

package/dist/esm/index.js

@@ -2,4 +2,5 @@ export { default } from './components/tabs';
 export { default as TabPanel } from './components/tab-panel';
 export { default as Tab } from './components/tab';
 export { default as TabList } from './components/tab-list';
-export { useTab, useTabPanel } from './hooks';
+export { default as useTab } from './use-tab';
+export { default as useTabPanel } from './use-tab-panel';

package/dist/esm/internal/tab-context.js

@@ -0,0 +1,3 @@
+/* eslint-disable @repo/internal/react/require-jsdoc */
+import { createContext } from 'react';
+export var TabContext = /*#__PURE__*/createContext(null);

package/dist/esm/internal/tab-list-context.js

@@ -0,0 +1,3 @@
+/* eslint-disable @repo/internal/react/require-jsdoc */
+import { createContext } from 'react';
+export var TabListContext = /*#__PURE__*/createContext(null);

package/dist/esm/internal/tab-panel-context.js

@@ -0,0 +1,3 @@
+/* eslint-disable @repo/internal/react/require-jsdoc */
+import { createContext } from 'react';
+export var TabPanelContext = /*#__PURE__*/createContext(null);

package/dist/esm/use-tab-list.js

@@ -0,0 +1,15 @@
+import { useContext } from 'react';
+import { TabListContext } from './internal/tab-list-context';
+
+// TODO: Fill in the hook {description}.
+/**
+ * {description}.
+ */
+export default function useTabList() {
+  var tabListData = useContext(TabListContext);
+  if (tabListData === null || typeof tabListData === 'undefined') {
+    throw Error('@atlaskit/tabs: A TabList must have a Tabs parent.');
+  }
+  return tabListData;
+}
+;

package/dist/esm/use-tab-panel.js

@@ -0,0 +1,15 @@
+import { useContext } from 'react';
+import { TabPanelContext } from './internal/tab-panel-context';
+
+// TODO: Fill in the hook {description}.
+/**
+ * {description}.
+ */
+export default function useTabPanel() {
+  var tabPanelData = useContext(TabPanelContext);
+  if (tabPanelData === null || typeof tabPanelData === 'undefined') {
+    throw Error('@atlaskit/tabs:  A TabPanel must have a Tabs parent.');
+  }
+  return tabPanelData;
+}
+;

package/dist/esm/use-tab.js

@@ -0,0 +1,15 @@
+import { useContext } from 'react';
+import { TabContext } from './internal/tab-context';
+
+// TODO: Fill in the hook {description}.
+/**
+ * {description}.
+ */
+export default function useTab() {
+  var tabData = useContext(TabContext);
+  if (tabData == null || typeof tabData === 'undefined') {
+    throw Error('@atlaskit/tabs: A Tab must have a TabList parent.');
+  }
+  return tabData;
+}
+;

package/dist/types/index.d.ts

@@ -3,4 +3,5 @@ export { default as TabPanel } from './components/tab-panel';
 export { default as Tab } from './components/tab';
 export { default as TabList } from './components/tab-list';
 export type { TabProps, TabPanelProps, TabsProps, TabListProps, TabAttributesType, TabListAttributesType, TabPanelAttributesType, TabData, } from './types';
-export { useTab, useTabPanel } from './hooks';
+export { default as useTab } from './use-tab';
+export { default as useTabPanel } from './use-tab-panel';

package/dist/types/internal/tab-context.d.ts

@@ -0,0 +1,2 @@
+import { type TabAttributesType } from '../types';
+export declare const TabContext: import('react').Context<TabAttributesType | null>;

package/dist/types/internal/tab-list-context.d.ts

@@ -0,0 +1,2 @@
+import { type TabListAttributesType } from '../types';
+export declare const TabListContext: import('react').Context<TabListAttributesType | null>;

package/dist/types/internal/tab-panel-context.d.ts

@@ -0,0 +1,2 @@
+import { type TabPanelAttributesType } from '../types';
+export declare const TabPanelContext: import('react').Context<TabPanelAttributesType | null>;

package/dist/types/use-tab-list.d.ts

@@ -0,0 +1,4 @@
+/**
+ * {description}.
+ */
+export default function useTabList(): import('./types').TabListAttributesType;

package/dist/types/use-tab-panel.d.ts

@@ -0,0 +1,4 @@
+/**
+ * {description}.
+ */
+export default function useTabPanel(): import('./types').TabPanelAttributesType;

package/dist/types/use-tab.d.ts

@@ -0,0 +1,4 @@
+/**
+ * {description}.
+ */
+export default function useTab(): import('./types').TabAttributesType;

package/dist/types-ts4.5/index.d.ts

@@ -3,4 +3,5 @@ export { default as TabPanel } from './components/tab-panel';
 export { default as Tab } from './components/tab';
 export { default as TabList } from './components/tab-list';
 export type { TabProps, TabPanelProps, TabsProps, TabListProps, TabAttributesType, TabListAttributesType, TabPanelAttributesType, TabData, } from './types';
-export { useTab, useTabPanel } from './hooks';
+export { default as useTab } from './use-tab';
+export { default as useTabPanel } from './use-tab-panel';

package/dist/types-ts4.5/internal/tab-context.d.ts

@@ -0,0 +1,2 @@
+import { type TabAttributesType } from '../types';
+export declare const TabContext: import('react').Context<TabAttributesType | null>;

package/dist/types-ts4.5/internal/tab-list-context.d.ts

@@ -0,0 +1,2 @@
+import { type TabListAttributesType } from '../types';
+export declare const TabListContext: import('react').Context<TabListAttributesType | null>;

package/dist/types-ts4.5/internal/tab-panel-context.d.ts

@@ -0,0 +1,2 @@
+import { type TabPanelAttributesType } from '../types';
+export declare const TabPanelContext: import('react').Context<TabPanelAttributesType | null>;

package/dist/types-ts4.5/use-tab-list.d.ts

@@ -0,0 +1,4 @@
+/**
+ * {description}.
+ */
+export default function useTabList(): import('./types').TabListAttributesType;

package/dist/types-ts4.5/use-tab-panel.d.ts

@@ -0,0 +1,4 @@
+/**
+ * {description}.
+ */
+export default function useTabPanel(): import('./types').TabPanelAttributesType;

package/dist/types-ts4.5/use-tab.d.ts

@@ -0,0 +1,4 @@
+/**
+ * {description}.
+ */
+export default function useTab(): import('./types').TabAttributesType;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/tabs",
-	"version": "18.3.5",
+	"version": "19.0.0",
 	"description": "Tabs are used to organize content by grouping similar information on the same page.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -36,9 +36,9 @@
 		"@atlaskit/platform-feature-flags": "^1.1.0",
 		"@atlaskit/primitives": "^18.0.0",
 		"@atlaskit/theme": "^22.0.0",
-		"@atlaskit/tokens": "^11.0.0",
+		"@atlaskit/tokens": "^11.1.0",
 		"@babel/runtime": "^7.0.0",
-		"@compiled/react": "^0.18.6"
+		"@compiled/react": "^0.20.0"
 	},
 	"peerDependencies": {
 		"react": "^18.2.0"
@@ -50,14 +50,15 @@
 		"@af/visual-regression": "workspace:^",
 		"@atlaskit/button": "^23.10.0",
 		"@atlaskit/css": "^0.19.0",
-		"@atlaskit/docs": "^11.5.0",
-		"@atlaskit/ds-lib": "^5.3.0",
+		"@atlaskit/docs": "^11.7.0",
+		"@atlaskit/ds-lib": "^6.0.0",
 		"@atlaskit/link": "^3.3.0",
 		"@atlaskit/section-message": "^8.12.0",
 		"@atlaskit/spinner": "^19.0.0",
-		"@atlaskit/tooltip": "^20.14.0",
+		"@atlaskit/tooltip": "^21.0.0",
 		"@atlaskit/visually-hidden": "^3.0.0",
 		"@atlassian/ssr-tests": "workspace:^",
+		"@atlassian/structured-docs-types": "workspace:^",
 		"@testing-library/react": "^16.3.0",
 		"@testing-library/user-event": "^14.4.3",
 		"react-dom": "^18.2.0",

package/tabs.docs.tsx

@@ -0,0 +1,51 @@
+import path from 'path';
+
+import type { ComponentStructuredContentSource } from '@atlassian/structured-docs-types';
+
+const documentation: ComponentStructuredContentSource[] = [
+	{
+		name: 'Tabs',
+		description:
+			'Tabs are used to organize content by grouping similar information on the same page.',
+		status: 'general-availability',
+		import: {
+			name: 'Tabs',
+			package: '@atlaskit/tabs',
+			type: 'default',
+			packagePath: path.resolve(__dirname),
+			packageJson: require('./package.json'),
+		},
+		usageGuidelines: [
+			'Use to organize related content on the same page without navigating away',
+			'Use for concise content or content users access regularly',
+			'Limit the number of tabs to avoid overcrowding',
+			'Keep tab labels concise and descriptive',
+			'Use consistent tab ordering and grouping',
+			'Consider responsive behavior for many tabs',
+		],
+		contentGuidelines: [
+			'Write clear, descriptive tab labels',
+			'Group related content logically',
+			'Use consistent naming conventions',
+			'Ensure tab content is relevant and complete',
+		],
+		accessibilityGuidelines: [
+			'Ensure proper keyboard navigation between tabs',
+			'Use appropriate ARIA attributes for tab panels',
+			'Provide clear focus indicators',
+			'Announce tab changes to screen readers',
+			'Ensure tab content is accessible',
+		],
+		examples: [
+			{
+				name: 'Tabs',
+				description: 'Tabs example',
+				source: path.resolve(__dirname, './examples/ai/tabs.tsx'),
+			},
+		],
+		keywords: ['tabs', 'navigation', 'content', 'organization', 'grouping'],
+		categories: ['navigation'],
+	},
+];
+
+export default documentation;

package/dist/cjs/hooks.js

@@ -1,29 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useTabPanel = exports.useTabList = exports.useTab = void 0;
-var _react = require("react");
-var _context = require("./internal/context");
-var useTab = exports.useTab = function useTab() {
-  var tabData = (0, _react.useContext)(_context.TabContext);
-  if (tabData == null || typeof tabData === 'undefined') {
-    throw Error('@atlaskit/tabs: A Tab must have a TabList parent.');
-  }
-  return tabData;
-};
-var useTabList = exports.useTabList = function useTabList() {
-  var tabListData = (0, _react.useContext)(_context.TabListContext);
-  if (tabListData === null || typeof tabListData === 'undefined') {
-    throw Error('@atlaskit/tabs: A TabList must have a Tabs parent.');
-  }
-  return tabListData;
-};
-var useTabPanel = exports.useTabPanel = function useTabPanel() {
-  var tabPanelData = (0, _react.useContext)(_context.TabPanelContext);
-  if (tabPanelData === null || typeof tabPanelData === 'undefined') {
-    throw Error('@atlaskit/tabs:  A TabPanel must have a Tabs parent.');
-  }
-  return tabPanelData;
-};

package/dist/cjs/internal/context.js

@@ -1,12 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.TabPanelContext = exports.TabListContext = exports.TabContext = void 0;
-var _react = require("react");
-/* eslint-disable @repo/internal/react/require-jsdoc */
-
-var TabContext = exports.TabContext = /*#__PURE__*/(0, _react.createContext)(null);
-var TabListContext = exports.TabListContext = /*#__PURE__*/(0, _react.createContext)(null);
-var TabPanelContext = exports.TabPanelContext = /*#__PURE__*/(0, _react.createContext)(null);

package/dist/es2019/hooks.js

@@ -1,23 +0,0 @@
-import { useContext } from 'react';
-import { TabContext, TabListContext, TabPanelContext } from './internal/context';
-export const useTab = () => {
-  const tabData = useContext(TabContext);
-  if (tabData == null || typeof tabData === 'undefined') {
-    throw Error('@atlaskit/tabs: A Tab must have a TabList parent.');
-  }
-  return tabData;
-};
-export const useTabList = () => {
-  const tabListData = useContext(TabListContext);
-  if (tabListData === null || typeof tabListData === 'undefined') {
-    throw Error('@atlaskit/tabs: A TabList must have a Tabs parent.');
-  }
-  return tabListData;
-};
-export const useTabPanel = () => {
-  const tabPanelData = useContext(TabPanelContext);
-  if (tabPanelData === null || typeof tabPanelData === 'undefined') {
-    throw Error('@atlaskit/tabs:  A TabPanel must have a Tabs parent.');
-  }
-  return tabPanelData;
-};

package/dist/esm/hooks.js

@@ -1,23 +0,0 @@
-import { useContext } from 'react';
-import { TabContext, TabListContext, TabPanelContext } from './internal/context';
-export var useTab = function useTab() {
-  var tabData = useContext(TabContext);
-  if (tabData == null || typeof tabData === 'undefined') {
-    throw Error('@atlaskit/tabs: A Tab must have a TabList parent.');
-  }
-  return tabData;
-};
-export var useTabList = function useTabList() {
-  var tabListData = useContext(TabListContext);
-  if (tabListData === null || typeof tabListData === 'undefined') {
-    throw Error('@atlaskit/tabs: A TabList must have a Tabs parent.');
-  }
-  return tabListData;
-};
-export var useTabPanel = function useTabPanel() {
-  var tabPanelData = useContext(TabPanelContext);
-  if (tabPanelData === null || typeof tabPanelData === 'undefined') {
-    throw Error('@atlaskit/tabs:  A TabPanel must have a Tabs parent.');
-  }
-  return tabPanelData;
-};

package/dist/esm/internal/context.js

@@ -1,5 +0,0 @@
-/* eslint-disable @repo/internal/react/require-jsdoc */
-import { createContext } from 'react';
-export var TabContext = /*#__PURE__*/createContext(null);
-export var TabListContext = /*#__PURE__*/createContext(null);
-export var TabPanelContext = /*#__PURE__*/createContext(null);

package/dist/types/hooks.d.ts

@@ -1,3 +0,0 @@
-export declare const useTab: () => import('./types').TabAttributesType;
-export declare const useTabList: () => import('./types').TabListAttributesType;
-export declare const useTabPanel: () => import('./types').TabPanelAttributesType;

package/dist/types/internal/context.d.ts

@@ -1,4 +0,0 @@
-import { type TabAttributesType, type TabListAttributesType, type TabPanelAttributesType } from '../types';
-export declare const TabContext: import('react').Context<TabAttributesType | null>;
-export declare const TabListContext: import('react').Context<TabListAttributesType | null>;
-export declare const TabPanelContext: import('react').Context<TabPanelAttributesType | null>;

package/dist/types-ts4.5/hooks.d.ts

@@ -1,3 +0,0 @@
-export declare const useTab: () => import('./types').TabAttributesType;
-export declare const useTabList: () => import('./types').TabListAttributesType;
-export declare const useTabPanel: () => import('./types').TabPanelAttributesType;

package/dist/types-ts4.5/internal/context.d.ts

@@ -1,4 +0,0 @@
-import { type TabAttributesType, type TabListAttributesType, type TabPanelAttributesType } from '../types';
-export declare const TabContext: import('react').Context<TabAttributesType | null>;
-export declare const TabListContext: import('react').Context<TabListAttributesType | null>;
-export declare const TabPanelContext: import('react').Context<TabPanelAttributesType | null>;

package/hooks/package.json

@@ -1,17 +0,0 @@
-{
-  "name": "@atlaskit/tabs/hooks",
-  "main": "../dist/cjs/hooks.js",
-  "module": "../dist/esm/hooks.js",
-  "module:es2019": "../dist/es2019/hooks.js",
-  "sideEffects": [
-    "**/*.compiled.css"
-  ],
-  "types": "../dist/types/hooks.d.ts",
-  "typesVersions": {
-    ">=4.5 <5.9": {
-      "*": [
-        "../dist/types-ts4.5/hooks.d.ts"
-      ]
-    }
-  }
-}