@hanzo/ui 4.6.0 → 4.7.0

package/types/media-stack-def.ts

@@ -1,31 +0,0 @@
-import type AnimationDef from './animation-def'
-import type ImageDef from './image-def'
-import type VideoDef from './video-def'
-
-  /** 
-   * This will be implemented via css transforms, 
-   * so will be a subset of those capabilities.
-   * Individual transforms will be added as they 
-   * are needed.
-   */
-interface MediaTransform {
-    /** (X and Y) or [X, Y] */ 
-  scale?: number | number[]  
-}
-
-interface MediaStackDef {
-  img?: ImageDef
-  video?: VideoDef
-  animation?: AnimationDef
-  mediaTransform?: MediaTransform
-    /** prefered order of precedence.  
-     * If an type is missing, it will not be used.
-     * default (inMediaStack component): ['a', 'v', 'i']
-     * */ 
-  order?: ('a' | 'v' | 'i')[]  
-}
-
-export type { 
-  MediaStackDef,
-  MediaTransform  
-}

package/types/t-shirt-size.ts

@@ -1,5 +0,0 @@
-type TShirtSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl'
-
-export {
-  type TShirtSize as default
-}

package/types/tshirt-dimensions.ts

@@ -1,20 +0,0 @@
-type ConcreteDimensions = {
-  w: number
-  h: number
-}
-
-  // TODO: This is only used by VideoDef. 
-  // Is there a better way w @next/video?  
-type TShirtDimensions = { 
-  xs?: ConcreteDimensions            
-  sm?: ConcreteDimensions 
-  md:  ConcreteDimensions 
-  lg?: ConcreteDimensions 
-  xl?: ConcreteDimensions
-}
-
-export {
-  type TShirtDimensions as default
-}
-
-  

package/types/video-def.ts

@@ -1,25 +0,0 @@
-import type TShirtDimensions from './tshirt-dimensions'
-
-interface VideoDef {
-  videoProps?: any   // For example,
-    /* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-      videoProps: {
-        autoPlay: true, 
-        loop: true, 
-        muted: true, 
-        playsInline: true
-      }, 
-
-      Valueless props are boolean.  
-      NOTE: Must be camalCase as per React conventions! (playsinline => playsInline)
-    ~~~~~~~~~~~~~~~~~~~~~~~~ */
-  poster?: string      
-  sources?: string[]
-  dim: TShirtDimensions 
-    //  These are suppored so far: { vh: 60, mobile: {vw: 70} }
-  sizing?: any
-}
-
-export {
-  type VideoDef as default
-}

package/util/blob.ts

@@ -1,28 +0,0 @@
-import { Buffer } from 'buffer';
-
-export const blobToBase64 = (blob: Blob): Promise<string> => {
-  const reader = new FileReader();
-  reader.readAsDataURL(blob);
-  return new Promise((resolve) => {
-    reader.onloadend = () => {
-      resolve(reader.result as string);
-    };
-  });
-};
-
-export const dataUrlToFile = (
-  dataUrl: string,
-  filename: string,
-): File | undefined => {
-  const arr = dataUrl.split(',');
-  if (arr.length < 2) {
-    return undefined;
-  }
-  const mimeArr = arr[0].match(/:(.*?);/);
-  if (!mimeArr || mimeArr.length < 2) {
-    return undefined;
-  }
-  const mime = mimeArr[1];
-  const buff = Buffer.from(arr[1], 'base64');
-  return new File([buff], filename, { type: mime });
-};

package/util/copy-to-clipboard.ts

@@ -1,17 +0,0 @@
-export async function copyToClipboard(text: string) {
-  try {
-    await navigator.clipboard.writeText(text);
-  } catch {
-    // Fallback for browsers where the Clipboard API is not supported
-    const textarea = document.createElement('textarea');
-    textarea.style.position = 'fixed';
-    textarea.style.top = '-9999px';
-    textarea.style.left = '-9999px';
-    textarea.innerText = text;
-    document.body.appendChild(textarea);
-    textarea.focus();
-    textarea.select();
-    document.execCommand('copy');
-    textarea.remove();
-  }
-}

package/util/create-shadow-root.ts

