@kashi-ui/react 0.0.0-stage → 0.2.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Kashi contributors
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,3 +1,25 @@
-# Temporary Holding Version
+# @kashi-ui/react
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+کامپوننت‌های React [کاشی](https://github.com/Sepantapouya/Kashi)، دیزاین‌سیستم فارسی، دسترس‌پذیر و متن‌باز.
+
+```bash
+npm i @kashi-ui/react @kashi-ui/css
+```
+
+```tsx
+import "@kashi-ui/css";
+import { Button, Input } from "@kashi-ui/react";
+
+export function SignUp() {
+  return (
+    <form>
+      <Input label="ایمیل" type="email" required />
+      <Button variant="primary" type="submit">ثبت‌نام</Button>
+    </form>
+  );
+}
+```
+
+کامپوننت‌ها: Button · Input · Textarea · Badge · Card · Alert · Avatar · AvatarGroup · Checkbox · Switch
+
+نیازمند React ۱۸ یا بالاتر. مستندات کامل: [kashi.sepantapouya.com](https://kashi.sepantapouya.com) · کد: [GitHub](https://github.com/Sepantapouya/Kashi) · لایسنس MIT

package/dist/Alert.d.ts

@@ -0,0 +1,18 @@
+import { type HTMLAttributes, type ReactNode } from "react";
+export type AlertTone = "neutral" | "brand" | "info" | "success" | "warning" | "error";
+export interface AlertProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
+    /** @default "neutral" */
+    tone?: AlertTone;
+    title?: ReactNode;
+    /** آیکون سفارشی؛ false برای حذف */
+    icon?: ReactNode | false;
+    /** دکمه‌ها یا لینک‌های زیر متن */
+    actions?: ReactNode;
+    /** با دادن این تابع دکمهٔ بستن نمایش داده می‌شود */
+    onClose?: () => void;
+    /** @default "بستن" */
+    closeLabel?: string;
+    /** پس‌زمینهٔ رنگی کم‌رنگ */
+    tinted?: boolean;
+}
+export declare const Alert: import("react").ForwardRefExoticComponent<AlertProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/Alert.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { cx } from "./cx.js";
+import { CloseIcon, ErrorIcon, InfoIcon, SuccessIcon, WarningIcon } from "./icons.js";
+const ICONS = {
+    neutral: InfoIcon,
+    brand: InfoIcon,
+    info: InfoIcon,
+    success: SuccessIcon,
+    warning: WarningIcon,
+    error: ErrorIcon,
+};
+export const Alert = forwardRef(function Alert({ tone = "neutral", title, icon, actions, onClose, closeLabel = "بستن", tinted = false, role, className, children, ...rest }, ref) {
+    const Icon = ICONS[tone];
+    return (_jsxs("div", { ref: ref, 
+        // خطا و هشدار فوراً خوانده می‌شوند؛ بقیه مؤدبانه
+        role: role ?? (tone === "error" || tone === "warning" ? "alert" : "status"), className: cx("k-alert", tone !== "neutral" && `k-alert--${tone}`, tinted && "k-alert--tinted", className), ...rest, children: [icon !== false && _jsx("span", { className: "k-alert__icon", "aria-hidden": "true", children: icon ?? _jsx(Icon, {}) }), _jsxs("div", { className: "k-alert__content", children: [title && _jsx("p", { className: "k-alert__title", children: title }), children && _jsx("div", { className: "k-alert__description", children: children }), actions && _jsx("div", { className: "k-alert__actions", children: actions })] }), onClose && (_jsx("button", { type: "button", className: "k-btn k-btn--tertiary k-btn--icon k-btn--sm k-alert__close", "aria-label": closeLabel, onClick: onClose, children: _jsx(CloseIcon, {}) }))] }));
+});

package/dist/Avatar.d.ts

@@ -0,0 +1,29 @@
+import { type HTMLAttributes, type ReactNode } from "react";
+export type AvatarSize = "xs" | "sm" | "md" | "lg" | "xl" | "2xl";
+export type AvatarStatus = "online" | "offline" | "busy" | "away";
+/** حروف اول دو کلمهٔ اول؛ با نیم‌فاصله تا حروف فارسی به هم نچسبند */
+export declare function initials(name: string): string;
+export interface AvatarProps extends HTMLAttributes<HTMLSpanElement> {
+    /** نام شخص — برای alt تصویر و حروف اول جایگزین */
+    name: string;
+    src?: string;
+    /** @default "md" */
+    size?: AvatarSize;
+    square?: boolean;
+    /** رنگ برند برای حالت حروف اول */
+    brand?: boolean;
+    status?: AvatarStatus;
+    /** برچسب‌های وضعیت برای صفحه‌خوان (پیش‌فرض فارسی) */
+    statusLabels?: Partial<Record<AvatarStatus, string>>;
+}
+export declare const Avatar: import("react").ForwardRefExoticComponent<AvatarProps & import("react").RefAttributes<HTMLSpanElement>>;
+export interface AvatarGroupProps extends HTMLAttributes<HTMLDivElement> {
+    /** حداکثر تعداد نمایش؛ بقیه به شکل «+۳» */
+    max?: number;
+    /** اندازهٔ آواتار «+n» @default "md" */
+    size?: AvatarSize;
+    /** @default (n) => `${n} نفر دیگر` */
+    moreLabel?: (count: number) => string;
+    children: ReactNode;
+}
+export declare function AvatarGroup({ max, size, moreLabel, className, children, ...rest }: AvatarGroupProps): import("react").JSX.Element;

package/dist/Avatar.js

@@ -0,0 +1,32 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Children, forwardRef, useState } from "react";
+import { cx } from "./cx.js";
+import { toFaDigits } from "./utils.js";
+const STATUS_LABEL = {
+    online: "آنلاین",
+    offline: "آفلاین",
+    busy: "مشغول",
+    away: "غایب",
+};
+/** حروف اول دو کلمهٔ اول؛ با نیم‌فاصله تا حروف فارسی به هم نچسبند */
+export function initials(name) {
+    return name
+        .trim()
+        .split(/\s+/)
+        .slice(0, 2)
+        .map((w) => w[0])
+        .join("‌")
+        .toUpperCase();
+}
+export const Avatar = forwardRef(function Avatar({ name, src, size = "md", square = false, brand = false, status, statusLabels, className, ...rest }, ref) {
+    const [failed, setFailed] = useState(false);
+    const showImage = src && !failed;
+    const statusText = status ? (statusLabels?.[status] ?? STATUS_LABEL[status]) : undefined;
+    return (_jsxs("span", { ref: ref, role: "img", "aria-label": statusText ? `${name}، ${statusText}` : name, className: cx("k-avatar", size !== "md" && `k-avatar--${size}`, square && "k-avatar--square", brand && "k-avatar--brand", className), ...rest, children: [showImage ? (_jsx("img", { className: "k-avatar__image", src: src, alt: "", onError: () => setFailed(true) })) : (_jsx("span", { "aria-hidden": "true", children: initials(name) })), status && _jsx("span", { className: `k-avatar__status k-avatar__status--${status}`, "aria-hidden": "true" })] }));
+});
+export function AvatarGroup({ max, size = "md", moreLabel = (n) => `${toFaDigits(n)} نفر دیگر`, className, children, ...rest }) {
+    const items = Children.toArray(children);
+    const visible = max ? items.slice(0, max) : items;
+    const extra = items.length - visible.length;
+    return (_jsxs("div", { role: "group", className: cx("k-avatar-group", className), ...rest, children: [visible, extra > 0 && (_jsx("span", { role: "img", "aria-label": moreLabel(extra), className: cx("k-avatar", size !== "md" && `k-avatar--${size}`), children: _jsxs("span", { "aria-hidden": "true", children: ["+", toFaDigits(extra)] }) }))] }));
+}

