@sydsoft/base 1.58.0 → 1.59.0

package/dist/esm/countDown/index.js

@@ -0,0 +1,97 @@
+import { useEffect, useRef, useState } from 'react';
+import React from 'react';
+import { useInterval } from '../_lib/useInterval';
+export var useCountDown = function (_a) {
+    var _b = _a.autoStart, autoStart = _b === void 0 ? false : _b, onComplete = _a.onComplete, getStatus = _a.getStatus, targetTime = _a.targetTime, _c = _a.timerType, timerType = _c === void 0 ? 'countdown' : _c, _d = _a.countType, countType = _d === void 0 ? 'seconds' : _d, _e = _a.speed, speed = _e === void 0 ? 1000 : _e, hide = _a.hide;
+    var refCountDownRender = useRef(null);
+    var _f = useState(timerType === 'datetime' || autoStart), enabled = _f[0], setEnabled = _f[1];
+    var _g = useState(0), timer = _g[0], setTimer = _g[1];
+    var _h = useState(typeof speed === 'number' && speed > 0 ? speed : 1000), timerSpeed = _h[0], setTimerSpeed = _h[1];
+    useEffect(function () { return prepareTimer(targetTime); }, [targetTime]);
+    useEffect(function () {
+        if (!hide)
+            render();
+    }, [timer]);
+    useInterval(function () {
+        if (enabled) {
+            if (timer <= 1) {
+                stopCountDown();
+            }
+            else {
+                setTimer(timer - 1);
+            }
+        }
+    }, enabled ? timerSpeed : null);
+    var prepareTimer = function (timeORstring) {
+        if (timerType === 'datetime') {
+            setTimer(Math.floor((new Date(timeORstring).getTime() - new Date().getTime()) / 1000));
+            setEnabled(true);
+        }
+        else {
+            setTimer(timeORstring);
+        }
+    };
+    var stopCountDown = function () {
+        setTimer(0);
+        setEnabled(false);
+        if ((enabled && onComplete) || (timerType === 'datetime' && onComplete)) {
+            onComplete();
+        }
+    };
+    var padNumber = function (num, padLength, padString) {
+        if (padLength === void 0) { padLength = 2; }
+        if (padString === void 0) { padString = '0'; }
+        return (typeof targetTime === 'number' && targetTime < 10 ? num : String(num).padStart(padLength, padString));
+    };
+    var render = function () {
+        var days = 0, hours = 0, minutes = 0, seconds = timer;
+        if (countType === 'minutes:seconds') {
+            minutes = Math.floor(seconds / 60);
+            seconds -= minutes * 60;
+        }
+        else if (countType === 'hours:minutes:seconds') {
+            hours = Math.floor(seconds / (60 * 60));
+            seconds -= hours * 60 * 60;
+            minutes = Math.floor(seconds / 60);
+            seconds -= minutes * 60;
+        }
+        else if (countType === 'days:hours:minutes:seconds') {
+            days = Math.floor(seconds / (60 * 60 * 24));
+            seconds -= days * 60 * 60 * 24;
+            hours = Math.floor(seconds / (60 * 60));
+            seconds -= hours * 60 * 60;
+            minutes = Math.floor(seconds / 60);
+            seconds -= minutes * 60;
+        }
+        seconds = Math.floor(seconds);
+        if (getStatus && timer > 0)
+            getStatus({ days: days, hours: hours, minutes: minutes, seconds: seconds, timer: timer });
+        if (refCountDownRender.current) {
+            var getPadValues = function (div) {
+                var length = div.dataset.padlength || 2;
+                var string = div.dataset.padstring || '0';
+                return { length: length, string: string };
+            };
+            var divGun = refCountDownRender.current.querySelector("[data-name='days']");
+            if (divGun)
+                divGun.innerHTML = padNumber(days, getPadValues(divGun).length, getPadValues(divGun).string).toString();
+            var divSaat = refCountDownRender.current.querySelector("[data-name='hours']");
+            if (divSaat)
+                divSaat.innerHTML = padNumber(hours, getPadValues(divSaat).length, getPadValues(divSaat).string).toString();
+            var divDakika = refCountDownRender.current.querySelector("[data-name='minutes']");
+            if (divDakika)
+                divDakika.innerHTML = padNumber(minutes, getPadValues(divDakika).length, getPadValues(divDakika).string).toString();
+            var divSaniye = refCountDownRender.current.querySelector("[data-name='seconds']");
+            if (divSaniye)
+                divSaniye.innerHTML = padNumber(seconds, getPadValues(divSaniye).length, getPadValues(divSaniye).string).toString();
+        }
+    };
+    return {
+        ComponentCountDown: function (children) { return (hide ? null : React.cloneElement(children, { ref: refCountDownRender })); },
+        startCountDown: function () { return setEnabled(true); },
+        stopCountDown: function () { return setEnabled(false); },
+        setTargetTime: function (targetTime) { return prepareTimer(targetTime); },
+        setTimerSpeed: function (timerSpeed) { return setTimerSpeed(timerSpeed); },
+        getChildrenRef: function () { return refCountDownRender.current || null; }
+    };
+};

