@mari-ui/components 0.0.0-stage → 0.1.1

package/dist/chunk-NPM7IDYV.js

@@ -0,0 +1,145 @@
+import {
+  getShapeClasses,
+  getSizeStyle
+} from "./chunk-XUKVQO6M.js";
+import {
+  skeletonFill
+} from "./chunk-54HHEXXD.js";
+
+// src/skeleton/Skeleton.tsx
+import { cn as cn2 } from "@mari-ui/core";
+
+// src/skeleton/utils.ts
+import { cn } from "@mari-ui/core";
+var CONTROL_BOX_CLASS = {
+  sm: "h-6 rounded-sm",
+  md: "h-8 rounded-md",
+  lg: "h-10 rounded-md"
+};
+var INPUT_SIZE_CLASS = {
+  sm: cn(CONTROL_BOX_CLASS.sm, "w-full"),
+  md: cn(CONTROL_BOX_CLASS.md, "w-full"),
+  lg: cn(CONTROL_BOX_CLASS.lg, "w-full")
+};
+var BUTTON_WIDTH_CLASS = { sm: "w-16", md: "w-20", lg: "w-24" };
+var CIRCLE_SIZE_CLASS = { sm: "size-6", md: "size-8", lg: "size-10" };
+function getButtonSkeletonClass(size, shape, block) {
+  if (shape === "circle") return cn(CIRCLE_SIZE_CLASS[size], "rounded-full");
+  return cn(
+    CONTROL_BOX_CLASS[size],
+    block ? "w-full" : BUTTON_WIDTH_CLASS[size],
+    (shape === "pill" || shape === "round") && "rounded-full",
+    shape === "square" && "rounded-none"
+  );
+}
+function widthToStyle(width) {
+  if (width === void 0) return void 0;
+  return { width: typeof width === "number" ? `${width}px` : width };
+}
+function getLineClass(round, extra, active) {
+  return cn(skeletonFill(active), round ? "rounded-full" : "rounded-md", extra);
+}
+
+// src/skeleton/Skeleton.tsx
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function resolveParagraphWidths(width, rows) {
+  if (Array.isArray(width)) return width;
+  if (width !== void 0) return [...Array(rows - 1).fill(void 0), width];
+  return [];
+}
+function resolveFallbackWidthClass(explicitWidth, isLastRow) {
+  if (explicitWidth !== void 0) return void 0;
+  return isLastRow ? "w-3/5" : "w-full";
+}
+function Skeleton({
+  active = false,
+  label,
+  avatar = false,
+  loading,
+  paragraph = true,
+  round = false,
+  title = true,
+  className,
+  children
+}) {
+  if (loading === false) return /* @__PURE__ */ jsx(Fragment, { children });
+  const avatarProps = typeof avatar === "boolean" ? {} : avatar;
+  const titleProps = typeof title === "boolean" ? {} : title;
+  const paragraphProps = typeof paragraph === "boolean" ? {} : paragraph;
+  const rows = paragraphProps.rows ?? 3;
+  const paragraphWidths = resolveParagraphWidths(paragraphProps.width, rows);
+  const avatarSize = avatarProps.size ?? "md";
+  return (
+    // Faz 13.6: eskiden `animate-pulse` `active`ten bağımsız HER ZAMAN vardı.
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className,
+        ...label ? { role: "status", "aria-label": label, "aria-busy": true } : { "aria-hidden": true },
+        children: /* @__PURE__ */ jsxs("div", { className: "flex gap-4", children: [
+          avatar && /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: cn2(getShapeClasses(avatarProps.shape ?? "circle", avatarSize), skeletonFill(avatarProps.active ?? active)),
+              style: getSizeStyle(avatarSize)
+            }
+          ),
+          /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+            title && /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: getLineClass(round, cn2("h-4", titleProps.width === void 0 && "w-2/5"), active),
+                style: widthToStyle(titleProps.width)
+              }
+            ),
+            paragraph && /* @__PURE__ */ jsx("div", { className: cn2("space-y-2.5", title && "mt-4"), children: Array.from({ length: rows }).map((_, i) => {
+              const explicitWidth = paragraphWidths[i];
+              const fallbackWidthClass = resolveFallbackWidthClass(explicitWidth, i === rows - 1);
+              return /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: getLineClass(round, cn2("h-3", fallbackWidthClass), active),
+                  style: widthToStyle(explicitWidth)
+                },
+                i
+              );
+            }) })
+          ] })
+        ] })
+      }
+    )
+  );
+}
+function SkeletonBlock({ width, height = "1rem", radius = "md", active = false, className }) {
+  const radiusClass = { none: "rounded-none", sm: "rounded-sm", md: "rounded-md", lg: "rounded-lg", xl: "rounded-xl", full: "rounded-full" }[radius];
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "aria-hidden": true,
+      className: cn2("shrink-0", skeletonFill(active), radiusClass, width === void 0 && "w-full", className),
+      style: { width: typeof width === "number" ? `${width}px` : width, height: typeof height === "number" ? `${height}px` : height }
+    }
+  );
+}
+
+// src/skeleton/SkeletonButton.tsx
+import { cn as cn3 } from "@mari-ui/core";
+import { jsx as jsx2 } from "react/jsx-runtime";
+function SkeletonButton({ active = false, block = false, shape = "default", size = "md", className }) {
+  return /* @__PURE__ */ jsx2("div", { "aria-hidden": true, className: cn3(skeletonFill(active), getButtonSkeletonClass(size, shape, block), className) });
+}
+
+// src/skeleton/SkeletonInput.tsx
+import { cn as cn4 } from "@mari-ui/core";
+import { jsx as jsx3 } from "react/jsx-runtime";
+function SkeletonInput({ active = false, size = "md", className }) {
+  return /* @__PURE__ */ jsx3("div", { "aria-hidden": true, className: cn4(skeletonFill(active), INPUT_SIZE_CLASS[size], className) });
+}
+
+export {
+  Skeleton,
+  SkeletonBlock,
+  SkeletonButton,
+  SkeletonInput
+};
+//# sourceMappingURL=chunk-NPM7IDYV.js.map