package/dist/Badge.d.ts

@@ -0,0 +1,13 @@
+import { type HTMLAttributes } from "react";
+export type BadgeTone = "neutral" | "brand" | "error" | "warning" | "success" | "info";
+export interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {
+    /** @default "neutral" */
+    tone?: BadgeTone;
+    /** @default "md" */
+    size?: "sm" | "md" | "lg";
+    /** نقطهٔ رنگی ابتدای متن */
+    dot?: boolean;
+    /** گوشهٔ کم به‌جای گرد */
+    square?: boolean;
+}
+export declare const Badge: import("react").ForwardRefExoticComponent<BadgeProps & import("react").RefAttributes<HTMLSpanElement>>;

package/dist/Badge.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { cx } from "./cx.js";
+export const Badge = forwardRef(function Badge({ tone = "neutral", size = "md", dot = false, square = false, className, children, ...rest }, ref) {
+    return (_jsxs("span", { ref: ref, className: cx("k-badge", tone !== "neutral" && `k-badge--${tone}`, size !== "md" && `k-badge--${size}`, square && "k-badge--square", className), ...rest, children: [dot && _jsx("span", { className: "k-badge__dot", "aria-hidden": "true" }), children] }));
+});

package/dist/Button.d.ts

@@ -0,0 +1,22 @@
+import { type ButtonHTMLAttributes, type ReactNode } from "react";
+export type ButtonVariant = "primary" | "secondary" | "tertiary" | "link" | "danger" | "danger-secondary";
+export type ButtonSize = "sm" | "md" | "lg" | "xl";
+export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    /** @default "secondary" */
+    variant?: ButtonVariant;
+    /** @default "md" */
+    size?: ButtonSize;
+    /** نمایش اسپینر؛ دکمه فوکوس‌پذیر می‌ماند ولی کلیک نمی‌گیرد */
+    loading?: boolean;
+    /** متنی که صفحه‌خوان هنگام بارگذاری می‌خواند @default "در حال بارگذاری" */
+    loadingLabel?: string;
+    /** دکمهٔ تمام‌عرض */
+    block?: boolean;
+    /** دکمهٔ مربعی فقط‌آیکون — حتماً aria-label بدهید */
+    iconOnly?: boolean;
+    /** آیکون ابتدای متن (در RTL سمت راست) */
+    iconStart?: ReactNode;
+    /** آیکون انتهای متن (در RTL سمت چپ) */
+    iconEnd?: ReactNode;
+}
+export declare const Button: import("react").ForwardRefExoticComponent<ButtonProps & import("react").RefAttributes<HTMLButtonElement>>;

