@stisocial/ui 0.2.1 → 0.3.0

package/dist/components/AuditLogList/AuditLogList.module.js

@@ -0,0 +1,28 @@
+import './AuditLogList.css';
+// src/components/AuditLogList/AuditLogList.module.css
+var AuditLogList_module_default = {
+	"root": "sti-AuditLogList-root-4407a",
+	"list": "sti-AuditLogList-list-62656",
+	"item": "sti-AuditLogList-item-b8db6",
+	"media": "sti-AuditLogList-media-197b1",
+	"body": "sti-AuditLogList-body-6213c",
+	"head": "sti-AuditLogList-head-e816f",
+	"action": "sti-AuditLogList-action-9d060",
+	"who": "sti-AuditLogList-who-2c120",
+	"meta": "sti-AuditLogList-meta-b3ba8",
+	"actor": "sti-AuditLogList-actor-9dbc4",
+	"email": "sti-AuditLogList-email-9c122",
+	"target": "sti-AuditLogList-target-af192",
+	"metaPart": "sti-AuditLogList-metaPart-44f2d",
+	"ip": "sti-AuditLogList-ip-9f6f7",
+	"dot": "sti-AuditLogList-dot-89c88",
+	"toggle": "sti-AuditLogList-toggle-56831",
+	"chevron": "sti-AuditLogList-chevron-a9483",
+	"details": "sti-AuditLogList-details-a7b35",
+	"detail": "sti-AuditLogList-detail-7383b",
+	"term": "sti-AuditLogList-term-bc8c3",
+	"value": "sti-AuditLogList-value-92938",
+	"more": "sti-AuditLogList-more-e7f24",
+	"empty": "sti-AuditLogList-empty-4f6e6"
+};
+export { AuditLogList_module_default as default };

package/dist/components/AuditLogList/index.d.ts

@@ -0,0 +1,2 @@
+import { AuditLogDetail, AuditLogEntry, AuditLogList, AuditLogListProps, AuditLogResult, maskIpAddress } from "./AuditLogList.js";
+export { AuditLogDetail, AuditLogEntry, AuditLogList, AuditLogListProps, AuditLogResult, maskIpAddress };

package/dist/components/Avatar/Avatar.js

@@ -1,7 +1,7 @@
 "use client";
 import { useLocale, useMessages } from "../../provider/UIProvider.js";
-import { initials } from "../../text/text.js";
 import { UserIcon } from "../../icons/generated/UserIcon.js";
+import { initials } from "../../text/text.js";
 import Avatar_module_default from "./Avatar.module.js";
 import { AvatarGroupContext } from "./context.js";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/components/AvatarGroup/AvatarGroup.js

@@ -1,8 +1,8 @@
 "use client";
 import { useFormatter, useMessages } from "../../provider/UIProvider.js";
 import { template } from "../../text/text.js";
-import { VisuallyHidden } from "../VisuallyHidden/VisuallyHidden.js";
 import { AvatarGroupContext } from "../Avatar/context.js";
+import { VisuallyHidden } from "../VisuallyHidden/VisuallyHidden.js";
 import AvatarGroup_module_default from "./AvatarGroup.module.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Children, isValidElement, useMemo } from "react";

package/dist/components/BulkActionBar/BulkActionBar.css

