@hanzo/ui 4.9.0 → 5.0.1

package/util/step-animation.ts

@@ -0,0 +1,90 @@
+import { useEffect, useRef } from 'react'
+import { makeObservable, reaction, computed, type IReactionDisposer, observable, action } from 'mobx'
+
+interface StepAnimation {
+  notPast(step: number): boolean
+}
+
+class MyStepAnimation implements StepAnimation {
+
+  _step: number = -1
+  _reactionDisposer: IReactionDisposer | undefined = undefined
+
+  _initialStep: () => boolean
+  _intervals: number[]
+
+    /**  initialStep: false -> true: step 0
+                      true -> false: step 1
+         after intervals[0] : step 2
+         after intervals[1] : step 3
+
+        initialStep must contain at least one mobx observable and return boolean 
+        see: https://mobx.js.org/reactions.html#reaction
+    */
+  constructor(initialStep: () => boolean, intervals: number[]) {
+
+    this._initialStep = initialStep
+    this._intervals = intervals
+
+    makeObservable(this, {
+      _step: observable,
+      _setStep: action
+    })
+  }
+
+    // This is separated out because reactions have to be created
+    // once we have a valid doc / window etc. (mobx internals)
+    // Can't just do it in constructor and assign to ref
+  initialize = () => {
+    
+    const fireNext = () => {
+      this._setStep(this._step + 1)
+      if (this._step <= this._intervals.length) {
+          // No need to call clearTimeout(): https://stackoverflow.com/a/7391588/11645689
+        setTimeout(() => { fireNext() }, this._intervals[this._step - 1]) 
+      }
+    }
+
+    this._reactionDisposer = reaction(
+      this._initialStep,
+      (triggered: boolean) => {
+        if (triggered && this._step === -1) { 
+          this._setStep(0)
+        }
+          // extra safe
+        else if (this._step === 0) { 
+          fireNext()  
+        }
+      }
+    )
+  }
+
+  _setStep = (v: number): void => {this._step = v}
+
+  dispose = () => {
+    if (this._reactionDisposer) {
+      this._reactionDisposer()
+    }
+  }
+
+    // https://mobx.js.org/computeds-with-args.html#2-close-over-the-arguments
+  notPast = (step: number): boolean => (
+    computed(() => (this._step > -1 && this._step <= step)).get()
+  )
+}
+
+const useStepAnimation = (initialStep: () => boolean, intervals: number[]): StepAnimation => {
+
+  const animRef = useRef<MyStepAnimation>(new MyStepAnimation(initialStep, intervals))
+  useEffect(() => {
+    animRef.current.initialize()
+    return animRef.current.dispose 
+  }, [])
+
+  return animRef.current
+}
+
+export {
+  type StepAnimation, 
+  useStepAnimation
+}

package/util/timing.ts

@@ -0,0 +1,3 @@
+export function delay(e = 1e3) {
+  return new Promise((t) => setTimeout(t, e));
+}

package/util/toasts.tsx

@@ -0,0 +1,17 @@
+import { toast } from 'sonner';
+
+export const submitRegistrationNoCodeNonPristineError = () => {
+  return toast.error(
+    <div>
+      Your Hanzo Node is currently locked by existing keys, please restore your
+      connection or reset your Hanzo Node Storage
+    </div>,
+    { position: 'bottom-center' },
+  );
+};
+
+export const submitRegistrationNoCodeError = () => {
+  return toast.error(<div>Error connecting to your Hanzo Node</div>, {
+    position: 'bottom-center',
+  });
+};

package/util/two-way-map.ts

@@ -0,0 +1,19 @@
+class TwoWayReadonlyMap<T, K> {
+  map: Map<T, K>;
+  reverseMap: Map<K, T>;
+  constructor(map: Map<T, K>) {
+    this.map = map;
+    this.reverseMap = new Map<K, T>();
+    map.forEach((value, key) => {
+      this.reverseMap.set(value, key);
+    });
+  }
+  get(key: T) {
+    return this.map.get(key);
+  }
+  revGet(key: K) {
+    return this.reverseMap.get(key);
+  }
+}
+
+export default TwoWayReadonlyMap

