@parto-system-design/ui 1.1.9 → 1.1.16

package/dist/components/ui/form.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/lib/utils.ts","../../../src/components/ui/label.tsx","../../../src/components/ui/form.tsx"],"names":["twMerge","clsx","jsx","LabelPrimitive","FormProvider","React","Controller","useFormContext","useFormState","Slot"],"mappings":"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","file":"form.cjs","sourcesContent":["import { type ClassValue, clsx } from 'clsx'\nimport { twMerge } from 'tailwind-merge'\nimport { formatJalaliDate } from '@/lib/jalali-utils'\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs))\n}\n\nexport type SupportedLocale = 'fa' | 'ar' | 'en'\n\n/**\n * Convert digits in a string to Persian/Arabic numerals based on locale.\n * @example convertToLocalNumbers('123', 'fa') => '۱۲۳'\n * @example convertToLocalNumbers('123', 'en') => '123'\n */\nexport function convertToLocalNumbers(text: string | number, locale: SupportedLocale): string {\n  if (locale === 'fa' || locale === 'ar') {\n    const persianDigits = ['۰', '۱', '۲', '۳', '۴', '۵', '۶', '۷', '۸', '۹']\n    return String(text).replace(/\\d/g, (digit) => persianDigits[parseInt(digit)])\n  }\n  return String(text)\n}\n\n/**\n * Format large numbers with locale-aware suffixes (K/M/B).\n * @example formatLargeNumber(1500, 'fa') => '۱.۵ هزار'\n * @example formatLargeNumber(1500, 'en') => '1.5K'\n */\nexport function formatLargeNumber(num: number, locale: SupportedLocale): string {\n  if (num >= 1_000_000_000) {\n    const formatted = (num / 1_000_000_000).toFixed(1).replace(/\\.0$/, '')\n    return convertToLocalNumbers(formatted, locale) + (locale === 'en' ? 'B' : ' میلیارد')\n  }\n  if (num >= 1_000_000) {\n    const formatted = (num / 1_000_000).toFixed(1).replace(/\\.0$/, '')\n    return convertToLocalNumbers(formatted, locale) + (locale === 'en' ? 'M' : ' میلیون')\n  }\n  if (num >= 1_000) {\n    const formatted = (num / 1_000).toFixed(1).replace(/\\.0$/, '')\n    return convertToLocalNumbers(formatted, locale) + (locale === 'en' ? 'K' : ' هزار')\n  }\n  return convertToLocalNumbers(num.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, ','), locale)\n}\n\n/**\n * Format number to Instagram-style short format (English only).\n * @example formatNumber(123456, 'short') => '123K'\n * @example formatNumber(123456, 'exact') => '123,456'\n */\nexport function formatNumber(num: number | undefined, format: 'exact' | 'short' = 'exact'): string {\n  if (num === undefined || num === null) return '0'\n\n  if (format === 'exact') {\n    return num.toLocaleString('en-US')\n  }\n\n  // Short format (Instagram style)\n  if (num >= 1_000_000_000) {\n    return `${(num / 1_000_000_000).toFixed(1).replace(/\\.0$/, '')}B`\n  }\n  if (num >= 1_000_000) {\n    return `${(num / 1_000_000).toFixed(1).replace(/\\.0$/, '')}M`\n  }\n  if (num >= 1_000) {\n    return `${(num / 1_000).toFixed(1).replace(/\\.0$/, '')}K`\n  }\n  return num.toString()\n}\n\n/**\n * Format date to relative time with absolute on hover (Persian)\n * @example formatRelativeTime(new Date()) => '۲ ساعت پیش'\n */\nexport function formatRelativeTime(date: Date | string | number): string {\n  const now = new Date()\n  const then = new Date(date)\n  const diffInSeconds = Math.floor((now.getTime() - then.getTime()) / 1000)\n\n  if (diffInSeconds < 60) {\n    return 'همین الان'\n  }\n\n  const diffInMinutes = Math.floor(diffInSeconds / 60)\n  if (diffInMinutes < 60) {\n    return `${convertToLocalNumbers(diffInMinutes, 'fa')} دقیقه پیش`\n  }\n\n  const diffInHours = Math.floor(diffInMinutes / 60)\n  if (diffInHours < 24) {\n    return `${convertToLocalNumbers(diffInHours, 'fa')} ساعت پیش`\n  }\n\n  const diffInDays = Math.floor(diffInHours / 24)\n  if (diffInDays < 7) {\n    return `${convertToLocalNumbers(diffInDays, 'fa')} روز پیش`\n  }\n\n  const diffInWeeks = Math.floor(diffInDays / 7)\n  if (diffInWeeks < 4) {\n    return `${convertToLocalNumbers(diffInWeeks, 'fa')} هفته پیش`\n  }\n\n  const diffInMonths = Math.floor(diffInDays / 30)\n  if (diffInMonths < 12) {\n    return `${convertToLocalNumbers(diffInMonths, 'fa')} ماه پیش`\n  }\n\n  const diffInYears = Math.floor(diffInDays / 365)\n  return `${convertToLocalNumbers(diffInYears, 'fa')} سال پیش`\n}\n\n/**\n * Format date to absolute format (Persian / Jalali)\n * Uses date-fns-jalali for accurate Jalali conversion.\n * @example formatAbsoluteTime(new Date()) => '۱۵ دی ۱۴۰۳، ۱۵:۳۰'\n */\nexport function formatAbsoluteTime(date: Date | string | number): string {\n  const d = new Date(date)\n  return formatJalaliDate(d, 'd MMMM yyyy، HH:mm')\n}\n","\"use client\"\n\nimport * as React from \"react\"\nimport * as LabelPrimitive from \"@radix-ui/react-label\"\n\nimport { cn } from \"@/lib/utils\"\n\nfunction Label({\n  className,\n  ...props\n}: React.ComponentProps<typeof LabelPrimitive.Root>) {\n  return (\n    <LabelPrimitive.Root\n      data-slot=\"label\"\n      className={cn(\n        \"flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nLabel.displayName = \"Label\"\n\nexport { Label }\n\n","\"use client\"\n\nimport * as React from \"react\"\nimport * as LabelPrimitive from \"@radix-ui/react-label\"\nimport { Slot } from \"@radix-ui/react-slot\"\nimport {\n  Controller,\n  FormProvider,\n  useFormContext,\n  useFormState,\n  type ControllerProps,\n  type FieldPath,\n  type FieldValues,\n} from \"react-hook-form\"\n\nimport { cn } from \"@/lib/utils\"\nimport { Label } from \"./label\"\n\nconst Form = FormProvider\n\ntype FormFieldContextValue<\n  TFieldValues extends FieldValues = FieldValues,\n  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n> = {\n  name: TName\n}\n\nconst FormFieldContext = React.createContext<FormFieldContextValue>(\n  {} as FormFieldContextValue\n)\n\nconst FormField = <\n  TFieldValues extends FieldValues = FieldValues,\n  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n>({\n  ...props\n}: ControllerProps<TFieldValues, TName>) => {\n  return (\n    <FormFieldContext.Provider value={{ name: props.name }}>\n      <Controller {...props} />\n    </FormFieldContext.Provider>\n  )\n}\n\nconst useFormField = () => {\n  const fieldContext = React.useContext(FormFieldContext)\n  const itemContext = React.useContext(FormItemContext)\n  const { getFieldState } = useFormContext()\n  const formState = useFormState({ name: fieldContext.name })\n  const fieldState = getFieldState(fieldContext.name, formState)\n\n  if (!fieldContext) {\n    throw new Error(\"useFormField should be used within <FormField>\")\n  }\n\n  const { id } = itemContext\n\n  return {\n    id,\n    name: fieldContext.name,\n    formItemId: `${id}-form-item`,\n    formDescriptionId: `${id}-form-item-description`,\n    formMessageId: `${id}-form-item-message`,\n    ...fieldState,\n  }\n}\n\ntype FormItemContextValue = {\n  id: string\n}\n\nconst FormItemContext = React.createContext<FormItemContextValue>(\n  {} as FormItemContextValue\n)\n\nfunction FormItem({ className, ...props }: React.ComponentProps<\"div\">) {\n  const id = React.useId()\n\n  return (\n    <FormItemContext.Provider value={{ id }}>\n      <div\n        data-slot=\"form-item\"\n        className={cn(\"grid gap-2\", className)}\n        {...props}\n      />\n    </FormItemContext.Provider>\n  )\n}\n\nfunction FormLabel({\n  className,\n  ...props\n}: React.ComponentProps<typeof LabelPrimitive.Root>) {\n  const { error, formItemId } = useFormField()\n\n  return (\n    <Label\n      data-slot=\"form-label\"\n      data-error={!!error}\n      className={cn(\"data-[error=true]:text-destructive\", className)}\n      htmlFor={formItemId}\n      {...props}\n    />\n  )\n}\n\nfunction FormControl({ ...props }: React.ComponentProps<typeof Slot>) {\n  const { error, formItemId, formDescriptionId, formMessageId } = useFormField()\n\n  return (\n    <Slot\n      data-slot=\"form-control\"\n      id={formItemId}\n      aria-describedby={\n        !error\n          ? `${formDescriptionId}`\n          : `${formDescriptionId} ${formMessageId}`\n      }\n      aria-invalid={!!error}\n      {...props}\n    />\n  )\n}\n\nfunction FormDescription({ className, ...props }: React.ComponentProps<\"p\">) {\n  const { formDescriptionId } = useFormField()\n\n  return (\n    <p\n      data-slot=\"form-description\"\n      id={formDescriptionId}\n      className={cn(\"text-muted-foreground text-sm\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction FormMessage({ className, ...props }: React.ComponentProps<\"p\">) {\n  const { error, formMessageId } = useFormField()\n  const body = error ? String(error?.message ?? \"\") : props.children\n\n  if (!body) {\n    return null\n  }\n\n  return (\n    <p\n      data-slot=\"form-message\"\n      id={formMessageId}\n      className={cn(\"text-destructive text-sm\", className)}\n      {...props}\n    >\n      {body}\n    </p>\n  )\n}\n\nFormField.displayName = \"FormField\"\nFormItem.displayName = \"FormItem\"\nFormLabel.displayName = \"FormLabel\"\nFormControl.displayName = \"FormControl\"\nFormDescription.displayName = \"FormDescription\"\nFormMessage.displayName = \"FormMessage\"\n\nexport {\n  useFormField,\n  Form,\n  FormItem,\n  FormLabel,\n  FormControl,\n  FormDescription,\n  FormMessage,\n  FormField,\n}\n\n"]}

package/dist/components/ui/form.d.cts

@@ -0,0 +1,46 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as react_hook_form from 'react-hook-form';
+import { FieldValues, FieldPath, ControllerProps } from 'react-hook-form';
+import * as React from 'react';
+import * as LabelPrimitive from '@radix-ui/react-label';
+import { Slot } from '@radix-ui/react-slot';
+
+declare const Form: <TFieldValues extends FieldValues, TContext = any, TTransformedValues = TFieldValues>(props: react_hook_form.FormProviderProps<TFieldValues, TContext, TTransformedValues>) => React.JSX.Element;
+declare const FormField: {
+    <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ ...props }: ControllerProps<TFieldValues, TName>): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+declare const useFormField: () => {
+    invalid: boolean;
+    isDirty: boolean;
+    isTouched: boolean;
+    isValidating: boolean;
+    error?: react_hook_form.FieldError;
+    id: string;
+    name: string;
+    formItemId: string;
+    formDescriptionId: string;
+    formMessageId: string;
+};
+declare function FormItem({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare namespace FormItem {
+    var displayName: string;
+}
+declare function FormLabel({ className, ...props }: React.ComponentProps<typeof LabelPrimitive.Root>): react_jsx_runtime.JSX.Element;
+declare namespace FormLabel {
+    var displayName: string;
+}
+declare function FormControl({ ...props }: React.ComponentProps<typeof Slot>): react_jsx_runtime.JSX.Element;
+declare namespace FormControl {
+    var displayName: string;
+}
+declare function FormDescription({ className, ...props }: React.ComponentProps<"p">): react_jsx_runtime.JSX.Element;
+declare namespace FormDescription {
+    var displayName: string;
+}
+declare function FormMessage({ className, ...props }: React.ComponentProps<"p">): react_jsx_runtime.JSX.Element | null;
+declare namespace FormMessage {
+    var displayName: string;
+}
+
+export { Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, useFormField };

package/dist/components/ui/form.d.ts

@@ -0,0 +1,46 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as react_hook_form from 'react-hook-form';
+import { FieldValues, FieldPath, ControllerProps } from 'react-hook-form';
+import * as React from 'react';
+import * as LabelPrimitive from '@radix-ui/react-label';
+import { Slot } from '@radix-ui/react-slot';
+
+declare const Form: <TFieldValues extends FieldValues, TContext = any, TTransformedValues = TFieldValues>(props: react_hook_form.FormProviderProps<TFieldValues, TContext, TTransformedValues>) => React.JSX.Element;
+declare const FormField: {
+    <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ ...props }: ControllerProps<TFieldValues, TName>): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+declare const useFormField: () => {
+    invalid: boolean;
+    isDirty: boolean;
+    isTouched: boolean;
+    isValidating: boolean;
+    error?: react_hook_form.FieldError;
+    id: string;
+    name: string;
+    formItemId: string;
+    formDescriptionId: string;
+    formMessageId: string;
+};
+declare function FormItem({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare namespace FormItem {
+    var displayName: string;
+}
+declare function FormLabel({ className, ...props }: React.ComponentProps<typeof LabelPrimitive.Root>): react_jsx_runtime.JSX.Element;
+declare namespace FormLabel {
+    var displayName: string;
+}
+declare function FormControl({ ...props }: React.ComponentProps<typeof Slot>): react_jsx_runtime.JSX.Element;
+declare namespace FormControl {
+    var displayName: string;
+}
+declare function FormDescription({ className, ...props }: React.ComponentProps<"p">): react_jsx_runtime.JSX.Element;
+declare namespace FormDescription {
+    var displayName: string;
+}
+declare function FormMessage({ className, ...props }: React.ComponentProps<"p">): react_jsx_runtime.JSX.Element | null;
+declare namespace FormMessage {
+    var displayName: string;
+}
+
+export { Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, useFormField };

package/dist/components/ui/form.js

@@ -0,0 +1,139 @@
+'use client';
+import * as React from 'react';
+import { Slot } from '@radix-ui/react-slot';
+import { FormProvider, Controller, useFormContext, useFormState } from 'react-hook-form';
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+import * as LabelPrimitive from '@radix-ui/react-label';
+import { jsx } from 'react/jsx-runtime';
+
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+function Label({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    LabelPrimitive.Root,
+    {
+      "data-slot": "label",
+      className: cn(
+        "flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50",
+        className
+      ),
+      ...props
+    }
+  );
+}
+Label.displayName = "Label";
+var Form = FormProvider;
+var FormFieldContext = React.createContext(
+  {}
+);
+var FormField = ({
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx(FormFieldContext.Provider, { value: { name: props.name }, children: /* @__PURE__ */ jsx(Controller, { ...props }) });
+};
+var useFormField = () => {
+  const fieldContext = React.useContext(FormFieldContext);
+  const itemContext = React.useContext(FormItemContext);
+  const { getFieldState } = useFormContext();
+  const formState = useFormState({ name: fieldContext.name });
+  const fieldState = getFieldState(fieldContext.name, formState);
+  if (!fieldContext) {
+    throw new Error("useFormField should be used within <FormField>");
+  }
+  const { id } = itemContext;
+  return {
+    id,
+    name: fieldContext.name,
+    formItemId: `${id}-form-item`,
+    formDescriptionId: `${id}-form-item-description`,
+    formMessageId: `${id}-form-item-message`,
+    ...fieldState
+  };
+};
+var FormItemContext = React.createContext(
+  {}
+);
+function FormItem({ className, ...props }) {
+  const id = React.useId();
+  return /* @__PURE__ */ jsx(FormItemContext.Provider, { value: { id }, children: /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "form-item",
+      className: cn("grid gap-2", className),
+      ...props
+    }
+  ) });
+}
+function FormLabel({
+  className,
+  ...props
+}) {
+  const { error, formItemId } = useFormField();
+  return /* @__PURE__ */ jsx(
+    Label,
+    {
+      "data-slot": "form-label",
+      "data-error": !!error,
+      className: cn("data-[error=true]:text-destructive", className),
+      htmlFor: formItemId,
+      ...props
+    }
+  );
+}
+function FormControl({ ...props }) {
+  const { error, formItemId, formDescriptionId, formMessageId } = useFormField();
+  return /* @__PURE__ */ jsx(
+    Slot,
+    {
+      "data-slot": "form-control",
+      id: formItemId,
+      "aria-describedby": !error ? `${formDescriptionId}` : `${formDescriptionId} ${formMessageId}`,
+      "aria-invalid": !!error,
+      ...props
+    }
+  );
+}
+function FormDescription({ className, ...props }) {
+  const { formDescriptionId } = useFormField();
+  return /* @__PURE__ */ jsx(
+    "p",
+    {
+      "data-slot": "form-description",
+      id: formDescriptionId,
+      className: cn("text-muted-foreground text-sm", className),
+      ...props
+    }
+  );
+}
+function FormMessage({ className, ...props }) {
+  const { error, formMessageId } = useFormField();
+  const body = error ? String(error?.message ?? "") : props.children;
+  if (!body) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(
+    "p",
+    {
+      "data-slot": "form-message",
+      id: formMessageId,
+      className: cn("text-destructive text-sm", className),
+      ...props,
+      children: body
+    }
+  );
+}
+FormField.displayName = "FormField";
+FormItem.displayName = "FormItem";
+FormLabel.displayName = "FormLabel";
+FormControl.displayName = "FormControl";
+FormDescription.displayName = "FormDescription";
+FormMessage.displayName = "FormMessage";
+
+export { Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, useFormField };
+//# sourceMappingURL=form.js.map
+//# sourceMappingURL=form.js.map

package/dist/components/ui/form.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/lib/utils.ts","../../../src/components/ui/label.tsx","../../../src/components/ui/form.tsx"],"names":["jsx"],"mappings":"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","file":"form.js","sourcesContent":["import { type ClassValue, clsx } from 'clsx'\nimport { twMerge } from 'tailwind-merge'\nimport { formatJalaliDate } from '@/lib/jalali-utils'\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs))\n}\n\nexport type SupportedLocale = 'fa' | 'ar' | 'en'\n\n/**\n * Convert digits in a string to Persian/Arabic numerals based on locale.\n * @example convertToLocalNumbers('123', 'fa') => '۱۲۳'\n * @example convertToLocalNumbers('123', 'en') => '123'\n */\nexport function convertToLocalNumbers(text: string | number, locale: SupportedLocale): string {\n  if (locale === 'fa' || locale === 'ar') {\n    const persianDigits = ['۰', '۱', '۲', '۳', '۴', '۵', '۶', '۷', '۸', '۹']\n    return String(text).replace(/\\d/g, (digit) => persianDigits[parseInt(digit)])\n  }\n  return String(text)\n}\n\n/**\n * Format large numbers with locale-aware suffixes (K/M/B).\n * @example formatLargeNumber(1500, 'fa') => '۱.۵ هزار'\n * @example formatLargeNumber(1500, 'en') => '1.5K'\n */\nexport function formatLargeNumber(num: number, locale: SupportedLocale): string {\n  if (num >= 1_000_000_000) {\n    const formatted = (num / 1_000_000_000).toFixed(1).replace(/\\.0$/, '')\n    return convertToLocalNumbers(formatted, locale) + (locale === 'en' ? 'B' : ' میلیارد')\n  }\n  if (num >= 1_000_000) {\n    const formatted = (num / 1_000_000).toFixed(1).replace(/\\.0$/, '')\n    return convertToLocalNumbers(formatted, locale) + (locale === 'en' ? 'M' : ' میلیون')\n  }\n  if (num >= 1_000) {\n    const formatted = (num / 1_000).toFixed(1).replace(/\\.0$/, '')\n    return convertToLocalNumbers(formatted, locale) + (locale === 'en' ? 'K' : ' هزار')\n  }\n  return convertToLocalNumbers(num.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, ','), locale)\n}\n\n/**\n * Format number to Instagram-style short format (English only).\n * @example formatNumber(123456, 'short') => '123K'\n * @example formatNumber(123456, 'exact') => '123,456'\n */\nexport function formatNumber(num: number | undefined, format: 'exact' | 'short' = 'exact'): string {\n  if (num === undefined || num === null) return '0'\n\n  if (format === 'exact') {\n    return num.toLocaleString('en-US')\n  }\n\n  // Short format (Instagram style)\n  if (num >= 1_000_000_000) {\n    return `${(num / 1_000_000_000).toFixed(1).replace(/\\.0$/, '')}B`\n  }\n  if (num >= 1_000_000) {\n    return `${(num / 1_000_000).toFixed(1).replace(/\\.0$/, '')}M`\n  }\n  if (num >= 1_000) {\n    return `${(num / 1_000).toFixed(1).replace(/\\.0$/, '')}K`\n  }\n  return num.toString()\n}\n\n/**\n * Format date to relative time with absolute on hover (Persian)\n * @example formatRelativeTime(new Date()) => '۲ ساعت پیش'\n */\nexport function formatRelativeTime(date: Date | string | number): string {\n  const now = new Date()\n  const then = new Date(date)\n  const diffInSeconds = Math.floor((now.getTime() - then.getTime()) / 1000)\n\n  if (diffInSeconds < 60) {\n    return 'همین الان'\n  }\n\n  const diffInMinutes = Math.floor(diffInSeconds / 60)\n  if (diffInMinutes < 60) {\n    return `${convertToLocalNumbers(diffInMinutes, 'fa')} دقیقه پیش`\n  }\n\n  const diffInHours = Math.floor(diffInMinutes / 60)\n  if (diffInHours < 24) {\n    return `${convertToLocalNumbers(diffInHours, 'fa')} ساعت پیش`\n  }\n\n  const diffInDays = Math.floor(diffInHours / 24)\n  if (diffInDays < 7) {\n    return `${convertToLocalNumbers(diffInDays, 'fa')} روز پیش`\n  }\n\n  const diffInWeeks = Math.floor(diffInDays / 7)\n  if (diffInWeeks < 4) {\n    return `${convertToLocalNumbers(diffInWeeks, 'fa')} هفته پیش`\n  }\n\n  const diffInMonths = Math.floor(diffInDays / 30)\n  if (diffInMonths < 12) {\n    return `${convertToLocalNumbers(diffInMonths, 'fa')} ماه پیش`\n  }\n\n  const diffInYears = Math.floor(diffInDays / 365)\n  return `${convertToLocalNumbers(diffInYears, 'fa')} سال پیش`\n}\n\n/**\n * Format date to absolute format (Persian / Jalali)\n * Uses date-fns-jalali for accurate Jalali conversion.\n * @example formatAbsoluteTime(new Date()) => '۱۵ دی ۱۴۰۳، ۱۵:۳۰'\n */\nexport function formatAbsoluteTime(date: Date | string | number): string {\n  const d = new Date(date)\n  return formatJalaliDate(d, 'd MMMM yyyy، HH:mm')\n}\n","\"use client\"\n\nimport * as React from \"react\"\nimport * as LabelPrimitive from \"@radix-ui/react-label\"\n\nimport { cn } from \"@/lib/utils\"\n\nfunction Label({\n  className,\n  ...props\n}: React.ComponentProps<typeof LabelPrimitive.Root>) {\n  return (\n    <LabelPrimitive.Root\n      data-slot=\"label\"\n      className={cn(\n        \"flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nLabel.displayName = \"Label\"\n\nexport { Label }\n\n","\"use client\"\n\nimport * as React from \"react\"\nimport * as LabelPrimitive from \"@radix-ui/react-label\"\nimport { Slot } from \"@radix-ui/react-slot\"\nimport {\n  Controller,\n  FormProvider,\n  useFormContext,\n  useFormState,\n  type ControllerProps,\n  type FieldPath,\n  type FieldValues,\n} from \"react-hook-form\"\n\nimport { cn } from \"@/lib/utils\"\nimport { Label } from \"./label\"\n\nconst Form = FormProvider\n\ntype FormFieldContextValue<\n  TFieldValues extends FieldValues = FieldValues,\n  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n> = {\n  name: TName\n}\n\nconst FormFieldContext = React.createContext<FormFieldContextValue>(\n  {} as FormFieldContextValue\n)\n\nconst FormField = <\n  TFieldValues extends FieldValues = FieldValues,\n  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n>({\n  ...props\n}: ControllerProps<TFieldValues, TName>) => {\n  return (\n    <FormFieldContext.Provider value={{ name: props.name }}>\n      <Controller {...props} />\n    </FormFieldContext.Provider>\n  )\n}\n\nconst useFormField = () => {\n  const fieldContext = React.useContext(FormFieldContext)\n  const itemContext = React.useContext(FormItemContext)\n  const { getFieldState } = useFormContext()\n  const formState = useFormState({ name: fieldContext.name })\n  const fieldState = getFieldState(fieldContext.name, formState)\n\n  if (!fieldContext) {\n    throw new Error(\"useFormField should be used within <FormField>\")\n  }\n\n  const { id } = itemContext\n\n  return {\n    id,\n    name: fieldContext.name,\n    formItemId: `${id}-form-item`,\n    formDescriptionId: `${id}-form-item-description`,\n    formMessageId: `${id}-form-item-message`,\n    ...fieldState,\n  }\n}\n\ntype FormItemContextValue = {\n  id: string\n}\n\nconst FormItemContext = React.createContext<FormItemContextValue>(\n  {} as FormItemContextValue\n)\n\nfunction FormItem({ className, ...props }: React.ComponentProps<\"div\">) {\n  const id = React.useId()\n\n  return (\n    <FormItemContext.Provider value={{ id }}>\n      <div\n        data-slot=\"form-item\"\n        className={cn(\"grid gap-2\", className)}\n        {...props}\n      />\n    </FormItemContext.Provider>\n  )\n}\n\nfunction FormLabel({\n  className,\n  ...props\n}: React.ComponentProps<typeof LabelPrimitive.Root>) {\n  const { error, formItemId } = useFormField()\n\n  return (\n    <Label\n      data-slot=\"form-label\"\n      data-error={!!error}\n      className={cn(\"data-[error=true]:text-destructive\", className)}\n      htmlFor={formItemId}\n      {...props}\n    />\n  )\n}\n\nfunction FormControl({ ...props }: React.ComponentProps<typeof Slot>) {\n  const { error, formItemId, formDescriptionId, formMessageId } = useFormField()\n\n  return (\n    <Slot\n      data-slot=\"form-control\"\n      id={formItemId}\n      aria-describedby={\n        !error\n          ? `${formDescriptionId}`\n          : `${formDescriptionId} ${formMessageId}`\n      }\n      aria-invalid={!!error}\n      {...props}\n    />\n  )\n}\n\nfunction FormDescription({ className, ...props }: React.ComponentProps<\"p\">) {\n  const { formDescriptionId } = useFormField()\n\n  return (\n    <p\n      data-slot=\"form-description\"\n      id={formDescriptionId}\n      className={cn(\"text-muted-foreground text-sm\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction FormMessage({ className, ...props }: React.ComponentProps<\"p\">) {\n  const { error, formMessageId } = useFormField()\n  const body = error ? String(error?.message ?? \"\") : props.children\n\n  if (!body) {\n    return null\n  }\n\n  return (\n    <p\n      data-slot=\"form-message\"\n      id={formMessageId}\n      className={cn(\"text-destructive text-sm\", className)}\n      {...props}\n    >\n      {body}\n    </p>\n  )\n}\n\nFormField.displayName = \"FormField\"\nFormItem.displayName = \"FormItem\"\nFormLabel.displayName = \"FormLabel\"\nFormControl.displayName = \"FormControl\"\nFormDescription.displayName = \"FormDescription\"\nFormMessage.displayName = \"FormMessage\"\n\nexport {\n  useFormField,\n  Form,\n  FormItem,\n  FormLabel,\n  FormControl,\n  FormDescription,\n  FormMessage,\n  FormField,\n}\n\n"]}

package/dist/components/ui/input.cjs

@@ -1,22 +1,142 @@
+'use client';
 'use strict';
 
-var chunkHS3XI3CC_cjs = require('../../chunk-HS3XI3CC.cjs');
-require('../../chunk-K6G63EED.cjs');
-require('../../chunk-NV4JOKWL.cjs');
+var classVarianceAuthority = require('class-variance-authority');
+var React = require('react');
+var clsx = require('clsx');
+var tailwindMerge = require('tailwind-merge');
+var jsxRuntime = require('react/jsx-runtime');
 
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
 
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
-Object.defineProperty(exports, "Input", {
-  enumerable: true,
-  get: function () { return chunkHS3XI3CC_cjs.Input; }
-});
-Object.defineProperty(exports, "InputVariants", {
-  enumerable: true,
-  get: function () { return chunkHS3XI3CC_cjs.InputVariants; }
-});
-Object.defineProperty(exports, "inputVariants", {
-  enumerable: true,
-  get: function () { return chunkHS3XI3CC_cjs.inputVariants; }
-});
+// src/lib/constants.ts
+var SIZE = {
+  text: {
+    xs: "text-xs",
+    sm: "text-sm leading-4",
+    md: "text-sm",
+    lg: "text-base",
+    xl: "text-base"
+  },
+  padding: {
+    xs: "px-2.5 py-1",
+    sm: "px-3 py-2",
+    md: "px-4 py-2",
+    lg: "px-4 py-2",
+    xl: "px-6 py-3"
+  },
+  height: {
+    xs: "h-[26px]",
+    sm: "h-[34px]",
+    md: "h-[38px]",
+    lg: "h-[42px]",
+    xl: "h-[50px]"
+  }
+};
+var SIZE_VARIANTS = {
+  xs: `${SIZE.text["xs"]} ${SIZE.padding["xs"]} ${SIZE.height["xs"]}`,
+  sm: `${SIZE.text["sm"]} ${SIZE.padding["sm"]} ${SIZE.height["sm"]}`,
+  md: `${SIZE.text["md"]} ${SIZE.padding["md"]} ${SIZE.height["md"]}`,
+  lg: `${SIZE.text["lg"]} ${SIZE.padding["lg"]} ${SIZE.height["lg"]}`,
+  xl: `${SIZE.text["xl"]} ${SIZE.padding["xl"]} ${SIZE.height["xl"]}`
+};
+function cn(...inputs) {
+  return tailwindMerge.twMerge(clsx.clsx(inputs));
+}
+var inputVariants = classVarianceAuthority.cva(
+  cn(
+    // 1.1.16 — bg-control (now 19% in dark) instead of foreground/2.6%
+    // opacity overlay, so the input is visibly distinct from any Card
+    // it sits inside. text-start makes text-align follow the input's
+    // own `dir` (set explicitly or auto for LTR types), so an email
+    // field with `dir="ltr"` is left-aligned even in an RTL form.
+    "flex w-full rounded-md border border-control read-only:border-button bg-control text-sm text-foreground text-start file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-foreground-lighter read-only:text-foreground-light",
+    "transition-colors duration-150",
+    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50",
+    "aria-[invalid=true]:bg-destructive-200 dark:aria-[invalid=true]:bg-destructive/5 aria-[invalid=true]:border-destructive-400 dark:aria-[invalid=true]:border-destructive-default aria-[invalid=true]:focus:border-destructive aria-[invalid=true]:focus-visible:border-destructive"
+  ),
+  {
+    variants: {
+      size: {
+        ...SIZE_VARIANTS
+      }
+    },
+    defaultVariants: {
+      size: "sm"
+    }
+  }
+);
+var InputVariants = inputVariants;
+var LTR_INPUT_TYPES = /* @__PURE__ */ new Set(["email", "url", "tel", "number", "password"]);
+var Input = React__namespace.forwardRef(
+  ({ className, type, size = "sm", dir, startAdornment, endAdornment, ...props }, ref) => {
+    const resolvedDir = dir ?? (type && LTR_INPUT_TYPES.has(type) ? "ltr" : void 0);
+    if (!startAdornment && !endAdornment) {
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        "input",
+        {
+          type,
+          ref,
+          "data-slot": "input",
+          dir: resolvedDir,
+          ...props,
+          className: cn(inputVariants({ size }), className)
+        }
+      );
+    }
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-slot": "input-wrapper", dir: resolvedDir, className: "relative w-full", children: [
+      startAdornment && /* @__PURE__ */ jsxRuntime.jsx(
+        "span",
+        {
+          "data-slot": "input-start-adornment",
+          className: "pointer-events-none absolute start-3 top-1/2 flex -translate-y-1/2 items-center text-foreground-light [&_button]:pointer-events-auto",
+          children: startAdornment
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "input",
+        {
+          type,
+          ref,
+          "data-slot": "input",
+          dir: resolvedDir,
+          ...props,
+          className: cn(inputVariants({ size }), startAdornment && "ps-10", endAdornment && "pe-10", className)
+        }
+      ),
+      endAdornment && /* @__PURE__ */ jsxRuntime.jsx(
+        "span",
+        {
+          "data-slot": "input-end-adornment",
+          className: "pointer-events-none absolute end-3 top-1/2 flex -translate-y-1/2 items-center text-foreground-light [&_button]:pointer-events-auto",
+          children: endAdornment
+        }
+      )
+    ] });
+  }
+);
+Input.displayName = "Input";
+
+exports.Input = Input;
+exports.InputVariants = InputVariants;
+exports.inputVariants = inputVariants;
 //# sourceMappingURL=input.cjs.map
 //# sourceMappingURL=input.cjs.map

