@ayasofyazilim/ui 0.0.0

package/src/custom/tree.tsx

@@ -0,0 +1,200 @@
+"use client";
+"use no memo";
+
+import * as React from "react";
+import { ItemInstance } from "@headless-tree/core";
+import { ChevronDownIcon } from "lucide-react";
+import { Slot } from "radix-ui";
+export * from "@headless-tree/core";
+export * from "@headless-tree/react";
+import { cn } from "@repo/ayasofyazilim-ui/lib/utils";
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+interface TreeContextValue<T = any> {
+  indent: number;
+  currentItem?: ItemInstance<T>;
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  tree?: any;
+}
+
+const TreeContext = React.createContext<TreeContextValue>({
+  indent: 20,
+  currentItem: undefined,
+  tree: undefined,
+});
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+function useTreeContext<T = any>() {
+  return React.useContext(TreeContext) as TreeContextValue<T>;
+}
+
+interface TreeProps extends React.HTMLAttributes<HTMLDivElement> {
+  indent?: number;
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  tree?: any;
+}
+
+function Tree({ indent = 20, tree, className, ...props }: TreeProps) {
+  const containerProps =
+    tree && typeof tree.getContainerProps === "function"
+      ? tree.getContainerProps()
+      : {};
+  const mergedProps = { ...props, ...containerProps };
+
+  // Extract style from mergedProps to merge with our custom styles
+  const { style: propStyle, ...otherProps } = mergedProps;
+
+  // Merge styles
+  const mergedStyle = {
+    ...propStyle,
+    "--tree-indent": `${indent}px`,
+  } as React.CSSProperties;
+
+  return (
+    <TreeContext.Provider value={{ indent, tree }}>
+      <div
+        data-slot="tree"
+        style={mergedStyle}
+        className={cn("flex flex-col", className)}
+        {...otherProps}
+      />
+    </TreeContext.Provider>
+  );
+}
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+interface TreeItemProps<T = any>
+  extends React.HTMLAttributes<HTMLButtonElement> {
+  item: ItemInstance<T>;
+  indent?: number;
+  asChild?: boolean;
+}
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+function TreeItem<T = any>({
+  item,
+  className,
+  asChild,
+  children,
+  ...props
+}: Omit<TreeItemProps<T>, "indent">) {
+  const { indent } = useTreeContext<T>();
+
+  const itemProps = typeof item.getProps === "function" ? item.getProps() : {};
+  const mergedProps = { ...props, ...itemProps };
+
+  // Extract style from mergedProps to merge with our custom styles
+  const { style: propStyle, ...otherProps } = mergedProps;
+
+  // Merge styles
+  const mergedStyle = {
+    ...propStyle,
+    "--tree-padding": `${item.getItemMeta().level * indent}px`,
+  } as React.CSSProperties;
+
+  const Comp = asChild ? Slot.Root : "button";
+
+  return (
+    <TreeContext.Provider value={{ indent, currentItem: item }}>
+      <Comp
+        data-slot="tree-item"
+        style={mergedStyle}
+        className={cn(
+          "z-10 ps-(--tree-padding) outline-hidden select-none not-last:pb-0.5 focus:z-20 data-disabled:pointer-events-none data-disabled:opacity-50",
+          className
+        )}
+        data-focus={
+          typeof item.isFocused === "function"
+            ? item.isFocused() || false
+            : undefined
+        }
+        data-folder={
+          typeof item.isFolder === "function"
+            ? item.isFolder() || false
+            : undefined
+        }
+        data-selected={
+          typeof item.isSelected === "function"
+            ? item.isSelected() || false
+            : undefined
+        }
+        data-drag-target={
+          typeof item.isDragTarget === "function"
+            ? item.isDragTarget() || false
+            : undefined
+        }
+        data-search-match={
+          typeof item.isMatchingSearch === "function"
+            ? item.isMatchingSearch() || false
+            : undefined
+        }
+        aria-expanded={item.isExpanded()}
+        {...otherProps}
+      >
+        {children}
+      </Comp>
+    </TreeContext.Provider>
+  );
+}
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+interface TreeItemLabelProps<T = any>
+  extends React.HTMLAttributes<HTMLSpanElement> {
+  item?: ItemInstance<T>;
+}
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+function TreeItemLabel<T = any>({
+  item: propItem,
+  children,
+  className,
+  ...props
+}: TreeItemLabelProps<T>) {
+  const { currentItem } = useTreeContext<T>();
+  const item = propItem || currentItem;
+
+  if (!item) {
+    console.warn("TreeItemLabel: No item provided via props or context");
+    return null;
+  }
+
+  return (
+    <span
+      data-slot="tree-item-label"
+      className={cn(
+        "flex items-center gap-1 rounded-sm bg-background px-2 py-1.5 text-sm transition-colors not-in-data-[folder=true]:ps-7 hover:bg-accent in-focus-visible:ring-[3px] in-focus-visible:ring-ring/50 in-data-[drag-target=true]:bg-accent in-data-[search-match=true]:bg-blue-400/20! in-data-[selected=true]:bg-accent in-data-[selected=true]:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0",
+        className
+      )}
+      {...props}
+    >
+      {item.isFolder() && (
+        <ChevronDownIcon className="size-4 text-muted-foreground in-aria-[expanded=false]:-rotate-90" />
+      )}
+      {children ||
+        (typeof item.getItemName === "function" ? item.getItemName() : null)}
+    </span>
+  );
+}
+
+function TreeDragLine({
+  className,
+  ...props
+}: React.HTMLAttributes<HTMLDivElement>) {
+  const { tree } = useTreeContext();
+
+  if (!tree || typeof tree.getDragLineStyle !== "function") {
+    console.warn(
+      "TreeDragLine: No tree provided via context or tree does not have getDragLineStyle method"
+    );
+    return null;
+  }
+
+  const dragLine = tree.getDragLineStyle();
+  return (
+    <div
+      style={dragLine}
+      className={cn(
+        "absolute z-30 -mt-px h-0.5 w-[unset] bg-primary before:absolute before:-top-[3px] before:left-0 before:size-2 before:rounded-full before:border-2 before:border-primary before:bg-background",
+        className
+      )}
+      {...props}
+    />
+  );
+}
+
+export { Tree, TreeItem, TreeItemLabel, TreeDragLine };