package/dist/esm/dateTime/index.d.ts

@@ -0,0 +1,12 @@
+export default class dateTime {
+    private datetime;
+    private resut_format;
+    constructor(datetime?: Date | string | null, format?: string);
+    addDays(days: number): this;
+    private parse;
+    getResult(): string;
+    format(format?: string): this;
+    today(): string;
+    getTime(): number;
+    nextMonthFirstDay(format?: string): string;
+}

package/dist/esm/dateTime/index.js

@@ -0,0 +1,76 @@
+var dateTime = /** @class */ (function () {
+    function dateTime(datetime, format) {
+        if (datetime === void 0) { datetime = null; }
+        if (format === void 0) { format = "y-m-d h:i:s"; }
+        this.resut_format = "y-m-d h:i:s";
+        this.format(format);
+        this.datetime = datetime !== "0000-00-00 00:00:00" && datetime !== "0000-00-00" && datetime ? datetime : new Date().toISOString(); // GMT ekli halde
+        return this;
+    }
+    dateTime.prototype.addDays = function (days) {
+        var datetime = new Date(this.datetime);
+        datetime.setDate(datetime.getDate() + days);
+        this.datetime = datetime.toISOString();
+        return this;
+    };
+    dateTime.prototype.parse = function () {
+        var datetime = new Date(this.datetime);
+        var monthNames = ["Ocak", "Şubat", "Mart", "Nisan", "Mayıs", "Haziran", "Temmuz", "Ağustos", "Eylül", "Ekim", "Kasım", "Aralık"];
+        var dayNames = ["Pazar", "Pazartesi", "Salı", "Çarşamba", "Perşembe", "Cuma", "Cumartesi"];
+        return {
+            y: datetime.getFullYear().toString(),
+            m: (datetime.getMonth() + 1).toString().padStart(2, "0"),
+            d: datetime.getDate().toString().padStart(2, "0"),
+            h: datetime.getHours().toString().padStart(2, "0"),
+            i: datetime.getMinutes().toString().padStart(2, "0"),
+            s: datetime.getSeconds().toString().padStart(2, "0"),
+            ms: (datetime.getMilliseconds() / 10).toFixed(0).toString().padStart(2, "0"),
+            z: (datetime.getTimezoneOffset() / 60).toString(),
+            // TAM STRING ICEREN IFADELER SONA EKLENMELI
+            TAMAY: monthNames[datetime.getMonth()],
+            TAMGUN: dayNames[datetime.getDay()]
+        };
+    };
+    dateTime.prototype.getResult = function () {
+        var parse = this.parse();
+        var result = this.resut_format;
+        result = result.replace(new RegExp("y", "g"), parse.y.toString());
+        result = result.replace(new RegExp("m", "g"), parse.m.toString());
+        result = result.replace(new RegExp("d", "g"), parse.d.toString());
+        result = result.replace(new RegExp("h", "g"), parse.h.toString());
+        result = result.replace(new RegExp("i", "g"), parse.i.toString());
+        result = result.replace(new RegExp("s", "g"), parse.s.toString());
+        result = result.replace(new RegExp("ms", "g"), parse.ms.toString());
+        result = result.replace(new RegExp("z", "g"), parse.z.toString());
+        result = result.replace(new RegExp("TAMAY", "g"), parse.TAMAY.toString());
+        result = result.replace(new RegExp("TAMGUN", "g"), parse.TAMGUN.toString());
+        return result;
+    };
+    dateTime.prototype.format = function (format) {
+        if (format === void 0) { format = "y-m-d h:i:s"; }
+        this.resut_format = format;
+        return this;
+    };
+    dateTime.prototype.today = function () {
+        this.datetime = new Date().toISOString();
+        this.format("y-m-d");
+        return this.getResult();
+    };
+    dateTime.prototype.getTime = function () {
+        var convertDateTime = new dateTime(this.datetime).format("y-m-d h:i:s").getResult();
+        var datetime = new Date(convertDateTime);
+        return datetime.getTime();
+    };
+    dateTime.prototype.nextMonthFirstDay = function (format) {
+        if (format === void 0) { format = "y-m-d"; }
+        // Verilen tarihin bir sonraki ayının ilk gününü bul
+        this.datetime = new Date(this.datetime);
+        this.datetime.setMonth(this.datetime.getMonth() + 1);
+        this.datetime.setDate(1);
+        this.datetime = this.datetime.toISOString();
+        this.format(format);
+        return this.getResult();
+    };
+    return dateTime;
+}());
+export default dateTime;

