@ayasofyazilim/ui 0.0.0 → 0.0.2

package/src/hooks/use-callback-ref.ts

@@ -1,27 +1,27 @@
-import * as React from "react";
-
-/**
- * @see https://github.com/radix-ui/primitives/blob/main/packages/react/use-callback-ref/src/useCallbackRef.tsx
- */
-
-/**
- * A custom hook that converts a callback to a ref to avoid triggering re-renders when passed as a
- * prop or avoid re-executing effects when passed as a dependency
- */
-function useCallbackRef<T extends (...args: never[]) => unknown>(
-  callback: T | undefined
-): T {
-  const callbackRef = React.useRef(callback);
-
-  React.useEffect(() => {
-    callbackRef.current = callback;
-  });
-
-  // https://github.com/facebook/react/issues/19240
-  return React.useMemo(
-    () => ((...args) => callbackRef.current?.(...args)) as T,
-    []
-  );
-}
-
-export { useCallbackRef };
+import * as React from "react";
+
+/**
+ * @see https://github.com/radix-ui/primitives/blob/main/packages/react/use-callback-ref/src/useCallbackRef.tsx
+ */
+
+/**
+ * A custom hook that converts a callback to a ref to avoid triggering re-renders when passed as a
+ * prop or avoid re-executing effects when passed as a dependency
+ */
+function useCallbackRef<T extends (...args: never[]) => unknown>(
+  callback: T | undefined
+): T {
+  const callbackRef = React.useRef(callback);
+
+  React.useEffect(() => {
+    callbackRef.current = callback;
+  });
+
+  // https://github.com/facebook/react/issues/19240
+  return React.useMemo(
+    () => ((...args) => callbackRef.current?.(...args)) as T,
+    []
+  );
+}
+
+export { useCallbackRef };

package/src/hooks/use-controllable-state.ts

@@ -1,67 +1,67 @@
-import * as React from "react";
-
-import { useCallbackRef } from "./use-callback-ref";
-
-/**
- * @see https://github.com/radix-ui/primitives/blob/main/packages/react/use-controllable-state/src/useControllableState.tsx
- */
-
-type UseControllableStateParams<T> = {
-  prop?: T | undefined;
-  defaultProp?: T | undefined;
-  onChange?: (state: T) => void;
-};
-
-type SetStateFn<T> = (prevState?: T) => T;
-
-function useControllableState<T>({
-  prop,
-  defaultProp,
-  onChange = () => {},
-}: UseControllableStateParams<T>) {
-  const [uncontrolledProp, setUncontrolledProp] = useUncontrolledState({
-    defaultProp,
-    onChange,
-  });
-  const isControlled = prop !== undefined;
-  const value = isControlled ? prop : uncontrolledProp;
-  const handleChange = useCallbackRef(onChange);
-
-  const setValue: React.Dispatch<React.SetStateAction<T | undefined>> =
-    React.useCallback(
-      (nextValue) => {
-        if (isControlled) {
-          const setter = nextValue as SetStateFn<T>;
-          const value =
-            typeof nextValue === "function" ? setter(prop) : nextValue;
-          if (value !== prop) handleChange(value as T);
-        } else {
-          setUncontrolledProp(nextValue);
-        }
-      },
-      [isControlled, prop, setUncontrolledProp, handleChange]
-    );
-
-  return [value, setValue] as const;
-}
-
-function useUncontrolledState<T>({
-  defaultProp,
-  onChange,
-}: Omit<UseControllableStateParams<T>, "prop">) {
-  const uncontrolledState = React.useState<T | undefined>(defaultProp);
-  const [value] = uncontrolledState;
-  const prevValueRef = React.useRef(value);
-  const handleChange = useCallbackRef(onChange);
-
-  React.useEffect(() => {
-    if (prevValueRef.current !== value) {
-      handleChange(value as T);
-      prevValueRef.current = value;
-    }
-  }, [value, prevValueRef, handleChange]);
-
-  return uncontrolledState;
-}
-
-export { useControllableState };
+import * as React from "react";
+
+import { useCallbackRef } from "./use-callback-ref";
+
+/**
+ * @see https://github.com/radix-ui/primitives/blob/main/packages/react/use-controllable-state/src/useControllableState.tsx
+ */
+
+type UseControllableStateParams<T> = {
+  prop?: T | undefined;
+  defaultProp?: T | undefined;
+  onChange?: (state: T) => void;
+};
+
+type SetStateFn<T> = (prevState?: T) => T;
+
+function useControllableState<T>({
+  prop,
+  defaultProp,
+  onChange = () => {},
+}: UseControllableStateParams<T>) {
+  const [uncontrolledProp, setUncontrolledProp] = useUncontrolledState({
+    defaultProp,
+    onChange,
+  });
+  const isControlled = prop !== undefined;
+  const value = isControlled ? prop : uncontrolledProp;
+  const handleChange = useCallbackRef(onChange);
+
+  const setValue: React.Dispatch<React.SetStateAction<T | undefined>> =
+    React.useCallback(
+      (nextValue) => {
+        if (isControlled) {
+          const setter = nextValue as SetStateFn<T>;
+          const value =
+            typeof nextValue === "function" ? setter(prop) : nextValue;
+          if (value !== prop) handleChange(value as T);
+        } else {
+          setUncontrolledProp(nextValue);
+        }
+      },
+      [isControlled, prop, setUncontrolledProp, handleChange]
+    );
+
+  return [value, setValue] as const;
+}
+
+function useUncontrolledState<T>({
+  defaultProp,
+  onChange,
+}: Omit<UseControllableStateParams<T>, "prop">) {
+  const uncontrolledState = React.useState<T | undefined>(defaultProp);
+  const [value] = uncontrolledState;
+  const prevValueRef = React.useRef(value);
+  const handleChange = useCallbackRef(onChange);
+
+  React.useEffect(() => {
+    if (prevValueRef.current !== value) {
+      handleChange(value as T);
+      prevValueRef.current = value;
+    }
+  }, [value, prevValueRef, handleChange]);
+
+  return uncontrolledState;
+}
+
+export { useControllableState };

