ar-design 0.1.21 → 0.1.23

package/dist/libs/core/application/contexts/Notification.js

@@ -0,0 +1,19 @@
+"use client";
+import React, { createContext, useState } from "react";
+import Notification from "../../../../components/feedback/notification";
+const NotificationContext = createContext({});
+const NotificationProvider = ({ children, direction }) => {
+    const [title, setTitle] = useState("Example");
+    const [message, setMessage] = useState("Lorem Ipsum, dizgi ve baskı endüstrisinde kullanılan mıgır metinlerdir.");
+    const [status, setStatus] = useState("success");
+    const [trigger, setTrigger] = useState(false);
+    return (React.createElement(NotificationContext.Provider, { value: {
+            setTitle,
+            setMessage,
+            setStatus,
+            setTrigger,
+        } },
+        children,
+        React.createElement(Notification, { title: title, message: message, status: status, direction: direction, trigger: trigger })));
+};
+export { NotificationContext, NotificationProvider };

package/dist/libs/core/application/contexts/index.d.ts

@@ -0,0 +1,3 @@
+import { ConfigProvider } from "./Config";
+import { NotificationProvider } from "./Notification";
+export { ConfigProvider, NotificationProvider };

package/dist/libs/core/application/contexts/index.js

@@ -0,0 +1,3 @@
+import { ConfigProvider } from "./Config";
+import { NotificationProvider } from "./Notification";
+export { ConfigProvider, NotificationProvider };

package/dist/libs/core/application/hooks/index.d.ts

