@hanzogui/tabs 2.0.0-rc.41-hanzoai.1

package/dist/jsx/createTabs.native.js

@@ -0,0 +1,308 @@
+"use strict";
+
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+// If the importer is in node compatibility mode or this is not an ESM
+// file that has been converted to a CommonJS file using a Babel-
+// compatible transform (i.e. "__esModule" has not been set), then set
+// "default" to the CommonJS "module.exports" for node compatibility.
+isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+  value: mod,
+  enumerable: true
+}) : target, mod));
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var createTabs_exports = {};
+__export(createTabs_exports, {
+  createTabs: () => createTabs
+});
+module.exports = __toCommonJS(createTabs_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_compose_refs = require("@hanzogui/compose-refs");
+var import_constants = require("@hanzogui/constants");
+var import_group = require("@hanzogui/group");
+var import_helpers = require("@hanzogui/helpers");
+var import_roving_focus = require("@hanzogui/roving-focus");
+var import_sizable_context = require("@hanzogui/sizable-context");
+var import_use_controllable_state = require("@hanzogui/use-controllable-state");
+var import_use_direction = require("@hanzogui/use-direction");
+var import_web = require("@hanzogui/web");
+var React = __toESM(require("react"), 1);
+var import_StyledContext = require("./StyledContext.native.js");
+var import_Tabs = require("./Tabs.native.js");
+function createTabs(createProps) {
+  var {
+    ContentFrame = import_Tabs.DefaultTabsContentFrame,
+    TabFrame = import_Tabs.DefaultTabsTabFrame,
+    TabsFrame = import_Tabs.DefaultTabsFrame
+  } = createProps;
+  var TABS_CONTEXT = "TabsContext";
+  var TAB_LIST_NAME = "TabsList";
+  var TabsList = /* @__PURE__ */React.forwardRef(function (props, forwardedRef) {
+    var {
+      __scopeTabs,
+      loop = true,
+      children,
+      ...listProps
+    } = props;
+    var context = (0, import_StyledContext.useTabsContext)(__scopeTabs);
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_roving_focus.RovingFocusGroup, {
+      __scopeRovingFocusGroup: __scopeTabs || TABS_CONTEXT,
+      orientation: context.orientation,
+      dir: context.dir,
+      loop,
+      asChild: true,
+      children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_group.Group, {
+        role: "tablist",
+        componentName: TAB_LIST_NAME,
+        "aria-orientation": context.orientation,
+        ref: forwardedRef,
+        orientation: context.orientation,
+        ...listProps,
+        children
+      })
+    });
+  });
+  TabsList.displayName = TAB_LIST_NAME;
+  var TRIGGER_NAME = "TabsTrigger";
+  var TabsTrigger = TabFrame.styleable(function (props, forwardedRef) {
+    var {
+      __scopeTabs,
+      value,
+      disabled = false,
+      onInteraction,
+      activeStyle,
+      activeTheme,
+      unstyled = false,
+      ...triggerProps
+    } = props;
+    var context = (0, import_StyledContext.useTabsContext)(__scopeTabs);
+    var triggerId = makeTriggerId(context.baseId, value);
+    var contentId = makeContentId(context.baseId, value);
+    var isSelected = value === context.value;
+    var [layout, setLayout] = React.useState(null);
+    var triggerRef = React.useRef(null);
+    var groupItemProps = (0, import_group.useGroupItem)({
+      disabled: !!disabled
+    });
+    React.useEffect(function () {
+      context.registerTrigger();
+      return function () {
+        return context.unregisterTrigger();
+      };
+    }, []);
+    React.useEffect(function () {
+      if (!triggerRef.current || !import_constants.isWeb) return;
+      var el = triggerRef.current;
+      function getTriggerSize() {
+        if (!el) return;
+        setLayout({
+          width: el.offsetWidth,
+          height: el.offsetHeight,
+          x: el.offsetLeft,
+          y: el.offsetTop
+        });
+      }
+      getTriggerSize();
+      var observer = new ResizeObserver(getTriggerSize);
+      observer.observe(el);
+      return function () {
+        observer.disconnect();
+      };
+    }, [context.triggersCount]);
+    React.useEffect(function () {
+      if (isSelected && layout) {
+        onInteraction === null || onInteraction === void 0 ? void 0 : onInteraction("select", layout);
+      }
+    }, [isSelected, value, layout]);
+    var _props_onPress;
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_roving_focus.RovingFocusGroup.Item, {
+      __scopeRovingFocusGroup: __scopeTabs || TABS_CONTEXT,
+      asChild: true,
+      focusable: !disabled,
+      active: isSelected,
+      children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(TabFrame, {
+        ...(!import_constants.isWeb && {
+          onLayout: function (event) {
+            setLayout(event.nativeEvent.layout);
+          }
+        }),
+        onMouseEnter: (0, import_helpers.composeEventHandlers)(props.onMouseEnter, function () {
+          if (layout) {
+            onInteraction === null || onInteraction === void 0 ? void 0 : onInteraction("hover", layout);
+          }
+        }),
+        onMouseLeave: (0, import_helpers.composeEventHandlers)(props.onMouseLeave, function () {
+          onInteraction === null || onInteraction === void 0 ? void 0 : onInteraction("hover", null);
+        }),
+        role: "tab",
+        "aria-selected": isSelected,
+        "aria-controls": contentId,
+        "data-state": isSelected ? "active" : "inactive",
+        "data-disabled": disabled ? "" : void 0,
+        id: triggerId,
+        theme: activeTheme !== null && activeTheme !== void 0 ? activeTheme : null,
+        unstyled,
+        ...(!unstyled && {
+          size: context.size
+        }),
+        ...(isSelected && {
+          ...(!unstyled && !activeStyle && {
+            backgroundColor: "$backgroundActive"
+          }),
+          ...activeStyle
+        }),
+        ...groupItemProps,
+        disabled: disabled !== null && disabled !== void 0 ? disabled : groupItemProps.disabled,
+        ...triggerProps,
+        ref: (0, import_compose_refs.composeRefs)(forwardedRef, triggerRef),
+        onPress: (0, import_helpers.composeEventHandlers)((_props_onPress = props.onPress) !== null && _props_onPress !== void 0 ? _props_onPress : void 0, function (event) {
+          var webChecks = !import_constants.isWeb || event.button === 0 && event.ctrlKey === false;
+          if (!disabled && !isSelected && webChecks) {
+            context.onChange(value);
+          }
+        }),
+        ...(import_constants.isWeb && {
+          onKeyDown: (0, import_helpers.composeEventHandlers)(props.onKeyDown, function (event) {
+            if ([" ", "Enter"].includes(event.key)) {
+              context.onChange(value);
+              event.preventDefault();
+            }
+          }),
+          onFocus: (0, import_helpers.composeEventHandlers)(props.onFocus, function (event) {
+            if (layout) {
+              onInteraction === null || onInteraction === void 0 ? void 0 : onInteraction("focus", layout);
+            }
+            var isAutomaticActivation = context.activationMode !== "manual";
+            if (!isSelected && !disabled && isAutomaticActivation) {
+              context.onChange(value);
+            }
+          }),
+          onBlur: (0, import_helpers.composeEventHandlers)(props.onBlur, function () {
+            onInteraction === null || onInteraction === void 0 ? void 0 : onInteraction("focus", null);
+          })
+        })
+      })
+    });
+  });
+  TabsTrigger.displayName = TRIGGER_NAME;
+  var TabsContent = ContentFrame.styleable(function TabsContent2(props, forwardedRef) {
+    var {
+      __scopeTabs,
+      value,
+      forceMount,
+      children,
+      ...contentProps
+    } = props;
+    var context = (0, import_StyledContext.useTabsContext)(__scopeTabs);
+    var isSelected = value === context.value;
+    var show = forceMount || isSelected;
+    var triggerId = makeTriggerId(context.baseId, value);
+    var contentId = makeContentId(context.baseId, value);
+    if (!show) {
+      return null;
+    }
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(ContentFrame, {
+      "data-state": isSelected ? "active" : "inactive",
+      "data-orientation": context.orientation,
+      role: "tabpanel",
+      "aria-labelledby": triggerId,
+      // @ts-ignore
+      hidden: !show,
+      id: contentId,
+      tabIndex: 0,
+      ...contentProps,
+      ref: forwardedRef,
+      children
+    }, value);
+  });
+  var TabsComponent = TabsFrame.styleable(function Tabs(props, forwardedRef) {
+    var {
+      __scopeTabs,
+      value: valueProp,
+      onValueChange,
+      defaultValue,
+      orientation = "horizontal",
+      dir,
+      activationMode = "manual",
+      size = "$true",
+      ...tabsProps
+    } = props;
+    var direction = (0, import_use_direction.useDirection)(dir);
+    var [value, setValue] = (0, import_use_controllable_state.useControllableState)({
+      prop: valueProp,
+      onChange: onValueChange,
+      defaultProp: defaultValue !== null && defaultValue !== void 0 ? defaultValue : ""
+    });
+    var [triggersCount, setTriggersCount] = React.useState(0);
+    var registerTrigger = (0, import_web.useEvent)(function () {
+      return setTriggersCount(function (v) {
+        return v + 1;
+      });
+    });
+    var unregisterTrigger = (0, import_web.useEvent)(function () {
+      return setTriggersCount(function (v) {
+        return v - 1;
+      });
+    });
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_sizable_context.SizableContext.Provider, {
+      size,
+      children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_StyledContext.TabsProvider, {
+        scope: __scopeTabs,
+        baseId: React.useId(),
+        value,
+        onChange: setValue,
+        orientation,
+        dir: direction,
+        activationMode,
+        size,
+        registerTrigger,
+        triggersCount,
+        unregisterTrigger,
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(TabsFrame, {
+          direction,
+          "data-orientation": orientation,
+          ...tabsProps,
+          ref: forwardedRef
+        })
+      })
+    });
+  });
+  return (0, import_helpers.withStaticProperties)(TabsComponent, {
+    List: TabsList,
+    /**
+    * @deprecated Use Tabs.Tab instead
+    */
+    Trigger: TabsTrigger,
+    Tab: TabsTrigger,
+    Content: TabsContent
+  });
+}
+function makeTriggerId(baseId, value) {
+  return `${baseId}-trigger-${value}`;
+}
+function makeContentId(baseId, value) {
+  return `${baseId}-content-${value}`;
+}
+//# sourceMappingURL=createTabs.native.js.map