package/dist/esm/form/Button.d.ts

@@ -0,0 +1,27 @@
+import { propsDialog } from "./Dialog";
+import React from "react";
+import { typeTooltipPosition } from "../tooltip";
+interface Props {
+    children?: React.ReactNode;
+    onlyIcon?: React.ReactNode;
+    buttonClass?: "default" | "primary" | "secondary" | "success" | "danger" | "warning" | "info" | "light" | "dark" | "link";
+    buttonSize?: "small" | "medium" | "large";
+    autoFocus?: boolean;
+    hidden?: boolean;
+    component?: "button" | "a" | "div" | any;
+    className?: string;
+    type?: "submit" | "reset" | "button";
+    disabled?: boolean;
+    fullWidth?: boolean;
+    onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
+    href?: string | undefined;
+    target?: string | undefined;
+    style?: React.CSSProperties;
+    tabIndex?: number;
+    title?: string;
+    titlePosition?: typeTooltipPosition;
+    titleArrow?: boolean;
+    dialog?: propsDialog;
+}
+export declare const Button: React.NamedExoticComponent<Props>;
+export {};

package/dist/esm/form/Button.js

@@ -0,0 +1,76 @@
+import { __assign, __rest } from "tslib";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Dialog } from "./Dialog";
+import { memo, useCallback, useEffect, useState } from "react";
+import { Tooltip } from "../tooltip";
+import Link from "next/link";
+import styles from "./styles/Button.module.css";
+export var Button = memo(function MemoFunction(_a) {
+    var children = _a.children, _b = _a.component, component = _b === void 0 ? "button" : _b, className = _a.className, _c = _a.buttonClass, buttonClass = _c === void 0 ? "default" : _c, _d = _a.buttonSize, buttonSize = _d === void 0 ? "medium" : _d, style = _a.style, _e = _a.type, type = _e === void 0 ? "button" : _e, _f = _a.fullWidth, fullWidth = _f === void 0 ? false : _f, onlyIcon = _a.onlyIcon, onClick = _a.onClick, href = _a.href, target = _a.target, tabIndex = _a.tabIndex, title = _a.title, titlePosition = _a.titlePosition, titleArrow = _a.titleArrow, dialog = _a.dialog, autoFocus = _a.autoFocus, other = __rest(_a, ["children", "component", "className", "buttonClass", "buttonSize", "style", "type", "fullWidth", "onlyIcon", "onClick", "href", "target", "tabIndex", "title", "titlePosition", "titleArrow", "dialog", "autoFocus"]);
+    var Comp = component;
+    var ripple = function (e) {
+        var el = e.currentTarget;
+        var circle = document.createElement("span");
+        var diameter = Math.max(el.clientWidth, el.clientHeight);
+        circle.style.width = circle.style.height = "".concat(diameter, "px");
+        circle.classList.add(styles.ripple);
+        var ripple = el.getElementsByClassName(styles.ripple)[0];
+        if (ripple)
+            ripple.remove();
+        el.appendChild(circle);
+    };
+    var handleClick = function (e) {
+        ripple(e);
+        if (dialog) {
+            Dialog(dialog).then(function (result) {
+                if (result && onClick) {
+                    onClick(e);
+                }
+            });
+        }
+        else {
+            if (onClick)
+                onClick(e);
+        }
+    };
+    var createClassList = useCallback(function () {
+        var list = ["sbutton", styles.button];
+        if (buttonClass)
+            list.push(styles[buttonClass]);
+        if (className)
+            list.push(className);
+        if (onlyIcon)
+            list.push(styles.iconbutton);
+        if (fullWidth)
+            list.push(styles.fullwidth);
+        return list.join(" ");
+    }, [buttonClass, className, onlyIcon, fullWidth]);
+    var _g = useState(function () { return createClassList(); }), classList = _g[0], setClassList = _g[1];
+    useEffect(function () {
+        var newClassList = createClassList().split(" ").filter(Boolean);
+        if (href && typeof window !== "undefined" && window.location.pathname === href) {
+            newClassList.push("active");
+        }
+        setClassList(newClassList.join(" "));
+    }, [href, createClassList]);
+    var ortakProps = __assign({ className: classList, style: style, onClick: handleClick, tabIndex: tabIndex, autoFocus: autoFocus, "data-button-size": (!onlyIcon) ? buttonSize : null }, other);
+    var renderComponent;
+    if (href !== undefined) {
+        if (other === null || other === void 0 ? void 0 : other.hidden) {
+            renderComponent = null;
+        }
+        else {
+            var checkHref = (other === null || other === void 0 ? void 0 : other.disabled) ? "#" : href;
+            renderComponent = (_jsx(Link, { href: checkHref, target: (other === null || other === void 0 ? void 0 : other.disabled) ? "_self" : target, children: _jsx(Comp, __assign({}, ortakProps, { children: onlyIcon ? onlyIcon : children })) }));
+        }
+    }
+    else {
+        renderComponent = (_jsx(Comp, __assign({ type: type }, ortakProps, { children: onlyIcon ? onlyIcon : children })));
+    }
+    if (title && renderComponent) {
+        return (_jsx(Tooltip, { title: title, position: titlePosition, arrow: titleArrow, children: renderComponent }));
+    }
+    else {
+        return renderComponent;
+    }
+});