package/dist/Button.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { cx } from "./cx.js";
+import { isDev } from "./utils.js";
+export const Button = forwardRef(function Button({ variant = "secondary", size = "md", loading = false, loadingLabel = "در حال بارگذاری", block = false, iconOnly = false, iconStart, iconEnd, disabled, type = "button", className, children, onClick, ...rest }, ref) {
+    if (isDev() && iconOnly && !rest["aria-label"] && !rest["aria-labelledby"]) {
+        console.warn("[kashi] <Button iconOnly> بدون aria-label برای صفحه‌خوان‌ها بی‌نام است.");
+    }
+    return (_jsxs("button", { ref: ref, type: type, disabled: disabled, "aria-disabled": loading || undefined, "aria-busy": loading || undefined, onClick: loading ? (e) => e.preventDefault() : onClick, className: cx("k-btn", `k-btn--${variant}`, size !== "md" && `k-btn--${size}`, block && "k-btn--block", iconOnly && "k-btn--icon", className), ...rest, children: [iconStart, children, iconEnd, loading && (_jsx("span", { className: "k-sr-only", role: "status", children: loadingLabel }))] }));
+});

package/dist/Card.d.ts

@@ -0,0 +1,26 @@
+import { type ElementType, type HTMLAttributes } from "react";
+export interface CardProps extends HTMLAttributes<HTMLElement> {
+    /** @default "article" */
+    as?: ElementType;
+    /** بدون سایه */
+    flat?: boolean;
+    /** کارت قابل‌کلیک؛ یک لینک یا دکمه با کلاس k-card__link داخلش بگذارید */
+    interactive?: boolean;
+}
+export declare const Card: import("react").ForwardRefExoticComponent<CardProps & import("react").RefAttributes<HTMLElement>>;
+export declare const CardHeader: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLElement> & {
+    as?: ElementType;
+} & import("react").RefAttributes<HTMLElement>>;
+/** پیش‌فرض h3؛ با as سطح عنوان را با ساختار صفحه هماهنگ کنید */
+export declare const CardTitle: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLElement> & {
+    as?: ElementType;
+} & import("react").RefAttributes<HTMLElement>>;
+export declare const CardDescription: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLElement> & {
+    as?: ElementType;
+} & import("react").RefAttributes<HTMLElement>>;
+export declare const CardBody: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLElement> & {
+    as?: ElementType;
+} & import("react").RefAttributes<HTMLElement>>;
+export declare const CardFooter: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLElement> & {
+    as?: ElementType;
+} & import("react").RefAttributes<HTMLElement>>;