package/dist/chunk-NPM7IDYV.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/skeleton/Skeleton.tsx","../src/skeleton/utils.ts","../src/skeleton/SkeletonButton.tsx","../src/skeleton/SkeletonInput.tsx"],"sourcesContent":["import React from \"react\";\nimport { cn } from \"@mari-ui/core\";\nimport type { SkeletonAvatarProps, SkeletonBlockProps, SkeletonParagraphProps, SkeletonProps, SkeletonTitleProps } from \"./types\";\nimport { getAvatarShapeClasses, getAvatarSizeStyle, getLineClass, skeletonFill, widthToStyle } from \"./utils\";\n\nexport type { SkeletonProps };\n\n/** İç içe ternary yerine ayrık fonksiyon (Faz 8, SonarJS `no-nested-conditional`). */\nfunction resolveParagraphWidths(width: SkeletonParagraphProps[\"width\"], rows: number): (string | number | undefined)[] {\n  if (Array.isArray(width)) return width;\n  if (width !== undefined) return [...Array(rows - 1).fill(undefined), width];\n  return [];\n}\n\n/** İç içe ternary yerine ayrık fonksiyon (Faz 8, SonarJS `no-nested-conditional`). */\nfunction resolveFallbackWidthClass(explicitWidth: string | number | undefined, isLastRow: boolean): string | undefined {\n  if (explicitWidth !== undefined) return undefined;\n  return isLastRow ? \"w-3/5\" : \"w-full\";\n}\n\n// Hook yok, browser API yok — saf sunum, \"use client\" gerekmiyor.\nexport function Skeleton({\n  active = false,\n  label,\n  avatar = false,\n  loading,\n  paragraph = true,\n  round = false,\n  title = true,\n  className,\n  children,\n}: Readonly<SkeletonProps>) {\n  if (loading === false) return <>{children}</>;\n\n  const avatarProps: SkeletonAvatarProps = typeof avatar === \"boolean\" ? {} : avatar;\n  const titleProps: SkeletonTitleProps = typeof title === \"boolean\" ? {} : title;\n  const paragraphProps: SkeletonParagraphProps = typeof paragraph === \"boolean\" ? {} : paragraph;\n\n  const rows = paragraphProps.rows ?? 3;\n  const paragraphWidths = resolveParagraphWidths(paragraphProps.width, rows);\n\n  const avatarSize = avatarProps.size ?? \"md\";\n\n  return (\n    // Faz 13.6: eskiden `animate-pulse` `active`ten bağımsız HER ZAMAN vardı.\n    <div\n      className={className}\n      {...(label ? { role: \"status\", \"aria-label\": label, \"aria-busy\": true } : { \"aria-hidden\": true })}\n    >\n      <div className=\"flex gap-4\">\n        {avatar && (\n          <div\n            className={cn(getAvatarShapeClasses(avatarProps.shape ?? \"circle\", avatarSize), skeletonFill(avatarProps.active ?? active))}\n            style={getAvatarSizeStyle(avatarSize)}\n          />\n        )}\n        <div className=\"min-w-0 flex-1\">\n          {title && (\n            <div\n              className={getLineClass(round, cn(\"h-4\", titleProps.width === undefined && \"w-2/5\"), active)}\n              style={widthToStyle(titleProps.width)}\n            />\n          )}\n          {paragraph && (\n            <div className={cn(\"space-y-2.5\", title && \"mt-4\")}>\n              {Array.from({ length: rows }).map((_, i) => {\n                const explicitWidth = paragraphWidths[i];\n                const fallbackWidthClass = resolveFallbackWidthClass(explicitWidth, i === rows - 1);\n                return (\n                  <div\n                    key={i}\n                    className={getLineClass(round, cn(\"h-3\", fallbackWidthClass), active)}\n                    style={widthToStyle(explicitWidth)}\n                  />\n                );\n              })}\n            </div>\n          )}\n        </div>\n      </div>\n    </div>\n  );\n}\n\n/**\n * Serbest şekilli iskelet parçası — kendi yerleşiminizi (kart ızgarası, tablo\n * satırı) gerçek bileşenin ölçüleriyle kurmak için. Görsel; `aria-hidden`.\n */\nexport function SkeletonBlock({ width, height = \"1rem\", radius = \"md\", active = false, className }: Readonly<SkeletonBlockProps>) {\n  const radiusClass = { none: \"rounded-none\", sm: \"rounded-sm\", md: \"rounded-md\", lg: \"rounded-lg\", xl: \"rounded-xl\", full: \"rounded-full\" }[radius];\n  return (\n    <div\n      aria-hidden\n      className={cn(\"shrink-0\", skeletonFill(active), radiusClass, width === undefined && \"w-full\", className)}\n      style={{ width: typeof width === \"number\" ? `${width}px` : width, height: typeof height === \"number\" ? `${height}px` : height }}\n    />\n  );\n}\n","import type React from \"react\";\nimport { cn, type Size } from \"@mari-ui/core\";\nimport type { SkeletonButtonShape } from \"./types\";\nimport { skeletonFill } from \"../lib/skeleton\";\n\nexport { getShapeClasses as getAvatarShapeClasses, getSizeStyle as getAvatarSizeStyle } from \"../avatar/utils\";\n\n/**\n * Faz 15.6 — iskelet parçalarının geometrisi GERÇEK bileşenlerden gelir ki\n * yüklenince zıplamasın. Eskiden kendi tabloları vardı ve kaymıştı:\n * - Avatar iskeleti 32/48/64px, varsayılanı yuvarlatılmış kareydi; Avatar\n *   24/32/40px ve varsayılanı daire → artık `avatar/utils`'in kendisi.\n * - Button/Input `sm` iskeleti `rounded-md`, gerçeği `rounded-sm` (lib\n *   `sizeClass`).\n * - `SkeletonButton shape=\"circle\"` 80×32 bir hap çiziyordu; Button'ın\n *   `circle`'ı kare-daire.\n *\n * Sabit enum olmayan (tüketici verisi) genişlikler class değil inline stil —\n * Tailwind derleme zamanında olası her değeri üretemez.\n */\n\n/** lib `sizeClass` ile aynı yükseklik + radius (Button, Input). */\nconst CONTROL_BOX_CLASS: Record<Size, string> = {\n  sm: \"h-6 rounded-sm\",\n  md: \"h-8 rounded-md\",\n  lg: \"h-10 rounded-md\",\n};\n\nexport const INPUT_SIZE_CLASS: Record<Size, string> = {\n  sm: cn(CONTROL_BOX_CLASS.sm, \"w-full\"),\n  md: cn(CONTROL_BOX_CLASS.md, \"w-full\"),\n  lg: cn(CONTROL_BOX_CLASS.lg, \"w-full\"),\n};\n\nconst BUTTON_WIDTH_CLASS: Record<Size, string> = { sm: \"w-16\", md: \"w-20\", lg: \"w-24\" };\n/** Button `circle` = kare-daire: genişlik = yükseklik. */\nconst CIRCLE_SIZE_CLASS: Record<Size, string> = { sm: \"size-6\", md: \"size-8\", lg: \"size-10\" };\n\n/** Button'ın `getShapeClasses`'ıyla aynı şekiller (`round` = eski ad, `pill`). */\nexport function getButtonSkeletonClass(size: Size, shape: SkeletonButtonShape, block: boolean): string {\n  if (shape === \"circle\") return cn(CIRCLE_SIZE_CLASS[size], \"rounded-full\");\n  return cn(\n    CONTROL_BOX_CLASS[size],\n    block ? \"w-full\" : BUTTON_WIDTH_CLASS[size],\n    (shape === \"pill\" || shape === \"round\") && \"rounded-full\",\n    shape === \"square\" && \"rounded-none\"\n  );\n}\n\nexport function widthToStyle(width: number | string | undefined): React.CSSProperties | undefined {\n  if (width === undefined) return undefined;\n  return { width: typeof width === \"number\" ? `${width}px` : width };\n}\n\nexport { skeletonFill };\n\nexport function getLineClass(round: boolean | undefined, extra?: string, active?: boolean): string {\n  return cn(skeletonFill(active), round ? \"rounded-full\" : \"rounded-md\", extra);\n}\n","import React from \"react\";\nimport { cn, type Size } from \"@mari-ui/core\";\nimport type { SkeletonButtonShape } from \"./types\";\nimport { getButtonSkeletonClass, skeletonFill } from \"./utils\";\n\nexport interface SkeletonButtonProps {\n  active?: boolean;\n  block?: boolean;\n  /** Button'ın `shape`'iyle aynı: `default` / `pill` / `circle` / `square` (`round` = `pill`'in eski adı). */\n  shape?: SkeletonButtonShape;\n  size?: Size;\n  className?: string;\n}\n\n// Hook yok, browser API yok — saf sunum, \"use client\" gerekmiyor.\nexport function SkeletonButton({ active = false, block = false, shape = \"default\", size = \"md\", className }: Readonly<SkeletonButtonProps>) {\n  return <div aria-hidden className={cn(skeletonFill(active), getButtonSkeletonClass(size, shape, block), className)} />;\n}\n","import React from \"react\";\nimport { cn, type Size } from \"@mari-ui/core\";\nimport { INPUT_SIZE_CLASS, skeletonFill } from \"./utils\";\n\nexport interface SkeletonInputProps {\n  active?: boolean;\n  size?: Size;\n  className?: string;\n}\n\n// Hook yok, browser API yok — saf sunum, \"use client\" gerekmiyor.\nexport function SkeletonInput({ active = false, size = \"md\", className }: Readonly<SkeletonInputProps>) {\n  return (\n    <div aria-hidden className={cn(skeletonFill(active), INPUT_SIZE_CLASS[size], className)} />\n  );\n}\n"],"mappings":"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","names":["cn","cn","cn","jsx","cn","cn","jsx","cn"]}

