@hanzogui/web 7.3.0 → 7.3.2

package/dist/cjs/hooks/useMedia.cjs

@@ -199,7 +199,7 @@ function useMedia(componentContext, debug) {
     }
   });
 }
-const getServerSnapshot = () => initState;
+const getServerSnapshot = () => initState ?? getMedia();
 let disableMediaTouch = false;
 function _disableMediaTouch(val) {
   disableMediaTouch = val;

package/dist/esm/hooks/useMedia.mjs

@@ -160,7 +160,7 @@ function useMedia(componentContext, debug) {
     }
   });
 }
-const getServerSnapshot = () => initState;
+const getServerSnapshot = () => initState ?? getMedia();
 let disableMediaTouch = false;
 function _disableMediaTouch(val) {
   disableMediaTouch = val;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hanzogui/web",
-  "version": "7.3.0",
+  "version": "7.3.2",
   "license": "BSD-3-Clause",
   "author": "Hanzo AI <dev@hanzo.ai>",
   "repository": {
@@ -41,28 +41,21 @@
   "publishConfig": {
     "access": "public"
   },
-  "scripts": {
-    "build": "gui-build",
-    "watch": "gui-build --watch",
-    "clean": "gui-build clean",
-    "clean:build": "gui-build clean:build",
-    "test:web": "vitest --typecheck --run"
-  },
   "dependencies": {
-    "@hanzogui/compose-refs": "7.3.0",
-    "@hanzogui/constants": "7.3.0",
-    "@hanzogui/helpers": "7.3.0",
-    "@hanzogui/is-equal-shallow": "7.3.0",
-    "@hanzogui/native": "7.3.0",
-    "@hanzogui/normalize-css-color": "7.3.0",
-    "@hanzogui/timer": "7.3.0",
+    "@hanzogui/compose-refs": "7.3.1",
+    "@hanzogui/constants": "7.3.1",
+    "@hanzogui/helpers": "7.3.1",
+    "@hanzogui/is-equal-shallow": "7.3.1",
+    "@hanzogui/native": "7.3.1",
+    "@hanzogui/normalize-css-color": "7.3.1",
+    "@hanzogui/timer": "7.3.1",
     "@hanzogui/types": "7.3.0",
-    "@hanzogui/use-did-finish-ssr": "7.3.0",
-    "@hanzogui/use-event": "7.3.0",
-    "@hanzogui/use-force-update": "7.3.0"
+    "@hanzogui/use-did-finish-ssr": "7.3.1",
+    "@hanzogui/use-event": "7.3.1",
+    "@hanzogui/use-force-update": "7.3.1"
   },
   "devDependencies": {
-    "@hanzogui/build": "7.3.0",
+    "@hanzogui/build": "7.3.1",
     "@testing-library/react": "^16.1.0",
     "csstype": "^3.0.10",
     "react": ">=19",
@@ -84,5 +77,17 @@
     "*.mjs",
     "*.css",
     "README.md"
-  ]
-}
+  ],
+  "peerDependenciesMeta": {
+    "react-native": {
+      "optional": true
+    }
+  },
+  "scripts": {
+    "build": "gui-build",
+    "watch": "gui-build --watch",
+    "clean": "gui-build clean",
+    "clean:build": "gui-build clean:build",
+    "test:web": "vitest --typecheck --run"
+  }
+}

package/src/createComponent.tsx

@@ -56,6 +56,26 @@ import { Slot } from './views/Slot'
 import { getThemedChildren } from './views/Theme'
 import type { ViewProps } from './views/View'
 
+// data-slot: a neutral, standard structural annotation for zero-config analytics.
+// Mirrors shadcn's convention — the component's name, kebab-cased — so a tracker
+// like track.js's `annotate` can capture DOM structure with no per-app config.
+// Only named components carry one (base View/Text/Stack have no componentName),
+// matching shadcn's "named primitives only" rule.
+// Memoized: names come from the fixed set of styled() definitions, so each is
+// kebab-cased once — the render path is then an O(1) hit with no per-render regex.
+const dataSlotCache = new Map<string, string>()
+const dataSlotFor = (name: string): string => {
+  let slot = dataSlotCache.get(name)
+  if (slot === undefined) {
+    slot = name
+      .replace(/([A-Z]+)([A-Z][a-z])/g, '$1-$2')
+      .replace(/([a-z0-9])([A-Z])/g, '$1-$2')
+      .toLowerCase()
+    dataSlotCache.set(name, slot)
+  }
+  return slot
+}
+
 /**
  * All things that need one-time setup after createGui is called
  */
@@ -1471,6 +1491,15 @@ export function createComponent<
 
     if (process.env.NODE_ENV === 'development' && time) time`spaced-as-child`
 
+    // Stamp a neutral, standard structural annotation (data-slot) on the web host
+    // node so analytics can self-describe with zero app config. Named components
+    // only; overridable — passing your own `data-slot` (any value) opts out.
+    // No-op on native (isWeb compiles to false there). asChild flows via Slot,
+    // which merges viewProps onto the child host, so it is covered too.
+    if (isWeb && componentName && !('data-slot' in viewProps)) {
+      viewProps['data-slot'] = dataSlotFor(componentName)
+    }
+
     let content: ReactNode | undefined
 
     if (isPassthrough) {