package/dist/Card.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { cx } from "./cx.js";
+export const Card = forwardRef(function Card({ as: Tag = "article", flat = false, interactive = false, className, ...rest }, ref) {
+    return _jsx(Tag, { ref: ref, className: cx("k-card", flat && "k-card--flat", interactive && "k-card--interactive", className), ...rest });
+});
+const part = (tag, base, name) => {
+    const Part = forwardRef(function Part({ as: Tag = tag, className, ...rest }, ref) {
+        return _jsx(Tag, { ref: ref, className: cx(base, className), ...rest });
+    });
+    Part.displayName = name;
+    return Part;
+};
+export const CardHeader = part("header", "k-card__header", "CardHeader");
+/** پیش‌فرض h3؛ با as سطح عنوان را با ساختار صفحه هماهنگ کنید */
+export const CardTitle = part("h3", "k-card__title", "CardTitle");
+export const CardDescription = part("p", "k-card__description", "CardDescription");
+export const CardBody = part("div", "k-card__body", "CardBody");
+export const CardFooter = part("footer", "k-card__footer", "CardFooter");

package/dist/Checkbox.d.ts

@@ -0,0 +1,22 @@
+import { type InputHTMLAttributes, type ReactNode } from "react";
+interface CheckOwnProps {
+    /** برچسب کنار کنترل */
+    label?: ReactNode;
+    /** توضیح زیر برچسب */
+    description?: ReactNode;
+    /** حالت خطا */
+    invalid?: boolean;
+}
+export interface CheckboxProps extends CheckOwnProps, Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "size"> {
+    /** حالت نیمه‌انتخاب (مثلاً برای «انتخاب همه») */
+    indeterminate?: boolean;
+    /** @default "md" */
+    size?: "md" | "lg";
+}
+export declare const Checkbox: import("react").ForwardRefExoticComponent<CheckboxProps & import("react").RefAttributes<HTMLInputElement>>;
+export interface SwitchProps extends CheckOwnProps, Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "size" | "role"> {
+    /** @default "md" */
+    size?: "sm" | "md" | "lg";
+}
+export declare const Switch: import("react").ForwardRefExoticComponent<SwitchProps & import("react").RefAttributes<HTMLInputElement>>;
+export {};

package/dist/Checkbox.js

@@ -0,0 +1,26 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, useEffect, useId, useRef } from "react";
+import { cx } from "./cx.js";
+import { mergeRefs } from "./utils.js";
+/** برچسب و توضیح مشترک بین Checkbox و Switch */
+function CheckLabel({ id, label, description, className, children }) {
+    if (!label && !description)
+        return _jsx(_Fragment, { children: children });
+    return (_jsxs("label", { className: cx("k-check", className), htmlFor: id, children: [children, _jsxs("span", { className: "k-check__text", children: [label && _jsx("span", { className: "k-check__label", children: label }), description && _jsx("span", { className: "k-check__description", id: `${id}-desc`, children: description })] })] }));
+}
+export const Checkbox = forwardRef(function Checkbox({ label, description, invalid, indeterminate = false, size = "md", id, className, ...rest }, ref) {
+    const autoId = useId();
+    const inputId = id ?? autoId;
+    const inner = useRef(null);
+    // indeterminate فقط از طریق DOM قابل‌تنظیم است
+    useEffect(() => {
+        if (inner.current)
+            inner.current.indeterminate = indeterminate;
+    }, [indeterminate]);
+    return (_jsx(CheckLabel, { id: inputId, label: label, description: description, className: className, children: _jsx("input", { ref: mergeRefs(ref, inner), type: "checkbox", id: inputId, className: cx("k-checkbox", size === "lg" && "k-checkbox--lg", !label && !description && className), "aria-invalid": invalid || undefined, "aria-describedby": description ? `${inputId}-desc` : undefined, "data-indeterminate": indeterminate || undefined, ...rest }) }));
+});
+export const Switch = forwardRef(function Switch({ label, description, invalid, size = "md", id, className, ...rest }, ref) {
+    const autoId = useId();
+    const inputId = id ?? autoId;
+    return (_jsx(CheckLabel, { id: inputId, label: label, description: description, className: className, children: _jsx("input", { ref: ref, type: "checkbox", role: "switch", id: inputId, className: cx("k-switch", size !== "md" && `k-switch--${size}`, !label && !description && className), "aria-invalid": invalid || undefined, "aria-describedby": description ? `${inputId}-desc` : undefined, ...rest }) }));
+});