@@ -1,22 +0,0 @@
-import { createRoot } from 'react-dom/client';
-
-/**
- * Creates a shadow root with the specified styles and returns a React root in it.
- * @param {string} tagName - Node name to be applied to the shadow root.
- * @param {string} styles - CSS styles to be applied to the shadow root.
- * @returns {ReactRoot} - React root rendered inside the shadow root.
- */
-
-export function createShadowRoot(tagName: string, styles: string) {
-  const container = document.createElement(tagName);
-  const shadow = container.attachShadow({ mode: 'open' });
-
-  // Create a new CSS style sheet and apply the specified styles and apply the style sheet to the shadow root
-  const globalStyleSheet = new CSSStyleSheet();
-  globalStyleSheet.replaceSync(styles);
-  shadow.adoptedStyleSheets = [globalStyleSheet];
-
-  const html = document.querySelector('html') as HTMLHtmlElement;
-  html.prepend(container);
-  return createRoot(shadow);
-}

package/util/date.ts

@@ -1,83 +0,0 @@
-import { FormattedMessage } from '@hanzo_network/hanzo-node-state/v2/queries/getChatConversation/types';
-
-export type ChatConversationMessage = {
-  hash: string;
-  parentHash: string;
-  inboxId: string;
-  scheduledTime: string | undefined;
-  content: string;
-  isLocal: boolean;
-  sender: {
-    avatar: string;
-  };
-  fileInbox?: {
-    id: string;
-    files: {
-      name: string;
-      preview?: string;
-    }[];
-  };
-};
-export type GetChatConversationOutput = ChatConversationMessage[];
-
-export const formatDateToUSLocaleString = (date: Date | undefined) => {
-  if (!date) return '-';
-  return new Date(date).toLocaleDateString('en-US', {
-    year: 'numeric',
-    month: 'numeric',
-    day: 'numeric',
-  });
-};
-export const formatDateToLocaleStringWithTime = (date: Date | undefined) => {
-  if (!date) return '-';
-  return new Date(date).toLocaleDateString('en-US', {
-    year: 'numeric',
-    month: 'numeric',
-    day: 'numeric',
-    hour: 'numeric',
-    minute: 'numeric',
-  });
-};
-
-export const getRelativeDateLabel = (date: Date): string => {
-  const today = new Date();
-  const yesterday = new Date();
-  yesterday.setDate(today.getDate() - 1);
-  if (date.toDateString() === today.toDateString()) {
-    return 'today';
-  } else if (date.toDateString() === yesterday.toDateString()) {
-    return 'yesterday';
-  } else {
-    return date.toDateString();
-  }
-};
-
-export const groupMessagesByDate = (messages: FormattedMessage[]) => {
-  const groupedMessages: Record<string, FormattedMessage[]> = {};
-  for (const message of messages) {
-    const date = new Date(message.createdAt ?? '').toDateString();
-    if (!groupedMessages[date]) {
-      groupedMessages[date] = [];
-    }
-    groupedMessages[date].push(message);
-  }
-  return groupedMessages;
-};
-
-export const formatDateToMonthAndDay = (date: Date): string => {
-  const today = new Date();
-  if (
-    date.getDate() === today.getDate() &&
-    date.getMonth() === today.getMonth() &&
-    date.getFullYear() === today.getFullYear()
-  ) {
-    return date.toLocaleTimeString('en-US', {
-      hour: 'numeric',
-      minute: 'numeric',
-      hour12: true,
-    });
-  }
-  const month = date.getMonth() + 1;
-  const day = date.getDate();
-  return `${month}/${day}`;
-};

package/util/debounce.ts

@@ -1,11 +0,0 @@
-export const debounce = (func: Function, delay: number) => {
-  let timeoutId: NodeJS.Timeout | null = null;
-  return (...args: any[]) => {
-    if (timeoutId) {
-      clearTimeout(timeoutId);
-    }
-    timeoutId = setTimeout(() => {
-      func(...args);
-    }, delay);
-  };
-};

package/util/file.ts

@@ -1,15 +0,0 @@
-export const getFileName = (fileName: string): string => {
-  const nameParts = fileName.split('.');
-  return nameParts.slice(0, -1).join('.');
-};
-export const getFileExt = (fileName: string): string => {
-  const nameParts = fileName.split('.');
-  return nameParts.pop() || '';
-};
-
-export const isFileTypeImageOrPdf = (file: File): boolean => {
-  if (!file) return false;
-  return (
-    file?.type.startsWith('image/') || file?.type.startsWith('application/pdf')
-  );
-};