package/src/hooks/use-debounce.ts

@@ -1,19 +1,19 @@
-"use client";
-
-import { useState, useEffect } from "react";
-
-export function useDebounce<T>(value: T, delay: number) {
-  const [debouncedValue, setDebouncedValue] = useState<T>(value);
-
-  useEffect(() => {
-    const handler = setTimeout(() => {
-      setDebouncedValue(value);
-    }, delay);
-
-    return () => {
-      clearTimeout(handler);
-    };
-  }, [value, delay]);
-
-  return debouncedValue;
-}
+"use client";
+
+import { useState, useEffect } from "react";
+
+export function useDebounce<T>(value: T, delay: number) {
+  const [debouncedValue, setDebouncedValue] = useState<T>(value);
+
+  useEffect(() => {
+    const handler = setTimeout(() => {
+      setDebouncedValue(value);
+    }, delay);
+
+    return () => {
+      clearTimeout(handler);
+    };
+  }, [value, delay]);
+
+  return debouncedValue;
+}

package/src/hooks/use-is-visible.ts

@@ -1,23 +1,23 @@
-"use client";
-
-import { useEffect, useState } from "react";
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export function useIsVisible(ref: any, threshold = 0.3) {
-  const [isIntersecting, setIntersecting] = useState(false);
-
-  useEffect(() => {
-    const observer = new IntersectionObserver(
-      ([entry]) => {
-        setIntersecting(entry?.isIntersecting || false);
-      },
-      { threshold }
-    );
-
-    observer.observe(ref.current);
-    return () => {
-      observer.disconnect();
-    };
-  }, [ref, threshold]);
-
-  return isIntersecting;
-}
+"use client";
+
+import { useEffect, useState } from "react";
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export function useIsVisible(ref: any, threshold = 0.3) {
+  const [isIntersecting, setIntersecting] = useState(false);
+
+  useEffect(() => {
+    const observer = new IntersectionObserver(
+      ([entry]) => {
+        setIntersecting(entry?.isIntersecting || false);
+      },
+      { threshold }
+    );
+
+    observer.observe(ref.current);
+    return () => {
+      observer.disconnect();
+    };
+  }, [ref, threshold]);
+
+  return isIntersecting;
+}

package/src/hooks/use-media-query.ts