package/dist/esm/form/Checkbox.d.ts

@@ -0,0 +1,23 @@
+import React from "react";
+interface Props {
+    checked: "0" | "1" | boolean;
+    ref?: React.Ref<any>;
+    name?: string;
+    label?: string;
+    className?: string;
+    disabled?: boolean;
+    onToogle?: (e: {
+        target: {
+            name?: string;
+            value: "0" | "1";
+        };
+    }) => void;
+    style?: React.CSSProperties;
+    styleCheckbox?: React.CSSProperties;
+    styleLabel?: React.CSSProperties;
+    tabIndex?: number;
+    required?: boolean;
+    children?: React.ReactNode;
+}
+export declare const Checkbox: React.FC<Props>;
+export {};

package/dist/esm/form/Checkbox.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRef } from "react";
+import styles from "./styles/Input.module.css";
+export var Checkbox = function (_a) {
+    var ref = _a.ref, children = _a.children, name = _a.name, label = _a.label, checked = _a.checked, className = _a.className, style = _a.style, styleCheckbox = _a.styleCheckbox, styleLabel = _a.styleLabel, onToogle = _a.onToogle, disabled = _a.disabled, tabIndex = _a.tabIndex, _b = _a.required, required = _b === void 0 ? false : _b;
+    var refMain = useRef(null);
+    // checked değerini boolean hâline getiriyoruz
+    var isChecked = checked === "1" || checked === true;
+    var handleChange = function (newChecked) {
+        if (disabled)
+            return;
+        onToogle === null || onToogle === void 0 ? void 0 : onToogle({
+            target: {
+                name: name,
+                value: newChecked ? "1" : "0"
+            }
+        });
+    };
+    var toggleCheck = function () {
+        handleChange(!isChecked);
+    };
+    return (_jsxs("div", { ref: refMain, className: "".concat(styles.checkbox, " ").concat(className || ""), style: style, tabIndex: tabIndex, onClick: toggleCheck, children: [_jsx("input", { ref: ref, type: "checkbox", name: name, onChange: function (e) { return handleChange(e.target.checked); }, checked: isChecked, required: required, style: styleCheckbox, disabled: disabled }), label && _jsx("label", { style: styleLabel, children: label }), children && _jsx("div", { children: children })] }));
+};