package/dist/jsx/createTabs.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__create","Object","create","__defProp","defineProperty","__getOwnPropDesc","getOwnPropertyDescriptor","__getOwnPropNames","getOwnPropertyNames","__getProtoOf","getPrototypeOf","__hasOwnProp","prototype","hasOwnProperty","__export","target","all","name","get","enumerable","__copyProps","to","from","except","desc","key","call","__toESM","mod","isNodeMode","__esModule","value","__toCommonJS","createTabs_exports","createTabs","module","exports","import_jsx_runtime","require","import_compose_refs","import_constants","import_group","import_helpers","import_roving_focus","import_sizable_context","import_use_controllable_state","import_use_direction","import_web","React","import_StyledContext","import_Tabs","createProps","ContentFrame","DefaultTabsContentFrame","TabFrame","DefaultTabsTabFrame","TabsFrame","DefaultTabsFrame","TABS_CONTEXT","TAB_LIST_NAME","TabsList","forwardRef","props","forwardedRef","__scopeTabs","loop","children","listProps","context","useTabsContext","jsx","RovingFocusGroup","__scopeRovingFocusGroup","orientation","dir","asChild","Group","role","componentName","ref","displayName","TRIGGER_NAME","TabsTrigger","styleable","disabled","onInteraction","activeStyle","activeTheme","unstyled","triggerProps","triggerId","makeTriggerId","baseId","contentId","makeContentId","isSelected","layout","setLayout","useState","triggerRef","useRef","groupItemProps","useGroupItem","useEffect","registerTrigger","unregisterTrigger","current","isWeb","el","getTriggerSize","width","offsetWidth","height","offsetHeight","x","offsetLeft","y","offsetTop","observer","ResizeObserver","observe","disconnect","triggersCount","_props_onPress","Item","focusable","active","onLayout","event","nativeEvent","onMouseEnter","composeEventHandlers","onMouseLeave","id","theme","size","backgroundColor","composeRefs","onPress","webChecks","button","ctrlKey","onChange","onKeyDown","includes","preventDefault","onFocus","isAutomaticActivation","activationMode","onBlur","TabsContent","TabsContent2","forceMount","contentProps","show","hidden","tabIndex","TabsComponent","Tabs","valueProp","onValueChange","defaultValue","tabsProps","direction","useDirection","setValue","useControllableState","prop","defaultProp","setTriggersCount","useEvent","v","SizableContext","Provider","TabsProvider","scope","useId","withStaticProperties","List","Trigger"],"sources":["../../src/createTabs.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/jsx/index.js

