@ayasofyazilim/ui 0.0.0 → 0.0.1

package/dist/custom/document-scanner/lib.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/custom/document-scanner/lib.ts"],"sourcesContent":["import { createScanner } from \"../tscanify/browser\";\r\nimport { DEFAULT_MAX_DOCUMENT_SIZE, DEFAULT_MIN_DOCUMENT_SIZE } from \"./consts\";\r\nimport { DocumentCorners } from \"./types\";\r\nimport cv, { Mat } from \"opencv-ts\";\r\n\r\nexport async function scanDocument(\r\n  imageBase64: string,\r\n  videoDimensions: { width: number; height: number },\r\n  onSuccess: (corners: DocumentCorners) => void,\r\n  onError: (error: string) => void,\r\n  options?: {\r\n    minDocumentSize?: number;\r\n    maxDocumentSize?: number;\r\n    detectionSensitivity?: number;\r\n    detectionConfidence?: number;\r\n  }\r\n) {\r\n  try {\r\n    const scanner = createScanner();\r\n    const inputCanvas = document.createElement(\"canvas\");\r\n    const img = new Image();\r\n\r\n    await new Promise<void>((resolve, reject) => {\r\n      img.onload = () => {\r\n        try {\r\n          const ctx = inputCanvas.getContext(\"2d\");\r\n          if (!ctx) {\r\n            reject(new Error(\"Failed to get canvas context\"));\r\n            return;\r\n          }\r\n\r\n          inputCanvas.width = img.width;\r\n          inputCanvas.height = img.height;\r\n          ctx.drawImage(img, 0, 0);\r\n\r\n          const src = cv.imread(inputCanvas);\r\n          let detectedCorners: DocumentCorners | null = null;\r\n\r\n          try {\r\n            // Use configurable detection settings\r\n            const minDocumentSize =\r\n              options?.minDocumentSize ?? DEFAULT_MIN_DOCUMENT_SIZE;\r\n            const maxDocumentSize =\r\n              options?.maxDocumentSize ?? DEFAULT_MAX_DOCUMENT_SIZE;\r\n\r\n            // Try different detection methods\r\n            detectedCorners = findDocumentSimple(src, img.width, img.height);\r\n\r\n            if (!detectedCorners) {\r\n              detectedCorners = scanner.findDocumentCorners(src);\r\n            }\r\n\r\n            if (!detectedCorners) {\r\n              detectedCorners = findDocumentCornersAdvanced(\r\n                src,\r\n                img.width,\r\n                img.height\r\n              );\r\n            }\r\n\r\n            if (detectedCorners) {\r\n              // Validate corners with configurable sizes\r\n              const {\r\n                topLeftCorner,\r\n                topRightCorner,\r\n                bottomRightCorner,\r\n                bottomLeftCorner,\r\n              } = detectedCorners;\r\n              const width = Math.abs(topRightCorner.x - topLeftCorner.x);\r\n              const height = Math.abs(bottomLeftCorner.y - topLeftCorner.y);\r\n              const minSize = Math.min(img.width, img.height) * minDocumentSize;\r\n              const maxSize = Math.min(img.width, img.height) * maxDocumentSize;\r\n\r\n              if (\r\n                width >= minSize &&\r\n                height >= minSize &&\r\n                width <= maxSize &&\r\n                height <= maxSize\r\n              ) {\r\n                // Scale corners to video dimensions\r\n                const scaledCorners = {\r\n                  topLeftCorner: {\r\n                    x: (topLeftCorner.x / img.width) * videoDimensions.width,\r\n                    y: (topLeftCorner.y / img.height) * videoDimensions.height,\r\n                  },\r\n                  topRightCorner: {\r\n                    x: (topRightCorner.x / img.width) * videoDimensions.width,\r\n                    y: (topRightCorner.y / img.height) * videoDimensions.height,\r\n                  },\r\n                  bottomRightCorner: {\r\n                    x:\r\n                      (bottomRightCorner.x / img.width) * videoDimensions.width,\r\n                    y:\r\n                      (bottomRightCorner.y / img.height) *\r\n                      videoDimensions.height,\r\n                  },\r\n                  bottomLeftCorner: {\r\n                    x: (bottomLeftCorner.x / img.width) * videoDimensions.width,\r\n                    y:\r\n                      (bottomLeftCorner.y / img.height) *\r\n                      videoDimensions.height,\r\n                  },\r\n                };\r\n                onSuccess(scaledCorners);\r\n              }\r\n            }\r\n          } finally {\r\n            // Always cleanup OpenCV resources\r\n            src.delete();\r\n          }\r\n          resolve();\r\n        } catch (error) {\r\n          reject(error);\r\n        }\r\n      };\r\n\r\n      img.onerror = () => reject(new Error(\"Failed to load image\"));\r\n      img.src = imageBase64;\r\n    });\r\n  } catch (error) {\r\n    const errorMessage =\r\n      error instanceof Error\r\n        ? error.message\r\n        : \"Unknown error occurred during document scanning\";\r\n    onError(errorMessage);\r\n  }\r\n}\r\n\r\n// Document scanning function\r\n\r\n// Simple document detection fallback\r\nexport function findDocumentSimple(\r\n  src: Mat,\r\n  width: number,\r\n  height: number\r\n): DocumentCorners | null {\r\n  try {\r\n    const gray = new cv.Mat();\r\n    const binary = new cv.Mat();\r\n\r\n    cv.cvtColor(src, gray, cv.COLOR_RGBA2GRAY);\r\n    cv.threshold(gray, binary, 0, 255, cv.THRESH_BINARY + cv.THRESH_OTSU);\r\n\r\n    const contours = new cv.MatVector();\r\n    const hierarchy = new cv.Mat();\r\n\r\n    cv.findContours(\r\n      binary,\r\n      contours,\r\n      hierarchy,\r\n      cv.RETR_EXTERNAL,\r\n      cv.CHAIN_APPROX_SIMPLE\r\n    );\r\n\r\n    for (let i = 0; i < contours.size(); i++) {\r\n      const contour = contours.get(i);\r\n      const area = cv.contourArea(contour);\r\n      const minArea = width * height * 0.1;\r\n\r\n      if (area > minArea) {\r\n        const approx = new cv.Mat();\r\n        const peri = cv.arcLength(contour, true);\r\n        cv.approxPolyDP(contour, approx, 0.02 * peri, true);\r\n\r\n        if (approx.rows === 4) {\r\n          const points: Array<{ x: number; y: number }> = [];\r\n          for (let j = 0; j < 4; j++) {\r\n            const point = approx.data32S;\r\n            points.push({ x: point[j * 2] || 0, y: point[j * 2 + 1] || 0 });\r\n          }\r\n\r\n          // Sort points to match expected corners\r\n          points.sort((a, b) => a.y - b.y);\r\n          const topPoints = points.slice(0, 2).sort((a, b) => a.x - b.x);\r\n          const bottomPoints = points.slice(2, 4).sort((a, b) => a.x - b.x);\r\n\r\n          const corners = {\r\n            topLeftCorner: topPoints[0],\r\n            topRightCorner: topPoints[1],\r\n            bottomRightCorner: bottomPoints[1],\r\n            bottomLeftCorner: bottomPoints[0],\r\n          };\r\n\r\n          approx.delete();\r\n          contour.delete();\r\n          gray.delete();\r\n          binary.delete();\r\n          contours.delete();\r\n          hierarchy.delete();\r\n\r\n          return corners as DocumentCorners;\r\n        }\r\n\r\n        approx.delete();\r\n      }\r\n      contour.delete();\r\n    }\r\n\r\n    gray.delete();\r\n    binary.delete();\r\n    contours.delete();\r\n    hierarchy.delete();\r\n\r\n    return null;\r\n  } catch {\r\n    return null;\r\n  }\r\n}\r\n\r\n// Advanced document detection\r\nexport function findDocumentCornersAdvanced(\r\n  src: Mat,\r\n  width: number,\r\n  height: number\r\n): DocumentCorners | null {\r\n  try {\r\n    const gray = new cv.Mat();\r\n    cv.cvtColor(src, gray, cv.COLOR_RGBA2GRAY);\r\n\r\n    const approaches = [\r\n      {\r\n        name: \"OTSU + Gaussian\",\r\n        process: (input: any) => {\r\n          const blurred = new cv.Mat();\r\n          const binary = new cv.Mat();\r\n          cv.GaussianBlur(input, blurred, new cv.Size(9, 9), 0, 0, 0);\r\n          cv.threshold(\r\n            blurred,\r\n            binary,\r\n            0,\r\n            255,\r\n            cv.THRESH_BINARY + cv.THRESH_OTSU\r\n          );\r\n          blurred.delete();\r\n          return binary;\r\n        },\r\n      },\r\n      {\r\n        name: \"Adaptive Threshold\",\r\n        process: (input: Mat) => {\r\n          const binary = new cv.Mat();\r\n          cv.adaptiveThreshold(\r\n            input,\r\n            binary,\r\n            255,\r\n            cv.ADAPTIVE_THRESH_GAUSSIAN_C,\r\n            cv.THRESH_BINARY,\r\n            15,\r\n            10\r\n          );\r\n          return binary;\r\n        },\r\n      },\r\n    ];\r\n\r\n    let bestCorners: DocumentCorners | null = null;\r\n    let bestScore = 0;\r\n\r\n    Array.from(approaches).forEach((approach) => {\r\n      const binary = approach.process(gray);\r\n      const corners = findCornersFromBinary(binary, width, height);\r\n\r\n      if (corners) {\r\n        const score = scoreCornersQuality(corners, width, height);\r\n        if (score > bestScore) {\r\n          bestScore = score;\r\n          bestCorners = corners;\r\n        }\r\n      }\r\n\r\n      binary.delete();\r\n    });\r\n\r\n    gray.delete();\r\n    return bestCorners;\r\n  } catch {\r\n    return null;\r\n  }\r\n}\r\n\r\nexport function findCornersFromBinary(\r\n  binary: Mat,\r\n  width: number,\r\n  height: number\r\n): DocumentCorners | null {\r\n  try {\r\n    const contours = new cv.MatVector();\r\n    const hierarchy = new cv.Mat();\r\n    cv.findContours(\r\n      binary,\r\n      contours,\r\n      hierarchy,\r\n      cv.RETR_EXTERNAL,\r\n      cv.CHAIN_APPROX_SIMPLE\r\n    );\r\n\r\n    let bestCorners: DocumentCorners | null = null;\r\n    let bestArea = 0;\r\n\r\n    for (let i = 0; i < contours.size(); i++) {\r\n      const contour = contours.get(i);\r\n      const area = cv.contourArea(contour);\r\n      const minArea = width * height * 0.05;\r\n\r\n      if (area > minArea && area > bestArea) {\r\n        const approx = new cv.Mat();\r\n        const peri = cv.arcLength(contour, true);\r\n        cv.approxPolyDP(contour, approx, 0.02 * peri, true);\r\n\r\n        if (approx.rows === 4) {\r\n          const points: Array<{ x: number; y: number }> = [];\r\n          for (let j = 0; j < 4; j++) {\r\n            const point = approx.data32S;\r\n            points.push({ x: point[j * 2] || 0, y: point[j * 2 + 1] || 0 });\r\n          }\r\n\r\n          points.sort((a, b) => a.y - b.y);\r\n          const topPoints = points.slice(0, 2).sort((a, b) => a.x - b.x);\r\n          const bottomPoints = points.slice(2, 4).sort((a, b) => a.x - b.x);\r\n\r\n          bestCorners = {\r\n            topLeftCorner: topPoints[0] as DocumentCorners[\"topLeftCorner\"],\r\n            topRightCorner: topPoints[1] as DocumentCorners[\"topRightCorner\"],\r\n            bottomRightCorner:\r\n              bottomPoints[1] as DocumentCorners[\"bottomRightCorner\"],\r\n            bottomLeftCorner:\r\n              bottomPoints[0] as DocumentCorners[\"bottomLeftCorner\"],\r\n          };\r\n          bestArea = area;\r\n        }\r\n\r\n        approx.delete();\r\n      }\r\n      contour.delete();\r\n    }\r\n\r\n    contours.delete();\r\n    hierarchy.delete();\r\n    return bestCorners;\r\n  } catch {\r\n    return null;\r\n  }\r\n}\r\n\r\nexport function scoreCornersQuality(\r\n  corners: DocumentCorners,\r\n  width: number,\r\n  height: number\r\n): number {\r\n  try {\r\n    const {\r\n      topLeftCorner,\r\n      topRightCorner,\r\n      bottomRightCorner,\r\n      bottomLeftCorner,\r\n    } = corners;\r\n\r\n    // Calculate all four side lengths for more accurate measurement\r\n    const topWidth = Math.abs(topRightCorner.x - topLeftCorner.x);\r\n    const bottomWidth = Math.abs(bottomRightCorner.x - bottomLeftCorner.x);\r\n    const leftHeight = Math.abs(bottomLeftCorner.y - topLeftCorner.y);\r\n    const rightHeight = Math.abs(bottomRightCorner.y - topRightCorner.y);\r\n\r\n    // Use average width and height for better accuracy\r\n    const avgWidth = (topWidth + bottomWidth) / 2;\r\n    const avgHeight = (leftHeight + rightHeight) / 2;\r\n    const area = avgWidth * avgHeight;\r\n\r\n    // Calculate how much the shape deviates from a perfect rectangle\r\n    const widthDifference =\r\n      Math.abs(topWidth - bottomWidth) / Math.max(topWidth, bottomWidth);\r\n    const heightDifference =\r\n      Math.abs(leftHeight - rightHeight) / Math.max(leftHeight, rightHeight);\r\n    const rectangularityScore = 1 - (widthDifference + heightDifference) / 2;\r\n\r\n    // Area score (normalized)\r\n    const maxArea = width * height;\r\n    const areaScore = Math.min(area / (maxArea * 0.8), 1);\r\n\r\n    // Aspect ratio score (favor reasonable document proportions)\r\n    const aspectRatio = avgWidth / avgHeight;\r\n    const aspectScore = aspectRatio > 0.3 && aspectRatio < 3 ? 1 : 0.5;\r\n\r\n    // Size validation score (penalize very small or very large detections)\r\n    const minSize = Math.min(width, height) * 0.15; // At least 15% of image\r\n    const maxSize = Math.min(width, height) * 0.95; // At most 95% of image\r\n    const sizeScore =\r\n      avgWidth >= minSize &&\r\n      avgHeight >= minSize &&\r\n      avgWidth <= maxSize &&\r\n      avgHeight <= maxSize\r\n        ? 1\r\n        : 0.3;\r\n\r\n    // Combine all scores with weights\r\n    return (\r\n      areaScore * 0.3 +\r\n      rectangularityScore * 0.4 +\r\n      aspectScore * 0.2 +\r\n      sizeScore * 0.1\r\n    );\r\n  } catch {\r\n    return 0;\r\n  }\r\n}\r\n\r\n// Adjustable corners component\r\n"],"mappings":"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","names":[]}