package/dist/esm/form/Dialog.d.ts

@@ -0,0 +1,20 @@
+import React, { ReactNode } from 'react';
+export type propsDialog = {
+    message: any;
+    acceptButtonShow?: boolean;
+    cancelButtonShow?: boolean;
+    acceptButtonText?: string | ReactNode;
+    cancelButtonText?: string | ReactNode;
+    acceptButtonClass?: 'default' | 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | 'light' | 'dark' | 'link';
+    cancelButtonClass?: 'default' | 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | 'light' | 'dark' | 'link';
+    vertialAlign?: 'flex-start' | 'center' | 'flex-end';
+    horizontalAlign?: 'flex-start' | 'center' | 'flex-end';
+    hideBackdrop?: boolean;
+    hideEsc?: boolean;
+    styleMessage?: React.CSSProperties;
+    styleBox?: React.CSSProperties;
+    styleBoxFooter?: React.CSSProperties;
+    autoFocus?: 'accept' | 'cancel';
+    backdropStyle?: React.CSSProperties;
+};
+export declare const Dialog: (config: propsDialog) => Promise<unknown>;

package/dist/esm/form/Dialog.js

@@ -0,0 +1,40 @@
+import { __assign } from "tslib";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, BoxFooter } from '../box';
+import { createRoot } from 'react-dom/client';
+import { Modal } from '../modal';
+import { Button } from './Button';
+export var Dialog = function (config) {
+    return new Promise(function (resolve) {
+        if (typeof window === 'undefined')
+            return false;
+        var mainDiv = document.getElementById('sdialog');
+        if (!mainDiv) {
+            var createDiv = document.createElement('div');
+            createDiv.setAttribute('id', 'sdialog');
+            document.body.appendChild(createDiv);
+            mainDiv = createDiv;
+        }
+        var root = createRoot(mainDiv);
+        var settings = __assign({ acceptButtonShow: true, cancelButtonShow: true, acceptButtonText: 'EVET', cancelButtonText: 'HAYIR', acceptButtonClass: 'danger', cancelButtonClass: 'secondary', vertialAlign: 'center', horizontalAlign: 'center', hideBackdrop: true, hideEsc: true, styleMessage: {
+                fontSize: '1.1rem',
+                padding: '10px 20px'
+            }, styleBox: { padding: 0, margin: 0, minWidth: 250 }, styleBoxFooter: { padding: '8px 5px' }, autoFocus: 'accept' }, config);
+        var close = function () {
+            if (mainDiv) {
+                root.unmount();
+                mainDiv.remove();
+            }
+        };
+        var onCancel = function () {
+            resolve(false);
+            close();
+        };
+        var onAccept = function () {
+            resolve(true);
+            close();
+        };
+        var Component = (_jsx(Modal, { open: true, keepMounted: false, close: onCancel, hideBackdrop: settings.hideBackdrop, hideEsc: settings.hideEsc, hideCloseButton: true, vertialAlign: settings.vertialAlign, horizontalAlign: settings.horizontalAlign, backdropStyle: settings.backdropStyle, children: _jsxs(Box, { style: settings.styleBox, children: [_jsx("div", { className: "sbox_content", style: settings.styleMessage, dangerouslySetInnerHTML: { __html: settings.message } }), (settings.acceptButtonShow || settings.cancelButtonShow) && (_jsxs(BoxFooter, { style: settings.styleBoxFooter, children: [settings.cancelButtonShow && (_jsx(Button, { autoFocus: settings.autoFocus === 'cancel', buttonClass: settings.cancelButtonClass, onClick: onCancel, children: settings.cancelButtonText })), settings.acceptButtonShow && (_jsx(Button, { autoFocus: settings.autoFocus === 'accept', buttonClass: settings.acceptButtonClass, onClick: onAccept, children: settings.acceptButtonText }))] }))] }) }));
+        root.render(Component);
+    });
+};

package/dist/esm/form/Form.d.ts

