@hanzogui/tabs 7.0.0 → 7.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (59) hide show
  1. package/LICENSE +42 -21
  2. package/dist/cjs/StyledContext.cjs +33 -0
  3. package/dist/cjs/StyledContext.native.js +36 -0
  4. package/dist/cjs/StyledContext.native.js.map +1 -0
  5. package/dist/cjs/Tabs.cjs +83 -0
  6. package/dist/cjs/Tabs.native.js +86 -0
  7. package/dist/cjs/Tabs.native.js.map +1 -0
  8. package/dist/cjs/createTabs.cjs +293 -0
  9. package/dist/cjs/createTabs.native.js +308 -0
  10. package/dist/cjs/createTabs.native.js.map +1 -0
  11. package/dist/cjs/index.cjs +37 -0
  12. package/dist/cjs/index.native.js +40 -0
  13. package/dist/cjs/index.native.js.map +1 -0
  14. package/dist/esm/StyledContext.mjs +7 -0
  15. package/dist/esm/StyledContext.mjs.map +1 -0
  16. package/dist/esm/StyledContext.native.js +7 -0
  17. package/dist/esm/StyledContext.native.js.map +1 -0
  18. package/dist/esm/Tabs.mjs +56 -0
  19. package/dist/esm/Tabs.mjs.map +1 -0
  20. package/dist/esm/Tabs.native.js +56 -0
  21. package/dist/esm/Tabs.native.js.map +1 -0
  22. package/dist/esm/createTabs.mjs +257 -0
  23. package/dist/esm/createTabs.mjs.map +1 -0
  24. package/dist/esm/createTabs.native.js +269 -0
  25. package/dist/esm/createTabs.native.js.map +1 -0
  26. package/dist/esm/index.js +11 -0
  27. package/dist/esm/index.js.map +1 -0
  28. package/dist/esm/index.mjs +11 -0
  29. package/dist/esm/index.mjs.map +1 -0
  30. package/dist/esm/index.native.js +11 -0
  31. package/dist/esm/index.native.js.map +1 -0
  32. package/dist/jsx/StyledContext.mjs +7 -0
  33. package/dist/jsx/StyledContext.mjs.map +1 -0
  34. package/dist/jsx/StyledContext.native.js +36 -0
  35. package/dist/jsx/StyledContext.native.js.map +1 -0
  36. package/dist/jsx/Tabs.mjs +56 -0
  37. package/dist/jsx/Tabs.mjs.map +1 -0
  38. package/dist/jsx/Tabs.native.js +86 -0
  39. package/dist/jsx/Tabs.native.js.map +1 -0
  40. package/dist/jsx/createTabs.mjs +257 -0
  41. package/dist/jsx/createTabs.mjs.map +1 -0
  42. package/dist/jsx/createTabs.native.js +308 -0
  43. package/dist/jsx/createTabs.native.js.map +1 -0
  44. package/dist/jsx/index.js +11 -0
  45. package/dist/jsx/index.js.map +1 -0
  46. package/dist/jsx/index.mjs +11 -0
  47. package/dist/jsx/index.mjs.map +1 -0
  48. package/dist/jsx/index.native.js +40 -0
  49. package/dist/jsx/index.native.js.map +1 -0
  50. package/package.json +29 -22
  51. package/src/Tabs.tsx +1 -1
  52. package/src/createTabs.tsx +5 -5
  53. package/types/StyledContext.d.ts.map +1 -0
  54. package/types/Tabs.d.ts +5 -5
  55. package/types/Tabs.d.ts.map +1 -0
  56. package/types/createTabs.d.ts +73 -73
  57. package/types/createTabs.d.ts.map +1 -0
  58. package/types/index.d.ts +83 -83
  59. package/types/index.d.ts.map +1 -0