package/util/format-and-abbreviate-as-currency.ts

@@ -1,125 +0,0 @@
-import Abbr, { QuantityAbbrSymbol, ABBR_SYMBOLS_ARRAY } from './number-abbreviate'
-
-interface FormatThreshold {
-  from: number
-  use: QuantityAbbrSymbol
-}
-
-const usdFormatter = Intl.NumberFormat('en-US', {
-  style: 'currency',
-  currency: 'USD',
-  minimumFractionDigits: 2,  
-})
-
-const formatAsUSCurrency = (n: number) => {
-  let result = usdFormatter.format(n)
-  return result.endsWith('.00') ? result.slice(0, -3) : result
-}
-
-const formatAndAbbreviateAsCurrency = (
-  n: number | null,
-  thresholds: FormatThreshold[] = [{
-    from: 1000000000,
-    use: 'M'
-  }],
-    /** 
-     * Chars that will be added by ui if the number is rounded.  
-     * For example, if the desired output for 10.15 is "~10.1", 
-     * the tilda counts as 1 char.  
-     */
-  roundingAdds: number = 1,
-  maxDecimal: number = 2 
-): {
-  full: string
-  result: string 
-  change: 'rounded' | 'none' | 'abbr' | 'empty' 
-} => {
-  if (n === null) {
-    return {
-      full: '',
-      result: '',
-      change: 'empty'
-    }
-  }
-
-  const formatted = formatAsUSCurrency(n)
-
-  if (n < thresholds[0].from) {
-    return {
-      full: formatted,
-      result: formatted,
-      change: 'none' 
-    }
-  }
-
-    // Get operative FormatThreshold pair...
-  let threshold: FormatThreshold 
-  for (
-    let i = 0; 
-    i < thresholds.length && n >= thresholds[i].from; 
-    threshold = thresholds[i], i++ 
-  ) {}
-
-    // Build up units array to all units
-    // up to threshold.use
-  const units: QuantityAbbrSymbol[] = []
-  for (let i = 0; i < ABBR_SYMBOLS_ARRAY.length; i++) {
-    const current = ABBR_SYMBOLS_ARRAY[i]
-    units.push(current)
-    if (current === threshold!.use) {
-      break
-    }
-  }
-
-  const abbreviator = new Abbr(units)
-
-    // Use threshold.from as a guide to how many chars are available:
-    // first digit + comma = 2
-    // Possible trailing cents: '.xx'.length = 3
-    // 3 - 2 = 1
-  const charsAvail = formatAsUSCurrency(threshold!.from).length + 1 
-  const abbr = abbreviator.abbreviate(n, charsAvail) // arbitrary, but good approx
-  const numStr = abbr.slice(0, -1)
-  const abbreviation = abbr.slice(-1)
-  const numerical = parseFloat(numStr)
-
-  const integral = Math.floor(numerical)
-  const integralString = formatAsUSCurrency(integral)
-  const commas = integralString.split(',').length - 1
-
-    // minus abbr, dec point, dollar sign, and roundingAdds / tilda,  
-    // (1 + 1 + 1 + roundingAdds)
-    // ("precision" does NOT include the decimal point itself, 
-    // so we have to explicitly factor it in.)
-  const roundedString = numerical.toPrecision(charsAvail - commas - (3 + roundingAdds)) 
-    // remove trailing zeros, if any
-  const roundedNumerical = parseFloat(roundedString)
-  const roundedIntegral = Math.trunc(roundedNumerical)
-  const roundedIntegralString = formatAsUSCurrency(roundedIntegral)
-
-  let decimalPortion = roundedNumerical - roundedIntegral
-  let result
-  if (decimalPortion !== 0) {
-      // remove trailing zeros if any
-    decimalPortion = parseFloat(decimalPortion.toFixed(maxDecimal)) 
-    const decimalPortionString = decimalPortion.toString()
-    const afterDecimalString = decimalPortionString.slice(decimalPortionString.indexOf('.') + 1)
-    result = roundedIntegralString + '.' + afterDecimalString + abbreviation
-  }
-  else {
-    result = roundedIntegralString  + abbreviation  
-  }
-    // Did we lose any precision? 
-  const rounded = (roundedIntegral + decimalPortion !== n)
-  return {
-    full: formatted,
-    result,
-    change: rounded ?  'rounded' : 'abbr'
-  }
-}
-
-export {
-  formatAndAbbreviateAsCurrency as default,
-  type FormatThreshold, 
-  type QuantityAbbrSymbol
-}