@@ -0,0 +1,10 @@
+import React, { FormEventHandler } from "react";
+interface Props {
+    children?: React.ReactNode;
+    encType?: React.FormHTMLAttributes<HTMLFormElement>["encType"];
+    onSubmit?: FormEventHandler<HTMLFormElement>;
+    style?: React.CSSProperties;
+    disableOnEnterSubmit?: boolean;
+}
+export declare const Form: React.NamedExoticComponent<Props>;
+export {};

package/dist/esm/form/Form.js

@@ -0,0 +1,12 @@
+import { __assign, __rest } from "tslib";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { memo } from "react";
+export var Form = memo(function FunctionMemo(_a) {
+    var _b = _a.encType, encType = _b === void 0 ? "multipart/form-data" : _b, onSubmit = _a.onSubmit, style = _a.style, _c = _a.disableOnEnterSubmit, disableOnEnterSubmit = _c === void 0 ? false : _c, other = __rest(_a, ["encType", "onSubmit", "style", "disableOnEnterSubmit"]);
+    var onKeyDown = function (e) {
+        if (e.key === "Enter" && disableOnEnterSubmit) {
+            e.preventDefault();
+        }
+    };
+    return _jsx("form", __assign({ style: style, encType: encType, onSubmit: onSubmit, onKeyDown: onKeyDown }, other));
+});

package/dist/esm/form/FormOlustur.d.ts

@@ -0,0 +1,39 @@
+import React from 'react';
+import { typeJustifyContent, typeSpacingValues } from '../grid';
+type gridValues = 'auto' | 'full' | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
+type grid = {
+    xs?: gridValues;
+    sm?: gridValues;
+    md?: gridValues;
+    lg?: gridValues;
+    xl?: gridValues;
+    xxl?: gridValues;
+};
+export type PropsFormOgeler = {
+    label?: string | null;
+    noRender?: boolean;
+    fullComponent?: any;
+    component?: any;
+    propsComponent?: object;
+    propsRow?: object;
+    propsLabel?: object;
+    gridLabel?: grid;
+    gridInput?: grid;
+};
+interface Props {
+    form: {
+        [key: string | number]: any;
+    };
+    formOgeler: PropsFormOgeler[];
+    onChange: Function;
+    sabitGrid: {
+        label: grid;
+        input: grid;
+    };
+    formType: 'label' | 'noLabel';
+    justifyContent: typeJustifyContent;
+    rowSpacing?: typeSpacingValues;
+    colSpacing?: typeSpacingValues;
+}
+export declare const FormOlustur: React.NamedExoticComponent<Props>;
+export {};

package/dist/esm/form/FormOlustur.js