package/dist/custom/document-scanner/types.js

@@ -0,0 +1 @@
+//# sourceMappingURL=types.js.map

package/dist/custom/document-scanner/types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/custom/document-scanner/utils/perspective-correction.js

@@ -0,0 +1,100 @@
+import cv from "opencv-ts";
+function perspectiveCorrection(imageBase64, corners, videoDimensions, options) {
+  return new Promise((resolve, reject) => {
+    try {
+      const img = new Image();
+      img.onload = () => {
+        try {
+          const canvas = document.createElement("canvas");
+          canvas.width = img.width;
+          canvas.height = img.height;
+          const ctx = canvas.getContext("2d");
+          if (!ctx) {
+            reject(new Error("Failed to get canvas context"));
+            return;
+          }
+          ctx.drawImage(img, 0, 0);
+          const src = cv.imread(canvas);
+          const scaleX = img.width / videoDimensions.width;
+          const scaleY = img.height / videoDimensions.height;
+          const srcPoints = cv.matFromArray(4, 1, cv.CV_32FC2, [
+            corners.topLeftCorner.x * scaleX,
+            corners.topLeftCorner.y * scaleY,
+            corners.topRightCorner.x * scaleX,
+            corners.topRightCorner.y * scaleY,
+            corners.bottomRightCorner.x * scaleX,
+            corners.bottomRightCorner.y * scaleY,
+            corners.bottomLeftCorner.x * scaleX,
+            corners.bottomLeftCorner.y * scaleY
+          ]);
+          const { outputWidth, outputHeight } = calculateOutputDimensions(
+            corners,
+            scaleX,
+            scaleY
+          );
+          const dstPoints = cv.matFromArray(4, 1, cv.CV_32FC2, [
+            0,
+            0,
+            outputWidth,
+            0,
+            outputWidth,
+            outputHeight,
+            0,
+            outputHeight
+          ]);
+          const transformMatrix = cv.getPerspectiveTransform(
+            srcPoints,
+            dstPoints
+          );
+          const dst = new cv.Mat();
+          cv.warpPerspective(
+            src,
+            dst,
+            transformMatrix,
+            new cv.Size(outputWidth, outputHeight)
+          );
+          const outputCanvas = document.createElement("canvas");
+          cv.imshow(outputCanvas, dst);
+          const croppedBase64 = outputCanvas.toDataURL(
+            "image/jpeg",
+            options.imageQuality
+          );
+          cleanupMatrices([src, dst, srcPoints, dstPoints, transformMatrix]);
+          resolve(croppedBase64);
+        } catch (error) {
+          reject(error);
+        }
+      };
+      img.onerror = () => reject(new Error("Failed to load image"));
+      img.src = imageBase64;
+    } catch (error) {
+      reject(error);
+    }
+  });
+}
+function calculateOutputDimensions(corners, scaleX, scaleY) {
+  const distance = (p1, p2) => Math.sqrt(((p2.x - p1.x) * scaleX) ** 2 + ((p2.y - p1.y) * scaleY) ** 2);
+  const topWidth = distance(corners.topLeftCorner, corners.topRightCorner);
+  const bottomWidth = distance(
+    corners.bottomLeftCorner,
+    corners.bottomRightCorner
+  );
+  const leftHeight = distance(corners.topLeftCorner, corners.bottomLeftCorner);
+  const rightHeight = distance(
+    corners.topRightCorner,
+    corners.bottomRightCorner
+  );
+  return {
+    outputWidth: Math.max(topWidth, bottomWidth),
+    outputHeight: Math.max(leftHeight, rightHeight)
+  };
+}
+function cleanupMatrices(matrices) {
+  matrices.forEach((matrix) => {
+    matrix.delete();
+  });
+}
+export {
+  perspectiveCorrection
+};
+//# sourceMappingURL=perspective-correction.js.map

