ar-design 0.2.61 → 0.2.63

package/dist/components/form/upload/Props.d.ts

@@ -1,19 +1,112 @@
 import { AllowedTypes } from "../../../libs/types";
-import { IValidation } from "../../../libs/types/IGlobalProps";
+import { IDisabled, IValidation } from "../../../libs/types/IGlobalProps";
 interface IMultiple {
+    /**
+     * Yüklenen dosyalar dizisi.
+     *
+     * Örneğin;
+     *
+     * ```jsx
+     * <Upload
+     *    file={[file1, file2]}
+     *    multiple={true}
+     *    onChange={(formData, files, isInvalid) => {}}
+     * />
+     * ```
+     */
     file: File[];
+    /**
+     * Dosya seçimi veya değişikliğinde tetiklenen fonksiyon.
+     *
+     * @param formData - Dosyalarla oluşturulmuş FormData nesnesi.
+     * @param files - Seçilen dosyalar dizisi.
+     * @param isInvalidFileExist - Geçersiz dosya olup olmadığını belirtir.
+     *
+     * Örneğin;
+     *
+     * ```jsx
+     * <Upload
+     *    onChange={(formData, files, isInvalid) => {
+     *      console.log(files.length, isInvalid);
+     *    }}
+     * />
+     * ```
+     */
     onChange: (formData: FormData, files: File[], isInvalidFileExist: boolean) => void;
+    /**
+     * Çoklu dosya seçiminin aktif olduğunu belirtir.
+     *
+     * Örneğin;
+     * ```jsx
+     * <Upload multiple={true} />
+     * ```
+     */
     multiple: true;
 }
 interface ISingle {
+    /**
+     * Yüklenen tek dosya veya undefined.
+     *
+     * Örneğin;
+     *
+     * ```jsx
+     * <Upload file={selectedFile} />
+     * ```
+     */
     file: File | undefined;
+    /**
+     * Dosya seçimi veya değişikliğinde tetiklenen fonksiyon.
+     *
+     * @param formData - Dosyayla oluşturulmuş FormData nesnesi veya undefined.
+     * @param files - Seçilen dosya veya null.
+     *
+     * Örneğin;
+     *
+     * ```jsx
+     * <Upload onChange={(formData, file) => console.log(file)} />
+     * ```
+     */
     onChange: (formData: FormData | undefined, files: File | null) => void;
+    /**
+     * Çoklu dosya seçiminin devre dışı olduğunu belirtir.
+     *
+     * Örneğin;
+     *
+     * ```jsx
+     * <Upload multiple={false} />
+     * ```
+     */
     multiple?: false;
 }
 type Props = {
+    /**
+     * Bileşen ile ilgili açıklayıcı veya gösterilecek metin.
+     *
+     * Örneğin;
+     *
+     * ```jsx
+     * <Upload text="Dosya yükle" />
+     * ```
+     */
     text: string;
+    /**
+     * Kabul edilen dosya türlerinin listesi.
+     *
+     * Örneğin;
+     * ```jsx
+     * <Upload allowedTypes={["image/png", "application/pdf"]} />
+     * ```
+     */
     allowedTypes?: AllowedTypes[];
+    /**
+     * Kabul edilen maksimum dosya boyutu (byte cinsinden).
+     *
+     * Örneğin;
+     *
+     * ```jsx
+     * <Upload maxSize={1} /> // 1 MB
+     * ```
+     */
     maxSize?: number;
-    disabled?: boolean;
-} & (IMultiple | ISingle) & IValidation;
+} & (IMultiple | ISingle) & IValidation & IDisabled;
 export default Props;

package/dist/components/navigation/menu/IProps.d.ts