package/dist/Field.d.ts

@@ -0,0 +1,16 @@
+import { type ReactNode } from "react";
+export interface FieldProps {
+    id: string;
+    label?: ReactNode;
+    hint?: ReactNode;
+    error?: ReactNode;
+    required?: boolean;
+    className?: string;
+    children: ReactNode;
+}
+/** شناسهٔ متن‌های راهنما و خطا برای aria-describedby */
+export declare const hintId: (id: string) => string;
+export declare const errorId: (id: string) => string;
+export declare function describedBy(id: string, hint: unknown, error: unknown, extra?: string): string | undefined;
+/** قالب مشترک برچسب + کنترل + راهنما/خطا */
+export declare function Field({ id, label, hint, error, required, className, children }: FieldProps): import("react").JSX.Element;

package/dist/Field.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/** شناسهٔ متن‌های راهنما و خطا برای aria-describedby */
+export const hintId = (id) => `${id}-hint`;
+export const errorId = (id) => `${id}-error`;
+export function describedBy(id, hint, error, extra) {
+    return [extra, error ? errorId(id) : null, hint ? hintId(id) : null].filter(Boolean).join(" ") || undefined;
+}
+/** قالب مشترک برچسب + کنترل + راهنما/خطا */
+export function Field({ id, label, hint, error, required, className, children }) {
+    return (_jsxs("div", { className: className ? `k-field ${className}` : "k-field", children: [label && (_jsxs("label", { className: "k-label", htmlFor: id, children: [label, required && _jsx("span", { className: "k-label__required", "aria-hidden": "true", children: "*" })] })), children, error && _jsx("p", { className: "k-hint k-hint--error", id: errorId(id), children: error }), hint && _jsx("p", { className: "k-hint", id: hintId(id), children: hint })] }));
+}

package/dist/Input.d.ts

@@ -0,0 +1,25 @@
+import { type InputHTMLAttributes, type ReactNode, type TextareaHTMLAttributes } from "react";
+export type InputSize = "sm" | "md" | "lg";
+interface FieldOwnProps {
+    /** برچسب بالای فیلد — اگر نمی‌دهید حتماً aria-label بدهید */
+    label?: ReactNode;
+    /** متن راهنمای زیر فیلد */
+    hint?: ReactNode;
+    /** پیام خطا؛ فیلد را aria-invalid می‌کند */
+    error?: ReactNode;
+    /** کلاس روی ظرف بیرونی (k-field) */
+    fieldClassName?: string;
+}
+export interface InputProps extends FieldOwnProps, Omit<InputHTMLAttributes<HTMLInputElement>, "size"> {
+    /** @default "md" */
+    size?: InputSize;
+    /** آیکون یا متن ابتدای فیلد */
+    addonStart?: ReactNode;
+    /** آیکون یا متن انتهای فیلد */
+    addonEnd?: ReactNode;
+}
+export declare const Input: import("react").ForwardRefExoticComponent<InputProps & import("react").RefAttributes<HTMLInputElement>>;
+export interface TextareaProps extends FieldOwnProps, TextareaHTMLAttributes<HTMLTextAreaElement> {
+}
+export declare const Textarea: import("react").ForwardRefExoticComponent<TextareaProps & import("react").RefAttributes<HTMLTextAreaElement>>;
+export {};