package/dist/custom/document-scanner/utils/perspective-correction.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/custom/document-scanner/utils/perspective-correction.ts"],"sourcesContent":["import cv from \"opencv-ts\";\r\nimport type { Mat } from \"opencv-ts\";\r\nimport { DocumentCorners } from \"../types\";\r\n\r\nexport interface PerspectiveCorrectionOptions {\r\n  imageQuality: number;\r\n}\r\n\r\nexport function perspectiveCorrection(\r\n  imageBase64: string,\r\n  corners: DocumentCorners,\r\n  videoDimensions: { width: number; height: number },\r\n  options: PerspectiveCorrectionOptions\r\n): Promise<string> {\r\n  return new Promise<string>((resolve, reject) => {\r\n    try {\r\n      const img = new Image();\r\n      img.onload = () => {\r\n        try {\r\n          // Create canvas and get image data\r\n          const canvas = document.createElement(\"canvas\");\r\n          canvas.width = img.width;\r\n          canvas.height = img.height;\r\n          const ctx = canvas.getContext(\"2d\");\r\n          if (!ctx) {\r\n            reject(new Error(\"Failed to get canvas context\"));\r\n            return;\r\n          }\r\n          ctx.drawImage(img, 0, 0);\r\n\r\n          // Create OpenCV matrices\r\n          const src = cv.imread(canvas);\r\n\r\n          // Scale corners from video dimensions to actual image dimensions\r\n          const scaleX = img.width / videoDimensions.width;\r\n          const scaleY = img.height / videoDimensions.height;\r\n\r\n          // Source points (detected corners scaled to image size)\r\n          const srcPoints = cv.matFromArray(4, 1, cv.CV_32FC2, [\r\n            corners.topLeftCorner.x * scaleX,\r\n            corners.topLeftCorner.y * scaleY,\r\n            corners.topRightCorner.x * scaleX,\r\n            corners.topRightCorner.y * scaleY,\r\n            corners.bottomRightCorner.x * scaleX,\r\n            corners.bottomRightCorner.y * scaleY,\r\n            corners.bottomLeftCorner.x * scaleX,\r\n            corners.bottomLeftCorner.y * scaleY,\r\n          ]);\r\n\r\n          // Calculate output dimensions\r\n          const { outputWidth, outputHeight } = calculateOutputDimensions(\r\n            corners,\r\n            scaleX,\r\n            scaleY\r\n          );\r\n\r\n          // Destination points (rectangle)\r\n          const dstPoints = cv.matFromArray(4, 1, cv.CV_32FC2, [\r\n            0,\r\n            0,\r\n            outputWidth,\r\n            0,\r\n            outputWidth,\r\n            outputHeight,\r\n            0,\r\n            outputHeight,\r\n          ]);\r\n\r\n          // Get perspective transform matrix\r\n          const transformMatrix = cv.getPerspectiveTransform(\r\n            srcPoints,\r\n            dstPoints\r\n          );\r\n\r\n          // Apply perspective transformation\r\n          const dst = new cv.Mat();\r\n          cv.warpPerspective(\r\n            src,\r\n            dst,\r\n            transformMatrix,\r\n            new cv.Size(outputWidth, outputHeight)\r\n          );\r\n\r\n          // Convert back to canvas and get base64\r\n          const outputCanvas = document.createElement(\"canvas\");\r\n          cv.imshow(outputCanvas, dst);\r\n          const croppedBase64 = outputCanvas.toDataURL(\r\n            \"image/jpeg\",\r\n            options.imageQuality\r\n          );\r\n\r\n          // Cleanup OpenCV matrices\r\n          cleanupMatrices([src, dst, srcPoints, dstPoints, transformMatrix]);\r\n\r\n          resolve(croppedBase64);\r\n        } catch (error) {\r\n          reject(error);\r\n        }\r\n      };\r\n      img.onerror = () => reject(new Error(\"Failed to load image\"));\r\n      img.src = imageBase64;\r\n    } catch (error) {\r\n      reject(error);\r\n    }\r\n  });\r\n}\r\n\r\nfunction calculateOutputDimensions(\r\n  corners: DocumentCorners,\r\n  scaleX: number,\r\n  scaleY: number\r\n): { outputWidth: number; outputHeight: number } {\r\n  const distance = (\r\n    p1: { x: number; y: number },\r\n    p2: { x: number; y: number }\r\n  ) => Math.sqrt(((p2.x - p1.x) * scaleX) ** 2 + ((p2.y - p1.y) * scaleY) ** 2);\r\n\r\n  const topWidth = distance(corners.topLeftCorner, corners.topRightCorner);\r\n  const bottomWidth = distance(\r\n    corners.bottomLeftCorner,\r\n    corners.bottomRightCorner\r\n  );\r\n  const leftHeight = distance(corners.topLeftCorner, corners.bottomLeftCorner);\r\n  const rightHeight = distance(\r\n    corners.topRightCorner,\r\n    corners.bottomRightCorner\r\n  );\r\n\r\n  return {\r\n    outputWidth: Math.max(topWidth, bottomWidth),\r\n    outputHeight: Math.max(leftHeight, rightHeight),\r\n  };\r\n}\r\n\r\nfunction cleanupMatrices(matrices: Mat[]): void {\r\n  matrices.forEach((matrix) => {\r\n    matrix.delete();\r\n  });\r\n}\r\n"],"mappings":"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","names":[]}