@@ -1,7 +1,32 @@
 import React from "react";
 import { MenuItemVariants, MenuProps } from "../../../libs/types";
 interface IProps extends React.HTMLAttributes<HTMLElement> {
+    /**
+     * Menüde gösterilecek öğeler listesi.
+     *
+     * Örneğin;
+     *
+     * ```jsx
+     * <Menu data={[
+     *   { render: "Anasayfa", icon: SVGElement | HTMLImageElement },
+     *   { render: <b>Hakkımızda</b>, type: "group", submenu: [{ render: "Ekibimiz" }] }
+     * ]} />
+     * ```
+     */
     data: MenuProps[];
+    /**
+     * Menü öğelerinin varyantı (stili).
+     *
+     * - `vertical`: Stil türünü belirtir ("filled" | "outlined" | "dashed" | "borderless").
+     * - `horizontal`: Bileşenin soluna içerik ekler (örneğin ₺, %, vb.).
+     * - `after`: Bileşenin sağına içerik ekler.
+     *
+     * Örneğin;
+     *
+     * ```jsx
+     * <Menu variant="vertical" />
+     * ```
+     */
     variant?: MenuItemVariants;
 }
 export default IProps;

package/dist/components/navigation/pagination/IProps.d.ts

@@ -1,12 +1,18 @@
-/**
- * Pagination component props
- */
 interface IProps {
     /**
      * Varsayılan olarak seçili olan sayfa numarası.
      * Eğer belirtilmezse, 1. sayfa varsayılan olarak kabul edilir.
+     *
+     * Örneğin;
+     *
+     * ```tsx
+     * <Pagination defaultCurrent={3} />
+     * ```
      */
     defaultCurrent?: number;
+    /**
+     * Şu anda aktif olan sayfa numarası.
+     */
     currentPage: number;
     /**
      * Toplam kayıt sayısı.
@@ -20,6 +26,7 @@ interface IProps {
     perPage?: number;
     /**
      * Sayfa değiştiğinde tetiklenen geri çağırma fonksiyonu.
+     *
      * @param currentPage - Kullanıcının seçtiği yeni sayfa numarası.
      */
     onChange: (currentPage: number) => void;

package/dist/components/navigation/steps/IProps.d.ts

@@ -1,8 +1,5 @@
 import { StepProps, ValidationProperties } from "../../../libs/types";
 import { IChildren } from "../../../libs/types/IGlobalProps";
-/**
- * Stepper component props
- */
 interface IProps<TData extends object> extends IChildren {
     /**
      * Step'leri temsil eden dizisi.
@@ -15,10 +12,21 @@ interface IProps<TData extends object> extends IChildren {
      */
     onChange: (currentStep: number) => void;
     /**
-     * ...
+     * Doğrulama için kullanılan veri nesnesi.
+     *
+     * `TData` tipi ile esnek şekilde tanımlanır.
      */
     validation?: {
+        /**
+         * Doğrulama yapılacak veri.
+         */
         data: TData;
+        /**
+         * Doğrulama kuralları dizisi.
+         *
+         * `ValidationProperties<TData>` tipiyle tanımlanır ve
+         * `data` üzerindeki alanlara uygulanacak doğrulama kurallarını içerir.
+         */
         rules: ValidationProperties<TData>[];
     };
 }

package/dist/libs/types/IGlobalProps.d.ts

@@ -1,8 +1,29 @@
 import { Border, Icon, Sizes, Status, Variants } from ".";
-/**
- * Ortak olabilecek özellikler bu interface altına konumlandırıldı.
- */
-export interface IGlobalProps {
+export interface IChildren {
+    /**
+     * Bileşenin içinde render edilecek içeriği belirtir.
+     * Bu içerik bir dize (string) veya bir React Elemanı olabilir.
+     *
+     * Örneğin;
+     * - Bir Dize: "Hello, World!"
+     * - Bir React Elemanı: <span>Hello, World!</span>
+     *
+     * ```jsx
+     * <Component>Hello, World!</Component>
+     *
+     * <Component>
+     *    <span>Hello, World!</span>
+     * </Component>
+     *
+     * <Component>
+     *    <span>Hello, World!</span>
+     *    <span>Hello, World!</span>
+     * </Component>
+     * ```
+     */
+    children?: React.ReactNode;
+}
+export interface IVariant {
     /**
      * Bileşenin stil varyantını belirtir.
      *
@@ -20,6 +41,8 @@ export interface IGlobalProps {
      * ```
      */
     variant?: Variants;
+}
+export interface IStatus {
     /**
      * Bileşenin statü durumuna göre renk özelliğini belirtir.
      *
@@ -30,6 +53,31 @@ export interface IGlobalProps {
      * ```
      */
     status?: Status;
+}
+export interface IBorder {
+    /**
+     * Bileşenin çervesinde düzenleme yapılmasına olanak tanır.
+     * Kenarlığın stilini ve köşe yuvarlama derecesini tanımlamak için kullanılır.
+     *
+     * - `radius` (isteğe bağlı): Köşe yuvarlama derecesini belirtir.
+     *    - `sm`: Küçük yuvarlama.
+     *    - `lg`: Büyük yuvarlama.
+     *    - `xl`: Ekstra büyük yuvarlama.
+     *    - `xxl`: Çok büyük yuvarlama.
+     *    - `pill`: Hap şeklinde yuvarlama.
+     *    - `none`: Yuvarlama yok.
+     *
+     * Örneğin;
+     *
+     * ```jsx
+     * <Component border={{ radius: "sm" }} >
+     *  Example
+     * </Component>
+     * ```
+     */
+    border?: Border;
+}
+export interface IIcon {
     /**
      * İkon eklemeyi sağlar.
      * İkonun kendisini, yönünü ve pozisyonunu tanımlamak için kullanılır.
@@ -54,27 +102,26 @@ export interface IGlobalProps {
      * ```
      */
     icon?: Icon;
+}
+export interface ISize {
     /**
-     * Bileşenin çervesinde düzenleme yapılmasına olanak tanır.
-     * Kenarlığın stilini ve köşe yuvarlama derecesini tanımlamak için kullanılır.
+     * Bileşenin boyutlarınu belirlemek için kullanılır.
      *
-     * - `radius` (isteğe bağlı): Köşe yuvarlama derecesini belirtir.
-     *    - `sm`: Küçük yuvarlama.
-     *    - `lg`: Büyük yuvarlama.
-     *    - `xl`: Ekstra büyük yuvarlama.
-     *    - `xxl`: Çok büyük yuvarlama.
-     *    - `pill`: Hap şeklinde yuvarlama.
-     *    - `none`: Yuvarlama yok.
+     * - `large`: Büyük boyut.
+     * - `normal (Varsayılan)`: Normal boyut.
+     * - `small`: Küçük boyut.
      *
      * Örneğin;
      *
      * ```jsx
-     * <Component border={{ radius: "sm" }} >
+     * <Component size="large" >
      *  Example
      * </Component>
      * ```
      */
-    border?: Border;
+    size?: Sizes;
+}
+export interface IUpperCase {
     /**
      * Bileşendeki metni büyük harflere dönüştürüp dönüştürmeyeceğini belirtir.
      * Boolean (true/false) değeri alır.
@@ -83,55 +130,54 @@ export interface IGlobalProps {
      * - `false`: Metin olduğu gibi, yani küçük/büyük harf karışımı şeklinde yazılır.
      *
      * Bu özellik, metnin stilini özelleştirmek için kullanılır ve isteğe bağlı şekilde çalışır.
+     *
+     * Örneğin;
+     *
+     * ```jsx
+     * <Component upperCase>
+     *  Example
+     * </Component>
+     * ```
      */
     upperCase?: boolean;
-    disabled?: boolean;
 }
-export interface IChildren {
+export interface IValidation {
     /**
-     * Bileşenin içinde render edilecek içeriği belirtir.
-     * Bu içerik bir dize (string) veya bir React Elemanı olabilir.
+     * Bileşen için doğrulama (validation) mesajı tanımlamak amacıyla kullanılır.
+     *
+     * - `text`: Gösterilecek hata veya uyarı mesajı.
+     * - `scrollTo`: (İsteğe bağlı) true olarak ayarlanırsa, doğrulama mesajı varsa ilgili bileşene otomatik olarak kaydırma yapılır.
      *
      * Örneğin;
-     * - Bir Dize: "Hello, World!"
-     * - Bir React Elemanı: <span>Hello, World!</span>
      *
      * ```jsx
-     * <Component>Hello, World!</Component>
-     *
-     * <Component>
-     *    <span>Hello, World!</span>
-     * </Component>
-     *
-     * <Component>
-     *    <span>Hello, World!</span>
-     *    <span>Hello, World!</span>
-     * </Component>
+     * <Component
+     *   validation={{
+     *     text: "Bu alan zorunludur.",
+     *     scrollTo: true,
+     *   }}
+     * />
      * ```
      */
-    children?: React.ReactNode;
+    validation?: {
+        text: string | undefined;
+        scrollTo?: boolean;
+    };
 }
-export interface ISizes {
+export interface IDisabled {
     /**
-     * Bileşenin boyutlarınu belirlemek için kullanılır.
+     * Bileşenin pasif (devre dışı) olup olmadığını belirtmek için kullanılır.
      *
-     * - `large`: Büyük boyut.
-     * - `normal (Varsayılan)`: Normal boyut.
-     * - `small`: Küçük boyut.
+     * - `true`: Bileşen devre dışı olur, kullanıcı etkileşimi engellenir.
+     * - `false` veya belirtilmemişse: Bileşen aktif olur.
      *
      * Örneğin;
      *
      * ```jsx
-     * <Component size="large" >
+     * <Component disabled>
      *  Example
      * </Component>
      * ```
      */
-    size?: Sizes;
-}
-export interface IValidation {
-    validation?: {
-        text: string | undefined;
-        scrollTo?: boolean;
-    };
+    disabled?: boolean;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ar-design",
-  "version": "0.2.61",
+  "version": "0.2.63",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -19,17 +19,9 @@
     "dist/"
   ],
   "scripts": {
-    "build": "npm run scripts && rm -rf dist/ && npm run build:post-mac && npm run build:esm",
-    "build:post-mac": "npm run mkdir:esm && npm run copy:esm",
-    "mkdir:esm": "mkdir -p dist/assets && mkdir -p dist/assets/css",
-    "copy:esm": "cp -r ./src/assets dist/ && cp -r ./src/assets/css dist/assets/",
-    "build:esm": "tsc",
-    "mv:esm": "for ext in js ts; do mv ./dist/esm/*.$ext ./dist/; done",
-    "mkdir:cjs": "mkdir -p dist/cjs/libs/styles",
-    "copy:cjs": "cp -r ./src/libs/styles dist/cjs/libs/",
-    "build:cjs": "tsc --module commonjs --outdir dist/cjs",
-    "mv:cjs": "for ext in js ts; do mv ./dist/cjs/*.$ext ./dist/; done",
-    "scripts": "node src/scripts/index.cjs"
+    "build": "npm run clean && tsc && npm run css-loader && cp -r ./src/assets dist/",
+    "css-loader": "node src/scripts/index.cjs",
+    "clean": "rm -rf dist/"
   },
   "repository": {
     "type": "git",

package/dist/components/data-display/grid-system/row/Types.d.ts

@@ -1,4 +0,0 @@
-export type Props = {
-    children: React.ReactNode;
-    direction?: "row";
-};

package/dist/components/data-display/table/_index.d.ts

@@ -1,13 +0,0 @@
-import "../../../assets/css/components/data-display/table/styles.css";
-import IProps from "./IProps";
-import React, { ReactElement } from "react";
-declare const TableWithRef: <T>(props: IProps<T> & {
-    ref?: React.ForwardedRef<HTMLTableElement>;
-}) => ReactElement;
-type TableCompoundComponents = typeof TableWithRef & {
-    Actions: React.FC<{
-        children: React.ReactElement | React.ReactElement[];
-    }>;
-};
-declare const Table: TableCompoundComponents;
-export default Table;