@hanzo/ui 4.5.0 → 4.5.2

package/dist/registry/index.js

@@ -0,0 +1,45 @@
+import { z } from "zod";
+// Define the file schema to match shadcn/ui's format
+export const fileSchema = z.object({
+    path: z.string(),
+    content: z.string().optional(),
+    type: z.string(),
+    target: z.string().optional(),
+});
+// Registry item schema aligned with shadcn/ui format
+export const registryItemSchema = z.object({
+    name: z.string(),
+    type: z.string(),
+    description: z.string().optional(),
+    author: z.string().optional(),
+    dependencies: z.array(z.string()).optional(),
+    devDependencies: z.array(z.string()).optional(),
+    registryDependencies: z.array(z.string()).optional(),
+    files: z.array(fileSchema).optional(),
+    meta: z.record(z.any()).optional(),
+    title: z.string().optional(),
+    cssVars: z.record(z.any()).optional(),
+    tailwind: z.record(z.any()).optional(),
+    category: z.string().optional(),
+    subcategory: z.string().optional(),
+});
+// Registry schema aligned with shadcn/ui format
+export const registrySchema = z.object({
+    $schema: z.string().optional(),
+    name: z.string(),
+    homepage: z.string().optional(),
+    style: z.string().optional(),
+    items: z.array(registryItemSchema),
+});
+// Schema for a registry with full content
+export const registryWithContentSchema = registrySchema.extend({
+    items: z.array(registryItemSchema.extend({
+        files: z.array(fileSchema.extend({
+            content: z.string(),
+        })),
+    })),
+});
+// Support CommonJS
+if (typeof module !== 'undefined') {
+    module.exports = { fileSchema, registryItemSchema, registrySchema, registryWithContentSchema };
+}

package/dist/style/theme-provider.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import { type ThemeProviderProps } from "next-themes/dist/types";
+declare const ThemeProvider: React.FC<ThemeProviderProps>;
+export default ThemeProvider;

package/dist/style/theme-provider.jsx

@@ -0,0 +1,11 @@
+"use client";
+import React from "react";
+import { ThemeProvider as NextThemesProvider } from "next-themes";
+import {} from "next-themes/dist/types";
+const ThemeProvider = ({ children, ...props }) => (<NextThemesProvider attribute="class" {...props} value={{
+        light: 'hanzo-ui-light-theme',
+        dark: 'hanzo-ui-dark-theme'
+    }}>
+    {children}
+  </NextThemesProvider>);
+export default ThemeProvider;

package/dist/tailwind/fontFamily.tailwind.d.ts

@@ -0,0 +1,8 @@
+declare const _default: {
+    sans: string[];
+    heading: string[];
+    nav: string[];
+    serif: string[];
+    mono: string[];
+};
+export default _default;

package/dist/tailwind/fontFamily.tailwind.js

@@ -0,0 +1,7 @@
+export default {
+    sans: ['sans-serif'],
+    heading: ['serif'],
+    nav: ['serif'],
+    serif: ['serif'],
+    mono: ['monospace']
+};

package/dist/tailwind/fontSize.tailwind.d.ts

@@ -0,0 +1,36 @@
+declare const _default: {
+    xxs: (string | {
+        lineHeight: string;
+    })[];
+    xs: (string | {
+        lineHeight: string;
+    })[];
+    sm: (string | {
+        lineHeight: string;
+    })[];
+    base: (string | {
+        lineHeight: number;
+    })[];
+    lg: (string | {
+        lineHeight: string;
+    })[];
+    xl: (string | {
+        lineHeight: string;
+    })[];
+    '2xl': (string | {
+        lineHeight: string;
+    })[];
+    '3xl': (string | {
+        lineHeight: string;
+    })[];
+    '4xl': (string | {
+        lineHeight: string;
+    })[];
+    '5xl': (string | {
+        lineHeight: string;
+    })[];
+    '6xl': (string | {
+        lineHeight: string;
+    })[];
+};
+export default _default;

package/dist/tailwind/fontSize.tailwind.js