package/dist/custom/document-viewer/controllers.js

@@ -0,0 +1,76 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import {
+  DownloadIcon,
+  EyeIcon,
+  EyeOffIcon,
+  SearchIcon,
+  ZoomIn,
+  ZoomOut
+} from "lucide-react";
+import Link from "next/link";
+import { useEffect, useState } from "react";
+import { Button } from "@repo/ayasofyazilim-ui/components/button";
+import {
+  Popover,
+  PopoverContent,
+  PopoverTrigger
+} from "@repo/ayasofyazilim-ui/components/popover";
+import { Input } from "@repo/ayasofyazilim-ui/components/input";
+function Controllers({
+  documentUri,
+  zoom,
+  setZoom,
+  showThumbnail,
+  setShowThumbnail,
+  searchValue,
+  setSearchValue
+}) {
+  const [open, setOpen] = useState(false);
+  useEffect(() => {
+    if (!open) {
+      if (setSearchValue) {
+        setSearchValue("");
+      }
+    }
+  }, [open]);
+  return /* @__PURE__ */ jsxs("div", { className: "absolute top-4 right-6 flex gap-2 z-10 flex-col", children: [
+    setShowThumbnail && /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: "outline",
+        size: "icon",
+        onClick: () => setShowThumbnail(!showThumbnail),
+        children: showThumbnail ? /* @__PURE__ */ jsx(EyeIcon, { className: "size-4" }) : /* @__PURE__ */ jsx(EyeOffIcon, { className: "size-4" })
+      }
+    ),
+    /* @__PURE__ */ jsx(Button, { variant: "outline", size: "icon", onClick: () => setZoom(zoom - 0.1), children: /* @__PURE__ */ jsx(ZoomOut, { className: "size-4" }) }),
+    /* @__PURE__ */ jsx(Button, { variant: "outline", size: "icon", onClick: () => setZoom(zoom + 0.1), children: /* @__PURE__ */ jsx(ZoomIn, { className: "size-4" }) }),
+    /* @__PURE__ */ jsx(Button, { asChild: true, variant: "outline", size: "icon", children: /* @__PURE__ */ jsx(Link, { href: documentUri, download: true, target: "_blank", children: /* @__PURE__ */ jsx(DownloadIcon, { className: "size-4" }) }) }),
+    setSearchValue && /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
+      /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "outline",
+          size: "icon",
+          onClick: () => setOpen(!open),
+          children: /* @__PURE__ */ jsx(SearchIcon, { className: "size-4" })
+        }
+      ) }),
+      /* @__PURE__ */ jsx(PopoverContent, { className: "w-80 p-0", side: "left", children: /* @__PURE__ */ jsx("div", { className: "grid gap-4", children: /* @__PURE__ */ jsx(
+        Input,
+        {
+          id: "search",
+          defaultValue: searchValue,
+          onChange: (e) => {
+            setSearchValue(e.target.value);
+          },
+          className: "col-span-2 h-8"
+        }
+      ) }) })
+    ] })
+  ] });
+}
+export {
+  Controllers
+};
+//# sourceMappingURL=controllers.js.map

