@hanzo/ui 4.7.0 → 4.8.3

package/src/registry/index.ts

@@ -0,0 +1,60 @@
+import { z } from "zod"
+
+// Define the file schema to match hanzo/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 hanzo/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 hanzo/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(),
+        })
+      ),
+    })
+  ),
+})
+
+// Type definitions for easier use in TypeScript
+export type RegistryItem = z.infer<typeof registryItemSchema>
+export type Registry = z.infer<typeof registrySchema>
+export type RegistryWithContent = z.infer<typeof registryWithContentSchema>
+export type RegistryFile = z.infer<typeof fileSchema>
+
+// Support CommonJS
+if (typeof module !== 'undefined') {
+  module.exports = { fileSchema, registryItemSchema, registrySchema, registryWithContentSchema }
+}

package/src/registry/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@hanzo/ui-registry",
+  "private": true,
+  "type": "module",
+  "main": "../dist/registry/index.js",
+  "types": "../dist/registry/index.d.ts",
+  "scripts": {
+    "build": "tsc"
+  }
+}

package/src/utils.ts

@@ -0,0 +1,19 @@
+import { clsx, type ClassValue } from "clsx"
+import { twMerge } from "tailwind-merge"
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs))
+}
+
+export function formatDate(input: string | number): string {
+  const date = new Date(input)
+  return date.toLocaleDateString("en-US", {
+    month: "long",
+    day: "numeric",
+    year: "numeric",
+  })
+}
+
+export function absoluteUrl(path: string) {
+  return `${process.env.NEXT_PUBLIC_APP_URL || ''}${path}`
+}

package/tailwind/colors.tailwind.js

@@ -0,0 +1,53 @@
+export default ({ colors }) => ({
+  inherit: colors.inherit,
+  current: colors.current,
+  transparent: colors.transparent,
+  ring: "var(--hz-ui-ring)",
+  background: 'var(--hz-ui-bg-0)',
+    // Should be partially transparent,
+    // so opacity animations in 'vaul' module and other 3rd party stuff work
+  overlay: 'var(--hz-ui-bg-overlay)', 
+  
+    // levels forward in z-index (a la Material Design)
+  level: {
+    DEFAULT: "var(--hz-ui-bg-0)",
+    '0': "var(--hz-ui-bg-0)",
+    '1': "var(--hz-ui-bg-1)",
+    '2': "var(--hz-ui-bg-2)",
+    '3': "var(--hz-ui-bg-3)",
+  },
+  accent: "var(--hz-ui-fg-0)",      // full contrast (darkTheme:white) : heading and links hover
+  foreground: "var(--hz-ui-fg-body)", // body text off-white (bright enough to contrast to bg-level-1)
+  muted: {
+    DEFAULT: "var(--hz-ui-fg-2)",   // de-emphasized: fine print
+    '1': "var(--hz-ui-fg-2)",       // synonymous ^^^
+    '2': "var(--hz-ui-fg-3)",       // disabled or very de-emphasized
+    '3': "var(--hz-ui-fg-4)",       // very disabled ;)
+    '4': "var(--hz-ui-fg-5)",       // disabled border
+  },
+  primary: {
+    DEFAULT: "var(--hz-ui-primary)",
+    lux: "var(--hz-ui-primary)", // in case there are two configs
+    hover: "var(--hz-ui-primary-hover)",
+    fg: "var(--hz-ui-primary-fg)",
+  },
+  secondary: {
+    DEFAULT: "var(--hz-ui-secondary)",
+    lux: "var(--hz-ui-secondary)", // in case there are two configs
+    hover: "var(--hz-ui-secondary-hover)",
+    fg: "var(--hz-ui-secondary-fg)",
+    '0': 'var(--hz-ui-secondary-0)', 
+    '1': 'var(--hz-ui-secondary-1)', 
+    '2': 'var(--hz-ui-secondary-2)', 
+    '3': 'var(--hz-ui-secondary-3)', 
+  },
+  destructive: {
+    DEFAULT: "var(--hz-ui-destructive)",
+    fg: "var(--hz-ui-destructive-fg)",
+  },
+  nav: {
+    DEFAULT: "var(--hz-ui-nav)",
+    hover: "var(--hz-ui-nav-hover)",
+    current: "var(--hz-ui-nav-current)",
+  },
+})

package/tailwind/fontFamily.tailwind.ts

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

package/tailwind/fontSize.tailwind.ts

@@ -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/tailwind/index.ts

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

package/tailwind/safelist.tailwind.js

@@ -0,0 +1,26 @@
+  // https://tailwindcss.com/docs/content-configuration#dynamic-class-names
+  // https://tailwindcss.com/docs/content-configuration#safelisting-classes
+export default [
+
+  'font-sans',
+  { 
+    pattern: /grid-cols-[1-6]/,
+    variants: [ 'xs', 'sm', 'md', 'lg', 'xl', '2xl' ]
+  },
+  { // SpaceBlock
+    pattern: /h-([0-9]|[1-3][0-9]|40)/,
+    variants: [ 'xs', 'sm', 'md', 'lg', 'xl', '2xl' ]
+  },
+  { 
+    pattern: /order-[0-6]/
+  },
+  { // EnhHeadingBlock
+    pattern: /mb-([1-9]|1[0-2])/
+  },
+  'md:text-left', // EnhHeadingBlock
+  'md:text-center',
+  'md:text-right',
+  'md:self-start',
+  'md:self-center',
+  'md:self-end',
+]

package/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/tailwind/spacing.tailwind.js

@@ -0,0 +1,65 @@
+const percentages = {}
+for (let i = 0; i <= 100; i++) {
+  percentages[`pr-${i}`] = `${i}%` 
+}
+
+
+export default {
+  ...percentages,
+  px: '1px',
+  0: '0px',
+  0.5: '0.125rem',
+  1: '0.25rem',
+  1.5: '0.375rem',
+  2: '0.5rem',
+  2.5: '0.625rem',
+  3: '0.75rem',
+  3.5: '0.875rem',
+  4: '1rem',
+  5: '1.25rem',
+  6: '1.5rem',
+  7: '1.75rem',
+  8: '2rem',
+  9: '2.25rem',
+  10: '2.5rem',
+  11: '2.75rem',
+  12: '3rem',
+  13: '3.25rem',
+  14: '3.5rem',
+  15: '3.75rem',
+  16: '4rem',
+  17: '4.25rem',
+  18: '4.5rem',
+  19: '4.75rem',
+  20: '5rem',
+  21: '5.25rem',
+  22: '5.5rem',
+  23: '5.75rem',
+  24: '6rem',
+  25: '5.25rem',
+  26: '5.5rem',
+  27: '5.75rem',
+  28: '7rem',
+  29: '7.25rem',
+  30: '7.5rem',
+  31: '7.75rem',
+  32: '8rem',
+  33: '8.25rem',
+  34: '8.5rem',
+  35: '8.75rem',
+  36: '9rem',
+  37: '9.25rem',
+  38: '9.5rem',
+  39: '9.75rem',
+  40: '10rem',
+  44: '11rem',
+  48: '12rem',
+  52: '13rem',
+  56: '14rem',
+  60: '15rem',
+  64: '16rem',
+  72: '18rem',
+  80: '20rem',
+  96: '24rem',
+}
+

package/tailwind/tailwind.config.hanzo-preset.d.ts

@@ -0,0 +1,5 @@
+import type { Config } from 'tailwindcss'
+
+declare const conf: Config
+
+export default conf