package/src/custom/tscanify/browser.ts

@@ -0,0 +1,66 @@
+/*! tscanify browser entry point v1.0.0 | MIT License */
+
+/**
+ * This file is a specific entry point for browser environments.
+ * It only exports the browser-compatible implementation and avoids importing
+ * any Node.js-specific modules like 'canvas' or 'jsdom'.
+ */
+
+// Export the browser-specific implementation
+export { TScanifyBrowser } from "./tscanify-browser";
+
+// Re-export types
+export * from "./types";
+
+// Re-export opencv-ts for convenience
+import cv from "opencv-ts";
+import type { Mat, MatVector, Size, Rect } from "opencv-ts";
+export { cv };
+export type { Mat, MatVector, Size, Rect };
+
+// Initialize OpenCV if needed (browser environment only)
+if (typeof window !== "undefined") {
+  // Check if OpenCV is already available globally
+  if (
+    !(window as unknown as WindowWithCV).cv ||
+    !(window as unknown as WindowWithCV).cv.Mat
+  ) {
+    (window as unknown as WindowWithCV).cv = cv;
+  }
+}
+
+// Export the browser implementation as the default for convenience
+import { TScanifyBrowser } from "./tscanify-browser";
+import { WindowWithCV } from "./types";
+export default TScanifyBrowser;
+
+// Helper function to create a new instance and ensure OpenCV is ready
+export function createScanner(): TScanifyBrowser {
+  const scanner = new TScanifyBrowser();
+
+  // If in browser, ensure OpenCV is available
+  if (typeof window !== "undefined") {
+    // Try to make cv from opencv-ts available globally if not already
+    if (
+      !(window as unknown as WindowWithCV).cv ||
+      !(window as unknown as WindowWithCV).cv.Mat
+    ) {
+      if (cv && (cv as typeof cv).Mat) {
+        (window as unknown as WindowWithCV).cv = cv;
+      }
+    }
+  }
+
+  return scanner;
+}
+
+// Helper function to check if OpenCV is loaded
+export function isOpenCVReady(): boolean {
+  if (typeof window !== "undefined") {
+    return (
+      !!(window as unknown as WindowWithCV).cv &&
+      !!(window as unknown as WindowWithCV).cv.Mat
+    );
+  }
+  return !!cv && !!(cv as typeof cv).Mat;
+}

package/src/custom/tscanify/index.ts

@@ -0,0 +1,51 @@
+/*! tscanify index v1.0.0 | MIT License */
+
+// Export types
+export * from "./types";
+
+// Re-export opencv-ts for convenience
+import type { Mat, MatVector, Size, Rect } from "opencv-ts";
+export type { Mat, MatVector, Size, Rect };
+
+// Dynamic imports based on environment
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+let TScanify: any;
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+let TScanifyNode: any;
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+let TScanifyBrowser: any;
+
+// Detect browser environment
+const isBrowser =
+  typeof window !== "undefined" && typeof window.document !== "undefined";
+
+// Use dynamic imports to avoid loading Node.js modules in the browser
+if (isBrowser) {
+  // In browser environments, only import the browser version
+  import("./tscanify-browser").then((module) => {
+    TScanifyBrowser = module.TScanifyBrowser;
+    TScanify = TScanifyBrowser;
+  });
+} else {
+  // In Node.js environments, we can safely import the Node versions
+  import("./tscanify").then((module) => {
+    TScanify = module.TScanify;
+  });
+}
+
+// Use dynamic import approach in function form for better browser bundling
+export async function createTScanify() {
+  if (isBrowser) {
+    const { TScanifyBrowser } = await import("./tscanify-browser");
+    return new TScanifyBrowser();
+  } else {
+    const { TScanify } = await import("./tscanify");
+    return new TScanify();
+  }
+}
+
+// Export for backward compatibility
+export { TScanify, TScanifyBrowser, TScanifyNode };
+
+// Default export for backward compatibility
+export default TScanify;