danieljpgo

function MenuIcon() {
  return (
    <svg
      overflow="visible"
      preserveAspectRatio="none"
      className="h-6 w-6 origin-center"
      viewBox="0 0 4 4"
      stroke="currentColor"
      strokeWidth="2"
    >

danieljpgo

"use client";
import { useHydrated } from "~/hooks/use-hydrated";

export function ClientOnly({ children }: React.PropsWithChildren) {
  const hydrated = useHydrated();
  return hydrated ? children : null;
}

danieljpgo

import * as React from "react";

import { cxm } from "ui/lib/cva";

const speeds = {
  slow: "40s",
  fast: "20s",
} as const;

const directions = {

danieljpgo

import { type ImageProps, getImageProps } from "next/image";

type DynamicImageProps = Omit<React.ComponentProps<"img">, "src"> & {
  alt: string;
  src: ImageProps["src"];
  srcMobile: ImageProps["src"];
  srcTablet: ImageProps["src"];
  srcDesktop: ImageProps["src"];
  priority?: ImageProps["priority"];
  quality?: ImageProps["quality"];

danieljpgo

export type ObjectValues<T> = T[keyof T];

export type LooseAutocomplete<T extends string> = T | Omit<string, T>;

export type PropsFrom<Component> = Component extends React.FunctionComponent<
  infer Props
>
  ? Props
  : never;

danieljpgo

export function useSupportWebGL() {
  const [hasWebGLSupport, setHasWebGLSupport] = useState<boolean>();

  useEffect(() => {
    const canvas = window.document.createElement('canvas');
    try {
      const gl = canvas.getContext('webgl');
      if (gl === null) throw new Error('not supported');
      gl.getSupportedExtensions();
      setHasWebGLSupport(true);

danieljpgo

import {
  useForm as useHookForm,
  UseFormProps as useHookFormProps,
} from "react-hook-form";
import { zodResolver } from "@hookform/resolvers/zod";
import { TypeOf, ZodSchema } from "zod";

type UseFormProps<Z extends ZodSchema> = Omit<
  useHookFormProps<TypeOf<Z>>,
  'resolver'

danieljpgo

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    // "./src/app/**/*.{js,ts,jsx,tsx}",
    // "./src/pages/**/*.{js,ts,jsx,tsx}",
    // "./src/components/**/*.{js,ts,jsx,tsx}",
  ],
  theme: {
    extend: {
      screens: {

danieljpgo

Lib folder that every project needs

danieljpgo

import { useAuth } from '~/hooks';

type AuthProps = {
  children: ({ auth }: { auth: ReturnType<typeof useAuth> }) => JSX.Element;
};

export default function Auth(props: AuthProps) {
  const auth = useAuth();
  return props.children({ auth });
};