package/util/format-text.ts

@@ -1,33 +0,0 @@
-import { HanzoToolHeader } from '@hanzo_network/hanzo-message-ts/api/tools/types';
-
-export const formatText = (text: string) => {
-  const camelToSpaces = text.replace(/([a-z])([A-Z])/g, '$1 $2');
-  const snakeToSpaces = camelToSpaces.replace(/_/g, ' ');
-  return snakeToSpaces
-    .split(' ')
-    .map((word) => word.charAt(0).toUpperCase() + word.slice(1))
-    .join(' ');
-};
-
-export const formatCamelCaseText = (text: string) => {
-  const words = text.split(/(?=[A-Z])/);
-
-  const formattedWords = words.map((word) => {
-    return word.charAt(0).toUpperCase() + word.slice(1).toLowerCase();
-  });
-
-  const result = formattedWords.join(' ');
-
-  return result.charAt(0).toUpperCase() + result.slice(1);
-};
-
-export const getVersionFromTool = (toolRouterKey: HanzoToolHeader) => {
-  if (toolRouterKey.version) {
-    return toolRouterKey.version;
-  }
-  const parts = toolRouterKey.name.split(':::');
-  if (parts.length === 4) {
-    return parts[3];
-  }
-  return 'latest';
-};

package/util/format-to-max-char.ts

@@ -1,68 +0,0 @@
-import Abbr from './number-abbreviate'
-
-const abbr = new Abbr(['K', 'M', 'B', 'T'])
-
-const formatToMaxChar = (
-  n: number | null, 
-  maxChars: number, 
-    /** 
-     * Chars that will be added by ui if the number is rounded.  
-     * For example, if the desired output for 10.15 is "~10.1", 
-     * the tilda counts as 1 char.  
-     */
-  roundingAdds: number = 1 
-): {
-  result: string 
-  change: 'rounded' | 'none' | 'abbr' | 'empty' 
-} => {
-  if (n === null) {
-    return {
-      result: '',
-      change: 'empty'
-    }
-  }
-  const s = n.toString()
-  if (s.length > maxChars) {
-      // Highest number that can be rounded down to an 
-      // acceptable string.
-      // Decimal point, plus one decimal place = 2 chars
-    const cuttoff = Math.pow(10, maxChars - 2 - roundingAdds) - 0.05
-    if (n < cuttoff) {
-      const intPortion = Math.floor(n)
-      const len = intPortion.toString().length
-        // 1 is for dec point itself
-      const availDecimals = maxChars - len - 1 - roundingAdds 
-        // removes trailing zeros, if any
-      const roundedNumerical = parseFloat(n.toFixed(availDecimals))
-      return {
-        result: roundedNumerical.toString(),
-        change: 'rounded'
-      }
-    }
-    else {
-
-      const str = abbr.abbreviate(n, maxChars)
-      const numStr = str.slice(0, -1)
-      const abbreviation = str.slice(-1)
-      const numerical = parseFloat(numStr)
-
-        // minus abbr, dec point, and roundingAdds / tilda,  
-        // (1 + 1 + roundingAdds)
-        // ("precision" does NOT include the decimal point itself, 
-        // so we have to explicitly factor it in.)
-      const roundedString = numerical.toPrecision(maxChars - (2 + roundingAdds)) 
-        // remove trailing zeros, if any
-      const roundedNumerical = parseFloat(roundedString)
-      return {
-        result: roundedNumerical.toString() + abbreviation,
-        change: roundedNumerical === numerical ? 'abbr' : 'rounded'
-      }
-    }
-  }
-  return {
-    result: s,
-    change: 'none'
-  }
-}
-
-export default formatToMaxChar

package/util/index-client.ts

@@ -1,3 +0,0 @@
-export * from './index'
-// Must be imported from 'use client'
-export * from './step-animation'

package/util/index.ts

@@ -1,9 +0,0 @@
-export * from './date';
-export * from './file';
-export * from './create-shadow-root';
-export * from './timing';
-export * from './blob';
-export * from './copy-to-clipboard';
-export * from './format-text';
-export * from './toasts';
-export * from './debounce';