package/dist/custom/document-viewer/controllers.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/custom/document-viewer/controllers.tsx"],"sourcesContent":["import {\r\n  DownloadIcon,\r\n  EyeIcon,\r\n  EyeOffIcon,\r\n  SearchIcon,\r\n  ZoomIn,\r\n  ZoomOut,\r\n} from \"lucide-react\";\r\nimport Link from \"next/link\";\r\nimport { useEffect, useState } from \"react\";\r\nimport { Button } from \"@repo/ayasofyazilim-ui/components/button\";\r\nimport {\r\n  Popover,\r\n  PopoverContent,\r\n  PopoverTrigger,\r\n} from \"@repo/ayasofyazilim-ui/components/popover\";\r\nimport { Input } from \"@repo/ayasofyazilim-ui/components/input\";\r\n\r\nexport function Controllers({\r\n  documentUri,\r\n  zoom,\r\n  setZoom,\r\n  showThumbnail,\r\n  setShowThumbnail,\r\n  searchValue,\r\n  setSearchValue,\r\n}: {\r\n  documentUri: string;\r\n  zoom: number;\r\n  setZoom: (zoom: number) => void;\r\n  showThumbnail?: boolean;\r\n  setShowThumbnail?: (show: boolean) => void;\r\n  searchValue?: string;\r\n  setSearchValue?: (value: string) => void;\r\n}) {\r\n  const [open, setOpen] = useState(false);\r\n  useEffect(() => {\r\n    if (!open) {\r\n      if (setSearchValue) {\r\n        setSearchValue(\"\");\r\n      }\r\n    }\r\n  }, [open]);\r\n\r\n  return (\r\n    <div className=\"absolute top-4 right-6 flex gap-2 z-10 flex-col\">\r\n      {setShowThumbnail && (\r\n        <Button\r\n          variant=\"outline\"\r\n          size=\"icon\"\r\n          onClick={() => setShowThumbnail(!showThumbnail)}\r\n        >\r\n          {showThumbnail ? (\r\n            <EyeIcon className=\"size-4\" />\r\n          ) : (\r\n            <EyeOffIcon className=\"size-4\" />\r\n          )}\r\n        </Button>\r\n      )}\r\n      <Button variant=\"outline\" size=\"icon\" onClick={() => setZoom(zoom - 0.1)}>\r\n        <ZoomOut className=\"size-4\" />\r\n      </Button>\r\n      <Button variant=\"outline\" size=\"icon\" onClick={() => setZoom(zoom + 0.1)}>\r\n        <ZoomIn className=\"size-4\" />\r\n      </Button>\r\n      <Button asChild variant=\"outline\" size=\"icon\">\r\n        <Link href={documentUri} download target=\"_blank\">\r\n          <DownloadIcon className=\"size-4\" />\r\n        </Link>\r\n      </Button>\r\n      {setSearchValue && (\r\n        <Popover open={open} onOpenChange={setOpen}>\r\n          <PopoverTrigger asChild>\r\n            <Button\r\n              variant=\"outline\"\r\n              size=\"icon\"\r\n              onClick={() => setOpen(!open)}\r\n            >\r\n              <SearchIcon className=\"size-4\" />\r\n            </Button>\r\n          </PopoverTrigger>\r\n          <PopoverContent className=\"w-80 p-0\" side=\"left\">\r\n            <div className=\"grid gap-4\">\r\n              <Input\r\n                id=\"search\"\r\n                defaultValue={searchValue}\r\n                onChange={(e) => {\r\n                  setSearchValue(e.target.value);\r\n                }}\r\n                className=\"col-span-2 h-8\"\r\n              />\r\n            </div>\r\n          </PopoverContent>\r\n        </Popover>\r\n      )}\r\n    </div>\r\n  );\r\n}\r\n"],"mappings":"AAqDY,cAkBJ,YAlBI;AArDZ;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,OAAO,UAAU;AACjB,SAAS,WAAW,gBAAgB;AACpC,SAAS,cAAc;AACvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,aAAa;AAEf,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAQG;AACD,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,KAAK;AACtC,YAAU,MAAM;AACd,QAAI,CAAC,MAAM;AACT,UAAI,gBAAgB;AAClB,uBAAe,EAAE;AAAA,MACnB;AAAA,IACF;AAAA,EACF,GAAG,CAAC,IAAI,CAAC;AAET,SACE,qBAAC,SAAI,WAAU,mDACZ;AAAA,wBACC;AAAA,MAAC;AAAA;AAAA,QACC,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,SAAS,MAAM,iBAAiB,CAAC,aAAa;AAAA,QAE7C,0BACC,oBAAC,WAAQ,WAAU,UAAS,IAE5B,oBAAC,cAAW,WAAU,UAAS;AAAA;AAAA,IAEnC;AAAA,IAEF,oBAAC,UAAO,SAAQ,WAAU,MAAK,QAAO,SAAS,MAAM,QAAQ,OAAO,GAAG,GACrE,8BAAC,WAAQ,WAAU,UAAS,GAC9B;AAAA,IACA,oBAAC,UAAO,SAAQ,WAAU,MAAK,QAAO,SAAS,MAAM,QAAQ,OAAO,GAAG,GACrE,8BAAC,UAAO,WAAU,UAAS,GAC7B;AAAA,IACA,oBAAC,UAAO,SAAO,MAAC,SAAQ,WAAU,MAAK,QACrC,8BAAC,QAAK,MAAM,aAAa,UAAQ,MAAC,QAAO,UACvC,8BAAC,gBAAa,WAAU,UAAS,GACnC,GACF;AAAA,IACC,kBACC,qBAAC,WAAQ,MAAY,cAAc,SACjC;AAAA,0BAAC,kBAAe,SAAO,MACrB;AAAA,QAAC;AAAA;AAAA,UACC,SAAQ;AAAA,UACR,MAAK;AAAA,UACL,SAAS,MAAM,QAAQ,CAAC,IAAI;AAAA,UAE5B,8BAAC,cAAW,WAAU,UAAS;AAAA;AAAA,MACjC,GACF;AAAA,MACA,oBAAC,kBAAe,WAAU,YAAW,MAAK,QACxC,8BAAC,SAAI,WAAU,cACb;AAAA,QAAC;AAAA;AAAA,UACC,IAAG;AAAA,UACH,cAAc;AAAA,UACd,UAAU,CAAC,MAAM;AACf,2BAAe,EAAE,OAAO,KAAK;AAAA,UAC/B;AAAA,UACA,WAAU;AAAA;AAAA,MACZ,GACF,GACF;AAAA,OACF;AAAA,KAEJ;AAEJ;","names":[]}

package/dist/custom/document-viewer/index.js

@@ -0,0 +1,36 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { cn } from "@repo/ayasofyazilim-ui/lib/utils";
+import DocViewer, { DocViewerRenderers } from "react-doc-viewer";
+import CustomImageRenderer from "./renderers/image";
+import CustomPDFRenderer from "./renderers/pdf";
+export * from "react-doc-viewer";
+function DocumentViewer({
+  document,
+  className,
+  renderers = []
+}) {
+  return /* @__PURE__ */ jsx(
+    DocViewer,
+    {
+      config: {
+        header: {
+          disableHeader: true,
+          disableFileName: true
+        }
+      },
+      className: cn("h-full rounded-md border relative", className),
+      pluginRenderers: [
+        ...DocViewerRenderers,
+        CustomPDFRenderer,
+        CustomImageRenderer,
+        ...renderers
+      ],
+      documents: [document]
+    }
+  );
+}
+export {
+  DocumentViewer as default
+};
+//# sourceMappingURL=index.js.map

package/dist/custom/document-viewer/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/custom/document-viewer/index.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { cn } from \"@repo/ayasofyazilim-ui/lib/utils\";\r\nimport DocViewer, { DocRenderer, DocViewerRenderers } from \"react-doc-viewer\";\r\nimport CustomImageRenderer from \"./renderers/image\";\r\nimport CustomPDFRenderer from \"./renderers/pdf\";\r\n\r\nexport * from \"react-doc-viewer\";\r\n\r\nexport type DocumentType = {\r\n  uri: string;\r\n  fileType?: string;\r\n  fileName?: string;\r\n  fileData?: string | ArrayBuffer;\r\n};\r\nexport default function DocumentViewer({\r\n  document,\r\n  className,\r\n  renderers = [],\r\n}: {\r\n  document: DocumentType;\r\n  className?: string;\r\n  renderers?: DocRenderer[];\r\n}) {\r\n  return (\r\n    <DocViewer\r\n      config={{\r\n        header: {\r\n          disableHeader: true,\r\n          disableFileName: true,\r\n        },\r\n      }}\r\n      className={cn(\"h-full rounded-md border relative\", className)}\r\n      pluginRenderers={[\r\n        ...DocViewerRenderers,\r\n        CustomPDFRenderer,\r\n        CustomImageRenderer,\r\n        ...renderers,\r\n      ]}\r\n      documents={[document]}\r\n    />\r\n  );\r\n}\r\n"],"mappings":";AAyBI;AAvBJ,SAAS,UAAU;AACnB,OAAO,aAA0B,0BAA0B;AAC3D,OAAO,yBAAyB;AAChC,OAAO,uBAAuB;AAE9B,cAAc;AAQC,SAAR,eAAgC;AAAA,EACrC;AAAA,EACA;AAAA,EACA,YAAY,CAAC;AACf,GAIG;AACD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,QAAQ;AAAA,QACN,QAAQ;AAAA,UACN,eAAe;AAAA,UACf,iBAAiB;AAAA,QACnB;AAAA,MACF;AAAA,MACA,WAAW,GAAG,qCAAqC,SAAS;AAAA,MAC5D,iBAAiB;AAAA,QACf,GAAG;AAAA,QACH;AAAA,QACA;AAAA,QACA,GAAG;AAAA,MACL;AAAA,MACA,WAAW,CAAC,QAAQ;AAAA;AAAA,EACtB;AAEJ;","names":[]}

package/dist/custom/document-viewer/renderers/image.js