package/dist/chunk-NS7FKOFI.js

@@ -0,0 +1,56 @@
+// src/lib/floating.ts
+function parsePlacement(placement) {
+  const [side, align] = placement.split("-");
+  return { side, align: align ?? "center" };
+}
+var OPPOSITE_SIDE = { top: "bottom", bottom: "top", left: "right", right: "left" };
+function getArrowCenter(align, size, inset, towardsTrigger) {
+  if (towardsTrigger !== void 0) return towardsTrigger;
+  if (align === "start") return inset;
+  if (align === "end") return size - inset;
+  return size / 2;
+}
+function computePanelPosition(anchor, panel, placement, viewport, gap, edge, arrow) {
+  const { side: preferred, align } = parsePlacement(placement);
+  const mainStart = (side2) => {
+    switch (side2) {
+      case "top":
+        return anchor.top - gap - panel.height;
+      case "bottom":
+        return anchor.top + anchor.height + gap;
+      case "left":
+        return anchor.left - gap - panel.width;
+      default:
+        return anchor.left + anchor.width + gap;
+    }
+  };
+  const fits = (side2) => {
+    const start = mainStart(side2);
+    const size = side2 === "top" || side2 === "bottom" ? panel.height : panel.width;
+    const limit = side2 === "top" || side2 === "bottom" ? viewport.height : viewport.width;
+    return start >= edge && start + size <= limit - edge;
+  };
+  const perpendicular = preferred === "top" || preferred === "bottom" ? ["right", "left"] : ["top", "bottom"];
+  const side = [preferred, OPPOSITE_SIDE[preferred], ...perpendicular].find(fits) ?? preferred;
+  const vertical = side === "top" || side === "bottom";
+  const inset = arrow?.inset ?? 0;
+  const cross = vertical ? { start: anchor.left, length: anchor.width, size: panel.width } : { start: anchor.top, length: anchor.height, size: panel.height };
+  const center = cross.start + cross.length / 2;
+  let origin;
+  if (align === "center") origin = center - cross.size / 2;
+  else if (arrow?.pointAtCenter) origin = align === "start" ? center - inset : center + inset - cross.size;
+  else origin = align === "start" ? cross.start : cross.start + cross.length - cross.size;
+  const clamp = (value, min, max) => Math.min(Math.max(value, min), Math.max(min, max));
+  const attach = (value) => clamp(value, center - cross.size + inset, center - inset);
+  const crossPos = attach(clamp(origin, edge, (vertical ? viewport.width - panel.width : viewport.height - panel.height) - edge));
+  const top = vertical ? clamp(mainStart(side), edge, viewport.height - panel.height - edge) : crossPos;
+  const left = vertical ? crossPos : clamp(mainStart(side), edge, viewport.width - panel.width - edge);
+  const finalOrigin = vertical ? left : top;
+  const arrowOffset = clamp(getArrowCenter(align, cross.size, inset, arrow?.pointAtCenter ? center - finalOrigin : void 0), inset, cross.size - inset);
+  return { top, left, side, arrowOffset };
+}
+
+export {
+  computePanelPosition
+};
+//# sourceMappingURL=chunk-NS7FKOFI.js.map

