@hanzogui/tabs 3.0.1 → 7.0.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hanzogui/tabs",
-  "version": "3.0.1",
+  "version": "7.0.0",
   "gitHead": "a49cc7ea6b93ba384e77a4880ae48ac4a5635c14",
   "source": "src/index.ts",
   "files": [
@@ -31,29 +31,29 @@
     "access": "public"
   },
   "scripts": {
-    "build": "hanzo-gui-build",
-    "watch": "hanzo-gui-build --watch",
-    "clean": "hanzo-gui-build clean",
-    "clean:build": "hanzo-gui-build clean:build"
+    "build": "hanzogui-build",
+    "watch": "hanzogui-build --watch",
+    "clean": "hanzogui-build clean",
+    "clean:build": "hanzogui-build clean:build"
   },
   "dependencies": {
-    "@hanzogui/compose-refs": "3.0.0",
-    "@hanzogui/constants": "3.0.0",
-    "@hanzogui/core": "3.0.0",
-    "@hanzogui/create-context": "3.0.0",
-    "@hanzogui/element": "3.0.0",
-    "@hanzogui/get-button-sized": "3.0.0",
-    "@hanzogui/group": "3.0.0",
-    "@hanzogui/helpers": "3.0.0",
-    "@hanzogui/roving-focus": "3.0.0",
-    "@hanzogui/sizable-context": "3.0.0",
-    "@hanzogui/stacks": "3.0.0",
-    "@hanzogui/use-controllable-state": "3.0.0",
-    "@hanzogui/use-direction": "3.0.0",
-    "@hanzogui/web": "3.0.0"
+    "@hanzogui/compose-refs": "^7.0.0",
+    "@hanzogui/constants": "^7.0.0",
+    "@hanzogui/core": "^7.0.0",
+    "@hanzogui/create-context": "^7.0.0",
+    "@hanzogui/element": "^7.0.0",
+    "@hanzogui/get-button-sized": "^7.0.0",
+    "@hanzogui/group": "^7.0.0",
+    "@hanzogui/helpers": "^7.0.0",
+    "@hanzogui/roving-focus": "^7.0.0",
+    "@hanzogui/sizable-context": "^7.0.0",
+    "@hanzogui/stacks": "^7.0.0",
+    "@hanzogui/use-controllable-state": "^7.0.0",
+    "@hanzogui/use-direction": "^7.0.0",
+    "@hanzogui/web": "^7.0.0"
   },
   "devDependencies": {
-    "@hanzogui/build": "3.0.0",
+    "@hanzogui/build": "^7.0.0",
     "react": ">=19",
     "react-native": "0.83.2"
   },
@@ -62,4 +62,4 @@
     "react-native": "*"
   },
   "module:jsx": "dist/jsx"
-}
+}

package/src/Tabs.tsx