@@ -0,0 +1,52 @@
+import { __assign } from "tslib";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { memo, useEffect, useMemo } from 'react';
+import { Col, Row } from '../grid';
+import { isDev } from '../_lib/baseFunctions';
+import { Label } from './Label';
+export var FormOlustur = memo(function FunctionMemo(props) {
+    var form = props.form, formOgeler = props.formOgeler, onChange = props.onChange, formType = props.formType, sabitGrid = props.sabitGrid, justifyContent = props.justifyContent, rowSpacing = props.rowSpacing, colSpacing = props.colSpacing;
+    useEffect(function () {
+        if (formOgeler && onChange && form) {
+            formOgeler.forEach(function (formOgeler) {
+                var _a, _b, _c, _d;
+                var fieldName = (_b = (_a = formOgeler === null || formOgeler === void 0 ? void 0 : formOgeler.component) === null || _a === void 0 ? void 0 : _a.props) === null || _b === void 0 ? void 0 : _b.name;
+                if (formOgeler.noRender && fieldName && form[fieldName] && form[fieldName] != '') {
+                    isDev && console.log('noRenderGuncelle');
+                    if ((formOgeler === null || formOgeler === void 0 ? void 0 : formOgeler.component) && ((_d = (_c = formOgeler === null || formOgeler === void 0 ? void 0 : formOgeler.component) === null || _c === void 0 ? void 0 : _c.props) === null || _d === void 0 ? void 0 : _d.name)) {
+                        onChange({
+                            target: {
+                                name: fieldName,
+                                value: ''
+                            }
+                        });
+                    }
+                }
+            });
+        }
+    }, [JSON.stringify(form), formOgeler]);
+    var result = useMemo(function () {
+        return formOgeler.map(function (_a, i) {
+            var noRender = _a.noRender, fullComponent = _a.fullComponent, component = _a.component, propsComponent = _a.propsComponent, propsRow = _a.propsRow, label = _a.label, propsLabel = _a.propsLabel, gridLabel = _a.gridLabel, gridInput = _a.gridInput;
+            if (noRender) {
+                return null;
+            }
+            if (fullComponent)
+                return React.cloneElement(fullComponent, { key: i });
+            var newProps = __assign({}, propsComponent);
+            if (onChange && component && !component.props.onChange) {
+                newProps = __assign(__assign({}, newProps), { onChange: onChange });
+            }
+            if (onChange && form && component.props.name && !component.props.value) {
+                newProps = __assign(__assign({}, newProps), { value: form[component.props.name] && form[component.props.name].length > 0 ? String(form[component.props.name]) : '' });
+            }
+            if (formType === 'label')
+                newProps = __assign(__assign({}, newProps), { label: '' });
+            var detectLabel = label || component.props.label;
+            gridLabel = __assign(__assign({}, sabitGrid.label), gridLabel);
+            gridInput = __assign(__assign({}, sabitGrid.input), gridInput);
+            return (_jsxs(Row, __assign({ justifyContent: justifyContent, rowSpacing: rowSpacing, colSpacing: colSpacing }, propsRow, { children: [formType === 'label' && detectLabel && (_jsx(Col, __assign({}, gridLabel, { children: _jsx(Label, __assign({ required: component.props.required }, propsLabel, { children: detectLabel })) }))), _jsx(Col, __assign({}, gridInput, { children: React.cloneElement(component, newProps) }))] }), i));
+        });
+    }, [form, formOgeler, onChange, formType, sabitGrid, justifyContent, rowSpacing, colSpacing]);
+    return _jsx(React.Fragment, { children: result });
+});

package/dist/esm/form/Input.d.ts

@@ -0,0 +1,66 @@
+/**
+ * @author    : izzetseydaoglu
+ * @copyright : sydSOFT Bilişim Hizmetleri (c) 2026
+ * @version   : 2026-01-21 21:35:48
+ */
+import React from 'react';
+type maskSettingsTranslation = {
+    [key: string]: {
+        pattern: any;
+        transform?: (value: string) => string;
+        optional?: boolean;
+        recursive?: boolean;
+    };
+};
+type maskSettings = {
+    clearIfNotMatch?: boolean;
+    reverse?: boolean;
+    translation?: maskSettingsTranslation;
+    selectOnFocus?: boolean;
+    onChange?: (maskedValue: string, cleanValue: string, targetInput: React.ChangeEvent<HTMLInputElement>) => void;
+};
+export interface PropsInput {
+    componentRef?: any;
+    inputRef?: any;
+    className?: string;
+    id?: string;
+    name?: string;
+    value?: any;
+    label?: string;
+    loading?: boolean;
+    autoFocus?: boolean | undefined;
+    disabled?: boolean;
+    required?: boolean;
+    placeholder?: string;
+    type?: 'text' | 'number' | 'email' | 'color' | 'date' | 'time' | 'datetime-local' | 'hidden' | 'file' | 'password' | 'tel' | 'search';
+    select?: any[];
+    ilkSec?: boolean;
+    valueKey?: string;
+    labelKey?: string;
+    multiline?: boolean;
+    rows?: number | undefined;
+    onChange?: (e: any) => void;
+    onFocus?: (e: any) => void;
+    onBlur?: (e: any) => void;
+    onClick?: (e: any) => void;
+    onKeyPress?: (e: any) => void;
+    onKeyUp?: (e: any) => void;
+    onKeyDown?: (e: any) => void;
+    propsComponent?: object | any;
+    propsInput?: object;
+    startAdornment?: any;
+    endAdornment?: any;
+    sadeceYazi?: boolean;
+    sadeceSayi?: boolean;
+    tumuBuyuk?: boolean;
+    tumuKucuk?: boolean;
+    seoCevir?: boolean;
+    dosyaNoGiris?: boolean;
+    fileNameGiris?: boolean;
+    dateGecmisKontrol?: boolean;
+    autoSelectText?: boolean;
+    mask?: string;
+    maskSettings?: maskSettings;
+}
+export declare const Input: React.FC<PropsInput>;
+export {};