package/CHANGELOG.md

@@ -1,184 +0,0 @@
-# Changelog
-
-All notable changes to @hanzo/ui will be documented in this file.
-
-The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
-and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
-
-## [5.0.0] - 2025-09-20
-
-### 🎉 Major Release - shadcn/ui v4 Migration
-
-This major release migrates @hanzo/ui to the latest shadcn/ui v4 architecture with significant improvements in performance, accessibility, and developer experience.
-
-### ✨ New Features
-
-- **Registry-Based Architecture**: New component registry system for selective imports
-- **Multi-Brand Support**: Built-in theming for Hanzo, Lux, and Zoo brands
-- **50+ Components**: Complete component library with shadcn/ui v4 components
-- **35+ Custom Hooks**: Comprehensive collection of React hooks
-- **25+ Utilities**: Helper functions for common tasks
-- **AI Integration**: Model Context Protocol (MCP) support for AI-powered development
-- **Dark Mode**: Native dark mode support with theme persistence
-- **OKLCH Colors**: Modern color system with OKLCH color space
-- **TypeScript First**: Full TypeScript support with strict typing
-- **Tree Shaking**: Optimized bundle sizes with proper tree shaking
-- **Accessibility**: WCAG 2.1 AA compliant components
-
-### 🔧 Component Updates
-
-#### New Components
-- Alert
-- Alert Dialog
-- Accordion
-- Avatar
-- Badge
-- Breadcrumb
-- Button (enhanced with variants)
-- Calendar
-- Card
-- Carousel
-- Chart
-- Checkbox
-- Collapsible
-- Command
-- Context Menu
-- Data Table
-- Date Picker
-- Dialog
-- Drawer
-- Dropdown Menu
-- Form
-- Hover Card
-- Input
-- Input OTP
-- Label
-- Menubar
-- Navigation Menu
-- Pagination
-- Popover
-- Progress
-- Radio Group
-- Resizable
-- Scroll Area
-- Select
-- Separator
-- Sheet
-- Skeleton
-- Slider
-- Sonner (Toast)
-- Switch
-- Table
-- Tabs
-- Textarea
-- Toast
-- Toggle
-- Toggle Group
-- Tooltip
-
-#### AI Components
-- Chat Interface
-- Code Block with syntax highlighting
-- Message components
-- Streaming support
-
-#### Block Components
-- Authentication forms
-- Dashboard layouts
-- Marketing sections
-- E-commerce patterns
-
-### 💥 Breaking Changes
-
-#### Package Structure
-- Changed from single export to multiple export paths:
-  - `@hanzo/ui` - Core exports with cn utility
-  - `@hanzo/ui/components` - Component exports
-  - `@hanzo/ui/blocks` - Block patterns
-  - `@hanzo/ui/ai` - AI components
-  - `@hanzo/ui/lib/utils` - Utilities
-
-#### Import Changes
-```typescript
-// Before (v4.x)
-import { Button, Card, cn } from '@hanzo/ui'
-
-// After (v5.0)
-import { cn } from '@hanzo/ui'
-import { Button, Card } from '@hanzo/ui/components'
-// Or selective imports
-import { Button } from '@hanzo/ui/components/button'
-```
-
-#### CSS Variables
-- Migrated from HSL to OKLCH color space
-- New CSS variable naming convention
-- Theme variables now use `--hanzo-` prefix
-
-#### Component API Changes
-- Button: `variant` prop values changed
-- Dialog: Now uses Radix UI Dialog v1.0
-- Toast: Replaced with Sonner for better performance
-- DataTable: New API with tanstack/react-table v8
-
-#### Dependency Updates
-- Requires React 18+
-- Requires Tailwind CSS 3.4+
-- All Radix UI primitives updated to v1.0+
-
-### 🐛 Bug Fixes
-
-- Fixed hydration issues with dark mode
-- Resolved tree-shaking problems in production builds
-- Fixed TypeScript type exports
-- Corrected accessibility issues in form components
-- Fixed z-index stacking context issues
-
-### 📦 Dependencies
-
-#### Updated
-- All @radix-ui/* packages to latest v1.0+
-- class-variance-authority to v0.7.0
-- cmdk to v1.0.3
-- lucide-react to v0.525.0
-- recharts to v2.12.7
-- tailwind-merge to v2.0.0
-
-### 🚀 Performance Improvements
-
-- 40% reduction in bundle size through better tree-shaking
-- Lazy loading for heavy components (Charts, Calendar)
-- Optimized re-renders with proper memo usage
-- CSS-in-JS removed in favor of Tailwind CSS
-
-### 📝 Documentation
-
-- Complete API documentation for all components
-- Interactive Storybook with all components
-- Migration guide from v4 to v5
-- Accessibility documentation
-- Theming and customization guides
-
-### 🔄 Migration Guide
-
-See [MIGRATION.md](./MIGRATION.md) for detailed migration instructions from v4.x to v5.0.
-
-### 🙏 Contributors
-
-Thanks to all contributors who made this release possible!
-
----
-
-## [4.5.6] - 2024-09-01
-
-### Changed
-- Last version before major v5 rewrite
-
----
-
-## Previous Versions
-
-For changelog of versions prior to v4.5.6, please refer to the git history.
-
-[5.0.0]: https://github.com/hanzoai/ui/compare/v4.5.6...v5.0.0
-[4.5.6]: https://github.com/hanzoai/ui/releases/tag/v4.5.6

package/LICENSE

@@ -1,21 +0,0 @@
-MIT License
-
-Copyright (c) 2025 Hanzo AI
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.

package/dist/ai/index.js

@@ -1,53 +0,0 @@
-'use strict';
-
-var chunkBDZQJ6GK_js = require('../chunk-BDZQJ6GK.js');
-require('../chunk-DN2AEEA2.js');
-
-
-
-Object.defineProperty(exports, "AIActions", {
-  enumerable: true,
-  get: function () { return chunkBDZQJ6GK_js.AIActions; }
-});
-Object.defineProperty(exports, "AIAgents", {
-  enumerable: true,
-  get: function () { return chunkBDZQJ6GK_js.AIAgents; }
-});
-Object.defineProperty(exports, "AIAssistant", {
-  enumerable: true,
-  get: function () { return chunkBDZQJ6GK_js.AIAssistant; }
-});
-Object.defineProperty(exports, "AIChat", {
-  enumerable: true,
-  get: function () { return chunkBDZQJ6GK_js.AIChat; }
-});
-Object.defineProperty(exports, "AIModels", {
-  enumerable: true,
-  get: function () { return chunkBDZQJ6GK_js.AIModels; }
-});
-Object.defineProperty(exports, "AIPlayground", {
-  enumerable: true,
-  get: function () { return chunkBDZQJ6GK_js.AIPlayground; }
-});
-Object.defineProperty(exports, "AITools", {
-  enumerable: true,
-  get: function () { return chunkBDZQJ6GK_js.AITools; }
-});
-Object.defineProperty(exports, "AIVision", {
-  enumerable: true,
-  get: function () { return chunkBDZQJ6GK_js.AIVision; }
-});
-Object.defineProperty(exports, "AnthropicProvider", {
-  enumerable: true,
-  get: function () { return chunkBDZQJ6GK_js.AnthropicProvider; }
-});
-Object.defineProperty(exports, "OpenAIProvider", {
-  enumerable: true,
-  get: function () { return chunkBDZQJ6GK_js.OpenAIProvider; }
-});
-Object.defineProperty(exports, "configureAI", {
-  enumerable: true,
-  get: function () { return chunkBDZQJ6GK_js.configureAI; }
-});
-//# sourceMappingURL=index.js.map
-//# sourceMappingURL=index.js.map

package/dist/ai/index.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}

package/dist/ai/index.mjs

@@ -1,4 +0,0 @@
-export { AIActions, AIAgents, AIAssistant, AIChat, AIModels, AIPlayground, AITools, AIVision, AnthropicProvider, OpenAIProvider, configureAI } from '../chunk-UNUTTHCH.mjs';
-import '../chunk-TH2UKMCO.mjs';
-//# sourceMappingURL=index.mjs.map
-//# sourceMappingURL=index.mjs.map

package/dist/ai/index.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"index.mjs"}