package/dist/Input.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, useId } from "react";
+import { cx } from "./cx.js";
+import { Field, describedBy } from "./Field.js";
+export const Input = forwardRef(function Input({ label, hint, error, size = "md", addonStart, addonEnd, required, id, className, fieldClassName, "aria-describedby": ariaDescribedBy, ...rest }, ref) {
+    const autoId = useId();
+    const inputId = id ?? autoId;
+    return (_jsx(Field, { id: inputId, label: label, hint: hint, error: error, required: required, className: fieldClassName, children: _jsxs("div", { className: cx("k-input", size !== "md" && `k-input--${size}`, className), children: [addonStart && _jsx("span", { className: "k-input__addon", children: addonStart }), _jsx("input", { ref: ref, id: inputId, className: "k-input__control", required: required, "aria-invalid": error ? true : undefined, "aria-describedby": describedBy(inputId, hint, error, ariaDescribedBy), ...rest }), addonEnd && _jsx("span", { className: "k-input__addon", children: addonEnd })] }) }));
+});
+export const Textarea = forwardRef(function Textarea({ label, hint, error, required, id, className, fieldClassName, "aria-describedby": ariaDescribedBy, ...rest }, ref) {
+    const autoId = useId();
+    const inputId = id ?? autoId;
+    return (_jsx(Field, { id: inputId, label: label, hint: hint, error: error, required: required, className: fieldClassName, children: _jsx("div", { className: cx("k-input", "k-input--textarea", className), children: _jsx("textarea", { ref: ref, id: inputId, className: "k-input__control", required: required, "aria-invalid": error ? true : undefined, "aria-describedby": describedBy(inputId, hint, error, ariaDescribedBy), ...rest }) }) }));
+});

package/dist/cx.d.ts

@@ -0,0 +1,2 @@
+/** کلاس‌ها را به هم می‌چسباند و مقادیر خالی را نادیده می‌گیرد */
+export declare function cx(...parts: Array<string | false | null | undefined>): string;

package/dist/cx.js

@@ -0,0 +1,4 @@
+/** کلاس‌ها را به هم می‌چسباند و مقادیر خالی را نادیده می‌گیرد */
+export function cx(...parts) {
+    return parts.filter(Boolean).join(" ");
+}

package/dist/icons.d.ts

@@ -0,0 +1,5 @@
+export declare const InfoIcon: () => import("react").JSX.Element;
+export declare const SuccessIcon: () => import("react").JSX.Element;
+export declare const WarningIcon: () => import("react").JSX.Element;
+export declare const ErrorIcon: () => import("react").JSX.Element;
+export declare const CloseIcon: () => import("react").JSX.Element;

package/dist/icons.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// آیکون‌های داخلی کوچک — همه aria-hidden هستند
+const base = {
+    viewBox: "0 0 20 20",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: 1.7,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    "aria-hidden": true,
+};
+export const InfoIcon = () => (_jsxs("svg", { ...base, children: [_jsx("circle", { cx: "10", cy: "10", r: "7.5" }), _jsx("path", { d: "M10 13.5V9.5M10 6.5h.01" })] }));
+export const SuccessIcon = () => (_jsxs("svg", { ...base, children: [_jsx("circle", { cx: "10", cy: "10", r: "7.5" }), _jsx("path", { d: "m6.75 10 2.25 2.25 4.25-4.5" })] }));
+export const WarningIcon = () => (_jsxs("svg", { ...base, children: [_jsx("path", { d: "M8.6 3.4 2.4 14a1.6 1.6 0 0 0 1.4 2.4h12.4a1.6 1.6 0 0 0 1.4-2.4L11.4 3.4a1.6 1.6 0 0 0-2.8 0Z" }), _jsx("path", { d: "M10 7.5v3.25M10 13.5h.01" })] }));
+export const ErrorIcon = () => (_jsxs("svg", { ...base, children: [_jsx("circle", { cx: "10", cy: "10", r: "7.5" }), _jsx("path", { d: "M10 6.5v4M10 13.5h.01" })] }));
+export const CloseIcon = () => (_jsx("svg", { ...base, children: _jsx("path", { d: "m5 5 10 10M15 5 5 15" }) }));