@@ -0,0 +1,13 @@
+export default {
+    xxs: ['0.65rem', { lineHeight: '0.8rem' }], // very fine print               
+    xs: ['0.8rem', { lineHeight: '1rem' }], // fine print               
+    sm: ['0.9rem', { lineHeight: '1.2rem' }], // 'standard' some news article cards  (set manually when using typography-sm)
+    base: ['1rem', { lineHeight: 1.4 }],
+    lg: ['1.125rem', { lineHeight: '1.75rem' }],
+    xl: ['1.25rem', { lineHeight: '1.75rem' }],
+    '2xl': ['1.5rem', { lineHeight: '2rem' }],
+    '3xl': ['1.875rem', { lineHeight: '2.25rem' }],
+    '4xl': ['2.25rem', { lineHeight: '2.5rem' }],
+    '5xl': ['3rem', { lineHeight: '1' }],
+    '6xl': ['3.75rem', { lineHeight: '1' }],
+};

package/dist/tailwind/index.d.ts

@@ -0,0 +1,3 @@
+import preset from './tailwind.config.hanzo-preset';
+import type TwFontDesc from './tw-font-desc';
+export { preset, type TwFontDesc };

package/dist/tailwind/index.js

@@ -0,0 +1,2 @@
+import preset from './tailwind.config.hanzo-preset';
+export { preset };

package/dist/tailwind/screens.tailwind.d.ts

@@ -0,0 +1,9 @@
+declare const _default: {
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+    '2xl': string;
+};
+export default _default;

package/dist/tailwind/screens.tailwind.js

@@ -0,0 +1,8 @@
+export default {
+    xs: '0px', // <-- phone
+    sm: '480px', // phone --><-- sm tablets / narrow
+    md: '768px', // sm tablets / narrow -->
+    lg: '1024px',
+    xl: '1280px',
+    '2xl': '1500px',
+};

package/dist/tailwind/tw-font-desc.d.ts

@@ -0,0 +1,6 @@
+interface TwFontDesc {
+    twName: string;
+    cssVar?: string;
+    fontFamily: string[];
+}
+export { type TwFontDesc as default };

package/dist/tailwind/tw-font-desc.js

@@ -0,0 +1,6 @@
+/*
+  NextFontDesc and TwFontDesc have to be seperate because they are needed
+  at different times during the next compile / build.  Otherwise a nasty
+  race condition happens! That's why they are in different files.
+*/
+export {};

package/dist/types/animation-def.d.ts

@@ -0,0 +1,2 @@
+type AnimationDef = string;
+export { type AnimationDef as default };

package/dist/types/animation-def.js

@@ -0,0 +1 @@
+export {};

package/dist/types/breakpoints.d.ts

@@ -0,0 +1,4 @@
+import bps from '../tailwind/screens.tailwind';
+type Breakpoint = keyof typeof bps;
+declare const Breakpoints: string[];
+export { Breakpoints, type Breakpoint };

package/dist/types/breakpoints.js

@@ -0,0 +1,4 @@
+// @ts-nocheck
+import bps from '../tailwind/screens.tailwind';
+const Breakpoints = Object.keys(bps);
+export { Breakpoints };

package/dist/types/bullet-item.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+interface BulletItem {
+    text: string;
+    icon?: React.ReactNode;
+}
+export { type BulletItem as default };

package/dist/types/bullet-item.js

@@ -0,0 +1,2 @@
+import React from 'react';
+export {};

package/dist/types/button-def.d.ts

@@ -0,0 +1,29 @@
+import { type ButtonProps } from '../primitives/button';
+type SubmitServerAction = (data: any, enclosure?: any) => Promise<any>;
+interface ButtonModalProps {
+    open: boolean;
+    onOpenChange: (b: boolean) => void;
+    buttonText: string;
+    buttonProps: ButtonProps;
+    title: string;
+    byline?: string;
+    action: SubmitServerAction;
+    actionEnclosure?: any;
+}
+interface ButtonModalDef {
+    Comp: React.ComponentType<ButtonModalProps>;
+    title: string;
+    props?: any;
+    byline?: string;
+    action?: SubmitServerAction;
+    actionEnclosure?: any;
+}
+interface ButtonDef {
+    text: string;
+    props: ButtonProps;
+    action: {
+        type: 'modal';
+        def: ButtonModalDef;
+    };
+}
+export { type ButtonDef, type SubmitServerAction, type ButtonModalProps, type ButtonModalDef, };

package/dist/types/button-def.js

@@ -0,0 +1,2 @@
+import {} from '../primitives/button';
+export {};

package/dist/types/dimensions.d.ts

@@ -0,0 +1,5 @@
+interface Dimensions {
+    w: number;
+    h: number;
+}
+export { type Dimensions as default };