@@ -0,0 +1,56 @@
1
+ import { styled, View } from "@hanzogui/core";
2
+ import { getButtonSized } from "@hanzogui/get-button-sized";
3
+ import { SizableStack, ThemeableStack } from "@hanzogui/stacks";
4
+ const TABS_NAME = "Tabs";
5
+ const DefaultTabsFrame = styled(SizableStack, {
6
+ name: TABS_NAME
7
+ });
8
+ const TRIGGER_NAME = "TabsTrigger";
9
+ const DefaultTabsTabFrame = styled(View, {
10
+ name: TRIGGER_NAME,
11
+ role: "tab",
12
+ variants: {
13
+ size: {
14
+ "...size": getButtonSized
15
+ },
16
+ disabled: {
17
+ true: {
18
+ pointerEvents: "none"
19
+ }
20
+ },
21
+ unstyled: {
22
+ false: {
23
+ borderWidth: 0,
24
+ backgroundColor: "$background",
25
+ userSelect: "none",
26
+ justifyContent: "center",
27
+ alignItems: "center",
28
+ flexWrap: "nowrap",
29
+ flexDirection: "row",
30
+ cursor: "pointer",
31
+ pressStyle: {
32
+ backgroundColor: "$backgroundPress"
33
+ },
34
+ focusVisibleStyle: {
35
+ outlineColor: "$outlineColor",
36
+ outlineWidth: 2,
37
+ outlineStyle: "solid",
38
+ zIndex: 10
39
+ }
40
+ }
41
+ }
42
+ },
43
+ defaultVariants: {
44
+ unstyled: process.env.GUI_HEADLESS === "1"
45
+ }
46
+ }, {
47
+ accept: {
48
+ activeStyle: "style"
49
+ }
50
+ });
51
+ const CONTENT_NAME = "TabsContent";
52
+ const DefaultTabsContentFrame = styled(ThemeableStack, {
53
+ name: CONTENT_NAME
54
+ });
55
+ export { DefaultTabsContentFrame, DefaultTabsFrame, DefaultTabsTabFrame };
56
+ //# sourceMappingURL=Tabs.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["styled","View","getButtonSized","SizableStack","ThemeableStack","TABS_NAME","DefaultTabsFrame","name","TRIGGER_NAME","DefaultTabsTabFrame","role","variants","size","disabled","true","pointerEvents","unstyled","false","borderWidth","backgroundColor","userSelect","justifyContent","alignItems","flexWrap","flexDirection","cursor","pressStyle","focusVisibleStyle","outlineColor","outlineWidth","outlineStyle","zIndex","defaultVariants","process","env","GUI_HEADLESS","accept","activeStyle","CONTENT_NAME","DefaultTabsContentFrame"],"sources":["../../src/Tabs.tsx"],"sourcesContent":[null],"mappings":"AAAA,SAASA,MAAA,EAAQC,IAAA,QAAY;AAC7B,SAASC,cAAA,QAAsB;AAC/B,SAASC,YAAA,EAAcC,cAAA,QAAsB;AAE7C,MAAMC,SAAA,GAAY;AACX,MAAMC,gBAAA,GAAmBN,MAAA,CAAOG,YAAA,EAAc;EACnDI,IAAA,EAAMF;AACR,CAAC;AAED,MAAMG,YAAA,GAAe;AAEd,MAAMC,mBAAA,GAAsBT,MAAA,CACjCC,IAAA,EACA;EACEM,IAAA,EAAMC,YAAA;EACNE,IAAA,EAAM;EAENC,QAAA,EAAU;IACRC,IAAA,EAAM;MACJ,WAAWV;IACb;IAEAW,QAAA,EAAU;MACRC,IAAA,EAAM;QACJC,aAAA,EAAe;MACjB;IACF;IAEAC,QAAA,EAAU;MACRC,KAAA,EAAO;QACLC,WAAA,EAAa;QACbC,eAAA,EAAiB;QACjBC,UAAA,EAAY;QACZC,cAAA,EAAgB;QAChBC,UAAA,EAAY;QACZC,QAAA,EAAU;QACVC,aAAA,EAAe;QACfC,MAAA,EAAQ;QAERC,UAAA,EAAY;UACVP,eAAA,EAAiB;QACnB;QAEAQ,iBAAA,EAAmB;UACjBC,YAAA,EAAc;UACdC,YAAA,EAAc;UACdC,YAAA,EAAc;UACdC,MAAA,EAAQ;QACV;MACF;IACF;EACF;EAEAC,eAAA,EAAiB;IACfhB,QAAA,EAAUiB,OAAA,CAAQC,GAAA,CAAIC,YAAA,KAAiB;EACzC;AACF,GACA;EACEC,MAAA,EAAQ;IACNC,WAAA,EAAa;EACf;AACF,CACF;AAEA,MAAMC,YAAA,GAAe;AAEd,MAAMC,uBAAA,GAA0BvC,MAAA,CAAOI,cAAA,EAAgB;EAC5DG,IAAA,EAAM+B;AACR,CAAC","ignoreList":[]}
@@ -0,0 +1,86 @@
1
+ "use strict";
2
+
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __export = (target, all) => {
8
+ for (var name in all) __defProp(target, name, {
9
+ get: all[name],
10
+ enumerable: true
11
+ });
12
+ };
13
+ var __copyProps = (to, from, except, desc) => {
14
+ if (from && typeof from === "object" || typeof from === "function") {
15
+ for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
16
+ get: () => from[key],
17
+ enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
18
+ });
19
+ }
20
+ return to;
21
+ };
22
+ var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
23
+ value: true
24
+ }), mod);
25
+ var Tabs_exports = {};
26
+ __export(Tabs_exports, {
27
+ DefaultTabsContentFrame: () => DefaultTabsContentFrame,
28
+ DefaultTabsFrame: () => DefaultTabsFrame,
29
+ DefaultTabsTabFrame: () => DefaultTabsTabFrame
30
+ });
31
+ module.exports = __toCommonJS(Tabs_exports);
32
+ var import_core = require("@hanzogui/core");
33
+ var import_get_button_sized = require("@hanzogui/get-button-sized");
34
+ var import_stacks = require("@hanzogui/stacks");
35
+ var TABS_NAME = "Tabs";
36
+ var DefaultTabsFrame = (0, import_core.styled)(import_stacks.SizableStack, {
37
+ name: TABS_NAME
38
+ });
39
+ var TRIGGER_NAME = "TabsTrigger";
40
+ var DefaultTabsTabFrame = (0, import_core.styled)(import_core.View, {
41
+ name: TRIGGER_NAME,
42
+ role: "tab",
43
+ variants: {
44
+ size: {
45
+ "...size": import_get_button_sized.getButtonSized
46
+ },
47
+ disabled: {
48
+ true: {
49
+ pointerEvents: "none"
50
+ }
51
+ },
52
+ unstyled: {
53
+ false: {
54
+ borderWidth: 0,
55
+ backgroundColor: "$background",
56
+ userSelect: "none",
57
+ justifyContent: "center",
58
+ alignItems: "center",
59
+ flexWrap: "nowrap",
60
+ flexDirection: "row",
61
+ cursor: "pointer",
62
+ pressStyle: {
63
+ backgroundColor: "$backgroundPress"
64
+ },
65
+ focusVisibleStyle: {
66
+ outlineColor: "$outlineColor",
67
+ outlineWidth: 2,
68
+ outlineStyle: "solid",
69
+ zIndex: 10
70
+ }
71
+ }
72
+ }
73
+ },
74
+ defaultVariants: {
75
+ unstyled: process.env.GUI_HEADLESS === "1"
76
+ }
77
+ }, {
78
+ accept: {
79
+ activeStyle: "style"
80
+ }
81
+ });
82
+ var CONTENT_NAME = "TabsContent";
83
+ var DefaultTabsContentFrame = (0, import_core.styled)(import_stacks.ThemeableStack, {
84
+ name: CONTENT_NAME
85
+ });
86
+ //# sourceMappingURL=Tabs.native.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["__defProp","Object","defineProperty","__getOwnPropDesc","getOwnPropertyDescriptor","__getOwnPropNames","getOwnPropertyNames","__hasOwnProp","prototype","hasOwnProperty","__export","target","all","name","get","enumerable","__copyProps","to","from","except","desc","key","call","__toCommonJS","mod","value","Tabs_exports","DefaultTabsContentFrame","DefaultTabsFrame","DefaultTabsTabFrame","module","exports","import_core","require","import_get_button_sized","import_stacks","TABS_NAME","styled","SizableStack","TRIGGER_NAME","View","role","variants","size","getButtonSized","disabled","true","pointerEvents","unstyled","false","borderWidth","backgroundColor","userSelect","justifyContent","alignItems","flexWrap","flexDirection","cursor","pressStyle"],"sources":["../../src/Tabs.tsx"],"sourcesContent":[null],"mappings":"AAAA,YAAS;;AACT,IAAAA,SAAS,GAAAC,MAAA,CAAAC,cAAsB;AAC/B,IAAAC,gBAAS,GAAcF,MAAA,CAAAG,wBAAsB;AAE7C,IAAAC,iBAAkB,GAAAJ,MAAA,CAAAK,mBAAA;AACX,IAAAC,YAAM,GAAAN,MAAmB,CAAAO,SAAO,CAAAC,cAAc;AAAA,IACnDC,QAAM,GAAAA,CAAAC,MAAA,EAAAC,GAAA;EACP,SAAAC,IAAA,IAAAD,GAAA,EAEDZ,SAAM,CAAAW,MAAA,EAAeE,IAAA;IAAAC,GAAA,EAAAF,GAAA,CAAAC,IAAA;IAAAE,UAAA;EAAA;AAEd;AAA4B,IACjCC,WAAA,GAAAA,CAAAC,EAAA,EAAAC,IAAA,EAAAC,MAAA,EAAAC,IAAA;EACA,IAAAF,IAAA,WAAAA,IAAA,wBAAAA,IAAA;IACE,SAAMG,GAAA,IAAAhB,iBAAA,CAAAa,IAAA,GACN,IAAM,CAAAX,YAAA,CAAAe,IAAA,CAAAL,EAAA,EAAAI,GAAA,KAAAA,GAAA,KAAAF,MAAA,EAENnB,SAAU,CAAAiB,EAAA,EAAAI,GAAA;MAAAP,GAAA,EAAAA,CAAA,KAAAI,IAAA,CAAAG,GAAA;MAAAN,UAAA,IAAAK,IAAA,GAAAjB,gBAAA,CAAAe,IAAA,EAAAG,GAAA,MAAAD,IAAA,CAAAL;IAAA;EAAA;EACF,OACJE,EAAA;AAAW;AACb,IAAAM,YAEU,GAAAC,GAAA,IAAAR,WAAA,CAAAhB,SAAA;EAAAyB,KAAA;AAAA,IAAAD,GAAA;AAAA,IAAAE,YACF;AAAAhB,QAAA,CAAAgB,YACJ;EAAeC,uBACjB,EAAAA,CAAA,KAAAA,uBAAA;EAAAC,gBACF,EAAAA,CAAA,KAAAA,gBAAA;EAAAC,mBAEU,EAAAA,CAAA,KAAAA;AAAA;AACDC,MAAA,CAAAC,OACL,GAAAR,YAAa,CAAAG,YAAA;AAAA,IAAAM,WACb,GAAAC,OAAA,iBAAiB;AAAA,IAAAC,uBACL,GAAAD,OAAA;AAAA,IAAAE,aACZ,GAAAF,OAAgB;AAAA,IAAAG,SAChB,SAAY;AAAA,IAAAR,gBACF,OAAAI,WAAA,CAAAK,MAAA,EAAAF,aAAA,CAAAG,YAAA;EAAAzB,IAAA,EAAAuB;AACK;AACP,IAAAG,YAER,gBAAY;AAAA,IAAAV,mBACV,OAAiBG,WAAA,CAAAK,MAAA,EAAAL,WAAA,CAAAQ,IAAA;EAAA3B,IAAA,EAAA0B,YACnB;EAAAE,IAAA,OAEA;EAAmBC,QAAA,EACjB;IAAcC,IAAA;MACA,SACd,EAAAT,uBAAc,CAAAU;IAAA;IACNC,QACV;MAAAC,IACF;QACFC,aAAA;MACF;IAEA;IAAiBC,QACf;MACFC,KAAA;QACFC,WAAA;QACAC,eAAA;QACEC,UAAQ;QACNC,cAAa;QACfC,UAAA;QACFC,QAAA;QACFC,aAAA;QAEMC,MAAA,WAAe;QAERC,UAAA;UACLP,eAAA;QACP","ignoreList":[]}
@@ -0,0 +1,257 @@
1
+ import { composeRefs } from "@hanzogui/compose-refs";
2
+ import { isWeb } from "@hanzogui/constants";
3
+ import { Group, useGroupItem } from "@hanzogui/group";
4
+ import { composeEventHandlers, withStaticProperties } from "@hanzogui/helpers";
5
+ import { RovingFocusGroup } from "@hanzogui/roving-focus";
6
+ import { SizableContext } from "@hanzogui/sizable-context";
7
+ import { useControllableState } from "@hanzogui/use-controllable-state";
8
+ import { useDirection } from "@hanzogui/use-direction";
9
+ import { useEvent } from "@hanzogui/web";
10
+ import * as React from "react";
11
+ import { TabsProvider, useTabsContext } from "./StyledContext.mjs";
12
+ import { DefaultTabsContentFrame, DefaultTabsFrame, DefaultTabsTabFrame } from "./Tabs.mjs";
13
+ import { jsx } from "react/jsx-runtime";
14
+ function createTabs(createProps) {
15
+ const {
16
+ ContentFrame = DefaultTabsContentFrame,
17
+ TabFrame = DefaultTabsTabFrame,
18
+ TabsFrame = DefaultTabsFrame
19
+ } = createProps;
20
+ const TABS_CONTEXT = "TabsContext";
21
+ const TAB_LIST_NAME = "TabsList";
22
+ const TabsList = React.forwardRef((props, forwardedRef) => {
23
+ const {
24
+ __scopeTabs,
25
+ loop = true,
26
+ children,
27
+ ...listProps
28
+ } = props;
29
+ const context = useTabsContext(__scopeTabs);
30
+ return /* @__PURE__ */jsx(RovingFocusGroup, {
31
+ __scopeRovingFocusGroup: __scopeTabs || TABS_CONTEXT,
32
+ orientation: context.orientation,
33
+ dir: context.dir,
34
+ loop,
35
+ asChild: true,
36
+ children: /* @__PURE__ */jsx(Group, {
37
+ role: "tablist",
38
+ componentName: TAB_LIST_NAME,
39
+ "aria-orientation": context.orientation,
40
+ ref: forwardedRef,
41
+ orientation: context.orientation,
42
+ ...listProps,
43
+ children
44
+ })
45
+ });
46
+ });
47
+ TabsList.displayName = TAB_LIST_NAME;
48
+ const TRIGGER_NAME = "TabsTrigger";
49
+ const TabsTrigger = TabFrame.styleable((props, forwardedRef) => {
50
+ const {
51
+ __scopeTabs,
52
+ value,
53
+ disabled = false,
54
+ onInteraction,
55
+ activeStyle,
56
+ activeTheme,
57
+ unstyled = false,
58
+ ...triggerProps
59
+ } = props;
60
+ const context = useTabsContext(__scopeTabs);
61
+ const triggerId = makeTriggerId(context.baseId, value);
62
+ const contentId = makeContentId(context.baseId, value);
63
+ const isSelected = value === context.value;
64
+ const [layout, setLayout] = React.useState(null);
65
+ const triggerRef = React.useRef(null);
66
+ const groupItemProps = useGroupItem({
67
+ disabled: !!disabled
68
+ });
69
+ React.useEffect(() => {
70
+ context.registerTrigger();
71
+ return () => context.unregisterTrigger();
72
+ }, []);
73
+ React.useEffect(() => {
74
+ if (!triggerRef.current || !isWeb) return;
75
+ const el = triggerRef.current;
76
+ function getTriggerSize() {
77
+ if (!el) return;
78
+ setLayout({
79
+ width: el.offsetWidth,
80
+ height: el.offsetHeight,
81
+ x: el.offsetLeft,
82
+ y: el.offsetTop
83
+ });
84
+ }
85
+ getTriggerSize();
86
+ const observer = new ResizeObserver(getTriggerSize);
87
+ observer.observe(el);
88
+ return () => {
89
+ observer.disconnect();
90
+ };
91
+ }, [context.triggersCount]);
92
+ React.useEffect(() => {
93
+ if (isSelected && layout) {
94
+ onInteraction?.("select", layout);
95
+ }
96
+ }, [isSelected, value, layout]);
97
+ return /* @__PURE__ */jsx(RovingFocusGroup.Item, {
98
+ __scopeRovingFocusGroup: __scopeTabs || TABS_CONTEXT,
99
+ asChild: true,
100
+ focusable: !disabled,
101
+ active: isSelected,
102
+ children: /* @__PURE__ */jsx(TabFrame, {
103
+ ...(!isWeb && {
104
+ onLayout: event => {
105
+ setLayout(event.nativeEvent.layout);
106
+ }
107
+ }),
108
+ onMouseEnter: composeEventHandlers(props.onMouseEnter, () => {
109
+ if (layout) {
110
+ onInteraction?.("hover", layout);
111
+ }
112
+ }),
113
+ onMouseLeave: composeEventHandlers(props.onMouseLeave, () => {
114
+ onInteraction?.("hover", null);
115
+ }),
116
+ role: "tab",
117
+ "aria-selected": isSelected,
118
+ "aria-controls": contentId,
119
+ "data-state": isSelected ? "active" : "inactive",
120
+ "data-disabled": disabled ? "" : void 0,
121
+ id: triggerId,
122
+ theme: activeTheme ?? null,
123
+ unstyled,
124
+ ...(!unstyled && {
125
+ size: context.size
126
+ }),
127
+ ...(isSelected && {
128
+ ...(!unstyled && !activeStyle && {
129
+ backgroundColor: "$backgroundActive"
130
+ }),
131
+ ...activeStyle
132
+ }),
133
+ ...groupItemProps,
134
+ disabled: disabled ?? groupItemProps.disabled,
135
+ ...triggerProps,
136
+ ref: composeRefs(forwardedRef, triggerRef),
137
+ onPress: composeEventHandlers(props.onPress ?? void 0, event => {
138
+ const webChecks = !isWeb || event.button === 0 && event.ctrlKey === false;
139
+ if (!disabled && !isSelected && webChecks) {
140
+ context.onChange(value);
141
+ }
142
+ }),
143
+ ...(isWeb && {
144
+ onKeyDown: composeEventHandlers(props.onKeyDown, event => {
145
+ if ([" ", "Enter"].includes(event.key)) {
146
+ context.onChange(value);
147
+ event.preventDefault();
148
+ }
149
+ }),
150
+ onFocus: composeEventHandlers(props.onFocus, event => {
151
+ if (layout) {
152
+ onInteraction?.("focus", layout);
153
+ }
154
+ const isAutomaticActivation = context.activationMode !== "manual";
155
+ if (!isSelected && !disabled && isAutomaticActivation) {
156
+ context.onChange(value);
157
+ }
158
+ }),
159
+ onBlur: composeEventHandlers(props.onBlur, () => {
160
+ onInteraction?.("focus", null);
161
+ })
162
+ })
163
+ })
164
+ });
165
+ });
166
+ TabsTrigger.displayName = TRIGGER_NAME;
167
+ const TabsContent = ContentFrame.styleable(function TabsContent2(props, forwardedRef) {
168
+ const {
169
+ __scopeTabs,
170
+ value,
171
+ forceMount,
172
+ children,
173
+ ...contentProps
174
+ } = props;
175
+ const context = useTabsContext(__scopeTabs);
176
+ const isSelected = value === context.value;
177
+ const show = forceMount || isSelected;
178
+ const triggerId = makeTriggerId(context.baseId, value);
179
+ const contentId = makeContentId(context.baseId, value);
180
+ if (!show) {
181
+ return null;
182
+ }
183
+ return /* @__PURE__ */jsx(ContentFrame, {
184
+ "data-state": isSelected ? "active" : "inactive",
185
+ "data-orientation": context.orientation,
186
+ role: "tabpanel",
187
+ "aria-labelledby": triggerId,
188
+ hidden: !show,
189
+ id: contentId,
190
+ tabIndex: 0,
191
+ ...contentProps,
192
+ ref: forwardedRef,
193
+ children
194
+ }, value);
195
+ });
196
+ const TabsComponent = TabsFrame.styleable(function Tabs(props, forwardedRef) {
197
+ const {
198
+ __scopeTabs,
199
+ value: valueProp,
200
+ onValueChange,
201
+ defaultValue,
202
+ orientation = "horizontal",
203
+ dir,
204
+ activationMode = "manual",
205
+ size = "$true",
206
+ ...tabsProps
207
+ } = props;
208
+ const direction = useDirection(dir);
209
+ const [value, setValue] = useControllableState({
210
+ prop: valueProp,
211
+ onChange: onValueChange,
212
+ defaultProp: defaultValue ?? ""
213
+ });
214
+ const [triggersCount, setTriggersCount] = React.useState(0);
215
+ const registerTrigger = useEvent(() => setTriggersCount(v => v + 1));
216
+ const unregisterTrigger = useEvent(() => setTriggersCount(v => v - 1));
217
+ return /* @__PURE__ */jsx(SizableContext.Provider, {
218
+ size,
219
+ children: /* @__PURE__ */jsx(TabsProvider, {
220
+ scope: __scopeTabs,
221
+ baseId: React.useId(),
222
+ value,
223
+ onChange: setValue,
224
+ orientation,
225
+ dir: direction,
226
+ activationMode,
227
+ size,
228
+ registerTrigger,
229
+ triggersCount,
230
+ unregisterTrigger,
231
+ children: /* @__PURE__ */jsx(TabsFrame, {
232
+ direction,
233
+ "data-orientation": orientation,
234
+ ...tabsProps,
235
+ ref: forwardedRef
236
+ })
237
+ })
238
+ });
239
+ });
240
+ return withStaticProperties(TabsComponent, {
241
+ List: TabsList,
242
+ /**
243
+ * @deprecated Use Tabs.Tab instead
244
+ */
245
+ Trigger: TabsTrigger,
246
+ Tab: TabsTrigger,
247
+ Content: TabsContent
248
+ });
249
+ }
250
+ function makeTriggerId(baseId, value) {
251
+ return `${baseId}-trigger-${value}`;
252
+ }
253
+ function makeContentId(baseId, value) {
254
+ return `${baseId}-content-${value}`;
255
+ }
256
+ export { createTabs };
257
+ //# sourceMappingURL=createTabs.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["composeRefs","isWeb","Group","useGroupItem","composeEventHandlers","withStaticProperties","RovingFocusGroup","SizableContext","useControllableState","useDirection","useEvent","React","TabsProvider","useTabsContext","DefaultTabsContentFrame","DefaultTabsFrame","DefaultTabsTabFrame","jsx","createTabs","createProps","ContentFrame","TabFrame","TabsFrame","TABS_CONTEXT","TAB_LIST_NAME","TabsList","forwardRef","props","forwardedRef","__scopeTabs","loop","children","listProps","context","__scopeRovingFocusGroup","orientation","dir","asChild","role","componentName","ref","displayName","TRIGGER_NAME","TabsTrigger","styleable","value","disabled","onInteraction","activeStyle","activeTheme","unstyled","triggerProps","triggerId","makeTriggerId","baseId","contentId","makeContentId","isSelected","layout","setLayout","useState","triggerRef","useRef","groupItemProps","useEffect","registerTrigger","unregisterTrigger","current","el","getTriggerSize","width","offsetWidth","height","offsetHeight","x","offsetLeft","y","offsetTop","observer","ResizeObserver","observe","disconnect","triggersCount","Item","focusable","active","onLayout","event","nativeEvent","onMouseEnter","onMouseLeave","id","theme","size","backgroundColor","onPress","webChecks","button","ctrlKey","onChange","onKeyDown","includes","key","preventDefault","onFocus","isAutomaticActivation","activationMode","onBlur","TabsContent","TabsContent2","forceMount","contentProps","show","hidden","tabIndex","TabsComponent","Tabs","valueProp","onValueChange","defaultValue","tabsProps","direction","setValue","prop","defaultProp","setTriggersCount","v","Provider","scope","useId","List","Trigger","Tab","Content"],"sources":["../../src/createTabs.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}