@@ -0,0 +1,11 @@
+import { createTabs } from "./createTabs.mjs";
+import { DefaultTabsContentFrame, DefaultTabsFrame, DefaultTabsTabFrame } from "./Tabs.mjs";
+export * from "./createTabs.mjs";
+export * from "./StyledContext.mjs";
+const Tabs = createTabs({
+  ContentFrame: DefaultTabsContentFrame,
+  TabFrame: DefaultTabsTabFrame,
+  TabsFrame: DefaultTabsFrame
+});
+export { Tabs };
+//# sourceMappingURL=index.js.map

package/dist/jsx/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["createTabs","DefaultTabsContentFrame","DefaultTabsFrame","DefaultTabsTabFrame","Tabs","ContentFrame","TabFrame","TabsFrame"],"sources":["../../src/index.ts"],"sourcesContent":[null],"mappings":"AAAA,SAASA,UAAA,QAAkB;AAC3B,SAASC,uBAAA,EAAyBC,gBAAA,EAAkBC,mBAAA,QAA2B;AAC/E,cAAc;AACd,cAAc;AAEP,MAAMC,IAAA,GAAOJ,UAAA,CAAW;EAC7BK,YAAA,EAAcJ,uBAAA;EACdK,QAAA,EAAUH,mBAAA;EACVI,SAAA,EAAWL;AACb,CAAC","ignoreList":[]}