@@ -0,0 +1,40 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { Controllers } from "../controllers";
+import ImageCanvas from "../../image-canvas";
+const CustomImageRenderer = (props) => {
+  const { mainState } = props;
+  const { currentDocument } = mainState;
+  if (!currentDocument) return null;
+  const [zoom, setZoom] = useState(1);
+  return /* @__PURE__ */ jsxs("div", { className: "flex w-full items-center justify-center p-4", children: [
+    /* @__PURE__ */ jsx(
+      Controllers,
+      {
+        documentUri: currentDocument.uri,
+        zoom,
+        setZoom
+      }
+    ),
+    /* @__PURE__ */ jsx("div", { className: "relative size-full flex items-center justify-center", children: /* @__PURE__ */ jsx(
+      ImageCanvas,
+      {
+        classNames: {
+          canvas: "border rounded-md"
+        },
+        imageUrl: currentDocument.uri,
+        zoom,
+        minZoom: 0.5,
+        maxZoom: 2,
+        onZoomChange: setZoom
+      }
+    ) })
+  ] });
+};
+CustomImageRenderer.fileTypes = ["image/jpeg", "image/png", "image/gif"];
+CustomImageRenderer.weight = 1;
+var image_default = CustomImageRenderer;
+export {
+  image_default as default
+};
+//# sourceMappingURL=image.js.map

package/dist/custom/document-viewer/renderers/image.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/custom/document-viewer/renderers/image.tsx"],"sourcesContent":["import { useState } from \"react\";\r\nimport { DocRendererProps } from \"react-doc-viewer\";\r\nimport { Controllers } from \"../controllers\";\r\nimport ImageCanvas from \"../../image-canvas\";\r\n\r\nconst CustomImageRenderer = (props: DocRendererProps) => {\r\n  const { mainState } = props;\r\n  const { currentDocument } = mainState;\r\n  if (!currentDocument) return null;\r\n  const [zoom, setZoom] = useState(1);\r\n  return (\r\n    <div className=\"flex w-full items-center justify-center p-4\">\r\n      <Controllers\r\n        documentUri={currentDocument.uri}\r\n        zoom={zoom}\r\n        setZoom={setZoom}\r\n      />\r\n      <div className=\"relative size-full flex items-center justify-center\">\r\n        <ImageCanvas\r\n          classNames={{\r\n            canvas: \"border rounded-md\",\r\n          }}\r\n          imageUrl={currentDocument.uri}\r\n          zoom={zoom}\r\n          minZoom={0.5}\r\n          maxZoom={2}\r\n          onZoomChange={setZoom}\r\n        />\r\n      </div>\r\n    </div>\r\n  );\r\n};\r\n\r\nCustomImageRenderer.fileTypes = [\"image/jpeg\", \"image/png\", \"image/gif\"];\r\nCustomImageRenderer.weight = 1;\r\n\r\nexport default CustomImageRenderer;\r\n"],"mappings":"AAWI,SACE,KADF;AAXJ,SAAS,gBAAgB;AAEzB,SAAS,mBAAmB;AAC5B,OAAO,iBAAiB;AAExB,MAAM,sBAAsB,CAAC,UAA4B;AACvD,QAAM,EAAE,UAAU,IAAI;AACtB,QAAM,EAAE,gBAAgB,IAAI;AAC5B,MAAI,CAAC,gBAAiB,QAAO;AAC7B,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,CAAC;AAClC,SACE,qBAAC,SAAI,WAAU,+CACb;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,aAAa,gBAAgB;AAAA,QAC7B;AAAA,QACA;AAAA;AAAA,IACF;AAAA,IACA,oBAAC,SAAI,WAAU,uDACb;AAAA,MAAC;AAAA;AAAA,QACC,YAAY;AAAA,UACV,QAAQ;AAAA,QACV;AAAA,QACA,UAAU,gBAAgB;AAAA,QAC1B;AAAA,QACA,SAAS;AAAA,QACT,SAAS;AAAA,QACT,cAAc;AAAA;AAAA,IAChB,GACF;AAAA,KACF;AAEJ;AAEA,oBAAoB,YAAY,CAAC,cAAc,aAAa,WAAW;AACvE,oBAAoB,SAAS;AAE7B,IAAO,gBAAQ;","names":[]}

package/dist/custom/document-viewer/renderers/index.js

@@ -0,0 +1,3 @@
+export * from "./pdf";
+export * from "./image";
+//# sourceMappingURL=index.js.map

package/dist/custom/document-viewer/renderers/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/custom/document-viewer/renderers/index.tsx"],"sourcesContent":["export * from \"./pdf\";\r\nexport * from \"./image\";\r\n"],"mappings":"AAAA,cAAc;AACd,cAAc;","names":[]}

package/dist/custom/document-viewer/renderers/pdf.js

@@ -0,0 +1,95 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useMemo, useState } from "react";
+import { Document, Page, pdfjs, Thumbnail } from "react-pdf";
+import { cn } from "@repo/ayasofyazilim-ui/lib/utils";
+import "react-pdf/dist/Page/AnnotationLayer.css";
+import "react-pdf/dist/Page/TextLayer.css";
+import { Controllers } from "../controllers";
+pdfjs.GlobalWorkerOptions.workerSrc = `https://cdn.jsdelivr.net/npm/pdfjs-dist@${pdfjs.version}/build/pdf.worker.min.mjs`;
+const CustomPDFRenderer = (props) => {
+  const { mainState } = props;
+  const { currentDocument } = mainState;
+  const [zoom, setZoom] = useState(1);
+  const [showThumbnail, setShowThumbnail] = useState(false);
+  const [pageCount, setPageCount] = useState(0);
+  const [activePage, setActivePage] = useState(1);
+  const [searchValue, setSearchValue] = useState();
+  if (!currentDocument) return null;
+  return /* @__PURE__ */ jsxs(
+    Document,
+    {
+      className: cn("p-4 w-full flex"),
+      file: currentDocument.uri,
+      renderMode: "canvas",
+      onLoadSuccess: ({ numPages }) => {
+        setPageCount(numPages);
+      },
+      children: [
+        /* @__PURE__ */ jsx(
+          Controllers,
+          {
+            documentUri: currentDocument.uri,
+            zoom,
+            setZoom,
+            showThumbnail,
+            setShowThumbnail,
+            searchValue,
+            setSearchValue
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "flex gap-2 w-full justify-center", children: [
+          showThumbnail && /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2 left-4 absolute top-4 z-10 w-full max-w-[110px]", children: Array.from(new Array(pageCount), (el, index) => /* @__PURE__ */ jsx(
+            Thumbnail,
+            {
+              onClick: () => {
+                setActivePage(index + 1);
+              },
+              className: cn(
+                "rounded-md border bg-white p-1 flex justify-center",
+                activePage === index + 1 && "border-primary"
+              ),
+              pageNumber: index + 1,
+              width: 100,
+              height: 100
+            },
+            "page_" + index
+          )) }),
+          /* @__PURE__ */ jsx("div", { className: cn("flex flex-col", showThumbnail && ""), children: Array.from(new Array(pageCount), (el, index) => /* @__PURE__ */ jsx(
+            Page,
+            {
+              customTextRenderer: ({ str }) => searchValue ? str.replace(
+                new RegExp(searchValue, "gi"),
+                (value) => `<mark>${value}</mark>`
+              ) : str,
+              className: "border shadow-sm max-w-max overflow-hidden rounded-md mb-2",
+              pageNumber: index + 1,
+              scale: zoom
+            },
+            `page_${index + 1}`
+          )) })
+        ] })
+      ]
+    }
+  );
+};
+CustomPDFRenderer.fileTypes = ["pdf", "application/pdf"];
+CustomPDFRenderer.weight = 1;
+var pdf_default = CustomPDFRenderer;
+const ExtendCustomPDFRenderer = ({
+  searchValue
+}) => {
+  const Renderer = useMemo(() => {
+    function RendererComponent(props) {
+      return /* @__PURE__ */ jsx(CustomPDFRenderer, { ...props });
+    }
+    RendererComponent.fileTypes = ["pdf", "application/pdf"];
+    RendererComponent.weight = 1;
+    return RendererComponent;
+  }, [searchValue]);
+  return Renderer;
+};
+export {
+  ExtendCustomPDFRenderer,
+  pdf_default as default
+};
+//# sourceMappingURL=pdf.js.map