package/dist/index.d.ts

@@ -0,0 +1,16 @@
+export { Button } from "./Button.js";
+export type { ButtonProps, ButtonVariant, ButtonSize } from "./Button.js";
+export { Input, Textarea } from "./Input.js";
+export type { InputProps, InputSize, TextareaProps } from "./Input.js";
+export { Badge } from "./Badge.js";
+export type { BadgeProps, BadgeTone } from "./Badge.js";
+export { Card, CardHeader, CardTitle, CardDescription, CardBody, CardFooter } from "./Card.js";
+export type { CardProps } from "./Card.js";
+export { Alert } from "./Alert.js";
+export type { AlertProps, AlertTone } from "./Alert.js";
+export { Avatar, AvatarGroup, initials } from "./Avatar.js";
+export type { AvatarProps, AvatarGroupProps, AvatarSize, AvatarStatus } from "./Avatar.js";
+export { Checkbox, Switch } from "./Checkbox.js";
+export type { CheckboxProps, SwitchProps } from "./Checkbox.js";
+export { cx } from "./cx.js";
+export { toFaDigits } from "./utils.js";

package/dist/index.js

@@ -0,0 +1,9 @@
+export { Button } from "./Button.js";
+export { Input, Textarea } from "./Input.js";
+export { Badge } from "./Badge.js";
+export { Card, CardHeader, CardTitle, CardDescription, CardBody, CardFooter } from "./Card.js";
+export { Alert } from "./Alert.js";
+export { Avatar, AvatarGroup, initials } from "./Avatar.js";
+export { Checkbox, Switch } from "./Checkbox.js";
+export { cx } from "./cx.js";
+export { toFaDigits } from "./utils.js";

package/dist/utils.d.ts

@@ -0,0 +1,6 @@
+import type { Ref, RefCallback } from "react";
+/** ارقام لاتین را به فارسی تبدیل می‌کند: 12 → ۱۲ */
+export declare function toFaDigits(value: string | number): string;
+/** چند ref را یکی می‌کند */
+export declare function mergeRefs<T>(...refs: Array<Ref<T> | undefined>): RefCallback<T>;
+export declare function isDev(): boolean;

package/dist/utils.js

@@ -0,0 +1,18 @@
+/** ارقام لاتین را به فارسی تبدیل می‌کند: 12 → ۱۲ */
+export function toFaDigits(value) {
+    return String(value).replace(/\d/g, (d) => "۰۱۲۳۴۵۶۷۸۹"[Number(d)]);
+}
+/** چند ref را یکی می‌کند */
+export function mergeRefs(...refs) {
+    return (node) => {
+        for (const ref of refs) {
+            if (typeof ref === "function")
+                ref(node);
+            else if (ref)
+                ref.current = node;
+        }
+    };
+}
+export function isDev() {
+    return typeof process !== "undefined" && process.env.NODE_ENV !== "production";
+}

package/package.json

@@ -1,6 +1,61 @@
 {
   "name": "@kashi-ui/react",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+  "version": "0.2.0",
+  "description": "کامپوننت‌های React دیزاین‌سیستم کاشی",
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "sideEffects": false,
+  "scripts": {
+    "build": "tsc -p tsconfig.json",
+    "test": "node --test test/*.test.mjs"
+  },
+  "peerDependencies": {
+    "@kashi-ui/css": "^0.2.0",
+    "react": ">=18"
+  },
+  "devDependencies": {
+    "@types/react": "^18.3.0",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "typescript": "^5.6.0"
+  },
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/Sepantapouya/Kashi.git",
+    "directory": "packages/react"
+  },
+  "homepage": "https://kashi.sepantapouya.com",
+  "bugs": "https://github.com/Sepantapouya/Kashi/issues",
+  "author": "Sepanta Pouya (https://sepantapouya.com)",
+  "keywords": [
+    "design-system",
+    "persian",
+    "farsi",
+    "rtl",
+    "accessibility",
+    "ui",
+    "css",
+    "react"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "peerDependenciesMeta": {
+    "@kashi-ui/css": {
+      "optional": false
+    }
+  }
+}