package/dist/types/dimensions.js

@@ -0,0 +1 @@
+export {};

package/dist/types/grid-def.d.ts

@@ -0,0 +1,36 @@
+import type { Breakpoint } from './breakpoints';
+type GridColumnSpec = number | {
+    columns: number;
+    gap: number;
+};
+interface GridDef {
+    /** Must define in ACCENDING order. */
+    at: {
+        [key in (Breakpoint)]?: GridColumnSpec;
+    };
+    mobile?: GridColumnSpec;
+}
+declare const COMMON_GRID_1_COL: {
+    at: {
+        xs: {
+            columns: number;
+            gap: number;
+        };
+        md: {
+            columns: number;
+            gap: number;
+        };
+        lg: {
+            columns: number;
+            gap: number;
+        };
+    };
+    mobile: {
+        columns: number;
+        gap: number;
+    };
+};
+declare const COMMON_GRID_2_COL: GridDef;
+declare const COMMON_GRID_3_COL: GridDef;
+declare const COMMON_GRID_4_COL: GridDef;
+export { type GridDef as default, type GridColumnSpec, COMMON_GRID_1_COL, COMMON_GRID_2_COL, COMMON_GRID_3_COL, COMMON_GRID_4_COL };

package/dist/types/grid-def.js

@@ -0,0 +1,33 @@
+const COMMON_GRID_1_COL = {
+    at: {
+        xs: { columns: 1, gap: 2 },
+        md: { columns: 1, gap: 3 },
+        lg: { columns: 1, gap: 6 }
+    },
+    mobile: { columns: 1, gap: 2 }
+};
+const COMMON_GRID_2_COL = {
+    at: {
+        xs: { columns: 1, gap: 2 },
+        md: { columns: 2, gap: 3 },
+        lg: { columns: 2, gap: 6 }
+    },
+    mobile: { columns: 1, gap: 2 }
+};
+const COMMON_GRID_3_COL = {
+    at: {
+        xs: { columns: 1, gap: 2 },
+        md: { columns: 3, gap: 3 },
+        lg: { columns: 3, gap: 6 }
+    },
+    mobile: { columns: 1, gap: 2 }
+};
+const COMMON_GRID_4_COL = {
+    at: {
+        xs: { columns: 1, gap: 2 },
+        md: { columns: 2, gap: 3 },
+        lg: { columns: 4, gap: 6 }
+    },
+    mobile: { columns: 1, gap: 2 }
+};
+export { COMMON_GRID_1_COL, COMMON_GRID_2_COL, COMMON_GRID_3_COL, COMMON_GRID_4_COL };

package/dist/types/image-def.d.ts

@@ -0,0 +1,27 @@
+import type Dimensions from './dimensions';
+/**
+ * Defines a in image to render.
+ * ImageDef is part of {@link LinkDef}
+ */
+interface ImageDef {
+    /** image url */
+    src: string;
+    /** defaults to short filename */
+    alt?: string;
+    /** See next js docs */
+    sizes?: string;
+    /**
+     * Tailwind class for svg files (usually a text-<color>).
+     * All affect 'fill' props in the svg file
+     * must be set to 'currentColor'.
+     */
+    svgFillClass?: string;
+    /** rendered dim, unless style prop overrides
+     * in which case the file resolution should
+     * be supplied so that both Next and the browser
+     * can determine the aspect ratio
+    */
+    dim: Dimensions;
+    rounded?: string;
+}
+export { type ImageDef as default };

package/dist/types/image-def.js

@@ -0,0 +1 @@
+export {};

package/dist/types/index.d.ts

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

package/dist/types/index.js

@@ -0,0 +1,2 @@
+export { Breakpoints } from './breakpoints';
+export { COMMON_GRID_1_COL, COMMON_GRID_2_COL, COMMON_GRID_3_COL, COMMON_GRID_4_COL } from './grid-def';

package/dist/types/link-def.d.ts