package/dist/jsx/index.mjs

@@ -0,0 +1,11 @@
+import { createTabs } from "./createTabs.mjs";
+import { DefaultTabsContentFrame, DefaultTabsFrame, DefaultTabsTabFrame } from "./Tabs.mjs";
+export * from "./createTabs.mjs";
+export * from "./StyledContext.mjs";
+const Tabs = createTabs({
+  ContentFrame: DefaultTabsContentFrame,
+  TabFrame: DefaultTabsTabFrame,
+  TabsFrame: DefaultTabsFrame
+});
+export { Tabs };
+//# sourceMappingURL=index.mjs.map

package/dist/jsx/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"names":["createTabs","DefaultTabsContentFrame","DefaultTabsFrame","DefaultTabsTabFrame","Tabs","ContentFrame","TabFrame","TabsFrame"],"sources":["../../src/index.ts"],"sourcesContent":[null],"mappings":"AAAA,SAASA,UAAA,QAAkB;AAC3B,SAASC,uBAAA,EAAyBC,gBAAA,EAAkBC,mBAAA,QAA2B;AAC/E,cAAc;AACd,cAAc;AAEP,MAAMC,IAAA,GAAOJ,UAAA,CAAW;EAC7BK,YAAA,EAAcJ,uBAAA;EACdK,QAAA,EAAUH,mBAAA;EACVI,SAAA,EAAWL;AACb,CAAC","ignoreList":[]}