package/util/number-abbreviate.ts

@@ -1,49 +0,0 @@
-// cf: https://github.com/domharrington/js-number-abbreviate/blob/master/index.js
-
-type QuantityAbbrSymbol = 'K' | 'M' | 'B' | 'T'
-const ABBR_SYMBOLS_ARRAY = ['K', 'M', 'B', 'T'] satisfies QuantityAbbrSymbol[]
-
-class NumberAbbreviator {
-
-  private _units: QuantityAbbrSymbol[]
-
-  constructor(units?: QuantityAbbrSymbol[]) {
-    this._units = units ?? ABBR_SYMBOLS_ARRAY
-  }
-
-  private _abbreviate = (
-    n: number, 
-    decPlaces: number,
-    log: boolean = false
-  ): string  => {
-
-    const _decPlaces = Math.pow(10, decPlaces)
-    let _n = n
-
-    let _unit
-    for (let i = this._units.length - 1; i >= 0; i--) {
-      const size = Math.pow(10, (i + 1) * 3)
-      if (size <= _n) {
-        _n = Math.round(_n * _decPlaces / size) / _decPlaces
-        if ((_n === 1000) && (i < this._units.length - 1)) {
-          _n = 1
-          i++
-        }
-        _unit = this._units[i]
-        break
-      }
-    }
-    return _n.toString() + (_unit ?? '')
-  }
-
-  abbreviate = (n: number, decPlaces: number, log: boolean = false) => {
-    const abbreviatedNumber = this._abbreviate(Math.abs(n), decPlaces, log)
-    return n < 0 ? '-' + abbreviatedNumber : abbreviatedNumber
-  }  
-}
-
-export {
-  type QuantityAbbrSymbol,
-  ABBR_SYMBOLS_ARRAY, 
-  NumberAbbreviator as default 
-}

package/util/specifier.ts

@@ -1,43 +0,0 @@
-import type { Dimensions, TShirtSize }  from '../types'
-import type { TypographySize } from '../primitives/apply-typography'
-
-export const getPrimaryStartingWith = (s: string, toFind: string) => {
-  const tokenArray = s.split(' ')
-  return tokenArray.find((tok) => (tok.startsWith(`${toFind}-`)))
-}
-
-export const getTShirtSize = (s: string): TShirtSize | undefined => {
-  const subTokenArray = s.split('-')
-  return subTokenArray[subTokenArray.length - 1] as TShirtSize
-}
-
-export const getTypographySize = (s: string): TypographySize | undefined => {
-  const subTokenArray = s.split('-')
-  return subTokenArray[subTokenArray.length - 1] as TypographySize
-}
-
-export const getDim = (s: string): Dimensions | undefined  => {
-  const subTokenArray = s.split('-')
-  const dimStr = subTokenArray[subTokenArray.length - 1] 
-  if (dimStr) {
-    const dimTokenArray = s.split('x')
-    return dimTokenArray ? {
-      w: Number(dimTokenArray[0]),
-      h: Number(dimTokenArray[1])
-    } : undefined
-  }
-  return undefined
-}
-
-export function getSpecifierData<T>(
-  main: string,
-  getPrimary: (s: string) => string | undefined,
-  getData: (s: string) => T | undefined,
-  def?: T
-): T | undefined {
-  const primary = getPrimary(main)
-  if (primary) {
-    return getData(primary) ?? def
-  }
-  return def ?? undefined
-}

package/util/spread-to-transform.ts

@@ -1,24 +0,0 @@
-import type { MediaTransform } from '../types'
-
-export default (t: MediaTransform) => {
-
-  let transformStrings: string[] = [] 
-  const scaleVal = 'scale' in t ? t.scale : undefined
-  if (scaleVal) {
-    if (typeof scaleVal === 'number') {
-      transformStrings.push(`scale(${scaleVal})`)   
-    }
-    else if (
-      Array.isArray(scaleVal) && 
-      scaleVal.length == 2 && 
-      typeof scaleVal[0] === 'number'
-    ) {
-      transformStrings.push(`scale(${scaleVal[0]}, ${scaleVal[1]})`)   
-    }
-    else {
-      throw new Error("parsing MediaTransform: Unrecognized value for 'scale'!")
-    }
-  }
-
-  return transformStrings.length > 0 ? { transform: transformStrings.join(' ') } : {}
-}