@@ -1,21 +1,21 @@
-"use client";
-
-import * as React from "react";
-
-export function useMediaQuery(query: string) {
-  const [value, setValue] = React.useState(false);
-
-  React.useEffect(() => {
-    function onChange(event: MediaQueryListEvent) {
-      setValue(event.matches);
-    }
-
-    const result = matchMedia(query);
-    result.addEventListener("change", onChange);
-    setValue(result.matches);
-
-    return () => result.removeEventListener("change", onChange);
-  }, [query]);
-
-  return value;
-}
+"use client";
+
+import * as React from "react";
+
+export function useMediaQuery(query: string) {
+  const [value, setValue] = React.useState(false);
+
+  React.useEffect(() => {
+    function onChange(event: MediaQueryListEvent) {
+      setValue(event.matches);
+    }
+
+    const result = matchMedia(query);
+    result.addEventListener("change", onChange);
+    setValue(result.matches);
+
+    return () => result.removeEventListener("change", onChange);
+  }, [query]);
+
+  return value;
+}

package/src/hooks/use-mobile.ts

@@ -1,21 +1,21 @@
-import * as React from "react";
-
-const MOBILE_BREAKPOINT = 768;
-
-export function useIsMobile() {
-  const [isMobile, setIsMobile] = React.useState<boolean | undefined>(
-    undefined
-  );
-
-  React.useEffect(() => {
-    const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
-    const onChange = () => {
-      setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
-    };
-    mql.addEventListener("change", onChange);
-    setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
-    return () => mql.removeEventListener("change", onChange);
-  }, []);
-
-  return !!isMobile;
-}
+import * as React from "react";
+
+const MOBILE_BREAKPOINT = 768;
+
+export function useIsMobile() {
+  const [isMobile, setIsMobile] = React.useState<boolean | undefined>(
+    undefined
+  );
+
+  React.useEffect(() => {
+    const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
+    const onChange = () => {
+      setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
+    };
+    mql.addEventListener("change", onChange);
+    setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
+    return () => mql.removeEventListener("change", onChange);
+  }, []);
+
+  return !!isMobile;
+}

package/src/hooks/use-on-window-resize.ts

@@ -1,15 +1,15 @@
-// Tremor Raw useOnWindowResize [v0.0.0]
-
-import * as React from "react";
-
-export const useOnWindowResize = (handler: { (): void }) => {
-  React.useEffect(() => {
-    const handleResize = () => {
-      handler();
-    };
-    handleResize();
-    window.addEventListener("resize", handleResize);
-
-    return () => window.removeEventListener("resize", handleResize);
-  }, [handler]);
-};
+// Tremor Raw useOnWindowResize [v0.0.0]
+
+import * as React from "react";
+
+export const useOnWindowResize = (handler: { (): void }) => {
+  React.useEffect(() => {
+    const handleResize = () => {
+      handler();
+    };
+    handleResize();
+    window.addEventListener("resize", handleResize);
+
+    return () => window.removeEventListener("resize", handleResize);
+  }, [handler]);
+};

package/src/hooks/use-scroll.tsx

@@ -1,22 +1,22 @@
-"use client";
-import React from "react";
-
-export function useScroll(threshold: number) {
-  const [scrolled, setScrolled] = React.useState(false);
-
-  const onScroll = React.useCallback(() => {
-    setScrolled(window.scrollY > threshold);
-  }, [threshold]);
-
-  React.useEffect(() => {
-    window.addEventListener("scroll", onScroll);
-    return () => window.removeEventListener("scroll", onScroll);
-  }, [onScroll]);
-
-  // also check on first load
-  React.useEffect(() => {
-    onScroll();
-  }, [onScroll]);
-
-  return scrolled;
-}
+"use client";
+import React from "react";
+
+export function useScroll(threshold: number) {
+  const [scrolled, setScrolled] = React.useState(false);
+
+  const onScroll = React.useCallback(() => {
+    setScrolled(window.scrollY > threshold);
+  }, [threshold]);
+
+  React.useEffect(() => {
+    window.addEventListener("scroll", onScroll);
+    return () => window.removeEventListener("scroll", onScroll);
+  }, [onScroll]);
+
+  // also check on first load
+  React.useEffect(() => {
+    onScroll();
+  }, [onScroll]);
+
+  return scrolled;
+}

package/src/lib/utils.ts