@@ -0,0 +1,111 @@
+@layer sti.reset, sti.tokens, sti.base, sti.components, sti.variants, sti.utilities;
+@layer sti.components {
+  .sti-BulkActionBar-root-e4f18 {
+    --sti-bulk-bg: var(--sti-bg-accent-subtle);
+    --sti-bulk-fg: var(--sti-fg-accent-strong);
+    min-inline-size: 0;
+    font-family: var(--sti-font-text);
+    container-type: inline-size;
+  }
+
+  .sti-BulkActionBar-root-e4f18[hidden] {
+    display: none;
+  }
+
+  .sti-BulkActionBar-panel-912bd {
+    align-items: center;
+    gap: var(--sti-space-2) var(--sti-space-3);
+    box-sizing: border-box;
+    min-block-size: calc(var(--sti-control-h-sm) + var(--sti-space-4));
+    padding-block: var(--sti-space-2);
+    padding-inline: var(--sti-space-3) var(--sti-space-4);
+    flex-wrap: wrap;
+    display: flex;
+  }
+
+  .sti-BulkActionBar-root-e4f18[data-placement="inline"] .sti-BulkActionBar-panel-912bd {
+    border: var(--sti-border-width) solid transparent;
+    border-radius: var(--sti-radius-lg);
+    background: var(--sti-bulk-bg);
+    color: var(--sti-bulk-fg);
+  }
+
+  .sti-BulkActionBar-root-e4f18[data-placement="floating"] {
+    z-index: var(--sti-z-sticky);
+    inset-inline: var(--sti-space-4);
+    pointer-events: none;
+    justify-content: center;
+    display: flex;
+    position: fixed;
+    inset-block-end: max(var(--sti-space-4), env(safe-area-inset-bottom, 0px));
+  }
+
+  .sti-BulkActionBar-root-e4f18[data-placement="floating"] .sti-BulkActionBar-panel-912bd {
+    pointer-events: auto;
+    max-inline-size: 40rem;
+    animation: sti-BulkActionBar-sti-bulk-in-ebf24 var(--sti-duration-base) var(--sti-ease-out);
+  }
+
+  .sti-BulkActionBar-count-be69f {
+    font-size: var(--sti-font-size-sm);
+    font-variant-numeric: tabular-nums;
+    font-weight: var(--sti-font-weight-semibold);
+    line-height: var(--sti-line-height-sm);
+    flex: none;
+  }
+
+  .sti-BulkActionBar-selectAll-cb7ae {
+    border-radius: var(--sti-radius-xs);
+    color: inherit;
+    font: inherit;
+    font-size: var(--sti-font-size-sm);
+    text-underline-offset: var(--sti-link-underline-offset);
+    cursor: pointer;
+    background: none;
+    border: 0;
+    outline: none;
+    flex: none;
+    padding: 0;
+    text-decoration: underline;
+  }
+
+  .sti-BulkActionBar-selectAll-cb7ae[data-focus-visible] {
+    outline: var(--sti-focus-ring-width) solid var(--sti-focus-ring);
+    outline-offset: var(--sti-focus-ring-offset);
+  }
+
+  .sti-BulkActionBar-actions-3f915 {
+    flex: auto;
+    min-inline-size: 0;
+  }
+
+  .sti-BulkActionBar-clear-d43a3 {
+    flex: none;
+    margin-inline-start: calc(var(--sti-space-2) * -1);
+  }
+
+  @container (width <= 36rem) {
+    .sti-BulkActionBar-actions-3f915 {
+      flex-basis: 100%;
+    }
+  }
+
+  @keyframes sti-BulkActionBar-sti-bulk-in-ebf24 {
+    from {
+      opacity: 0;
+      translate: 0 var(--sti-space-4);
+    }
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    .sti-BulkActionBar-root-e4f18[data-placement="floating"] .sti-BulkActionBar-panel-912bd {
+      animation: none;
+    }
+  }
+
+  @media (forced-colors: active) {
+    .sti-BulkActionBar-root-e4f18[data-placement="inline"] .sti-BulkActionBar-panel-912bd {
+      border-color: canvastext;
+    }
+  }
+}

package/dist/components/BulkActionBar/BulkActionBar.d.ts

@@ -0,0 +1,24 @@
+import { ReactNode } from "react";
+export interface BulkActionBarProps {
+  /** Seçili öğe sayısı; 0 ise çubuk gizlenir. */
+  selectedCount: number;
+  /** Bütün öğelerin sayısı; `onSelectAll` ile birlikte "Bütün N öğeyi seçin" bağlantısını açar. */
+  totalCount?: number;
+  onSelectAll?: () => void;
+  /** Seçimi kaldırır (zorunlu). */
+  onClear: () => void;
+  /** Eylem düğmeleri (araç çubuğunun içine): Arşivle, Dışa aktar, Sil. */
+  children?: ReactNode;
+  /** `inline` (tablonun üstünde, varsayılan) ya da `floating` (ekranın altında ortada). */
+  placement?: "inline" | "floating";
+  /** Bölgenin ve araç çubuğunun adı; varsayılan "Toplu işlemler". */
+  label?: string;
+  className?: string;
+  id?: string;
+}
+/**
+ * Toplu işlem çubuğu: seçim varken belirir; seçim sayısı, isteğe bağlı "Bütün N öğeyi seçin",
+ * eylemler (APG Toolbar) ve "Seçimi kaldır". Seçim değişiklikleri çubuğun dışındaki, her zaman var
+ * olan canlı bölgeden duyurulur (gizli öğenin içindeki canlı bölge okunmaz).
+ */
+export declare function BulkActionBar({ selectedCount, totalCount, onSelectAll, onClear, children, placement, label, className, id }: BulkActionBarProps): import("react").JSX.Element;

package/dist/components/BulkActionBar/BulkActionBar.js

