@hanzo/ui 4.7.0 → 4.8.3

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/dist/index.d.mts

@@ -1,16 +0,0 @@
-export * from './primitives/index-common.ts';
-export * from './primitives/next/index.ts';
-import './types/animation-def.ts';
-import './types/breakpoints.ts';
-import './types/bullet-item.ts';
-import './types/button-def.ts';
-import './types/dimensions.ts';
-import './types/grid-def.ts';
-import './types/image-def.ts';
-import './types/link-def.ts';
-import './types/tshirt-dimensions.ts';
-import './types/t-shirt-size.ts';
-import './types/video-def.ts';
-import './types/media-stack-def.ts';
-import './tailwind/tailwind.config.hanzo-preset.js';
-import './tailwind/tw-font-desc.ts';

package/dist/index.d.ts

@@ -1,16 +0,0 @@
-export * from './primitives/index-common.ts';
-export * from './primitives/next/index.ts';
-import './types/animation-def.ts';
-import './types/breakpoints.ts';
-import './types/bullet-item.ts';
-import './types/button-def.ts';
-import './types/dimensions.ts';
-import './types/grid-def.ts';
-import './types/image-def.ts';
-import './types/link-def.ts';
-import './types/tshirt-dimensions.ts';
-import './types/t-shirt-size.ts';
-import './types/video-def.ts';
-import './types/media-stack-def.ts';
-import './tailwind/tailwind.config.hanzo-preset.js';
-import './tailwind/tw-font-desc.ts';

package/dist/lib/utils.d.mts

@@ -1,2 +0,0 @@
-import 'clsx';
-export { absoluteUrl, cn, formatDate } from '../src/utils.mjs';

package/dist/lib/utils.d.ts

@@ -1,2 +0,0 @@
-import 'clsx';
-export { absoluteUrl, cn, formatDate } from '../src/utils.js';

package/dist/src/utils.d.mts

@@ -1,7 +0,0 @@
-import { ClassValue } from 'clsx';
-
-declare function cn(...inputs: ClassValue[]): string;
-declare function formatDate(input: string | number): string;
-declare function absoluteUrl(path: string): string;
-
-export { absoluteUrl, cn, formatDate };

package/dist/src/utils.d.ts

@@ -1,7 +0,0 @@
-import { ClassValue } from 'clsx';
-
-declare function cn(...inputs: ClassValue[]): string;
-declare function formatDate(input: string | number): string;
-declare function absoluteUrl(path: string): string;
-
-export { absoluteUrl, cn, formatDate };

package/dist/tailwind/index.d.mts

@@ -1,2 +0,0 @@
-export { default as preset } from './tailwind.config.hanzo-preset.js';
-export { default as TwFontDesc } from './tw-font-desc.ts';

package/dist/tailwind/index.d.ts

@@ -1,2 +0,0 @@
-export { default as preset } from './tailwind.config.hanzo-preset.js';
-export { default as TwFontDesc } from './tw-font-desc.ts';

package/dist/types/index.d.mts

@@ -1,12 +0,0 @@
-export { default as AnimationDef } from './animation-def.ts';
-export { Breakpoint, Breakpoints } from './breakpoints.ts';
-export { default as BulletItem } from './bullet-item.ts';
-export { ButtonDef, ButtonModalDef, ButtonModalProps, SubmitServerAction } from './button-def.ts';
-export { default as Dimensions } from './dimensions.ts';
-export { COMMON_GRID_1_COL, COMMON_GRID_2_COL, COMMON_GRID_3_COL, COMMON_GRID_4_COL, GridColumnSpec, default as GridDef } from './grid-def.ts';
-export { default as ImageDef } from './image-def.ts';
-export { default as LinkDef } from './link-def.ts';
-export { default as TShirtDimensions } from './tshirt-dimensions.ts';
-export { default as TShirtSize } from './t-shirt-size.ts';
-export { default as VideoDef } from './video-def.ts';
-export { MediaStackDef, MediaTransform } from './media-stack-def.ts';

package/dist/types/index.d.ts

@@ -1,12 +0,0 @@
-export { default as AnimationDef } from './animation-def.ts';
-export { Breakpoint, Breakpoints } from './breakpoints.ts';
-export { default as BulletItem } from './bullet-item.ts';
-export { ButtonDef, ButtonModalDef, ButtonModalProps, SubmitServerAction } from './button-def.ts';
-export { default as Dimensions } from './dimensions.ts';
-export { COMMON_GRID_1_COL, COMMON_GRID_2_COL, COMMON_GRID_3_COL, COMMON_GRID_4_COL, GridColumnSpec, default as GridDef } from './grid-def.ts';
-export { default as ImageDef } from './image-def.ts';
-export { default as LinkDef } from './link-def.ts';
-export { default as TShirtDimensions } from './tshirt-dimensions.ts';
-export { default as TShirtSize } from './t-shirt-size.ts';
-export { default as VideoDef } from './video-def.ts';
-export { MediaStackDef, MediaTransform } from './media-stack-def.ts';