package/dist/chunk-NS7FKOFI.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/lib/floating.ts"],"sourcesContent":["import type { Placement } from \"@mari-ui/core\";\n\n/**\n * Yüzen paneller (Dropdown, Tooltip) için ortak konumlandırma — Faz 15'te\n * `dropdown/utils.ts`'ten taşındı; Tooltip'in kendi 4-yönlü, kıstırmasız\n * hesabının yerini aldı (mobilde ekrandan taşıyordu).\n */\nexport type Side = \"top\" | \"bottom\" | \"left\" | \"right\";\ntype Align = \"start\" | \"center\" | \"end\";\n\n/** 12 değerli `Placement`i ana yön + hizaya ayırır (`bottom-end` → `{ side: \"bottom\", align: \"end\" }`). */\nexport function parsePlacement(placement: Placement): { side: Side; align: Align } {\n  const [side, align] = placement.split(\"-\") as [Side, Align | undefined];\n  return { side, align: align ?? \"center\" };\n}\n\nconst OPPOSITE_SIDE: Record<Side, Side> = { top: \"bottom\", bottom: \"top\", left: \"right\", right: \"left\" };\n\nexport interface Box {\n  top: number;\n  left: number;\n  width: number;\n  height: number;\n}\n\nexport interface ArrowOptions {\n  /** Okun ORTASININ panelin hizalandığı kenardan uzaklığı (ant.design: 12px kenar boşluğu + 8px yarım genişlik). */\n  inset: number;\n  /** `true`: panel, okun ortası TETİKLEYİCİNİN ortasına gelecek şekilde kayar (ant.design `arrow.pointAtCenter`). */\n  pointAtCenter: boolean;\n}\n\nfunction getArrowCenter(align: Align, size: number, inset: number, towardsTrigger: number | undefined): number {\n  if (towardsTrigger !== undefined) return towardsTrigger;\n  if (align === \"start\") return inset;\n  if (align === \"end\") return size - inset;\n  return size / 2;\n}\n\n/**\n * Panelin sol-üst köşesinin (viewport koordinatlarında) nereye gelmesi\n * gerektiğini hesaplar: tercih edilen yönde sığmıyor ama karşı yönde\n * sığıyorsa yönü çevirir (flip), sonra iki eksende de viewport içinde\n * kelepçeler. `side` (flip sonrası gerçek yön) ve `arrowOffset` (okun ortasının\n * panelin kenarı boyunca konumu) da döner. Saf fonksiyon — DOM'a dokunmaz.\n */\nexport function computePanelPosition(\n  anchor: Box,\n  panel: { width: number; height: number },\n  placement: Placement,\n  viewport: { width: number; height: number },\n  gap: number,\n  edge: number,\n  arrow?: ArrowOptions\n): { top: number; left: number; side: Side; arrowOffset: number } {\n  const { side: preferred, align } = parsePlacement(placement);\n\n  const mainStart = (side: Side): number => {\n    switch (side) {\n      case \"top\":\n        return anchor.top - gap - panel.height;\n      case \"bottom\":\n        return anchor.top + anchor.height + gap;\n      case \"left\":\n        return anchor.left - gap - panel.width;\n      default:\n        return anchor.left + anchor.width + gap;\n    }\n  };\n\n  const fits = (side: Side): boolean => {\n    const start = mainStart(side);\n    const size = side === \"top\" || side === \"bottom\" ? panel.height : panel.width;\n    const limit = side === \"top\" || side === \"bottom\" ? viewport.height : viewport.width;\n    return start >= edge && start + size <= limit - edge;\n  };\n\n  // Sıra: tercih → karşı yön → dik yönler. Dar ekranda yatay iki yön de\n  // sığmıyorsa (mobilde geniş bir balon) üst/alta geçilir — eskiden tercih\n  // edilen yönde kalıp kıstırılıyor ve TETİKLEYİCİNİN ÜSTÜNÜ KAPATIYORDU.\n  const perpendicular: Side[] = preferred === \"top\" || preferred === \"bottom\" ? [\"right\", \"left\"] : [\"top\", \"bottom\"];\n  const side = [preferred, OPPOSITE_SIDE[preferred], ...perpendicular].find(fits) ?? preferred;\n  const vertical = side === \"top\" || side === \"bottom\";\n  const inset = arrow?.inset ?? 0;\n\n  // Çapraz eksen: panelin `size`ı, tetikleyicinin `start`/`length`i.\n  const cross = vertical\n    ? { start: anchor.left, length: anchor.width, size: panel.width }\n    : { start: anchor.top, length: anchor.height, size: panel.height };\n  const center = cross.start + cross.length / 2;\n\n  let origin: number;\n  if (align === \"center\") origin = center - cross.size / 2;\n  else if (arrow?.pointAtCenter) origin = align === \"start\" ? center - inset : center + inset - cross.size;\n  else origin = align === \"start\" ? cross.start : cross.start + cross.length - cross.size;\n\n  const clamp = (value: number, min: number, max: number) => Math.min(Math.max(value, min), Math.max(min, max));\n  // Çapraz eksen: önce ekran içine kıstır, SONRA tetikleyiciye bağlılığı\n  // zorla — panel her koşulda tetikleyicinin ortasını (ok payıyla) kapsamalı.\n  // Eskiden yalnızca ekrana kıstırılıyordu: tetikleyici ekranın alt/üst\n  // kenarına yaklaşınca panel kayıp tetikleyiciden kopuyor, komşu satırın\n  // balonuna biniyordu (kaydırırken, kullanıcı bulgusu). Kenara yakınken panel\n  // ekrandan biraz taşar ama asla tetikleyicisinden ayrılmaz.\n  const attach = (value: number) => clamp(value, center - cross.size + inset, center - inset);\n  const crossPos = attach(clamp(origin, edge, (vertical ? viewport.width - panel.width : viewport.height - panel.height) - edge));\n  const top = vertical ? clamp(mainStart(side), edge, viewport.height - panel.height - edge) : crossPos;\n  const left = vertical ? crossPos : clamp(mainStart(side), edge, viewport.width - panel.width - edge);\n\n  // Ok: varsayılan olarak hizalanan kenardan sabit `inset` içeride (ant.design);\n  // `pointAtCenter` ise tetikleyicinin ortasında. Köşeye taşmasın diye kelepçelenir.\n  const finalOrigin = vertical ? left : top;\n  const arrowOffset = clamp(getArrowCenter(align, cross.size, inset, arrow?.pointAtCenter ? center - finalOrigin : undefined), inset, cross.size - inset);\n\n  return { top, left, side, arrowOffset };\n}\n\n"],"mappings":";AAWO,SAAS,eAAe,WAAoD;AACjF,QAAM,CAAC,MAAM,KAAK,IAAI,UAAU,MAAM,GAAG;AACzC,SAAO,EAAE,MAAM,OAAO,SAAS,SAAS;AAC1C;AAEA,IAAM,gBAAoC,EAAE,KAAK,UAAU,QAAQ,OAAO,MAAM,SAAS,OAAO,OAAO;AAgBvG,SAAS,eAAe,OAAc,MAAc,OAAe,gBAA4C;AAC7G,MAAI,mBAAmB,OAAW,QAAO;AACzC,MAAI,UAAU,QAAS,QAAO;AAC9B,MAAI,UAAU,MAAO,QAAO,OAAO;AACnC,SAAO,OAAO;AAChB;AASO,SAAS,qBACd,QACA,OACA,WACA,UACA,KACA,MACA,OACgE;AAChE,QAAM,EAAE,MAAM,WAAW,MAAM,IAAI,eAAe,SAAS;AAE3D,QAAM,YAAY,CAACA,UAAuB;AACxC,YAAQA,OAAM;AAAA,MACZ,KAAK;AACH,eAAO,OAAO,MAAM,MAAM,MAAM;AAAA,MAClC,KAAK;AACH,eAAO,OAAO,MAAM,OAAO,SAAS;AAAA,MACtC,KAAK;AACH,eAAO,OAAO,OAAO,MAAM,MAAM;AAAA,MACnC;AACE,eAAO,OAAO,OAAO,OAAO,QAAQ;AAAA,IACxC;AAAA,EACF;AAEA,QAAM,OAAO,CAACA,UAAwB;AACpC,UAAM,QAAQ,UAAUA,KAAI;AAC5B,UAAM,OAAOA,UAAS,SAASA,UAAS,WAAW,MAAM,SAAS,MAAM;AACxE,UAAM,QAAQA,UAAS,SAASA,UAAS,WAAW,SAAS,SAAS,SAAS;AAC/E,WAAO,SAAS,QAAQ,QAAQ,QAAQ,QAAQ;AAAA,EAClD;AAKA,QAAM,gBAAwB,cAAc,SAAS,cAAc,WAAW,CAAC,SAAS,MAAM,IAAI,CAAC,OAAO,QAAQ;AAClH,QAAM,OAAO,CAAC,WAAW,cAAc,SAAS,GAAG,GAAG,aAAa,EAAE,KAAK,IAAI,KAAK;AACnF,QAAM,WAAW,SAAS,SAAS,SAAS;AAC5C,QAAM,QAAQ,OAAO,SAAS;AAG9B,QAAM,QAAQ,WACV,EAAE,OAAO,OAAO,MAAM,QAAQ,OAAO,OAAO,MAAM,MAAM,MAAM,IAC9D,EAAE,OAAO,OAAO,KAAK,QAAQ,OAAO,QAAQ,MAAM,MAAM,OAAO;AACnE,QAAM,SAAS,MAAM,QAAQ,MAAM,SAAS;AAE5C,MAAI;AACJ,MAAI,UAAU,SAAU,UAAS,SAAS,MAAM,OAAO;AAAA,WAC9C,OAAO,cAAe,UAAS,UAAU,UAAU,SAAS,QAAQ,SAAS,QAAQ,MAAM;AAAA,MAC/F,UAAS,UAAU,UAAU,MAAM,QAAQ,MAAM,QAAQ,MAAM,SAAS,MAAM;AAEnF,QAAM,QAAQ,CAAC,OAAe,KAAa,QAAgB,KAAK,IAAI,KAAK,IAAI,OAAO,GAAG,GAAG,KAAK,IAAI,KAAK,GAAG,CAAC;AAO5G,QAAM,SAAS,CAAC,UAAkB,MAAM,OAAO,SAAS,MAAM,OAAO,OAAO,SAAS,KAAK;AAC1F,QAAM,WAAW,OAAO,MAAM,QAAQ,OAAO,WAAW,SAAS,QAAQ,MAAM,QAAQ,SAAS,SAAS,MAAM,UAAU,IAAI,CAAC;AAC9H,QAAM,MAAM,WAAW,MAAM,UAAU,IAAI,GAAG,MAAM,SAAS,SAAS,MAAM,SAAS,IAAI,IAAI;AAC7F,QAAM,OAAO,WAAW,WAAW,MAAM,UAAU,IAAI,GAAG,MAAM,SAAS,QAAQ,MAAM,QAAQ,IAAI;AAInG,QAAM,cAAc,WAAW,OAAO;AACtC,QAAM,cAAc,MAAM,eAAe,OAAO,MAAM,MAAM,OAAO,OAAO,gBAAgB,SAAS,cAAc,MAAS,GAAG,OAAO,MAAM,OAAO,KAAK;AAEtJ,SAAO,EAAE,KAAK,MAAM,MAAM,YAAY;AACxC;","names":["side"]}