package/dist/jsx/index.native.js

@@ -0,0 +1,40 @@
+"use strict";
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var index_exports = {};
+__export(index_exports, {
+  Tabs: () => Tabs
+});
+module.exports = __toCommonJS(index_exports);
+var import_createTabs = require("./createTabs.native.js");
+var import_Tabs = require("./Tabs.native.js");
+__reExport(index_exports, require("./createTabs.native.js"), module.exports);
+__reExport(index_exports, require("./StyledContext.native.js"), module.exports);
+var Tabs = (0, import_createTabs.createTabs)({
+  ContentFrame: import_Tabs.DefaultTabsContentFrame,
+  TabFrame: import_Tabs.DefaultTabsTabFrame,
+  TabsFrame: import_Tabs.DefaultTabsFrame
+});
+//# sourceMappingURL=index.native.js.map

package/dist/jsx/index.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__defProp","Object","defineProperty","__getOwnPropDesc","getOwnPropertyDescriptor","__getOwnPropNames","getOwnPropertyNames","__hasOwnProp","prototype","hasOwnProperty","__export","target","all","name","get","enumerable"],"sources":["../../src/index.ts"],"sourcesContent":[null],"mappings":"AAAA,YAAS;;AACT,IAAAA,SAAS,GAAAC,MAAA,CAAAC,cAAyB;AAClC,IAAAC,gBAAc,GAAAF,MAAA,CAAAG,wBAAA;AACd,IAAAC,iBAAc,GAAAJ,MAAA,CAAAK,mBAAA;AAEP,IAAAC,YAAa,GAAAN,MAAW,CAAAO,SAAA,CAAAC,cAAA;AAAA,IAC7BC,QAAA,GAAAA,CAAcC,MAAA,EAAAC,GAAA;EACd,SAAAC,IAAU,IAAAD,GAAA,EACVZ,SAAW,CAAAW,MAAA,EAAAE,IAAA;IAAAC,GAAA,EAAAF,GAAA,CAAAC,IAAA;IAAAE,UAAA;EAAA;AACb,CAAC","ignoreList":[]}

package/package.json

@@ -0,0 +1,65 @@
+{
+  "name": "@hanzogui/tabs",
+  "version": "2.0.0-rc.41-hanzoai.1",
+  "gitHead": "a49cc7ea6b93ba384e77a4880ae48ac4a5635c14",
+  "source": "src/index.ts",
+  "files": [
+    "src",
+    "types",
+    "dist"
+  ],
+  "type": "module",
+  "sideEffects": [
+    "*.css"
+  ],
+  "main": "dist/cjs",
+  "module": "dist/esm",
+  "types": "./types/index.d.ts",
+  "exports": {
+    "./package.json": "./package.json",
+    ".": {
+      "types": "./types/index.d.ts",
+      "react-native": "./dist/esm/index.native.js",
+      "browser": "./dist/esm/index.mjs",
+      "module": "./dist/esm/index.mjs",
+      "import": "./dist/esm/index.mjs",
+      "require": "./dist/cjs/index.cjs",
+      "default": "./dist/esm/index.mjs"
+    }
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "hanzogui-build",
+    "watch": "hanzogui-build --watch",
+    "clean": "hanzogui-build clean",
+    "clean:build": "hanzogui-build clean:build"
+  },
+  "dependencies": {
+    "@hanzogui/compose-refs": "2.0.0-rc.41-hanzoai.1",
+    "@hanzogui/constants": "2.0.0-rc.41-hanzoai.1",
+    "@hanzogui/core": "2.0.0-rc.41-hanzoai.1",
+    "@hanzogui/create-context": "2.0.0-rc.41-hanzoai.1",
+    "@hanzogui/element": "2.0.0-rc.41-hanzoai.1",
+    "@hanzogui/get-button-sized": "2.0.0-rc.41-hanzoai.1",
+    "@hanzogui/group": "2.0.0-rc.41-hanzoai.1",
+    "@hanzogui/helpers": "2.0.0-rc.41-hanzoai.1",
+    "@hanzogui/roving-focus": "2.0.0-rc.41-hanzoai.1",
+    "@hanzogui/sizable-context": "2.0.0-rc.41-hanzoai.1",
+    "@hanzogui/stacks": "2.0.0-rc.41-hanzoai.1",
+    "@hanzogui/use-controllable-state": "2.0.0-rc.41-hanzoai.1",
+    "@hanzogui/use-direction": "2.0.0-rc.41-hanzoai.1",
+    "@hanzogui/web": "2.0.0-rc.41-hanzoai.1"
+  },
+  "devDependencies": {
+    "@hanzogui/build": "2.0.0-rc.41-hanzoai.1",
+    "react": ">=19",
+    "react-native": "0.83.2"
+  },
+  "peerDependencies": {
+    "react": ">=19",
+    "react-native": "*"
+  },
+  "module:jsx": "dist/jsx"
+}

