@stisocial/ui 0.1.0 → 0.2.1

package/dist/agency/_shared/platforms.js

@@ -0,0 +1,109 @@
+// src/agency/_shared/platforms.ts
+const PLATFORM_LIMITS = {
+	instagram: {
+		max: 2200,
+		visible: 125,
+		hashtags: 30
+	},
+	tiktok: {
+		max: 2200,
+		visible: 90,
+		hashtags: null
+	},
+	facebook: {
+		max: 63206,
+		visible: 477,
+		hashtags: null
+	},
+	linkedin: {
+		max: 3e3,
+		visible: 210,
+		hashtags: null
+	},
+	x: {
+		max: 280,
+		visible: 280,
+		hashtags: null
+	},
+	threads: {
+		max: 500,
+		visible: 500,
+		hashtags: null
+	},
+	pinterest: {
+		max: 500,
+		visible: 100,
+		hashtags: null
+	},
+	youtube: {
+		max: 5e3,
+		visible: 100,
+		hashtags: 15
+	}
+};
+const PLATFORMS = Object.keys(PLATFORM_LIMITS);
+/** Görünen karakter sayısı: birleşik emoji ve aksanlı harf tek karakterdir. */
+function graphemes(text) {
+	if (typeof Intl !== "undefined" && "Segmenter" in Intl) return Array.from(new Intl.Segmenter("tr-TR", { granularity: "grapheme" }).segment(text), (s) => s.segment);
+	return Array.from(text);
+}
+function countChars(text) {
+	return graphemes(text).length;
+}
+/** Metni en çok `limit` karaktere keser; kesildiyse `cut: true` döner. Sözcük ortasında kesmez. */
+function truncateText(text, limit) {
+	const g = graphemes(text);
+	if (g.length <= limit) return {
+		text,
+		cut: false
+	};
+	let head = g.slice(0, limit).join("");
+	const space = head.search(/\s\S*$/u);
+	if (space > limit * .6) head = head.slice(0, space);
+	return {
+		text: head.trimEnd(),
+		cut: true
+	};
+}
+const TOKEN = /(#[\p{L}\p{N}_]+|@[\p{L}\p{N}_.]+|https?:\/\/[^\s]+)/gu;
+/** Gönderi metnini etiket, anma ve bağlantı parçalarına ayırır (vurgu için). */
+function tokenizeText(text) {
+	const out = [];
+	let last = 0;
+	for (const m of text.matchAll(TOKEN)) {
+		const at = m.index ?? 0;
+		if (at > last) out.push({
+			kind: "text",
+			value: text.slice(last, at),
+			at: last
+		});
+		const value = m[0];
+		out.push({
+			kind: value.startsWith("#") ? "hashtag" : value.startsWith("@") ? "mention" : "link",
+			value,
+			at
+		});
+		last = at + value.length;
+	}
+	if (last < text.length) out.push({
+		kind: "text",
+		value: text.slice(last),
+		at: last
+	});
+	return out;
+}
+/** Metindeki etiketler (# olmadan; yinelenenler ve büyük-küçük harf farkı atılır). */
+function extractHashtags(text) {
+	const seen = /* @__PURE__ */ new Set();
+	const out = [];
+	for (const m of text.matchAll(/#([\p{L}\p{N}_]+)/gu)) {
+		const tag = m[1];
+		const key = tag.toLocaleLowerCase("tr-TR");
+		if (!seen.has(key)) {
+			seen.add(key);
+			out.push(tag);
+		}
+	}
+	return out;
+}
+export { PLATFORMS, PLATFORM_LIMITS, countChars, extractHashtags, graphemes, tokenizeText, truncateText };

package/dist/agency/index.d.ts

@@ -0,0 +1,23 @@
+import { PreviewAccount, PreviewBaseProps, PreviewMediaItem, PreviewRatio } from "./_shared/Preview.js";
+import { PLATFORMS, PLATFORM_LIMITS, Platform, PlatformLimit, countChars, extractHashtags, truncateText } from "./_shared/platforms.js";
+import { FacebookPostPreview, FacebookPostPreviewProps } from "./FacebookPostPreview/FacebookPostPreview.js";
+import "./FacebookPostPreview/index.js";
+import { InstagramPostPreview, InstagramPostPreviewProps } from "./InstagramPostPreview/InstagramPostPreview.js";
+import "./InstagramPostPreview/index.js";
+import { InstagramReelPreview, InstagramReelPreviewProps } from "./InstagramReelPreview/InstagramReelPreview.js";
+import "./InstagramReelPreview/index.js";
+import { InstagramStoryPreview, InstagramStoryPreviewProps } from "./InstagramStoryPreview/InstagramStoryPreview.js";
+import "./InstagramStoryPreview/index.js";
+import { LinkedInPostPreview, LinkedInPostPreviewProps } from "./LinkedInPostPreview/LinkedInPostPreview.js";
+import "./LinkedInPostPreview/index.js";
+import { PinterestPinPreview, PinterestPinPreviewProps } from "./PinterestPinPreview/PinterestPinPreview.js";
+import "./PinterestPinPreview/index.js";
+import { ThreadsPostPreview, ThreadsPostPreviewProps } from "./ThreadsPostPreview/ThreadsPostPreview.js";
+import "./ThreadsPostPreview/index.js";
+import { TikTokPreview, TikTokPreviewProps } from "./TikTokPreview/TikTokPreview.js";
+import "./TikTokPreview/index.js";
+import { XPostPreview, XPostPreviewProps } from "./XPostPreview/XPostPreview.js";
+import "./XPostPreview/index.js";
+import { YOUTUBE_TITLE_MAX, YouTubeThumbnailPreview, YouTubeThumbnailPreviewProps } from "./YouTubeThumbnailPreview/YouTubeThumbnailPreview.js";
+import "./YouTubeThumbnailPreview/index.js";
+export { FacebookPostPreview, FacebookPostPreviewProps, InstagramPostPreview, InstagramPostPreviewProps, InstagramReelPreview, InstagramReelPreviewProps, InstagramStoryPreview, InstagramStoryPreviewProps, LinkedInPostPreview, LinkedInPostPreviewProps, PLATFORMS, PLATFORM_LIMITS, PinterestPinPreview, PinterestPinPreviewProps, type Platform, type PlatformLimit, type PreviewAccount, type PreviewBaseProps, type PreviewMediaItem, type PreviewRatio, ThreadsPostPreview, ThreadsPostPreviewProps, TikTokPreview, TikTokPreviewProps, XPostPreview, XPostPreviewProps, YOUTUBE_TITLE_MAX, YouTubeThumbnailPreview, YouTubeThumbnailPreviewProps, countChars, extractHashtags, truncateText };

package/dist/agency/index.js

@@ -0,0 +1,12 @@
+import { PLATFORMS, PLATFORM_LIMITS, countChars, extractHashtags, truncateText } from "./_shared/platforms.js";
+import { FacebookPostPreview } from "./FacebookPostPreview/FacebookPostPreview.js";
+import { InstagramPostPreview } from "./InstagramPostPreview/InstagramPostPreview.js";
+import { InstagramReelPreview } from "./InstagramReelPreview/InstagramReelPreview.js";
+import { InstagramStoryPreview } from "./InstagramStoryPreview/InstagramStoryPreview.js";
+import { LinkedInPostPreview } from "./LinkedInPostPreview/LinkedInPostPreview.js";
+import { PinterestPinPreview } from "./PinterestPinPreview/PinterestPinPreview.js";
+import { ThreadsPostPreview } from "./ThreadsPostPreview/ThreadsPostPreview.js";
+import { TikTokPreview } from "./TikTokPreview/TikTokPreview.js";
+import { XPostPreview } from "./XPostPreview/XPostPreview.js";
+import { YOUTUBE_TITLE_MAX, YouTubeThumbnailPreview } from "./YouTubeThumbnailPreview/YouTubeThumbnailPreview.js";
+export { FacebookPostPreview, InstagramPostPreview, InstagramReelPreview, InstagramStoryPreview, LinkedInPostPreview, PLATFORMS, PLATFORM_LIMITS, PinterestPinPreview, ThreadsPostPreview, TikTokPreview, XPostPreview, YOUTUBE_TITLE_MAX, YouTubeThumbnailPreview, countChars, extractHashtags, truncateText };

package/dist/ai/AiDisclosure/AiDisclosure.css

@@ -0,0 +1,99 @@
+@layer sti.reset, sti.tokens, sti.base, sti.components, sti.variants, sti.utilities;
+@layer sti.components {
+  .sti-AiDisclosure-root-99149 {
+    --sti-aidisclosure-font-size: var(--sti-font-size-sm);
+    --sti-aidisclosure-line-height: var(--sti-line-height-sm);
+    --sti-aidisclosure-py: var(--sti-space-1);
+    --sti-aidisclosure-px: var(--sti-space-3);
+    --sti-aidisclosure-gap: var(--sti-space-1);
+    --sti-aidisclosure-icon: var(--sti-icon-sm);
+    --sti-aidisclosure-bg: var(--sti-bg-accent-subtle);
+    --sti-aidisclosure-fg: var(--sti-fg-accent-strong);
+    --sti-aidisclosure-border: transparent;
+    box-sizing: border-box;
+    border: var(--sti-border-width) solid var(--sti-aidisclosure-border);
+    background: var(--sti-aidisclosure-bg);
+    min-inline-size: 0;
+    max-inline-size: 100%;
+    color: var(--sti-aidisclosure-fg);
+    font-family: var(--sti-font-text);
+    font-size: var(--sti-aidisclosure-font-size);
+    line-height: var(--sti-aidisclosure-line-height);
+  }
+
+  .sti-AiDisclosure-root-99149[data-size="sm"] {
+    --sti-aidisclosure-font-size: var(--sti-font-size-xs);
+    --sti-aidisclosure-line-height: var(--sti-line-height-xs);
+    --sti-aidisclosure-px: var(--sti-space-2);
+    --sti-aidisclosure-py: var(--sti-space-0-5);
+  }
+
+  .sti-AiDisclosure-root-99149[data-size="lg"] {
+    --sti-aidisclosure-font-size: var(--sti-font-size-md);
+    --sti-aidisclosure-line-height: var(--sti-line-height-md);
+    --sti-aidisclosure-px: var(--sti-space-4);
+    --sti-aidisclosure-py: var(--sti-space-2);
+    --sti-aidisclosure-icon: var(--sti-icon-md);
+  }
+
+  .sti-AiDisclosure-root-99149[data-variant="badge"] {
+    align-items: center;
+    gap: var(--sti-aidisclosure-gap);
+    padding: var(--sti-aidisclosure-py) var(--sti-aidisclosure-px);
+    border-radius: var(--sti-radius-pill);
+    font-weight: var(--sti-font-weight-medium);
+    vertical-align: middle;
+    display: inline-flex;
+  }
+
+  .sti-AiDisclosure-root-99149[data-variant="note"] {
+    align-items: flex-start;
+    gap: var(--sti-space-3);
+    padding: var(--sti-space-3) var(--sti-space-4);
+    --sti-aidisclosure-bg: var(--sti-bg-surface);
+    --sti-aidisclosure-fg: var(--sti-fg);
+    --sti-aidisclosure-border: var(--sti-border-subtle);
+    border-radius: var(--sti-radius-lg);
+    display: flex;
+  }
+
+  .sti-AiDisclosure-icon-26c1f {
+    font-size: var(--sti-aidisclosure-icon);
+    flex: none;
+    display: inline-flex;
+  }
+
+  .sti-AiDisclosure-root-99149[data-variant="note"] .sti-AiDisclosure-icon-26c1f {
+    color: var(--sti-fg-accent);
+    margin-block-start: var(--sti-space-0-5);
+  }
+
+  .sti-AiDisclosure-body-08a0e {
+    gap: var(--sti-space-0-5);
+    flex-direction: column;
+    min-inline-size: 0;
+    display: flex;
+  }
+
+  .sti-AiDisclosure-label-299b8 {
+    overflow-wrap: anywhere;
+    min-inline-size: 0;
+  }
+
+  .sti-AiDisclosure-root-99149[data-variant="note"] .sti-AiDisclosure-label-299b8 {
+    font-weight: var(--sti-font-weight-semibold);
+  }
+
+  .sti-AiDisclosure-description-7d9ab {
+    color: var(--sti-fg-muted);
+    font-size: var(--sti-font-size-sm);
+    line-height: var(--sti-line-height-sm);
+    overflow-wrap: anywhere;
+  }
+
+  @media (forced-colors: active) {
+    .sti-AiDisclosure-root-99149 {
+      border-color: canvastext;
+    }
+  }
+}

package/dist/ai/AiDisclosure/AiDisclosure.d.ts

@@ -0,0 +1,28 @@
+import { Locale } from "../../provider/locale.js";
+import { ReactNode } from "react";
+export type AiDisclosureKind = "generated" | "assisted";
+export interface AiDisclosureProps {
+  /**
+   * İçeriğin yapay zekâyla ilişkisi: `generated` "Yapay zekâ ile üretildi", `assisted` "Yapay zekâ
+   * desteğiyle hazırlandı".
+   */
+  kind?: AiDisclosureKind;
+  /** `badge`: satır içi etiket (varsayılan); `note`: etiket ve uyarı metni olan çerçeveli not. */
+  variant?: "badge" | "note";
+  /** Boy: `sm`, `md` (varsayılan), `lg`; yazı boyu ve iç boşluk değişir. */
+  size?: "sm" | "md" | "lg";
+  /** Yerleşik etiketin yerine geçen metin (ör. modelin adını içeren etiket). */
+  children?: ReactNode;
+  /** `note` türünde etiketin altındaki açıklama; verilmezse yerleşik uyarı metni yazılır. */
+  description?: ReactNode;
+  /** Yerleşik metinlerin dili (sunucu bileşeni: sağlayıcı yok). */
+  locale?: Locale;
+  className?: string;
+  id?: string;
+}
+/**
+ * "Yapay zekâ ile üretildi" etiketi: yapay zekâyla üretilen ya da desteklenen içeriği okura açıkça
+ * bildirir (şeffaflık yükümlülüğü). Anlam yalnız renk ve ikonla değil metinle verilir. Sunucu
+ * bileşenidir (JavaScript göndermez).
+ */
+export declare function AiDisclosure({ kind, variant, size, children, description, locale, className, id }: AiDisclosureProps): import("react").JSX.Element;

package/dist/ai/AiDisclosure/AiDisclosure.js

@@ -0,0 +1,52 @@
+import { messagesFor } from "../../messages/messages.js";
+import { SparkleGlyph } from "../_internal/glyphs.js";
+import AiDisclosure_module_default from "./AiDisclosure.module.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+// src/ai/AiDisclosure/AiDisclosure.tsx
+/**
+* "Yapay zekâ ile üretildi" etiketi: yapay zekâyla üretilen ya da desteklenen içeriği okura açıkça
+* bildirir (şeffaflık yükümlülüğü). Anlam yalnız renk ve ikonla değil metinle verilir. Sunucu
+* bileşenidir (JavaScript göndermez).
+*/
+function AiDisclosure({ kind = "generated", variant = "badge", size = "md", children, description, locale = "tr-TR", className, id }) {
+	const t = messagesFor(locale);
+	const label = children ?? (kind === "generated" ? t.aiDisclosureGenerated : t.aiDisclosureAssisted);
+	const rootClass = [AiDisclosure_module_default.root, className].filter(Boolean).join(" ");
+	if (variant === "note") return /* @__PURE__ */ jsxs("div", {
+		id,
+		className: rootClass,
+		"data-variant": "note",
+		"data-size": size,
+		"data-kind": kind,
+		children: [/* @__PURE__ */ jsx("span", {
+			className: AiDisclosure_module_default.icon,
+			"aria-hidden": "true",
+			children: /* @__PURE__ */ jsx(SparkleGlyph, {})
+		}), /* @__PURE__ */ jsxs("span", {
+			className: AiDisclosure_module_default.body,
+			children: [/* @__PURE__ */ jsx("span", {
+				className: AiDisclosure_module_default.label,
+				children: label
+			}), /* @__PURE__ */ jsx("span", {
+				className: AiDisclosure_module_default.description,
+				children: description ?? t.aiDisclosureNote
+			})]
+		})]
+	});
+	return /* @__PURE__ */ jsxs("span", {
+		id,
+		className: rootClass,
+		"data-variant": "badge",
+		"data-size": size,
+		"data-kind": kind,
+		children: [/* @__PURE__ */ jsx("span", {
+			className: AiDisclosure_module_default.icon,
+			"aria-hidden": "true",
+			children: /* @__PURE__ */ jsx(SparkleGlyph, {})
+		}), /* @__PURE__ */ jsx("span", {
+			className: AiDisclosure_module_default.label,
+			children: label
+		})]
+	});
+}
+export { AiDisclosure };

package/dist/ai/AiDisclosure/AiDisclosure.module.js

@@ -0,0 +1,10 @@
+import './AiDisclosure.css';
+// src/ai/AiDisclosure/AiDisclosure.module.css
+var AiDisclosure_module_default = {
+	"root": "sti-AiDisclosure-root-99149",
+	"icon": "sti-AiDisclosure-icon-26c1f",
+	"body": "sti-AiDisclosure-body-08a0e",
+	"label": "sti-AiDisclosure-label-299b8",
+	"description": "sti-AiDisclosure-description-7d9ab"
+};
+export { AiDisclosure_module_default as default };

package/dist/ai/AiDisclosure/index.d.ts

@@ -0,0 +1,2 @@
+import { AiDisclosure, AiDisclosureKind, AiDisclosureProps } from "./AiDisclosure.js";
+export { AiDisclosure, AiDisclosureKind, AiDisclosureProps };

package/dist/ai/AttachmentChip/AttachmentChip.css

@@ -0,0 +1,144 @@
+@layer sti.reset, sti.tokens, sti.base, sti.components, sti.variants, sti.utilities;
+@layer sti.components {
+  .sti-AttachmentChip-root-7b85b {
+    --sti-attach-tile: var(--sti-space-8);
+    --sti-attach-font-size: var(--sti-font-size-sm);
+    --sti-attach-line-height: var(--sti-line-height-sm);
+    --sti-attach-meta-size: var(--sti-font-size-xs);
+    --sti-attach-meta-line-height: var(--sti-line-height-xs);
+    --sti-attach-pad: var(--sti-space-1);
+    --sti-attach-radius: var(--sti-radius-md);
+    --sti-attach-border: var(--sti-border-subtle);
+    box-sizing: border-box;
+    align-items: center;
+    gap: var(--sti-space-2);
+    inline-size: fit-content;
+    min-inline-size: 0;
+    max-inline-size: 100%;
+    padding: var(--sti-attach-pad);
+    border: var(--sti-border-width) solid var(--sti-attach-border);
+    border-radius: var(--sti-attach-radius);
+    background: var(--sti-bg-surface);
+    color: var(--sti-fg);
+    font-family: var(--sti-font-text);
+    font-size: var(--sti-attach-font-size);
+    line-height: var(--sti-attach-line-height);
+    padding-inline-end: var(--sti-space-2);
+    display: inline-flex;
+    position: relative;
+    overflow: hidden;
+  }
+
+  .sti-AttachmentChip-root-7b85b[data-size="sm"] {
+    --sti-attach-tile: var(--sti-space-6);
+    --sti-attach-font-size: var(--sti-font-size-xs);
+    --sti-attach-line-height: var(--sti-line-height-xs);
+    --sti-attach-meta-size: var(--sti-font-size-xs);
+    --sti-attach-radius: var(--sti-radius-sm);
+  }
+
+  .sti-AttachmentChip-root-7b85b[data-size="lg"] {
+    --sti-attach-tile: var(--sti-space-10);
+    --sti-attach-font-size: var(--sti-font-size-md);
+    --sti-attach-line-height: var(--sti-line-height-md);
+    --sti-attach-meta-size: var(--sti-font-size-sm);
+    --sti-attach-meta-line-height: var(--sti-line-height-sm);
+    --sti-attach-pad: var(--sti-space-1);
+    --sti-attach-radius: var(--sti-radius-lg);
+  }
+
+  .sti-AttachmentChip-root-7b85b[data-status="error"] {
+    --sti-attach-border: var(--sti-border-danger);
+  }
+
+  .sti-AttachmentChip-root-7b85b[data-disabled] {
+    opacity: var(--sti-opacity-disabled);
+    cursor: not-allowed;
+  }
+
+  .sti-AttachmentChip-tile-b92ef {
+    inline-size: var(--sti-attach-tile);
+    block-size: var(--sti-attach-tile);
+    border-radius: calc(var(--sti-attach-radius) - var(--sti-attach-pad));
+    background: var(--sti-bg-accent-subtle);
+    color: var(--sti-fg-accent-strong);
+    font-size: calc(var(--sti-attach-tile) * .5);
+    flex: none;
+    justify-content: center;
+    align-items: center;
+    display: inline-flex;
+    overflow: hidden;
+  }
+
+  .sti-AttachmentChip-root-7b85b[data-status="error"] .sti-AttachmentChip-tile-b92ef {
+    background: var(--sti-bg-danger-subtle);
+    color: var(--sti-fg-danger-strong);
+  }
+
+  .sti-AttachmentChip-thumb-dc0ad {
+    object-fit: cover;
+    block-size: 100%;
+    inline-size: 100%;
+    display: block;
+  }
+
+  .sti-AttachmentChip-body-63bdc {
+    flex-direction: column;
+    flex: auto;
+    min-inline-size: 0;
+    display: flex;
+  }
+
+  .sti-AttachmentChip-name-a6285 {
+    min-inline-size: 0;
+    color: var(--sti-fg);
+    font-weight: var(--sti-font-weight-medium);
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    outline: none;
+    text-decoration: none;
+    overflow: hidden;
+  }
+
+  a.sti-AttachmentChip-name-a6285[data-hovered] {
+    text-underline-offset: var(--sti-link-underline-offset);
+    text-decoration: underline;
+  }
+
+  .sti-AttachmentChip-name-a6285[data-focus-visible] {
+    outline: var(--sti-focus-ring-width) solid var(--sti-focus-ring);
+    outline-offset: var(--sti-focus-ring-offset);
+    border-radius: var(--sti-radius-xs);
+  }
+
+  .sti-AttachmentChip-meta-b7a7e {
+    gap: var(--sti-space-0-5) var(--sti-space-2);
+    color: var(--sti-fg-muted);
+    font-size: var(--sti-attach-meta-size);
+    font-variant-numeric: tabular-nums;
+    line-height: var(--sti-attach-meta-line-height);
+    flex-wrap: wrap;
+    display: flex;
+  }
+
+  .sti-AttachmentChip-meta-b7a7e:empty {
+    display: none;
+  }
+
+  .sti-AttachmentChip-error-2b485 {
+    color: var(--sti-fg-danger-strong);
+    font-weight: var(--sti-font-weight-medium);
+  }
+
+  .sti-AttachmentChip-progress-3377c {
+    position: absolute;
+    inset-block-end: 0;
+    inset-inline: 0;
+  }
+
+  @media (forced-colors: active) {
+    .sti-AttachmentChip-root-7b85b {
+      border-color: canvastext;
+    }
+  }
+}

package/dist/ai/AttachmentChip/AttachmentChip.d.ts

@@ -0,0 +1,40 @@
+import { ReactNode } from "react";
+export type AttachmentKind = "file" | "image" | "video" | "document" | "table";
+export type AttachmentStatus = "ready" | "uploading" | "error";
+export interface AttachmentChipProps {
+  /** Dosyanın adı (uzunsa sonu kesilir, tam ad ekran okuyucuya okunur). */
+  name: string;
+  /** Dosya boyutu, bayt cinsinden. */
+  bytes?: number;
+  /** Dosya türü: ikonu belirler. Verilmezse `type` ya da ad uzantısından çıkarılır. */
+  kind?: AttachmentKind;
+  /** MIME türü (`image/png`); `kind` verilmemişse tür buradan çıkarılır. */
+  type?: string;
+  /** Küçük resim adresi (yalnız `image`); uygulama verir, bileşen kendisi dış istek yapmaz. */
+  thumbnailSrc?: string;
+  /** `ready` (varsayılan), `uploading` (ilerleme çubuğu) ya da `error` (kırmızı, yeniden dene). */
+  status?: AttachmentStatus;
+  /** Yükleme ilerlemesi, 0 ile 100 arasında; yoksa belirsiz süreli. */
+  progress?: number;
+  /** Hata metni (`status="error"`); verilmezse yerleşik "Yüklenemedi". */
+  errorMessage?: ReactNode;
+  /** Verilirse kaldır düğmesi gösterilir. */
+  onRemove?: () => void;
+  /** Verilirse hatalı dosyada "yeniden yükle" düğmesi gösterilir. */
+  onRetry?: () => void;
+  /** Verilirse ad bir bağlantı olur (önizleme, indirme). */
+  href?: string;
+  /** Boy: `sm`, `md` (varsayılan), `lg`. */
+  size?: "sm" | "md" | "lg";
+  isDisabled?: boolean;
+  className?: string;
+  id?: string;
+}
+/** Dosya türü: önce MIME, sonra uzantı; bilinmeyen `file`. */
+export declare function attachmentKind(name: string, type?: string): AttachmentKind;
+/**
+ * İstemle birlikte gönderilen ek: tür ikonu (ya da küçük resim), ad, boyut ve durum; yüklenirken
+ * ilerleme çubuğu, hatada kırmızı kenar, metin ve "yeniden yükle". Kaldır düğmesi adı dosyayı
+ * söyler ("report.pdf dosyasını kaldır").
+ */
+export declare function AttachmentChip({ name, bytes, kind, type, thumbnailSrc, status, progress, errorMessage, onRemove, onRetry, href, size, isDisabled, className, id }: AttachmentChipProps): import("react").JSX.Element;

package/dist/ai/AttachmentChip/AttachmentChip.js

@@ -0,0 +1,140 @@
+"use client";
+import { useLocale, useMessages } from "../../provider/UIProvider.js";
+import { template } from "../../text/text.js";
+import { AlertCircleIcon } from "../../icons/generated/AlertCircleIcon.js";
+import { IconButton } from "../../components/IconButton/IconButton.js";
+import { CloseIcon } from "../../icons/generated/CloseIcon.js";
+import { FileTextIcon } from "../../icons/generated/FileTextIcon.js";
+import { RefreshIcon } from "../../icons/generated/RefreshIcon.js";
+import { FileIcon } from "../../icons/generated/FileIcon.js";
+import { ImageIcon } from "../../icons/generated/ImageIcon.js";
+import { TableIcon } from "../../icons/generated/TableIcon.js";
+import { VideoIcon } from "../../icons/generated/VideoIcon.js";
+import { FileSize } from "../../components/FileSize/FileSize.js";
+import { ProgressBar as ProgressBar$1 } from "../../components/ProgressBar/ProgressBar.js";
+import AttachmentChip_module_default from "./AttachmentChip.module.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useId } from "react";
+import { Link } from "react-aria-components";
+// src/ai/AttachmentChip/AttachmentChip.tsx
+const EXTENSIONS = {
+	png: "image",
+	jpg: "image",
+	jpeg: "image",
+	gif: "image",
+	webp: "image",
+	avif: "image",
+	svg: "image",
+	mp4: "video",
+	mov: "video",
+	webm: "video",
+	pdf: "document",
+	doc: "document",
+	docx: "document",
+	txt: "document",
+	md: "document",
+	xls: "table",
+	xlsx: "table",
+	csv: "table"
+};
+/** Dosya türü: önce MIME, sonra uzantı; bilinmeyen `file`. */
+function attachmentKind(name, type) {
+	if (type) {
+		if (type.startsWith("image/")) return "image";
+		if (type.startsWith("video/")) return "video";
+		if (type === "application/pdf" || type.startsWith("text/")) return type === "text/csv" ? "table" : "document";
+		if (type.includes("spreadsheet") || type.includes("excel")) return "table";
+		if (type.includes("word") || type.includes("document")) return "document";
+	}
+	const ext = name.includes(".") ? name.split(".").pop()?.toLowerCase() : void 0;
+	return ext && EXTENSIONS[ext] || "file";
+}
+const KIND_ICON = {
+	file: FileIcon,
+	image: ImageIcon,
+	video: VideoIcon,
+	document: FileTextIcon,
+	table: TableIcon
+};
+/**
+* İstemle birlikte gönderilen ek: tür ikonu (ya da küçük resim), ad, boyut ve durum; yüklenirken
+* ilerleme çubuğu, hatada kırmızı kenar, metin ve "yeniden yükle". Kaldır düğmesi adı dosyayı
+* söyler ("report.pdf dosyasını kaldır").
+*/
+function AttachmentChip({ name, bytes, kind, type, thumbnailSrc, status = "ready", progress, errorMessage, onRemove, onRetry, href, size = "md", isDisabled, className, id }) {
+	const t = useMessages();
+	const locale = useLocale();
+	const statusId = useId();
+	const resolved = kind ?? attachmentKind(name, type);
+	const KindIcon = KIND_ICON[resolved];
+	const nameNode = href ? /* @__PURE__ */ jsx(Link, {
+		className: AttachmentChip_module_default.name,
+		href,
+		isDisabled,
+		children: name
+	}) : /* @__PURE__ */ jsx("span", {
+		className: AttachmentChip_module_default.name,
+		children: name
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		id,
+		className: [AttachmentChip_module_default.root, className].filter(Boolean).join(" "),
+		"data-status": status,
+		"data-size": size,
+		"data-kind": resolved,
+		"data-disabled": isDisabled || void 0,
+		role: "group",
+		"aria-label": name,
+		"aria-describedby": status === "ready" && bytes === void 0 ? void 0 : statusId,
+		children: [
+			/* @__PURE__ */ jsx("span", {
+				className: AttachmentChip_module_default.tile,
+				"aria-hidden": "true",
+				children: resolved === "image" && thumbnailSrc ? /* @__PURE__ */ jsx("img", {
+					className: AttachmentChip_module_default.thumb,
+					src: thumbnailSrc,
+					alt: ""
+				}) : status === "error" ? /* @__PURE__ */ jsx(AlertCircleIcon, {}) : /* @__PURE__ */ jsx(KindIcon, {})
+			}),
+			/* @__PURE__ */ jsxs("span", {
+				className: AttachmentChip_module_default.body,
+				children: [nameNode, /* @__PURE__ */ jsxs("span", {
+					className: AttachmentChip_module_default.meta,
+					id: statusId,
+					children: [status === "uploading" ? /* @__PURE__ */ jsxs("span", { children: [t.aiAttachmentUploading, progress !== void 0 ? ` ${Math.round(progress)}%` : ""] }) : status === "error" ? /* @__PURE__ */ jsx("span", {
+						className: AttachmentChip_module_default.error,
+						children: errorMessage ?? t.aiAttachmentFailed
+					}) : null, status !== "error" && bytes !== void 0 ? /* @__PURE__ */ jsx(FileSize, {
+						value: bytes,
+						locale
+					}) : null]
+				})]
+			}),
+			status === "error" && onRetry ? /* @__PURE__ */ jsx(IconButton, {
+				size: "sm",
+				label: template(t.aiAttachmentRetry, { name }),
+				icon: /* @__PURE__ */ jsx(RefreshIcon, {}),
+				isDisabled,
+				onPress: onRetry
+			}) : null,
+			onRemove ? /* @__PURE__ */ jsx(IconButton, {
+				size: "sm",
+				label: template(t.aiAttachmentRemove, { name }),
+				icon: /* @__PURE__ */ jsx(CloseIcon, {}),
+				isDisabled,
+				onPress: onRemove
+			}) : null,
+			status === "uploading" ? /* @__PURE__ */ jsx("span", {
+				className: AttachmentChip_module_default.progress,
+				children: /* @__PURE__ */ jsx(ProgressBar$1, {
+					"aria-label": name,
+					size: "sm",
+					value: progress ?? 0,
+					isIndeterminate: progress === void 0,
+					valueLabel: progress === void 0 ? void 0 : `${Math.round(progress)}%`
+				})
+			}) : null
+		]
+	});
+}
+export { AttachmentChip, attachmentKind };