zaravand-ui 5.0.1 → 5.1.1

package/dist/components/Avatar/Avatar.d.ts

@@ -0,0 +1,5 @@
+import type { AvatarGroupProps, AvatarProps } from "./Avatar.interface";
+declare function Avatar({ src, alt, name, fallback, size: sizeProp, shape: shapeProp, status, showTooltip, previewable, previewSrc, onClick, onImageSelect, onImageRemove, accept, maxSizeKb, onReject, className, }: AvatarProps): import("react/jsx-runtime").JSX.Element;
+declare function AvatarGroup({ items, children, max, size, shape, showTooltip, className, }: AvatarGroupProps): import("react/jsx-runtime").JSX.Element;
+export { AvatarGroup };
+export default Avatar;

package/dist/components/Avatar/Avatar.interface.d.ts

@@ -0,0 +1,65 @@
+import type * as React from "react";
+import type { UploaderRejection } from "../Uploader/Uploader.interface";
+export type AvatarSize = "xs" | "sm" | "default" | "lg" | "xl";
+export type AvatarShape = "circle" | "square";
+export type AvatarStatus = "online" | "offline" | "busy" | "away";
+export interface AvatarProps {
+    /** Image URL. When missing or failing to load, the fallback is shown. */
+    src?: string;
+    /** Image alt text. Defaults to `name`. */
+    alt?: string;
+    /** Person/entity name — used for the initials fallback, accessible label and tooltip. */
+    name?: string;
+    /** Custom fallback content. Replaces the initials/icon fallback. */
+    fallback?: React.ReactNode;
+    /** @default "default" (or the surrounding `AvatarGroup`'s size) */
+    size?: AvatarSize;
+    /** @default "circle" (or the surrounding `AvatarGroup`'s shape) */
+    shape?: AvatarShape;
+    /** Presence dot at the bottom corner. */
+    status?: AvatarStatus;
+    /** Shows `name` in a tooltip on hover/focus. */
+    showTooltip?: boolean;
+    /**
+     * When the image has loaded: shows a magnifier on hover and opens the image in a full-screen preview on click.
+     * @default true when `onClick` is not set
+     */
+    previewable?: boolean;
+    /** Larger image used in the preview. Defaults to `src`. */
+    previewSrc?: string;
+    /** Makes the avatar a button. Takes precedence over the preview click unless `previewable` is set explicitly. */
+    onClick?: React.MouseEventHandler<HTMLButtonElement>;
+    /** Enables editing: shows a camera button that picks a new image. The consumer updates `src`. */
+    onImageSelect?: (file: File) => void;
+    /** Shows a "remove image" action in the preview. */
+    onImageRemove?: () => void;
+    /** @default "image/*" */
+    accept?: string;
+    /** Max size of the picked image in kilobytes. */
+    maxSizeKb?: number;
+    /** Called with a rejected image. When omitted, an error toast is shown. */
+    onReject?: (rejection: UploaderRejection) => void;
+    className?: string;
+}
+export type AvatarGroupItem = Omit<AvatarProps, "size" | "shape"> & {
+    /** React key. Defaults to `name`/index. */
+    key?: string;
+};
+export interface AvatarGroupProps {
+    /** Data-driven usage. When provided, `children` is ignored. */
+    items?: AvatarGroupItem[];
+    /** Manual composition with `<Avatar>` children. */
+    children?: React.ReactNode;
+    /** Maximum avatars shown before collapsing the rest into a "+N" chip. */
+    max?: number;
+    /** @default "default" */
+    size?: AvatarSize;
+    /** @default "circle" */
+    shape?: AvatarShape;
+    /**
+     * Tooltip with the name on each avatar (items mode) and the hidden names on the "+N" chip.
+     * @default true
+     */
+    showTooltip?: boolean;
+    className?: string;
+}

package/dist/components/Avatar/Avatar.utils.d.ts

@@ -0,0 +1,6 @@
+/**
+ * First letter of the first and last word. Persian/Arabic letters are joined with a ZWNJ so
+ * they render as two separate letters ("م‌ط") instead of connecting into one word ("مط").
+ */
+declare function getInitials(name: string | undefined): string;
+export { getInitials };

package/dist/components/Avatar/Avatar.variant.d.ts

