@hanzo/ui 4.8.5 → 4.9.0

package/src/registry/index.ts

@@ -1,60 +0,0 @@
-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

@@ -1,10 +0,0 @@
-{
-  "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

@@ -1,19 +0,0 @@
-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/style/drawer.css

@@ -1,163 +0,0 @@
-/*  This is a copy of vaul/src/style.css */
-
-[vaul-drawer] {
-  touch-action: none;
-  transition: transform 0.5s cubic-bezier(0.32, 0.72, 0, 1);
-}
-
-[vaul-drawer][vaul-drawer-direction='bottom'] {
-  transform: translate3d(0, 100%, 0);
-}
-
-[vaul-drawer][vaul-drawer-direction='top'] {
-  transform: translate3d(0, -100%, 0);
-}
-
-[vaul-drawer][vaul-drawer-direction='left'] {
-  transform: translate3d(-100%, 0, 0);
-}
-
-[vaul-drawer][vaul-drawer-direction='right'] {
-  transform: translate3d(100%, 0, 0);
-}
-
-.vaul-dragging .vaul-scrollable [vault-drawer-direction='top'] {
-  overflow-y: hidden !important;
-}
-.vaul-dragging .vaul-scrollable [vault-drawer-direction='bottom'] {
-  overflow-y: hidden !important;
-}
-
-.vaul-dragging .vaul-scrollable [vault-drawer-direction='left'] {
-  overflow-x: hidden !important;
-}
-
-.vaul-dragging .vaul-scrollable [vault-drawer-direction='right'] {
-  overflow-x: hidden !important;
-}
-
-[vaul-drawer][vaul-drawer-visible='true'][vaul-drawer-direction='top'] {
-  transform: translate3d(0, var(--snap-point-height, 0), 0);
-}
-
-[vaul-drawer][vaul-drawer-visible='true'][vaul-drawer-direction='bottom'] {
-  transform: translate3d(0, var(--snap-point-height, 0), 0);
-}
-
-[vaul-drawer][vaul-drawer-visible='true'][vaul-drawer-direction='left'] {
-  transform: translate3d(var(--snap-point-height, 0), 0, 0);
-}
-
-[vaul-drawer][vaul-drawer-visible='true'][vaul-drawer-direction='right'] {
-  transform: translate3d(var(--snap-point-height, 0), 0, 0);
-}
-
-[vaul-overlay] {
-  opacity: 0;
-  transition: opacity 0.5s cubic-bezier(0.32, 0.72, 0, 1);
-}
-
-[vaul-overlay][vaul-drawer-visible='true'] {
-  opacity: 1;
-}
-
-[vaul-drawer]::after {
-  content: '';
-  position: absolute;
-  background: inherit;
-  background-color: inherit;
-}
-
-[vaul-drawer][vaul-drawer-direction='top']::after {
-  top: initial;
-  bottom: 100%;
-  left: 0;
-  right: 0;
-  height: 200%;
-}
-
-[vaul-drawer][vaul-drawer-direction='bottom']::after {
-  top: 100%;
-  bottom: initial;
-  left: 0;
-  right: 0;
-  height: 200%;
-}
-
-[vaul-drawer][vaul-drawer-direction='left']::after {
-  left: initial;
-  right: 100%;
-  top: 0;
-  bottom: 0;
-  width: 200%;
-}
-
-[vaul-drawer][vaul-drawer-direction='right']::after {
-  left: 100%;
-  right: initial;
-  top: 0;
-  bottom: 0;
-  width: 200%;
-}
-
-[vaul-handle] {
-  display: block;
-  position: relative;
-  opacity: 0.8;
-  margin-left: auto;
-  margin-right: auto;
-  height: 5px;
-  width: 56px;
-  border-radius: 1rem;
-  touch-action: pan-y;
-  cursor: grab;
-}
-
-[vaul-handle]:hover,
-[vaul-handle]:active {
-  opacity: 1;
-}
-
-[vaul-handle]:active {
-  cursor: grabbing;
-}
-
-[vaul-handle-hitarea] {
-  position: absolute;
-  left: 50%;
-  top: 50%;
-  transform: translate(-50%, -50%);
-  width: max(100%, 2.75rem); /* 44px */
-  height: max(100%, 2.75rem); /* 44px */
-  touch-action: inherit;
-}
-
-[vaul-overlay][vaul-snap-points='true']:not([vaul-snap-points-overlay='true']):not([data-state='closed']) {
-  opacity: 0;
-}
-
-[vaul-overlay][vaul-snap-points-overlay='true']:not([vaul-drawer-visible='false']) {
-  opacity: 1;
-}
-
-/* This will allow us to not animate via animation, but still benefit from delaying unmount via Radix. */
-@keyframes fake-animation {
-  from {
-  }
-  to {
-  }
-}
-
-@media (pointer: fine) {
-  [vaul-handle-hitarea] {
-    width: 100%;
-    height: 100%;
-  }
-}
-
-@media (hover: hover) and (pointer: fine) {
-  [vaul-drawer] {
-    user-select: none;
-  }
-}
-

package/style/globals.css

@@ -1,13 +0,0 @@
-/* Note, preflight is applied first: 
-  https://unpkg.com/tailwindcss@3.3.5/src/css/preflight.css
-*/
-@import "tailwindcss/base";
-
-/* see https://stackoverflow.com/questions/69746121/using-nextjs-how-can-you-import-in-css-using-tailwind-css */
-@import "hanzo-common";
-@import "hanzo-default-colors";
-
-@import "tailwindcss/components";
-@import "tailwindcss/utilities";
-
-

package/style/hanzo-common.css

@@ -1,31 +0,0 @@
-@tailwind base;
-/* see https://stackoverflow.com/questions/69746121/using-nextjs-how-can-you-import-in-css-using-tailwind-css */
-
-@layer base {
-  
-  * {
-    box-sizing: inherit;
-  }
-
-  /*
-    using this approach: 
-    https://stackoverflow.com/a/76066443/11645689
-    see src/app/(home)/scroll-snap
-  */
-
-  html {
-    scroll-snap-type: y mandatory;
-    height: 100vh;
-
-    overflow-y: scroll;
-    box-sizing: border-box;
-
-    scrollbar-width: none;
-  }
-
-  body {
-    font-feature-settings: "rlig" 1, "calt" 1;
-    font-size: 16px; 
-    letter-spacing: 0.15px;
-  }
-}

package/style/hanzo-default-colors.css

@@ -1,82 +0,0 @@
-@tailwind base;
-/* see https://stackoverflow.com/questions/69746121/using-nextjs-how-can-you-import-in-css-using-tailwind-css */
-
-@layer base {
-
-  :root, .hanzo-ui-light-theme {
-    --hz-ui-fg-0: hsl(0 0% 0%);
-    --hz-ui-fg-body: hsl(0 0% 10%);
-    --hz-ui-fg-1: hsl(0 0% 20%);
-    --hz-ui-fg-2: hsl(0 0% 35%);
-    --hz-ui-fg-3: hsl(0 0% 50%);
-    --hz-ui-fg-4: hsl(0 0% 70%);
-    --hz-ui-fg-5: hsl(0 0% 90%);
-
-    --hz-ui-bg-0: hsl(0 0% 100%);
-    --hz-ui-bg-1: hsl(0 0% 90%);
-    --hz-ui-bg-2: hsl(0 0% 75%);
-    --hz-ui-bg-3: hsl(0 0% 55%);
-
-    --hz-ui-bg-overlay: hsla(0 0% 100% 0.60);
-
-    --hz-ui-bg-inverted: var(--hz-ui-fg-0);
-    --hz-ui-bg-inverted-hover:  hsla(0 0% 0% 0.85);
-
-    --hz-ui-fg-inverted: var(--hz-ui-bg-0);
-
-    --hz-ui-secondary-0: hsl(266, 79%, 80%);
-    --hz-ui-secondary-1: hsl(266, 79%, 70%);
-    --hz-ui-secondary-2: hsl(266, 79%, 60%);
-    --hz-ui-secondary-3: hsl(266, 79%, 50%);
-
-    --hz-ui-primary: var(--hz-ui-bg-inverted);
-    --hz-ui-primary-hover: var(--hz-ui-bg-inverted-hover);
-    --hz-ui-primary-fg: var(--hz-ui-fg-inverted);
-
-    --hz-ui-secondary: var(--hz-ui-secondary-0);
-    --hz-ui-secondary-hover: var(--hz-ui-secondary-2);
-    --hz-ui-secondary-fg: var(--hz-ui-fg-0);
-
-    --hz-ui-nav: var(--hz-ui-fg-4);
-    --hz-ui-nav-current: var(--hz-ui-fg-0);
-    --hz-ui-nav-hover: var(--hz-ui-fg-0);
-
-    --hz-ui-destructive: hsl(0 62.8% 45%);
-    --hz-ui-destructive-hover: hsl(0 62.8% 25%);
-    --hz-ui-destructive-fg: hsl(0 0% 100%);
-
-    --hz-ui-ring: var(--hz-ui-fg-2);
-
-    --hz-ui-radius: 0.5rem;
-  }
- 
-  .hanzo-ui-dark-theme {
-
-    --hz-ui-fg-0: hsl(0 0% 100%);
-    --hz-ui-fg-body: hsl(0, 0%, 97%);
-    --hz-ui-fg-1: hsl(0 0% 85%);
-    --hz-ui-fg-2: hsl(0 0% 70%);
-    --hz-ui-fg-3: hsl(0 0% 55%);
-    --hz-ui-fg-4: hsl(0 0% 40%);
-    --hz-ui-fg-5: hsl(0 0% 25%);
-
-    --hz-ui-bg-inverted: var(--hz-ui-fg-0);
-    --hz-ui-bg-inverted-hover:  hsla(0, 0%, 100%, 0.85);
-
-    --hz-ui-bg-3: hsl(0 0% 25%);
-    --hz-ui-bg-2: hsl(0 0% 18%);
-    --hz-ui-bg-1: hsl(0 0% 12%);
-    --hz-ui-bg-0: hsl(0 0% 0%);
-
-    --hz-ui-bg-overlay: hsla(0 0% 0% 0.60);
-
-    --hz-ui-fg-inverted: var(--hz-ui-bg-0);
-
-    --hz-ui-secondary-0: hsl(266, 79%, 40%);
-    --hz-ui-secondary-1: hsl(266, 79%, 50%);
-    --hz-ui-secondary-2: hsl(266, 79%, 60%);
-    --hz-ui-secondary-3: hsl(266, 79%, 70%);
-  }
-
-}
-

package/style/theme-provider.tsx

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

package/tailwind/colors.tailwind.js

@@ -1,53 +0,0 @@
-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

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

package/tailwind/fontSize.tailwind.ts

@@ -1,13 +0,0 @@
-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

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

package/tailwind/safelist.tailwind.js

@@ -1,26 +0,0 @@
-  // 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

@@ -1,8 +0,0 @@
-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

@@ -1,65 +0,0 @@
-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

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