package/dist/components/ui/input.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"input.cjs"}
+{"version":3,"sources":["../../../src/lib/constants.ts","../../../src/lib/utils.ts","../../../src/components/ui/input.tsx"],"names":["twMerge","clsx","cva","React","jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoBO,IAAM,IAAA,GAAO;AAAA,EAClB,IAAA,EAAM;AAAA,IACJ,EAAA,EAAI,SAAA;AAAA,IACJ,EAAA,EAAI,mBAAA;AAAA,IACJ,EAAA,EAAI,SAAA;AAAA,IACJ,EAAA,EAAI,WAAA;AAAA,IACJ,EAAA,EAAI;AAAA,GACN;AAAA,EACA,OAAA,EAAS;AAAA,IACP,EAAA,EAAI,aAAA;AAAA,IACJ,EAAA,EAAI,WAAA;AAAA,IACJ,EAAA,EAAI,WAAA;AAAA,IACJ,EAAA,EAAI,WAAA;AAAA,IACJ,EAAA,EAAI;AAAA,GACN;AAAA,EACA,MAAA,EAAQ;AAAA,IACN,EAAA,EAAI,UAAA;AAAA,IACJ,EAAA,EAAI,UAAA;AAAA,IACJ,EAAA,EAAI,UAAA;AAAA,IACJ,EAAA,EAAI,UAAA;AAAA,IACJ,EAAA,EAAI;AAAA;AAER,CAAA;AA2BO,IAAM,aAAA,GAAgB;AAAA,EAC3B,EAAA,EAAI,CAAA,EAAG,IAAA,CAAK,IAAA,CAAK,IAAI,CAAC,CAAA,CAAA,EAAI,IAAA,CAAK,OAAA,CAAQ,IAAI,CAAC,CAAA,CAAA,EAAI,IAAA,CAAK,MAAA,CAAO,IAAI,CAAC,CAAA,CAAA;AAAA,EACjE,EAAA,EAAI,CAAA,EAAG,IAAA,CAAK,IAAA,CAAK,IAAI,CAAC,CAAA,CAAA,EAAI,IAAA,CAAK,OAAA,CAAQ,IAAI,CAAC,CAAA,CAAA,EAAI,IAAA,CAAK,MAAA,CAAO,IAAI,CAAC,CAAA,CAAA;AAAA,EACjE,EAAA,EAAI,CAAA,EAAG,IAAA,CAAK,IAAA,CAAK,IAAI,CAAC,CAAA,CAAA,EAAI,IAAA,CAAK,OAAA,CAAQ,IAAI,CAAC,CAAA,CAAA,EAAI,IAAA,CAAK,MAAA,CAAO,IAAI,CAAC,CAAA,CAAA;AAAA,EACjE,EAAA,EAAI,CAAA,EAAG,IAAA,CAAK,IAAA,CAAK,IAAI,CAAC,CAAA,CAAA,EAAI,IAAA,CAAK,OAAA,CAAQ,IAAI,CAAC,CAAA,CAAA,EAAI,IAAA,CAAK,MAAA,CAAO,IAAI,CAAC,CAAA,CAAA;AAAA,EACjE,EAAA,EAAI,CAAA,EAAG,IAAA,CAAK,IAAA,CAAK,IAAI,CAAC,CAAA,CAAA,EAAI,IAAA,CAAK,OAAA,CAAQ,IAAI,CAAC,CAAA,CAAA,EAAI,IAAA,CAAK,MAAA,CAAO,IAAI,CAAC,CAAA;AACnE,CAAA;ACvEO,SAAS,MAAM,MAAA,EAAsB;AAC1C,EAAA,OAAOA,qBAAA,CAAQC,SAAA,CAAK,MAAM,CAAC,CAAA;AAC7B;ACCO,IAAM,aAAA,GAAgBC,0BAAA;AAAA,EAC3B,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAME,6QAAA;AAAA,IACA,gCAAA;AAAA,IACA,0LAAA;AAAA,IACA;AAAA,GACF;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,IAAA,EAAM;AAAA,QACJ,GAAG;AAAA;AACL,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,IAAA,EAAM;AAAA;AACR;AAEJ;AAGO,IAAM,aAAA,GAAgB;AAqB7B,IAAM,eAAA,uBAAsB,GAAA,CAAI,CAAC,SAAS,KAAA,EAAO,KAAA,EAAO,QAAA,EAAU,UAAU,CAAC,CAAA;AAE7E,IAAM,KAAA,GAAcC,gBAAA,CAAA,UAAA;AAAA,EAClB,CAAC,EAAE,SAAA,EAAW,IAAA,EAAM,IAAA,GAAO,IAAA,EAAM,GAAA,EAAK,cAAA,EAAgB,YAAA,EAAc,GAAG,KAAA,EAAM,EAAG,GAAA,KAAQ;AAEtF,IAAA,MAAM,cAAc,GAAA,KAAQ,IAAA,IAAQ,gBAAgB,GAAA,CAAI,IAAI,IAAI,KAAA,GAAQ,MAAA,CAAA;AAIxE,IAAA,IAAI,CAAC,cAAA,IAAkB,CAAC,YAAA,EAAc;AACpC,MAAA,uBACEC,cAAA;AAAA,QAAC,OAAA;AAAA,QAAA;AAAA,UACC,IAAA;AAAA,UACA,GAAA;AAAA,UACA,WAAA,EAAU,OAAA;AAAA,UACV,GAAA,EAAK,WAAA;AAAA,UACJ,GAAG,KAAA;AAAA,UACJ,WAAW,EAAA,CAAG,aAAA,CAAc,EAAE,IAAA,EAAM,GAAG,SAAS;AAAA;AAAA,OAClD;AAAA,IAEJ;AAOA,IAAA,uCACG,KAAA,EAAA,EAAI,WAAA,EAAU,iBAAgB,GAAA,EAAK,WAAA,EAAa,WAAU,iBAAA,EACxD,QAAA,EAAA;AAAA,MAAA,cAAA,oBACCA,cAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,WAAA,EAAU,uBAAA;AAAA,UACV,SAAA,EAAU,sIAAA;AAAA,UAET,QAAA,EAAA;AAAA;AAAA,OACH;AAAA,sBAEFA,cAAA;AAAA,QAAC,OAAA;AAAA,QAAA;AAAA,UACC,IAAA;AAAA,UACA,GAAA;AAAA,UACA,WAAA,EAAU,OAAA;AAAA,UACV,GAAA,EAAK,WAAA;AAAA,UACJ,GAAG,KAAA;AAAA,UACJ,SAAA,EAAW,EAAA,CAAG,aAAA,CAAc,EAAE,IAAA,EAAM,CAAA,EAAG,cAAA,IAAkB,OAAA,EAAS,YAAA,IAAgB,OAAA,EAAS,SAAS;AAAA;AAAA,OACtG;AAAA,MACC,YAAA,oBACCA,cAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,WAAA,EAAU,qBAAA;AAAA,UACV,SAAA,EAAU,oIAAA;AAAA,UAET,QAAA,EAAA;AAAA;AAAA;AACH,KAAA,EAEJ,CAAA;AAAA,EAEJ;AACF;AAEA,KAAA,CAAM,WAAA,GAAc,OAAA","file":"input.cjs","sourcesContent":["/**\n * Standard size scale used across the design system.\n * Components should accept these values for their `size` prop.\n */\nexport type StandardSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl'\n\n/** @deprecated Use `StandardSize` instead — legacy names have been removed */\nexport type LegacySize = StandardSize\n\n/** @deprecated Use `StandardSize` instead */\nexport type SizeWithLegacy = StandardSize\n\n/**\n * Normalizes a size value to standard names.\n * @deprecated All sizes are standard now — this function is a no-op passthrough.\n */\nexport function normalizeSize(size: StandardSize): StandardSize {\n  return size\n}\n\nexport const SIZE = {\n  text: {\n    xs: 'text-xs',\n    sm: 'text-sm leading-4',\n    md: 'text-sm',\n    lg: 'text-base',\n    xl: 'text-base',\n  },\n  padding: {\n    xs: 'px-2.5 py-1',\n    sm: 'px-3 py-2',\n    md: 'px-4 py-2',\n    lg: 'px-4 py-2',\n    xl: 'px-6 py-3',\n  },\n  height: {\n    xs: 'h-[26px]',\n    sm: 'h-[34px]',\n    md: 'h-[38px]',\n    lg: 'h-[42px]',\n    xl: 'h-[50px]',\n  },\n}\n\n/** Inner sizes for nested elements (badges inside buttons, multi-select items, etc.) */\nexport const SIZE_INNER = {\n  text: {\n    xs: 'text-xs',\n    sm: 'text-sm leading-4',\n    md: 'text-sm',\n    lg: 'text-base',\n    xl: 'text-base',\n  },\n  padding: {\n    xs: 'px-2.5 py-1',\n    sm: 'px-3 py-2',\n    md: 'px-4 py-2',\n    lg: 'px-4 py-2',\n    xl: 'px-6 py-3',\n  },\n  height: {\n    xs: 'h-[24px]',\n    sm: 'h-[28px]',\n    md: 'h-[32px]',\n    lg: 'h-[36px]',\n    xl: 'h-[44px]',\n  },\n}\n\nexport const SIZE_VARIANTS = {\n  xs: `${SIZE.text['xs']} ${SIZE.padding['xs']} ${SIZE.height['xs']}`,\n  sm: `${SIZE.text['sm']} ${SIZE.padding['sm']} ${SIZE.height['sm']}`,\n  md: `${SIZE.text['md']} ${SIZE.padding['md']} ${SIZE.height['md']}`,\n  lg: `${SIZE.text['lg']} ${SIZE.padding['lg']} ${SIZE.height['lg']}`,\n  xl: `${SIZE.text['xl']} ${SIZE.padding['xl']} ${SIZE.height['xl']}`,\n}\n\nexport const SIZE_VARIANTS_INNER = {\n  xs: `${SIZE.text['xs']} ${SIZE.padding['xs']} ${SIZE_INNER.height['xs']}`,\n  sm: `${SIZE.text['sm']} ${SIZE.padding['sm']} ${SIZE_INNER.height['sm']}`,\n  md: `${SIZE.text['md']} ${SIZE.padding['md']} ${SIZE_INNER.height['md']}`,\n  lg: `${SIZE.text['lg']} ${SIZE.padding['lg']} ${SIZE_INNER.height['lg']}`,\n  xl: `${SIZE.text['xl']} ${SIZE.padding['xl']} ${SIZE_INNER.height['xl']}`,\n}\n\n/** @deprecated Use 'sm' instead */\nexport const SIZE_VARIANTS_DEFAULT = 'sm'\n","import { type ClassValue, clsx } from 'clsx'\nimport { twMerge } from 'tailwind-merge'\nimport { formatJalaliDate } from '@/lib/jalali-utils'\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs))\n}\n\nexport type SupportedLocale = 'fa' | 'ar' | 'en'\n\n/**\n * Convert digits in a string to Persian/Arabic numerals based on locale.\n * @example convertToLocalNumbers('123', 'fa') => '۱۲۳'\n * @example convertToLocalNumbers('123', 'en') => '123'\n */\nexport function convertToLocalNumbers(text: string | number, locale: SupportedLocale): string {\n  if (locale === 'fa' || locale === 'ar') {\n    const persianDigits = ['۰', '۱', '۲', '۳', '۴', '۵', '۶', '۷', '۸', '۹']\n    return String(text).replace(/\\d/g, (digit) => persianDigits[parseInt(digit)])\n  }\n  return String(text)\n}\n\n/**\n * Format large numbers with locale-aware suffixes (K/M/B).\n * @example formatLargeNumber(1500, 'fa') => '۱.۵ هزار'\n * @example formatLargeNumber(1500, 'en') => '1.5K'\n */\nexport function formatLargeNumber(num: number, locale: SupportedLocale): string {\n  if (num >= 1_000_000_000) {\n    const formatted = (num / 1_000_000_000).toFixed(1).replace(/\\.0$/, '')\n    return convertToLocalNumbers(formatted, locale) + (locale === 'en' ? 'B' : ' میلیارد')\n  }\n  if (num >= 1_000_000) {\n    const formatted = (num / 1_000_000).toFixed(1).replace(/\\.0$/, '')\n    return convertToLocalNumbers(formatted, locale) + (locale === 'en' ? 'M' : ' میلیون')\n  }\n  if (num >= 1_000) {\n    const formatted = (num / 1_000).toFixed(1).replace(/\\.0$/, '')\n    return convertToLocalNumbers(formatted, locale) + (locale === 'en' ? 'K' : ' هزار')\n  }\n  return convertToLocalNumbers(num.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, ','), locale)\n}\n\n/**\n * Format number to Instagram-style short format (English only).\n * @example formatNumber(123456, 'short') => '123K'\n * @example formatNumber(123456, 'exact') => '123,456'\n */\nexport function formatNumber(num: number | undefined, format: 'exact' | 'short' = 'exact'): string {\n  if (num === undefined || num === null) return '0'\n\n  if (format === 'exact') {\n    return num.toLocaleString('en-US')\n  }\n\n  // Short format (Instagram style)\n  if (num >= 1_000_000_000) {\n    return `${(num / 1_000_000_000).toFixed(1).replace(/\\.0$/, '')}B`\n  }\n  if (num >= 1_000_000) {\n    return `${(num / 1_000_000).toFixed(1).replace(/\\.0$/, '')}M`\n  }\n  if (num >= 1_000) {\n    return `${(num / 1_000).toFixed(1).replace(/\\.0$/, '')}K`\n  }\n  return num.toString()\n}\n\n/**\n * Format date to relative time with absolute on hover (Persian)\n * @example formatRelativeTime(new Date()) => '۲ ساعت پیش'\n */\nexport function formatRelativeTime(date: Date | string | number): string {\n  const now = new Date()\n  const then = new Date(date)\n  const diffInSeconds = Math.floor((now.getTime() - then.getTime()) / 1000)\n\n  if (diffInSeconds < 60) {\n    return 'همین الان'\n  }\n\n  const diffInMinutes = Math.floor(diffInSeconds / 60)\n  if (diffInMinutes < 60) {\n    return `${convertToLocalNumbers(diffInMinutes, 'fa')} دقیقه پیش`\n  }\n\n  const diffInHours = Math.floor(diffInMinutes / 60)\n  if (diffInHours < 24) {\n    return `${convertToLocalNumbers(diffInHours, 'fa')} ساعت پیش`\n  }\n\n  const diffInDays = Math.floor(diffInHours / 24)\n  if (diffInDays < 7) {\n    return `${convertToLocalNumbers(diffInDays, 'fa')} روز پیش`\n  }\n\n  const diffInWeeks = Math.floor(diffInDays / 7)\n  if (diffInWeeks < 4) {\n    return `${convertToLocalNumbers(diffInWeeks, 'fa')} هفته پیش`\n  }\n\n  const diffInMonths = Math.floor(diffInDays / 30)\n  if (diffInMonths < 12) {\n    return `${convertToLocalNumbers(diffInMonths, 'fa')} ماه پیش`\n  }\n\n  const diffInYears = Math.floor(diffInDays / 365)\n  return `${convertToLocalNumbers(diffInYears, 'fa')} سال پیش`\n}\n\n/**\n * Format date to absolute format (Persian / Jalali)\n * Uses date-fns-jalali for accurate Jalali conversion.\n * @example formatAbsoluteTime(new Date()) => '۱۵ دی ۱۴۰۳، ۱۵:۳۰'\n */\nexport function formatAbsoluteTime(date: Date | string | number): string {\n  const d = new Date(date)\n  return formatJalaliDate(d, 'd MMMM yyyy، HH:mm')\n}\n","'use client'\n\nimport { VariantProps, cva } from 'class-variance-authority'\nimport * as React from 'react'\nimport { SIZE_VARIANTS } from '@/lib/constants'\nimport { cn } from '@/lib/utils'\n\nexport const inputVariants = cva(\n  cn(\n    // 1.1.16 — bg-control (now 19% in dark) instead of foreground/2.6%\n    // opacity overlay, so the input is visibly distinct from any Card\n    // it sits inside. text-start makes text-align follow the input's\n    // own `dir` (set explicitly or auto for LTR types), so an email\n    // field with `dir=\"ltr\"` is left-aligned even in an RTL form.\n    'flex w-full rounded-md border border-control read-only:border-button bg-control text-sm text-foreground text-start file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-foreground-lighter read-only:text-foreground-light',\n    'transition-colors duration-150',\n    'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50',\n    'aria-[invalid=true]:bg-destructive-200 dark:aria-[invalid=true]:bg-destructive/5 aria-[invalid=true]:border-destructive-400 dark:aria-[invalid=true]:border-destructive-default aria-[invalid=true]:focus:border-destructive aria-[invalid=true]:focus-visible:border-destructive'\n  ),\n  {\n    variants: {\n      size: {\n        ...SIZE_VARIANTS,\n      },\n    },\n    defaultVariants: {\n      size: 'sm',\n    },\n  }\n)\n\n/** @deprecated Use inputVariants instead */\nexport const InputVariants = inputVariants\n\nexport interface InputProps\n  extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'>, VariantProps<typeof inputVariants> {\n  /**\n   * Node rendered at the start of the input (left in LTR, right in RTL).\n   * Common use: a search icon, a country flag, a currency symbol.\n   * The adornment wrapper is `pointer-events-none` by default so it doesn't\n   * steal focus from the input — interactive elements inside (e.g. a\n   * `<button>` for a password show/hide toggle) get `pointer-events-auto`\n   * back automatically.\n   */\n  startAdornment?: React.ReactNode\n  /**\n   * Node rendered at the end of the input (right in LTR, left in RTL).\n   * Common use: a password show/hide toggle, a clear button, a unit suffix.\n   * See `startAdornment` for the pointer-events behavior.\n   */\n  endAdornment?: React.ReactNode\n}\n\nconst LTR_INPUT_TYPES = new Set(['email', 'url', 'tel', 'number', 'password'])\n\nconst Input = React.forwardRef<HTMLInputElement, InputProps>(\n  ({ className, type, size = 'sm', dir, startAdornment, endAdornment, ...props }, ref) => {\n    // LTR content types: auto-set dir=\"ltr\" unless caller explicitly overrides\n    const resolvedDir = dir ?? (type && LTR_INPUT_TYPES.has(type) ? 'ltr' : undefined)\n\n    // Fast path: no adornments → render the bare <input>. Zero wrapper cost,\n    // identical to the pre-1.1.14 behavior for backward compatibility.\n    if (!startAdornment && !endAdornment) {\n      return (\n        <input\n          type={type}\n          ref={ref}\n          data-slot=\"input\"\n          dir={resolvedDir}\n          {...props}\n          className={cn(inputVariants({ size }), className)}\n        />\n      )\n    }\n\n    // Adornment path: wrap in a relative container that inherits the input's\n    // OWN direction. This is the key bug fix: when a password input declares\n    // `dir=\"ltr\"` inside an `dir=\"rtl\"` page, the adornment must be positioned\n    // relative to the input's flow (right side for LTR), not the page's flow\n    // (which would put it under the typed characters).\n    return (\n      <div data-slot=\"input-wrapper\" dir={resolvedDir} className=\"relative w-full\">\n        {startAdornment && (\n          <span\n            data-slot=\"input-start-adornment\"\n            className=\"pointer-events-none absolute start-3 top-1/2 flex -translate-y-1/2 items-center text-foreground-light [&_button]:pointer-events-auto\"\n          >\n            {startAdornment}\n          </span>\n        )}\n        <input\n          type={type}\n          ref={ref}\n          data-slot=\"input\"\n          dir={resolvedDir}\n          {...props}\n          className={cn(inputVariants({ size }), startAdornment && 'ps-10', endAdornment && 'pe-10', className)}\n        />\n        {endAdornment && (\n          <span\n            data-slot=\"input-end-adornment\"\n            className=\"pointer-events-none absolute end-3 top-1/2 flex -translate-y-1/2 items-center text-foreground-light [&_button]:pointer-events-auto\"\n          >\n            {endAdornment}\n          </span>\n        )}\n      </div>\n    )\n  }\n)\n\nInput.displayName = 'Input'\n\nexport { Input }\n"]}

package/dist/components/ui/input.d.cts

@@ -10,6 +10,21 @@ declare const InputVariants: (props?: ({
     size?: "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'>, VariantProps<typeof inputVariants> {
+    /**
+     * Node rendered at the start of the input (left in LTR, right in RTL).
+     * Common use: a search icon, a country flag, a currency symbol.
+     * The adornment wrapper is `pointer-events-none` by default so it doesn't
+     * steal focus from the input — interactive elements inside (e.g. a
+     * `<button>` for a password show/hide toggle) get `pointer-events-auto`
+     * back automatically.
+     */
+    startAdornment?: React.ReactNode;
+    /**
+     * Node rendered at the end of the input (right in LTR, left in RTL).
+     * Common use: a password show/hide toggle, a clear button, a unit suffix.
+     * See `startAdornment` for the pointer-events behavior.
+     */
+    endAdornment?: React.ReactNode;
 }
 declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;
 

package/dist/components/ui/input.d.ts

@@ -10,6 +10,21 @@ declare const InputVariants: (props?: ({
     size?: "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'>, VariantProps<typeof inputVariants> {
+    /**
+     * Node rendered at the start of the input (left in LTR, right in RTL).
+     * Common use: a search icon, a country flag, a currency symbol.
+     * The adornment wrapper is `pointer-events-none` by default so it doesn't
+     * steal focus from the input — interactive elements inside (e.g. a
+     * `<button>` for a password show/hide toggle) get `pointer-events-auto`
+     * back automatically.
+     */
+    startAdornment?: React.ReactNode;
+    /**
+     * Node rendered at the end of the input (right in LTR, left in RTL).
+     * Common use: a password show/hide toggle, a clear button, a unit suffix.
+     * See `startAdornment` for the pointer-events behavior.
+     */
+    endAdornment?: React.ReactNode;
 }
 declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;