@@ -0,0 +1,22 @@
+declare const avatarVariants: (props?: ({
+    size?: "xs" | "sm" | "default" | "lg" | "xl" | null | undefined;
+    shape?: "circle" | "square" | null | undefined;
+    interactive?: boolean | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare const avatarStatusVariants: (props?: ({
+    status?: "online" | "offline" | "busy" | "away" | null | undefined;
+    size?: "xs" | "sm" | "default" | "lg" | "xl" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare const avatarEditButtonVariants: (props?: ({
+    size?: "xs" | "sm" | "default" | "lg" | "xl" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+/** Overlap for `AvatarGroup` children (RTL-aware via margin-inline-start on every item but the first). */
+declare const avatarGroupOverlapBySize: {
+    readonly xs: "zui:[&>*:not(:first-child)]:-ms-1.5";
+    readonly sm: "zui:[&>*:not(:first-child)]:-ms-2";
+    readonly default: "zui:[&>*:not(:first-child)]:-ms-2.5";
+    readonly lg: "zui:[&>*:not(:first-child)]:-ms-3";
+    readonly xl: "zui:[&>*:not(:first-child)]:-ms-4";
+};
+declare const avatarPreviewContentClassName = "zui:relative zui:z-[110] zui:flex zui:max-w-[92vw] zui:flex-col zui:items-center zui:gap-3 zui:outline-none zui:duration-300 zui:ease-out zui:data-[state=open]:animate-in zui:data-[state=open]:fade-in-0 zui:data-[state=open]:zoom-in-75 zui:data-[state=closed]:animate-out zui:data-[state=closed]:fade-out-0 zui:data-[state=closed]:zoom-out-90";
+export { avatarEditButtonVariants, avatarGroupOverlapBySize, avatarPreviewContentClassName, avatarStatusVariants, avatarVariants, };

package/dist/components/Toast/Toast.variant.d.ts

@@ -1,6 +1,6 @@
 declare const toastViewportVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 declare const toastVariants: (props?: ({
-    variant?: "success" | "warning" | "default" | "error" | "info" | "destructive" | null | undefined;
+    variant?: "success" | "warning" | "default" | "info" | "error" | "destructive" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 declare const toastActionVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 declare const toastCloseVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;

package/dist/components/Uploader/Uploader.d.ts

@@ -0,0 +1,3 @@
+import type { UploaderProps } from "./Uploader.interface";
+declare function Uploader({ type, size, title, required, showRequiredMessage, placeholder, id, name, form, disabled, readOnly, className, accept, maxSizeKb, files, defaultFiles, onFilesChange, attachments, onAttachmentsChange, onAttachmentDelete, onPreview, onDownload, onReject, open, defaultOpen, onOpenChange, onInvalid, }: UploaderProps): import("react/jsx-runtime").JSX.Element;
+export default Uploader;

package/dist/components/Uploader/Uploader.interface.d.ts

@@ -0,0 +1,78 @@
+import type * as React from "react";
+import type { VariantProps } from "class-variance-authority";
+import { uploaderFieldVariants } from "./Uploader.variant";
+/** A file that already lives on the server (e.g. loaded with the entity being edited). */
+export interface UploaderAttachment {
+    /** Stable identity (storage key, id, ...). Used as the React key and for delete. */
+    key: string;
+    /** Display name. */
+    name: string;
+    /** Direct URL used by the built-in preview/download actions. */
+    url?: string;
+    /** Size in bytes, shown next to the name when provided. */
+    size?: number;
+}
+/** One row of the uploader: either a freshly picked local file or an existing server attachment. */
+export type UploaderItem = {
+    kind: "local";
+    file: File;
+} | {
+    kind: "attachment";
+    attachment: UploaderAttachment;
+};
+export type UploaderRejectReason = "size" | "type";
+export interface UploaderRejection {
+    file: File;
+    reason: UploaderRejectReason;
+}
+export interface UploaderProps extends VariantProps<typeof uploaderFieldVariants> {
+    /**
+     * `"single"` keeps at most one file; `"multi"` collects a list shown in a dropdown.
+     * @default "single"
+     */
+    type?: "single" | "multi";
+    title?: string;
+    required?: boolean;
+    /**
+     * When true and `required` is true, shows a "این فیلد اجباری است" hint next to the required star.
+     * @default false
+     */
+    showRequiredMessage?: boolean;
+    placeholder?: string;
+    id?: string;
+    /** When set, the picked local files are also submitted with a native `<form>` under this name. */
+    name?: string;
+    form?: string;
+    disabled?: boolean;
+    /** Shows the files with preview/download only — no picking, dropping or deleting. */
+    readOnly?: boolean;
+    className?: string;
+    /** Same syntax as the native `accept` attribute. Also enforced on picked and dropped files. */
+    accept?: string;
+    /** Maximum size of a single file in kilobytes. */
+    maxSizeKb?: number;
+    /** Controlled local files. */
+    files?: File[];
+    /** Initial local files (uncontrolled). */
+    defaultFiles?: File[];
+    onFilesChange?: (files: File[]) => void;
+    /** Existing server files. Always controlled. */
+    attachments?: UploaderAttachment[];
+    onAttachmentsChange?: (attachments: UploaderAttachment[]) => void;
+    /**
+     * Called before an attachment is removed (e.g. to send the DELETE request).
+     * Returning / resolving `false` keeps the attachment.
+     */
+    onAttachmentDelete?: (attachment: UploaderAttachment) => boolean | void | Promise<boolean | void>;
+    /** Replaces the built-in preview (open in a new tab). Also enables preview for attachments without `url`. */
+    onPreview?: (item: UploaderItem) => void;
+    /** Replaces the built-in download. Also enables download for attachments without `url`. */
+    onDownload?: (item: UploaderItem) => void;
+    /** Called with files rejected by `accept`/`maxSizeKb`. When omitted, an error toast is shown instead. */
+    onReject?: (rejections: UploaderRejection[]) => void;
+    /** Controlled open state of the multi-mode file list. */
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    onInvalid?: React.FormEventHandler<HTMLInputElement>;
+}

package/dist/components/Uploader/Uploader.utils.d.ts

@@ -0,0 +1,17 @@
+import type { UploaderItem, UploaderRejection } from "./Uploader.interface";
+declare function dedupeFiles(files: File[]): File[];
+/** Mirrors the native `accept` attribute: `.ext`, `type/*` and exact MIME tokens. */
+declare function matchesAccept(file: File, accept: string | undefined): boolean;
+declare function splitAcceptedFiles(files: File[], accept: string | undefined, maxSizeKb: number | undefined): {
+    accepted: File[];
+    rejected: UploaderRejection[];
+};
+declare function toPersianNumber(value: number, fractionDigits?: number): string;
+declare function formatFileSize(bytes: number): string;
+declare function describeRejection({ file, reason }: UploaderRejection, maxSizeKb: number | undefined): string;
+declare function getItemName(item: UploaderItem): string;
+declare function getItemSize(item: UploaderItem): number | undefined;
+declare function getItemKey(item: UploaderItem): string;
+declare function previewItemInNewTab(item: UploaderItem): void;
+declare function downloadItem(item: UploaderItem): void;
+export { dedupeFiles, describeRejection, downloadItem, formatFileSize, getItemKey, getItemName, getItemSize, matchesAccept, previewItemInNewTab, splitAcceptedFiles, toPersianNumber, };

package/dist/components/Uploader/Uploader.variant.d.ts

@@ -0,0 +1,8 @@
+declare const uploaderFieldVariants: (props?: ({
+    size?: "sm" | "default" | "lg" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare const uploaderIconButtonClassName = "zui:inline-flex zui:size-7 zui:shrink-0 zui:cursor-pointer zui:items-center zui:justify-center zui:rounded-md zui:border-0 zui:bg-transparent zui:p-0 zui:text-[var(--zui-color-text)] zui:outline-none zui:transition-[background-color,opacity,transform] zui:duration-200 zui:hover:bg-[var(--zui-theme-bg-muted)] zui:focus-visible:bg-[var(--zui-theme-bg-muted)] zui:focus-visible:shadow-[0_0_0_1px_var(--zui-theme-action-primary)] zui:disabled:pointer-events-none zui:disabled:cursor-not-allowed zui:disabled:opacity-40 zui:[&>svg]:size-4 zui:[&>svg]:transition-transform zui:[&>svg]:duration-200 zui:hover:[&>svg]:scale-110";
+declare const uploaderDangerIconClassName = "zui:text-[var(--zui-theme-status-danger)]";
+declare const uploaderContentVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+declare const uploaderRowClassName = "zui:flex zui:min-h-11 zui:items-center zui:gap-2 zui:border-b zui:border-[var(--zui-color-border)] zui:px-2 zui:py-1.5 zui:transition-colors zui:duration-150 zui:last:border-b-0 zui:hover:bg-[var(--zui-theme-bg-muted)]";
+export { uploaderContentVariants, uploaderDangerIconClassName, uploaderFieldVariants, uploaderIconButtonClassName, uploaderRowClassName, };