@@ -0,0 +1,82 @@
+"use client";
+import { useFormatter, useMessages } from "../../provider/UIProvider.js";
+import { template } from "../../text/text.js";
+import { VisuallyHidden } from "../VisuallyHidden/VisuallyHidden.js";
+import { IconButton } from "../IconButton/IconButton.js";
+import { CloseIcon } from "../../icons/generated/CloseIcon.js";
+import { Surface } from "../Surface/Surface.js";
+import { Toolbar as Toolbar$1 } from "../Toolbar/Toolbar.js";
+import BulkActionBar_module_default from "./BulkActionBar.module.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from "react";
+import { Button } from "react-aria-components";
+// src/components/BulkActionBar/BulkActionBar.tsx
+/**
+* Toplu işlem çubuğu: seçim varken belirir; seçim sayısı, isteğe bağlı "Bütün N öğeyi seçin",
+* eylemler (APG Toolbar) ve "Seçimi kaldır". Seçim değişiklikleri çubuğun dışındaki, her zaman var
+* olan canlı bölgeden duyurulur (gizli öğenin içindeki canlı bölge okunmaz).
+*/
+function BulkActionBar({ selectedCount, totalCount, onSelectAll, onClear, children, placement = "inline", label, className, id }) {
+	const t = useMessages();
+	const f = useFormatter();
+	const name = label ?? t.bulkActionBarLabel;
+	const countText = template(t.selectedCount, { count: selectedCount });
+	const [announcement, setAnnouncement] = useState("");
+	const previous = useRef(selectedCount);
+	useEffect(() => {
+		if (previous.current === selectedCount) return;
+		setAnnouncement(selectedCount > 0 ? countText : t.bulkActionBarCleared);
+		previous.current = selectedCount;
+	}, [
+		selectedCount,
+		countText,
+		t.bulkActionBarCleared
+	]);
+	const canSelectAll = onSelectAll !== void 0 && totalCount !== void 0 && selectedCount < totalCount;
+	const visible = selectedCount > 0;
+	const content = /* @__PURE__ */ jsxs(Fragment, { children: [
+		/* @__PURE__ */ jsx(IconButton, {
+			label: t.bulkActionBarClear,
+			icon: /* @__PURE__ */ jsx(CloseIcon, {}),
+			variant: "ghost",
+			size: "sm",
+			onPress: onClear,
+			className: BulkActionBar_module_default.clear
+		}),
+		/* @__PURE__ */ jsx("span", {
+			className: BulkActionBar_module_default.count,
+			children: countText
+		}),
+		canSelectAll ? /* @__PURE__ */ jsx(Button, {
+			className: BulkActionBar_module_default.selectAll,
+			onPress: onSelectAll,
+			children: template(t.bulkActionBarSelectAll, { count: f.number(totalCount) })
+		}) : null,
+		children ? /* @__PURE__ */ jsx(Toolbar$1, {
+			"aria-label": name,
+			className: BulkActionBar_module_default.actions,
+			children
+		}) : null
+	] });
+	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(VisuallyHidden, { children: /* @__PURE__ */ jsx("output", {
+		"aria-live": "polite",
+		children: announcement
+	}) }), /* @__PURE__ */ jsx("section", {
+		id,
+		"aria-label": name,
+		hidden: !visible,
+		className: [BulkActionBar_module_default.root, className].filter(Boolean).join(" "),
+		"data-placement": placement,
+		children: placement === "floating" ? /* @__PURE__ */ jsx(Surface, {
+			background: "inverse",
+			radius: "xl",
+			shadow: "lg",
+			className: BulkActionBar_module_default.panel,
+			children: content
+		}) : /* @__PURE__ */ jsx("div", {
+			className: BulkActionBar_module_default.panel,
+			children: content
+		})
+	})] });
+}
+export { BulkActionBar };

package/dist/components/BulkActionBar/BulkActionBar.module.js

@@ -0,0 +1,12 @@
+import './BulkActionBar.css';
+// src/components/BulkActionBar/BulkActionBar.module.css
+var BulkActionBar_module_default = {
+	"root": "sti-BulkActionBar-root-e4f18",
+	"panel": "sti-BulkActionBar-panel-912bd",
+	"sti-bulk-in": "sti-BulkActionBar-sti-bulk-in-ebf24",
+	"count": "sti-BulkActionBar-count-be69f",
+	"selectAll": "sti-BulkActionBar-selectAll-cb7ae",
+	"actions": "sti-BulkActionBar-actions-3f915",
+	"clear": "sti-BulkActionBar-clear-d43a3"
+};
+export { BulkActionBar_module_default as default };

package/dist/components/BulkActionBar/index.d.ts

@@ -0,0 +1,2 @@
+import { BulkActionBar, BulkActionBarProps } from "./BulkActionBar.js";
+export { BulkActionBar, BulkActionBarProps };