@@ -0,0 +1,44 @@
+import type { VariantProps } from 'class-variance-authority';
+import type { buttonVariants } from '../primitives/button';
+/**
+ * A Conf object for the LinkElement primitive.
+ */
+interface LinkDef extends VariantProps<typeof buttonVariants> {
+    /**
+     * If the LinkElement is rendered directly and has children,
+     * the title, icon, iconAfter fields in the supplied LinkDef
+     * will be ignored.
+     */
+    title?: string;
+    /**
+     * If the LinkElement is rendered directly and has children,
+     * the title, icon, iconAfter fields in the supplied LinkDef
+     * will be ignored.
+     */
+    icon?: React.ReactNode;
+    /**
+     * If the LinkElement is rendered directly and has children,
+     * the title, icon, iconAfter fields in the supplied LinkDef
+     * will be ignored.
+     */
+    iconAfter?: boolean;
+    href: string;
+    /**
+     * External links will open in a new tab (via target='_blank') by default,
+     * while internal ones will open in the same tab.
+     * @field newTab overrides these defaults in both cases.
+     * ('external' means the url starts with 'http')
+     */
+    newTab?: boolean;
+    /**
+     * rendered as a disabled link, shows default cursor, and eats pointer events.
+     */
+    disabled?: boolean;
+    /**
+     *contents for description link.
+     */
+    contents?: string;
+    childMenu?: LinkDef[];
+    groupName?: string;
+}
+export { type LinkDef as default };

package/dist/types/link-def.js

@@ -0,0 +1 @@
+export {};

package/dist/types/media-stack-def.d.ts

@@ -0,0 +1,25 @@
+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/dist/types/media-stack-def.js

@@ -0,0 +1 @@
+export {};

package/dist/types/t-shirt-size.d.ts

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

package/dist/types/t-shirt-size.js

@@ -0,0 +1 @@
+export {};

package/dist/types/tshirt-dimensions.d.ts

@@ -0,0 +1,12 @@
+type ConcreteDimensions = {
+    w: number;
+    h: number;
+};
+type TShirtDimensions = {
+    xs?: ConcreteDimensions;
+    sm?: ConcreteDimensions;
+    md: ConcreteDimensions;
+    lg?: ConcreteDimensions;
+    xl?: ConcreteDimensions;
+};
+export { type TShirtDimensions as default };

package/dist/types/tshirt-dimensions.js

@@ -0,0 +1 @@
+export {};

package/dist/types/video-def.d.ts

@@ -0,0 +1,9 @@
+import type TShirtDimensions from './tshirt-dimensions';
+interface VideoDef {
+    videoProps?: any;
+    poster?: string;
+    sources?: string[];
+    dim: TShirtDimensions;
+    sizing?: any;
+}
+export { type VideoDef as default };

package/dist/types/video-def.js

@@ -0,0 +1 @@
+export {};

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

@@ -0,0 +1,11 @@
+import { type QuantityAbbrSymbol } from './number-abbreviate';
+interface FormatThreshold {
+    from: number;
+    use: QuantityAbbrSymbol;
+}
+declare const formatAndAbbreviateAsCurrency: (n: number | null, thresholds?: FormatThreshold[], roundingAdds?: number, maxDecimal?: number) => {
+    full: string;
+    result: string;
+    change: "rounded" | "none" | "abbr" | "empty";
+};
+export { formatAndAbbreviateAsCurrency as default, type FormatThreshold, type QuantityAbbrSymbol };

package/dist/util/format-and-abbreviate-as-currency.js

@@ -0,0 +1,91 @@
+import Abbr, { ABBR_SYMBOLS_ARRAY } from './number-abbreviate';
+const usdFormatter = Intl.NumberFormat('en-US', {
+    style: 'currency',
+    currency: 'USD',
+    minimumFractionDigits: 2,
+});
+const formatAsUSCurrency = (n) => {
+    let result = usdFormatter.format(n);
+    return result.endsWith('.00') ? result.slice(0, -3) : result;
+};
+const formatAndAbbreviateAsCurrency = (n, thresholds = [{
+        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 = 1, maxDecimal = 2) => {
+    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;
+    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 = [];
+    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 };

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

@@ -0,0 +1,5 @@
+declare const formatToMaxChar: (n: number | null, maxChars: number, roundingAdds?: number) => {
+    result: string;
+    change: "rounded" | "none" | "abbr" | "empty";
+};
+export default formatToMaxChar;

package/dist/util/format-to-max-char.js

@@ -0,0 +1,57 @@
+import Abbr from './number-abbreviate';
+const abbr = new Abbr(['K', 'M', 'B', 'T']);
+const formatToMaxChar = (n, maxChars, 
+/**
+ * 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 = 1) => {
+    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;