@@ -52,7 +52,7 @@ export const DefaultTabsTabFrame = styled(
     } as const,
 
     defaultVariants: {
-      unstyled: process.env.HANZO_GUI_HEADLESS === '1',
+      unstyled: process.env.HANZOGUI_HEADLESS === '1',
     },
   },
   {

package/src/createTabs.tsx

@@ -7,7 +7,7 @@ import { RovingFocusGroup, type RovingFocusGroupProps } from '@hanzogui/roving-f
 import { SizableContext } from '@hanzogui/sizable-context'
 import { useControllableState } from '@hanzogui/use-controllable-state'
 import { useDirection } from '@hanzogui/use-direction'
-import type { GetProps, GuiElement, ViewProps } from '@hanzogui/web'
+import type { GetProps, HanzoguiElement, ViewProps } from '@hanzogui/web'
 import { useEvent } from '@hanzogui/web'
 import * as React from 'react'
 import type { LayoutRectangle } from 'react-native'
@@ -37,7 +37,7 @@ export function createTabs<
 
   const TAB_LIST_NAME = 'TabsList'
 
-  const TabsList = React.forwardRef<GuiElement, TabsListProps>(
+  const TabsList = React.forwardRef<HanzoguiElement, TabsListProps>(
     (props: ScopedProps<TabsListProps>, forwardedRef) => {
       const { __scopeTabs, loop = true, children, ...listProps } = props
       const context = useTabsContext(__scopeTabs)
@@ -94,7 +94,7 @@ export function createTabs<
       const contentId = makeContentId(context.baseId, value)
       const isSelected = value === context.value
       const [layout, setLayout] = React.useState<TabLayout | null>(null)
-      const triggerRef = React.useRef<GuiElement>(null)
+      const triggerRef = React.useRef<HanzoguiElement>(null)
       const groupItemProps = useGroupItem({ disabled: !!disabled })
 
       React.useEffect(() => {
@@ -122,7 +122,7 @@ export function createTabs<
         observer.observe(el)
 
         return () => {
-          observer.unobserve(el)
+          observer.disconnect()
         }
       }, [context.triggersCount])
 
@@ -140,6 +140,11 @@ export function createTabs<
           active={isSelected}
         >
           <TabFrame
+            {...(!isWeb && {
+              onLayout: (event) => {
+                setLayout(event.nativeEvent.layout)
+              },
+            })}
             onMouseEnter={composeEventHandlers(props.onMouseEnter, () => {
               if (layout) {
                 onInteraction?.('hover', layout)
@@ -318,7 +323,7 @@ export function createTabs<
   // this broke things outside our repo, but not sure why, all non style props were missing
   // like onPress etc
   // as <Tab = string>(
-  //   props: TabsProps<Tab> & { ref?: React.Ref<GuiElement> }
+  //   props: TabsProps<Tab> & { ref?: React.Ref<HanzoguiElement> }
   // ) => React.JSX.Element
 
   return withStaticProperties(TabsComponent, {
@@ -415,7 +420,7 @@ type TabsContentExtraProps = {
 
   /**
    * Used to force mounting when more control is needed. Useful when
-   * controlling animation with Gui animations.
+   * controlling animation with Hanzogui animations.
    */
   forceMount?: boolean
 }

package/types/StyledContext.d.ts

@@ -1,4 +1,4 @@
-import type { SizeTokens } from '@gui/core';
+import type { SizeTokens } from '@hanzogui/core';
 import type { TabsProps } from './createTabs';
 export type TabsContextValue = {
     baseId: string;

package/types/Tabs.d.ts

@@ -1,17 +1,17 @@
-export declare const DefaultTabsFrame: import("@gui/core").GuiComponent<import("@gui/core").TamaDefer, import("@gui/core").GuiElement, import("@gui/core").RNGuiViewNonStyleProps, import("@gui/core").StackStyleBase, {
-    size?: import("@gui/core").SizeTokens | undefined;
+export declare const DefaultTabsFrame: import("@hanzogui/core").HanzoguiComponent<import("@hanzogui/core").TamaDefer, import("@hanzogui/core").HanzoguiElement, import("@hanzogui/core").RNHanzoguiViewNonStyleProps, import("@hanzogui/core").StackStyleBase, {
+    size?: import("@hanzogui/core").SizeTokens | undefined;
     unstyled?: boolean | undefined;
-    elevation?: number | import("@gui/core").SizeTokens | undefined;
+    elevation?: number | import("@hanzogui/core").SizeTokens | undefined;
     transparent?: boolean | undefined;
     fullscreen?: boolean | undefined;
     circular?: boolean | undefined;
     elevate?: boolean | undefined;
     bordered?: boolean | undefined;
     chromeless?: boolean | "all" | undefined;
-}, import("@gui/core").StaticConfigPublic>;
-export declare const DefaultTabsTabFrame: import("@gui/core").GuiComponent<import("@gui/core").TamaDefer, import("@gui/core").GuiElement, import("@gui/core").RNGuiViewNonStyleProps, import("@gui/core").StackStyleBase & {
-    readonly activeStyle?: Partial<import("@gui/core").InferStyleProps<import("react").ForwardRefExoticComponent<Omit<import("@gui/core").RNGuiViewNonStyleProps, keyof import("@gui/core").StackStyleBase> & import("@gui/core").WithThemeValues<import("@gui/core").StackStyleBase> & import("@gui/core").WithShorthands<import("@gui/core").WithThemeValues<import("@gui/core").StackStyleBase>> & import("@gui/core").WithPseudoProps<import("@gui/core").WithThemeValues<import("@gui/core").StackStyleBase> & import("@gui/core").WithShorthands<import("@gui/core").WithThemeValues<import("@gui/core").StackStyleBase>>> & import("@gui/core").WithMediaProps<import("@gui/core").WithThemeShorthandsAndPseudos<import("@gui/core").StackStyleBase, {}>> & import("react").RefAttributes<import("@gui/core").GuiElement>> & import("@gui/core").StaticComponentObject<import("@gui/core").TamaDefer, import("@gui/core").GuiElement, import("@gui/core").RNGuiViewNonStyleProps, import("@gui/core").StackStyleBase, {}, {}> & Omit<{}, "staticConfig" | "styleable"> & {
-        __tama: [import("@gui/core").TamaDefer, import("@gui/core").GuiElement, import("@gui/core").RNGuiViewNonStyleProps, import("@gui/core").StackStyleBase, {}, {}];
+}, import("@hanzogui/core").StaticConfigPublic>;
+export declare const DefaultTabsTabFrame: import("@hanzogui/core").HanzoguiComponent<import("@hanzogui/core").TamaDefer, import("@hanzogui/core").HanzoguiElement, import("@hanzogui/core").RNHanzoguiViewNonStyleProps, import("@hanzogui/core").StackStyleBase & {
+    readonly activeStyle?: Partial<import("@hanzogui/core").InferStyleProps<import("react").ForwardRefExoticComponent<Omit<import("@hanzogui/core").RNHanzoguiViewNonStyleProps, keyof import("@hanzogui/core").StackStyleBase> & import("@hanzogui/core").WithThemeValues<import("@hanzogui/core").StackStyleBase> & import("@hanzogui/core").WithShorthands<import("@hanzogui/core").WithThemeValues<import("@hanzogui/core").StackStyleBase>> & import("@hanzogui/core").WithPseudoProps<import("@hanzogui/core").WithThemeValues<import("@hanzogui/core").StackStyleBase> & import("@hanzogui/core").WithShorthands<import("@hanzogui/core").WithThemeValues<import("@hanzogui/core").StackStyleBase>>> & import("@hanzogui/core").WithMediaProps<import("@hanzogui/core").WithThemeShorthandsAndPseudos<import("@hanzogui/core").StackStyleBase, {}>> & import("react").RefAttributes<import("@hanzogui/core").HanzoguiElement>> & import("@hanzogui/core").StaticComponentObject<import("@hanzogui/core").TamaDefer, import("@hanzogui/core").HanzoguiElement, import("@hanzogui/core").RNHanzoguiViewNonStyleProps, import("@hanzogui/core").StackStyleBase, {}, {}> & Omit<{}, "staticConfig" | "styleable"> & {
+        __tama: [import("@hanzogui/core").TamaDefer, import("@hanzogui/core").HanzoguiElement, import("@hanzogui/core").RNHanzoguiViewNonStyleProps, import("@hanzogui/core").StackStyleBase, {}, {}];
     }, {
         accept: {
             readonly activeStyle: "style";
@@ -20,19 +20,19 @@ export declare const DefaultTabsTabFrame: import("@gui/core").GuiComponent<impor
 }, {
     disabled?: boolean | undefined;
     unstyled?: boolean | undefined;
-    size?: import("@gui/core").SizeTokens | undefined;
+    size?: import("@hanzogui/core").SizeTokens | undefined;
 }, {
     accept: {
         readonly activeStyle: "style";
     };
 }>;
-export declare const DefaultTabsContentFrame: import("@gui/core").GuiComponent<import("@gui/core").TamaDefer, import("@gui/core").GuiElement, import("@gui/core").RNGuiViewNonStyleProps, import("@gui/core").StackStyleBase, {
-    elevation?: number | import("@gui/core").SizeTokens | undefined;
+export declare const DefaultTabsContentFrame: import("@hanzogui/core").HanzoguiComponent<import("@hanzogui/core").TamaDefer, import("@hanzogui/core").HanzoguiElement, import("@hanzogui/core").RNHanzoguiViewNonStyleProps, import("@hanzogui/core").StackStyleBase, {
+    elevation?: number | import("@hanzogui/core").SizeTokens | undefined;
     transparent?: boolean | undefined;
     fullscreen?: boolean | undefined;
     circular?: boolean | undefined;
     elevate?: boolean | undefined;
     bordered?: boolean | undefined;
     chromeless?: boolean | "all" | undefined;
-}, import("@gui/core").StaticConfigPublic>;
+}, import("@hanzogui/core").StaticConfigPublic>;
 //# sourceMappingURL=Tabs.d.ts.map