package/dist/custom/document-viewer/renderers/pdf.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/custom/document-viewer/renderers/pdf.tsx"],"sourcesContent":["import { useMemo, useState } from \"react\";\r\nimport { DocRenderer, DocRendererProps } from \"react-doc-viewer\";\r\nimport { Document, Page, pdfjs, Thumbnail } from \"react-pdf\";\r\nimport { cn } from \"@repo/ayasofyazilim-ui/lib/utils\";\r\nimport \"react-pdf/dist/Page/AnnotationLayer.css\";\r\nimport \"react-pdf/dist/Page/TextLayer.css\";\r\nimport { Controllers } from \"../controllers\";\r\n\r\npdfjs.GlobalWorkerOptions.workerSrc = `https://cdn.jsdelivr.net/npm/pdfjs-dist@${pdfjs.version}/build/pdf.worker.min.mjs`;\r\n\r\ntype CustomDocRendererProps = {} & DocRendererProps;\r\n\r\nconst CustomPDFRenderer = (props: CustomDocRendererProps) => {\r\n  const { mainState } = props;\r\n  const { currentDocument } = mainState;\r\n  const [zoom, setZoom] = useState(1);\r\n  const [showThumbnail, setShowThumbnail] = useState(false);\r\n  const [pageCount, setPageCount] = useState(0);\r\n  const [activePage, setActivePage] = useState(1);\r\n  const [searchValue, setSearchValue] = useState<string>();\r\n\r\n  if (!currentDocument) return null;\r\n  return (\r\n    <Document\r\n      className={cn(\"p-4 w-full flex\")}\r\n      file={currentDocument.uri}\r\n      renderMode=\"canvas\"\r\n      onLoadSuccess={({ numPages }) => {\r\n        setPageCount(numPages);\r\n      }}\r\n    >\r\n      <Controllers\r\n        documentUri={currentDocument.uri}\r\n        zoom={zoom}\r\n        setZoom={setZoom}\r\n        showThumbnail={showThumbnail}\r\n        setShowThumbnail={setShowThumbnail}\r\n        searchValue={searchValue}\r\n        setSearchValue={setSearchValue}\r\n      />\r\n\r\n      <div className=\"flex gap-2 w-full justify-center\">\r\n        {showThumbnail && (\r\n          <div className=\"flex flex-col gap-2 left-4 absolute top-4 z-10 w-full max-w-[110px]\">\r\n            {Array.from(new Array(pageCount), (el, index) => (\r\n              <Thumbnail\r\n                key={\"page_\" + index}\r\n                onClick={() => {\r\n                  setActivePage(index + 1);\r\n                }}\r\n                className={cn(\r\n                  \"rounded-md border bg-white p-1 flex justify-center\",\r\n                  activePage === index + 1 && \"border-primary\"\r\n                )}\r\n                pageNumber={index + 1}\r\n                width={100}\r\n                height={100}\r\n              />\r\n            ))}\r\n          </div>\r\n        )}\r\n        <div className={cn(\"flex flex-col\", showThumbnail && \"\")}>\r\n          {Array.from(new Array(pageCount), (el, index) => (\r\n            <Page\r\n              customTextRenderer={({ str }) =>\r\n                searchValue\r\n                  ? str.replace(\r\n                      new RegExp(searchValue, \"gi\"),\r\n                      (value) => `<mark>${value}</mark>`\r\n                    )\r\n                  : str\r\n              }\r\n              className=\"border shadow-sm max-w-max overflow-hidden rounded-md mb-2\"\r\n              key={`page_${index + 1}`}\r\n              pageNumber={index + 1}\r\n              scale={zoom}\r\n            />\r\n          ))}\r\n        </div>\r\n      </div>\r\n    </Document>\r\n  );\r\n};\r\n\r\nCustomPDFRenderer.fileTypes = [\"pdf\", \"application/pdf\"];\r\nCustomPDFRenderer.weight = 1;\r\n\r\nexport default CustomPDFRenderer;\r\n\r\nexport const ExtendCustomPDFRenderer = ({\r\n  searchValue,\r\n}: {\r\n  searchValue?: string;\r\n}): DocRenderer => {\r\n  const Renderer = useMemo(() => {\r\n    function RendererComponent(props: DocRendererProps) {\r\n      return <CustomPDFRenderer {...props} />;\r\n    }\r\n    RendererComponent.fileTypes = [\"pdf\", \"application/pdf\"];\r\n    RendererComponent.weight = 1;\r\n    return RendererComponent;\r\n  }, [searchValue]);\r\n\r\n  return Renderer;\r\n};\r\n"],"mappings":"AA+BM,cAUA,YAVA;AA/BN,SAAS,SAAS,gBAAgB;AAElC,SAAS,UAAU,MAAM,OAAO,iBAAiB;AACjD,SAAS,UAAU;AACnB,OAAO;AACP,OAAO;AACP,SAAS,mBAAmB;AAE5B,MAAM,oBAAoB,YAAY,2CAA2C,MAAM,OAAO;AAI9F,MAAM,oBAAoB,CAAC,UAAkC;AAC3D,QAAM,EAAE,UAAU,IAAI;AACtB,QAAM,EAAE,gBAAgB,IAAI;AAC5B,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,CAAC;AAClC,QAAM,CAAC,eAAe,gBAAgB,IAAI,SAAS,KAAK;AACxD,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,CAAC;AAC5C,QAAM,CAAC,YAAY,aAAa,IAAI,SAAS,CAAC;AAC9C,QAAM,CAAC,aAAa,cAAc,IAAI,SAAiB;AAEvD,MAAI,CAAC,gBAAiB,QAAO;AAC7B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,GAAG,iBAAiB;AAAA,MAC/B,MAAM,gBAAgB;AAAA,MACtB,YAAW;AAAA,MACX,eAAe,CAAC,EAAE,SAAS,MAAM;AAC/B,qBAAa,QAAQ;AAAA,MACvB;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,aAAa,gBAAgB;AAAA,YAC7B;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA;AAAA,QACF;AAAA,QAEA,qBAAC,SAAI,WAAU,oCACZ;AAAA,2BACC,oBAAC,SAAI,WAAU,uEACZ,gBAAM,KAAK,IAAI,MAAM,SAAS,GAAG,CAAC,IAAI,UACrC;AAAA,YAAC;AAAA;AAAA,cAEC,SAAS,MAAM;AACb,8BAAc,QAAQ,CAAC;AAAA,cACzB;AAAA,cACA,WAAW;AAAA,gBACT;AAAA,gBACA,eAAe,QAAQ,KAAK;AAAA,cAC9B;AAAA,cACA,YAAY,QAAQ;AAAA,cACpB,OAAO;AAAA,cACP,QAAQ;AAAA;AAAA,YAVH,UAAU;AAAA,UAWjB,CACD,GACH;AAAA,UAEF,oBAAC,SAAI,WAAW,GAAG,iBAAiB,iBAAiB,EAAE,GACpD,gBAAM,KAAK,IAAI,MAAM,SAAS,GAAG,CAAC,IAAI,UACrC;AAAA,YAAC;AAAA;AAAA,cACC,oBAAoB,CAAC,EAAE,IAAI,MACzB,cACI,IAAI;AAAA,gBACF,IAAI,OAAO,aAAa,IAAI;AAAA,gBAC5B,CAAC,UAAU,SAAS,KAAK;AAAA,cAC3B,IACA;AAAA,cAEN,WAAU;AAAA,cAEV,YAAY,QAAQ;AAAA,cACpB,OAAO;AAAA;AAAA,YAFF,QAAQ,QAAQ,CAAC;AAAA,UAGxB,CACD,GACH;AAAA,WACF;AAAA;AAAA;AAAA,EACF;AAEJ;AAEA,kBAAkB,YAAY,CAAC,OAAO,iBAAiB;AACvD,kBAAkB,SAAS;AAE3B,IAAO,cAAQ;AAER,MAAM,0BAA0B,CAAC;AAAA,EACtC;AACF,MAEmB;AACjB,QAAM,WAAW,QAAQ,MAAM;AAC7B,aAAS,kBAAkB,OAAyB;AAClD,aAAO,oBAAC,qBAAmB,GAAG,OAAO;AAAA,IACvC;AACA,sBAAkB,YAAY,CAAC,OAAO,iBAAiB;AACvD,sBAAkB,SAAS;AAC3B,WAAO;AAAA,EACT,GAAG,CAAC,WAAW,CAAC;AAEhB,SAAO;AACT;","names":[]}