@@ -1,26 +1,40 @@
+import { Status } from "../contexts/Notification";
 export declare const useLayout: () => {
-    options: {
-        sider: {
-            left?: {
-                element?: import("react").ReactNode;
-                active: boolean;
-            };
-            right?: {
-                element?: import("react").ReactNode;
-                active: boolean;
+    config: {
+        layout: {
+            sider: {
+                left: {
+                    element: import("react").ReactNode | null;
+                    active: boolean;
+                };
+                right: {
+                    element: import("react").ReactNode | null;
+                    active: boolean;
+                };
             };
         };
+        perPage: number;
     };
-    setOptions: import("react").Dispatch<import("react").SetStateAction<{
-        sider: {
-            left?: {
-                element?: import("react").ReactNode;
-                active: boolean;
-            };
-            right?: {
-                element?: import("react").ReactNode;
-                active: boolean;
+    setConfig: import("react").Dispatch<import("react").SetStateAction<{
+        layout: {
+            sider: {
+                left: {
+                    element: import("react").ReactNode | null;
+                    active: boolean;
+                };
+                right: {
+                    element: import("react").ReactNode | null;
+                    active: boolean;
+                };
             };
         };
+        perPage: number;
     }>>;
 };
+export declare const useNotification: () => {
+    notification: ({ title, message, status, }: {
+        title: string;
+        message: string;
+        status: Status;
+    }) => void;
+};

package/dist/libs/core/application/hooks/index.js

@@ -1,9 +1,22 @@
 import { useContext } from "react";
-import { LayoutContext } from "../contexts/Layout";
+import { ConfigContext } from "../contexts/Config";
+import { NotificationContext } from "../contexts/Notification";
 export const useLayout = () => {
-    const context = useContext(LayoutContext);
+    const context = useContext(ConfigContext);
     if (!context) {
         throw new Error("useLayout must be used within a LayoutProvider");
     }
     return context;
 };
+export const useNotification = () => {
+    // contexts
+    const { setTitle, setMessage, setStatus, setTrigger } = useContext(NotificationContext);
+    // methods
+    const notification = ({ title, message, status, }) => {
+        setTitle && setTitle(title);
+        setMessage && setMessage(message);
+        setStatus && setStatus(status);
+        setTrigger && setTrigger((trigger) => !trigger);
+    };
+    return { notification };
+};

package/dist/libs/core/service/Api.d.ts

@@ -0,0 +1,35 @@
+declare class Api {
+    private _host?;
+    private _core?;
+    constructor(values: {
+        host?: string;
+        core?: string;
+    });
+    Get<T>(values: {
+        input?: RequestInfo | undefined;
+        headers?: HeadersInit;
+    }): Promise<T>;
+    Post<T>(values: {
+        input?: RequestInfo;
+        data: any;
+        headers?: HeadersInit;
+    }): Promise<T>;
+    Put<T>(values: {
+        input?: RequestInfo;
+        data?: any;
+        headers?: HeadersInit;
+    }): Promise<T>;
+    Delete<T>(values: {
+        input?: RequestInfo;
+        headers?: HeadersInit;
+    }): Promise<T>;
+    /**
+     * Burada bir fetch işlemi gerçekleştirilmekte fakat farklı olarak burayı `interceptor` olarak kullanmaktayız.
+     * @param input
+     * @param init
+     * @returns
+     */
+    private CustomFetch;
+    private HeaderProperties;
+}
+export default Api;

package/dist/libs/core/service/Api.js

@@ -0,0 +1,86 @@
+class Api {
+    _host;
+    _core;
+    constructor(values) {
+        this._host = values.host || window.location.origin;
+        this._core = values.core || "";
+    }
+    async Get(values) {
+        const request = await this.CustomFetch(`${this._host}/${this._core ? this._core + "/" : ""}${values.input}`, {
+            headers: {
+                ...this.HeaderProperties,
+                ...values.headers,
+            },
+            method: "GET",
+        });
+        return await request.json();
+    }
+    async Post(values) {
+        const request = await this.CustomFetch(`${this._host}/${this._core ? this._core + "/" : ""}${values.input}`, {
+            headers: { ...this.HeaderProperties, ...values.headers },
+            method: "POST",
+            body: JSON.stringify(values.data),
+        });
+        return await request.json();
+    }
+    async Put(values) {
+        const request = await this.CustomFetch(`${this._host}/${this._core ? this._core + "/" : ""}${values.input}`, {
+            headers: {
+                ...this.HeaderProperties,
+                ...values.headers,
+            },
+            method: "PUT",
+            body: JSON.stringify(values.data),
+        });
+        return await request.json();
+    }
+    async Delete(values) {
+        const request = await this.CustomFetch(`${this._host}/${this._core ? this._core + "/" : ""}${values.input}`, {
+            headers: {
+                ...this.HeaderProperties,
+                ...values.headers,
+            },
+            method: "DELETE",
+        });
+        return await request.json();
+    }
+    /**
+     * Burada bir fetch işlemi gerçekleştirilmekte fakat farklı olarak burayı `interceptor` olarak kullanmaktayız.
+     * @param input
+     * @param init
+     * @returns
+     */
+    async CustomFetch(input, init) {
+        try {
+            // # Request Interceptor
+            const request = await fetch(input, init);
+            // # Response Interceptor
+            // Error Handling
+            if (!request.ok) {
+                switch (request.status) {
+                    case 400:
+                        console.error("400");
+                        break;
+                    case 401:
+                        console.error("401");
+                        break;
+                    case 404:
+                        console.error("404");
+                        break;
+                    default:
+                        break;
+                }
+            }
+            // Return
+            return request;
+        }
+        catch (error) {
+            throw error;
+        }
+    }
+    HeaderProperties = {
+        Accept: "application/json",
+        "Content-Type": "application/json",
+    };
+}
+export default Api;

package/dist/libs/core/service/index.d.ts

@@ -0,0 +1,28 @@
+declare class Service {
+    private _api;
+    private _endPoint;
+    constructor(values: {
+        host?: string;
+        core?: string;
+        endPoint: string;
+    });
+    Get<T>(values?: {
+        input?: string;
+        headers?: HeadersInit | undefined;
+    }): Promise<T>;
+    Post<T, TData>(values?: {
+        input?: RequestInfo;
+        data: TData;
+        headers?: HeadersInit;
+    }): Promise<T>;
+    Put<T, TData>(values?: {
+        input?: RequestInfo;
+        data?: TData;
+        headers?: HeadersInit;
+    }): Promise<T>;
+    Delete<T>(values?: {
+        input?: RequestInfo;
+        headers?: HeadersInit;
+    }): Promise<T>;
+}
+export default Service;

package/dist/libs/core/service/index.js

@@ -0,0 +1,48 @@
+import Api from "./Api";
+class Service {
+    _api;
+    _endPoint;
+    constructor(values) {
+        this._api = new Api({ host: values.host, core: values.core });
+        this._endPoint = values.endPoint;
+    }
+    async Get(values) {
+        let endPoint = `${this._endPoint}`;
+        if (values?.input)
+            endPoint += `/${values.input}`;
+        return await this._api.Get({
+            input: endPoint,
+            headers: values?.headers,
+        });
+    }
+    async Post(values) {
+        let endPoint = `${this._endPoint}`;
+        if (values?.input)
+            endPoint += `/${values.input}`;
+        return await this._api.Post({
+            input: endPoint,
+            data: values?.data,
+            headers: values?.headers,
+        });
+    }
+    async Put(values) {
+        let endPoint = `${this._endPoint}`;
+        if (values?.input)
+            endPoint += `/${values.input}`;
+        return await this._api.Put({
+            input: endPoint,
+            data: values?.data,
+            headers: values?.headers,
+        });
+    }
+    async Delete(values) {
+        let endPoint = `${this._endPoint}`;
+        if (values?.input)
+            endPoint += `/${values.input}`;
+        return await this._api.Delete({
+            input: endPoint,
+            headers: values?.headers,
+        });
+    }
+}
+export default Service;

package/dist/libs/infrastructure/shared/Utils.d.ts

@@ -0,0 +1,6 @@
+import { Border, Icon, Sizes, Status, Variants } from "../../types";
+declare class Utils {
+    GetClassName: (variant?: Variants, status?: Status, border?: Border, size?: Sizes, icon?: Icon, className?: string) => string[];
+}
+declare const _default: Utils;
+export default _default;

package/dist/libs/infrastructure/shared/Utils.js

@@ -0,0 +1,15 @@
+class Utils {
+    GetClassName = (variant = "filled", status = "light", border = { radius: "sm" }, size = "normal", icon, className) => {
+        const classNames = [variant, status, `border-radius-${border.radius}`];
+        if (size)
+            classNames.push(size);
+        if (icon && icon.element) {
+            classNames.push("icon");
+            classNames.push(`icon-${icon.position || "start"}`);
+        }
+        if (className)
+            classNames.push(className);
+        return classNames;
+    };
+}
+export default new Utils();

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

@@ -1,4 +1,4 @@
-import { BorderRadiuses, Sizes, Status, Variants } from ".";
+import { Border, Icon, Sizes, Status, Variants } from ".";
 /**
  * Ortak olabilecek özellikler bu interface altına konumlandırıldı.
  */
@@ -57,9 +57,6 @@ export interface IGlobalProps {
      * İkonun kendisini, yönünü ve pozisyonunu tanımlamak için kullanılır.
      *
      * - `element`: İkon olarak kullanılacak React JSX elemanı.
-     * - `direction` (isteğe bağlı): İkonun ve metnin hizalanma yönünü belirtir.
-     *    - `row`: İkon ve metin yatay olarak hizalanır.
-     *    - `column`: İkon ve metin dikey olarak hizalanır.
      * - `position` (isteğe bağlı): İkonun metne göre konumunu belirtir.
      *    - `start`: İkon metnin başında yer alır.
      *    - `end`: İkon metnin sonunda yer alır.
@@ -78,11 +75,7 @@ export interface IGlobalProps {
      * </Component>
      * ```
      */
-    icon?: {
-        element: React.JSX.Element;
-        direction?: "row" | "column";
-        position?: "start" | "end";
-    };
+    icon?: Icon;
     /**
      * 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.
@@ -99,13 +92,11 @@ export interface IGlobalProps {
      *
      * ```jsx
      * <Component border={{ radius: "sm" }} >
-     *  Test
+     *  Example
      * </Component>
      * ```
      */
-    border?: {
-        radius: BorderRadiuses;
-    };
+    border?: Border;
     size?: Sizes;
     /**
      * Bileşendeki metni büyük harflere dönüştürüp dönüştürmeyeceğini belirtir.
@@ -119,3 +110,45 @@ export interface IGlobalProps {
     upperCase?: boolean;
     disabled?: boolean;
 }
+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 ISizes {
+    /**
+     * Bileşenin boyutlarınu belirlemek için kullanılır.
+     *
+     * - `large`: Büyük boyut.
+     * - `normal (Varsayılan)`: Normal boyut.
+     * - `small`: Küçük boyut.
+     *
+     * Örneğin;
+     *
+     * ```jsx
+     * <Component size="large" >
+     *  Example
+     * </Component>
+     * ```
+     */
+    size?: Sizes;
+}

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

@@ -1,17 +1,37 @@
+import React from "react";
 export type Variants = "filled" | "outlined" | "dashed" | "borderless";
 export type Status = "primary" | "secondary" | "success" | "danger" | "warning" | "information" | "dark" | "light";
 export type ParagraphColors = "gray-100" | "gray-200" | "gray-300" | "gray-400" | "gray-500" | "gray-600" | "gray-700" | "gray-800" | "gray-900";
+export type Border = {
+    radius: BorderRadiuses;
+};
 export type BorderRadiuses = "sm" | "lg" | "xl" | "xxl" | "pill" | "none";
+export type Icon = {
+    element: React.JSX.Element;
+    position?: "start" | "end";
+};
 export type Sizes = "large" | "normal" | "small";
 export type Option = {
     value: string | number;
     text: string;
 };
-export type MenuItemVariants = "vertical" | "horizontal";
-export type MenuItemType = "group" | "divider";
 export type MenuProps = {
     render?: string | React.JSX.Element;
     type?: MenuItemType;
     icon?: React.JSX.Element;
     submenu?: MenuProps[];
 };
+export type MenuItemVariants = "vertical" | "horizontal";
+export type MenuItemType = "group" | "divider";
+export type TableColumnType<T> = {
+    title: string;
+    key?: keyof T | {
+        field: keyof T;
+        nestedKey: string;
+    };
+    render?: (item: T) => React.ReactNode;
+    config?: {
+        alignContent?: "left" | "center" | "right";
+        sticky?: "left" | "right";
+    };
+};

package/package.json

@@ -1,11 +1,13 @@
 {
   "name": "ar-design",
-  "version": "0.1.21",
+  "version": "0.1.23",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "exports": {
     ".": "./dist/index.js",
+    "./@service": "./dist/libs/core/service/index.js",
+    "./@config": "./dist/libs/core/application/contexts/index.js",
     "./@hooks": "./dist/libs/core/application/hooks/index.js",
     "./@types": "./dist/libs/types/index.js",
     "./@styles": "./dist/assets/css/core/ar-core.css"

package/dist/libs/core/application/contexts/Layout.d.ts

@@ -1,23 +0,0 @@
-import React from "react";
-type LayoutOptions = {
-    sider: {
-        left?: {
-            element?: React.ReactNode;
-            active: boolean;
-        };
-        right?: {
-            element?: React.ReactNode;
-            active: boolean;
-        };
-    };
-};
-type LayoutContextProps = {
-    options: LayoutOptions;
-    setOptions: React.Dispatch<React.SetStateAction<LayoutOptions>>;
-};
-type LayoutProviderProps = {
-    children: React.ReactNode;
-};
-declare const LayoutContext: React.Context<LayoutContextProps>;
-declare const LayoutProvider: ({ children }: LayoutProviderProps) => React.JSX.Element;
-export { LayoutContext, LayoutProvider };

package/dist/libs/core/application/contexts/Layout.js

@@ -1,17 +0,0 @@
-"use client";
-import React, { createContext, useState } from "react";
-const defaultOptions = {
-    sider: {
-        left: { element: null, active: false },
-        right: { element: null, active: false },
-    },
-};
-const LayoutContext = createContext({
-    options: defaultOptions,
-    setOptions: () => { },
-});
-const LayoutProvider = ({ children }) => {
-    const [options, setOptions] = useState(defaultOptions);
-    return (React.createElement(LayoutContext.Provider, { value: { options, setOptions } }, children));
-};
-export { LayoutContext, LayoutProvider };

package/dist/libs/index.js

@@ -1,3 +0,0 @@
-"use strict";
-// export {};
-// export type {};