@@ -1,61 +1,61 @@
-import { clsx, type ClassValue } from "clsx";
-import { JSX } from "react";
-import { twMerge } from "tailwind-merge";
-import _ from "lodash";
-export const lodash = _;
-export * from "class-variance-authority";
-export function cn(...inputs: ClassValue[]) {
-  return twMerge(clsx(inputs));
-}
-
-export function formatBytes(
-  bytes: number,
-  opts: {
-    decimals?: number;
-    sizeType?: "accurate" | "normal";
-  } = {}
-) {
-  const { decimals = 0, sizeType = "normal" } = opts;
-
-  const sizes = ["Bytes", "KB", "MB", "GB", "TB"];
-  const accurateSizes = ["Bytes", "KiB", "MiB", "GiB", "TiB"];
-  if (bytes === 0) return "0 Byte";
-  const i = Math.floor(Math.log(bytes) / Math.log(1024));
-  return `${(bytes / Math.pow(1024, i)).toFixed(decimals)} ${
-    sizeType === "accurate" ? accurateSizes[i] ?? "Bytest" : sizes[i] ?? "Bytes"
-  }`;
-}
-
-export function replacePlaceholders(
-  string: string,
-  replacements: { holder: string; replacement: string | React.ReactNode }[]
-): (string | React.ReactNode | JSX.Element)[] {
-  if (!string || !replacements || replacements.length === 0) {
-    return [];
-  }
-
-  let result: (string | React.ReactNode | JSX.Element)[] = [string];
-
-  replacements.forEach(({ holder, replacement }) => {
-    const updatedResult: (string | React.ReactNode)[] = [];
-
-    result.forEach((element) => {
-      if (typeof element === "string") {
-        const parts: string[] = (element as string).split(holder);
-        parts.forEach((part, i) => {
-          if (i !== parts.length - 1) {
-            updatedResult.push(part, replacement);
-          } else {
-            updatedResult.push(part);
-          }
-        });
-      } else {
-        updatedResult.push(element);
-      }
-    });
-
-    result = updatedResult;
-  });
-
-  return result;
-}
+import { clsx, type ClassValue } from "clsx";
+import { JSX } from "react";
+import { twMerge } from "tailwind-merge";
+import _ from "lodash";
+export const lodash = _;
+export * from "class-variance-authority";
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs));
+}
+
+export function formatBytes(
+  bytes: number,
+  opts: {
+    decimals?: number;
+    sizeType?: "accurate" | "normal";
+  } = {}
+) {
+  const { decimals = 0, sizeType = "normal" } = opts;
+
+  const sizes = ["Bytes", "KB", "MB", "GB", "TB"];
+  const accurateSizes = ["Bytes", "KiB", "MiB", "GiB", "TiB"];
+  if (bytes === 0) return "0 Byte";
+  const i = Math.floor(Math.log(bytes) / Math.log(1024));
+  return `${(bytes / Math.pow(1024, i)).toFixed(decimals)} ${
+    sizeType === "accurate" ? accurateSizes[i] ?? "Bytest" : sizes[i] ?? "Bytes"
+  }`;
+}
+
+export function replacePlaceholders(
+  string: string,
+  replacements: { holder: string; replacement: string | React.ReactNode }[]
+): (string | React.ReactNode | JSX.Element)[] {
+  if (!string || !replacements || replacements.length === 0) {
+    return [];
+  }
+
+  let result: (string | React.ReactNode | JSX.Element)[] = [string];
+
+  replacements.forEach(({ holder, replacement }) => {
+    const updatedResult: (string | React.ReactNode)[] = [];
+
+    result.forEach((element) => {
+      if (typeof element === "string") {
+        const parts: string[] = (element as string).split(holder);
+        parts.forEach((part, i) => {
+          if (i !== parts.length - 1) {
+            updatedResult.push(part, replacement);
+          } else {
+            updatedResult.push(part);
+          }
+        });
+      } else {
+        updatedResult.push(element);
+      }
+    });
+
+    result = updatedResult;
+  });
+
+  return result;
+}

package/src/lib/zod.ts

@@ -1,2 +1,2 @@
-export { z } from "zod";
-export { zodResolver } from "@hookform/resolvers/zod";
+export { z } from "zod";
+export { zodResolver } from "@hookform/resolvers/zod";