package/dist/custom/email-input/email.js

@@ -0,0 +1,184 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "@repo/ayasofyazilim-ui/lib/utils";
+import { Input } from "@repo/ayasofyazilim-ui/components/input";
+import { Label } from "@repo/ayasofyazilim-ui/components/label";
+import { Button } from "@repo/ayasofyazilim-ui/components/button";
+import domains from "./domains.json";
+const EmailInput = React.forwardRef(
+  ({
+    id,
+    className,
+    label,
+    suggestions = [],
+    onValueChange,
+    disabled,
+    required,
+    ...props
+  }, ref) => {
+    const allSuggestions = React.useMemo(() => {
+      const combined = [...domains, ...suggestions];
+      return combined.filter((item, index) => combined.indexOf(item) === index);
+    }, [suggestions]);
+    const [value, setValue] = React.useState(props.value?.toString() || "");
+    const [open, setOpen] = React.useState(false);
+    const [filteredSuggestions, setFilteredSuggestions] = React.useState([]);
+    const [selectedIndex, setSelectedIndex] = React.useState(-1);
+    const inputRef = React.useRef(null);
+    const containerRef = React.useRef(null);
+    React.useImperativeHandle(ref, () => inputRef.current);
+    const updateSuggestions = React.useCallback(
+      (inputValue) => {
+        const atIndex = inputValue.lastIndexOf("@");
+        if (atIndex === -1) {
+          setOpen(false);
+          setFilteredSuggestions([]);
+          setSelectedIndex(-1);
+          return;
+        }
+        const beforeAt = inputValue.substring(0, atIndex + 1);
+        const afterAt = inputValue.substring(atIndex + 1);
+        if (afterAt.length === 0) {
+          const topSuggestions = allSuggestions.slice(0, 5).map((domain) => beforeAt + domain);
+          setFilteredSuggestions(topSuggestions);
+          setOpen(true);
+          setSelectedIndex(-1);
+        } else {
+          const filtered = allSuggestions.filter(
+            (domain) => domain.toLowerCase().startsWith(afterAt.toLowerCase())
+          ).map((domain) => beforeAt + domain);
+          if (filtered.length > 0) {
+            setFilteredSuggestions(filtered);
+            setOpen(true);
+            setSelectedIndex(-1);
+          } else {
+            setOpen(false);
+            setFilteredSuggestions([]);
+            setSelectedIndex(-1);
+          }
+        }
+      },
+      [allSuggestions]
+    );
+    const handleInputChange = (e) => {
+      const newValue = e.target.value;
+      setValue(newValue);
+      onValueChange?.(newValue);
+      updateSuggestions(newValue);
+    };
+    const applySuggestion = (suggestion) => {
+      setValue(suggestion);
+      onValueChange?.(suggestion);
+      setOpen(false);
+      setSelectedIndex(-1);
+      inputRef.current?.focus();
+    };
+    const handleKeyDown = (e) => {
+      if (!open || filteredSuggestions.length === 0) {
+        if (e.key === "Escape") {
+          setOpen(false);
+        }
+        return;
+      }
+      switch (e.key) {
+        case "ArrowDown":
+          e.preventDefault();
+          setSelectedIndex(
+            (prev) => prev < filteredSuggestions.length - 1 ? prev + 1 : 0
+          );
+          break;
+        case "ArrowUp":
+          e.preventDefault();
+          setSelectedIndex(
+            (prev) => prev > 0 ? prev - 1 : filteredSuggestions.length - 1
+          );
+          break;
+        case "Enter":
+          e.preventDefault();
+          if (selectedIndex >= 0 && selectedIndex < filteredSuggestions.length) {
+            applySuggestion(filteredSuggestions?.[selectedIndex] || "");
+          }
+          break;
+        case "Escape":
+          setOpen(false);
+          setSelectedIndex(-1);
+          break;
+        default:
+          setOpen(false);
+          break;
+      }
+    };
+    React.useEffect(() => {
+      const handleClickOutside = (event) => {
+        if (containerRef.current && !containerRef.current.contains(event.target)) {
+          setOpen(false);
+          setSelectedIndex(-1);
+        }
+      };
+      document.addEventListener("mousedown", handleClickOutside);
+      return () => document.removeEventListener("mousedown", handleClickOutside);
+    }, []);
+    React.useEffect(() => {
+      if (props.value !== void 0) {
+        setValue(props.value.toString());
+      }
+    }, [props.value]);
+    return /* @__PURE__ */ jsxs("div", { className: "w-full", ref: containerRef, children: [
+      label && /* @__PURE__ */ jsx(
+        Label,
+        {
+          className: cn(
+            "mb-2 block",
+            required && "after:content-['*'] after:ml-0.5 after:text-destructive"
+          ),
+          children: label
+        }
+      ),
+      /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            type: "email",
+            id,
+            "data-testid": id,
+            className,
+            ref: inputRef,
+            value,
+            onChange: handleInputChange,
+            onKeyDown: handleKeyDown,
+            disabled,
+            required,
+            ...props
+          }
+        ),
+        open && filteredSuggestions.length > 0 && /* @__PURE__ */ jsx("div", { className: "absolute top-full left-0 right-0 z-999 mt-1 bg-popover border border-border rounded-md shadow-md", children: /* @__PURE__ */ jsx("div", { className: "p-1 flex flex-col", children: filteredSuggestions.map((suggestion, index) => /* @__PURE__ */ jsxs(
+          Button,
+          {
+            variant: "ghost",
+            "data-testid": `${id}_suggestion_${index}`,
+            className: cn(
+              "w-full justify-start text-left px-2 py-1.5 text-sm cursor-pointer rounded-sm transition-colors gap-0",
+              "hover:bg-accent hover:text-accent-foreground",
+              index === selectedIndex && "bg-accent text-accent-foreground"
+            ),
+            onClick: () => applySuggestion(suggestion),
+            children: [
+              /* @__PURE__ */ jsx("span", { children: suggestion.split("@")[0] }),
+              /* @__PURE__ */ jsxs("span", { className: "text-primary font-semibold", children: [
+                "@",
+                suggestion.split("@")[1]
+              ] })
+            ]
+          },
+          suggestion
+        )) }) })
+      ] })
+    ] });
+  }
+);
+EmailInput.displayName = "EmailInput";
+export {
+  EmailInput
+};
+//# sourceMappingURL=email.js.map