package/src/StyledContext.tsx

@@ -0,0 +1,19 @@
+import type { SizeTokens } from '@hanzogui/core'
+import { createStyledContext } from '@hanzogui/core'
+import type { TabsProps } from './createTabs'
+
+export type TabsContextValue = {
+  baseId: string
+  value?: string
+  onChange: (value: string) => void
+  orientation?: TabsProps['orientation']
+  dir?: TabsProps['dir']
+  activationMode?: TabsProps['activationMode']
+  size: SizeTokens
+  registerTrigger: () => void
+  unregisterTrigger: () => void
+  triggersCount: number
+}
+
+export const { Provider: TabsProvider, useStyledContext: useTabsContext } =
+  createStyledContext<TabsContextValue>()

package/src/Tabs.tsx

@@ -0,0 +1,69 @@
+import { styled, View } from '@hanzogui/core'
+import { getButtonSized } from '@hanzogui/get-button-sized'
+import { SizableStack, ThemeableStack } from '@hanzogui/stacks'
+
+const TABS_NAME = 'Tabs'
+export const DefaultTabsFrame = styled(SizableStack, {
+  name: TABS_NAME,
+})
+
+const TRIGGER_NAME = 'TabsTrigger'
+
+export const DefaultTabsTabFrame = styled(
+  View,
+  {
+    name: TRIGGER_NAME,
+    role: 'tab',
+
+    variants: {
+      size: {
+        '...size': getButtonSized,
+      },
+
+      disabled: {
+        true: {
+          pointerEvents: 'none',
+        },
+      },
+
+      unstyled: {
+        false: {
+          borderWidth: 0,
+          backgroundColor: '$background',
+          userSelect: 'none',
+          justifyContent: 'center',
+          alignItems: 'center',
+          flexWrap: 'nowrap',
+          flexDirection: 'row',
+          cursor: 'pointer',
+
+          pressStyle: {
+            backgroundColor: '$backgroundPress',
+          },
+
+          focusVisibleStyle: {
+            outlineColor: '$outlineColor',
+            outlineWidth: 2,
+            outlineStyle: 'solid',
+            zIndex: 10,
+          },
+        },
+      },
+    } as const,
+
+    defaultVariants: {
+      unstyled: process.env.HANZOGUI_HEADLESS === '1',
+    },
+  },
+  {
+    accept: {
+      activeStyle: 'style',
+    } as const,
+  }
+)
+
+const CONTENT_NAME = 'TabsContent'
+
+export const DefaultTabsContentFrame = styled(ThemeableStack, {
+  name: CONTENT_NAME,
+})