albinasoft-ui-package 1.0.4 → 1.0.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/CustomCheckbox/CustomCheckbox.d.ts +19 -0
- package/dist/CustomCheckbox/CustomCheckbox.js +32 -0
- package/dist/CustomDateTimePicker/CustomDateTimePicker.d.ts +31 -0
- package/dist/CustomDateTimePicker/CustomDateTimePicker.js +45 -0
- package/dist/CustomDivider/CustomDivider.d.ts +51 -0
- package/dist/CustomDivider/CustomDivider.js +87 -0
- package/dist/CustomForm/CustomForm.d.ts +159 -0
- package/dist/CustomForm/CustomForm.js +163 -0
- package/dist/CustomInput/CustomInput.d.ts +34 -0
- package/dist/CustomInput/CustomInput.js +74 -0
- package/dist/CustomModal/CustomModal.d.ts +13 -0
- package/dist/CustomModal/CustomModal.js +16 -0
- package/dist/CustomRadioButton/CustomRadioButton.d.ts +25 -0
- package/dist/CustomRadioButton/CustomRadioButton.js +34 -0
- package/dist/CustomRichTextbox/CustomRichTextbox.d.ts +21 -0
- package/dist/CustomRichTextbox/CustomRichTextbox.js +41 -0
- package/dist/CustomSelect/CustomSelect.d.ts +26 -0
- package/dist/CustomSelect/CustomSelect.js +41 -0
- package/dist/CustomTab/CustomTab.d.ts +20 -0
- package/dist/CustomTab/CustomTab.js +65 -0
- package/dist/CustomText/CustomText.d.ts +71 -0
- package/dist/CustomText/CustomText.js +156 -0
- package/dist/CustomTextarea/CustomTextarea.d.ts +22 -0
- package/dist/CustomTextarea/CustomTextarea.js +33 -0
- package/dist/CustomTreeView/CustomTreeView.d.ts +15 -0
- package/dist/CustomTreeView/CustomTreeView.js +60 -0
- package/dist/components/CustomButton.d.ts +13 -0
- package/dist/components/CustomButton.js +92 -0
- package/dist/components/CustomCheckbox.d.ts +19 -0
- package/dist/components/CustomCheckbox.js +32 -0
- package/dist/components/CustomDateTimePicker.d.ts +31 -0
- package/dist/components/CustomDateTimePicker.js +45 -0
- package/dist/components/CustomDivider.d.ts +51 -0
- package/dist/components/CustomDivider.js +87 -0
- package/dist/components/CustomForm.d.ts +159 -0
- package/dist/components/CustomForm.js +163 -0
- package/dist/components/CustomInput.d.ts +34 -0
- package/dist/components/CustomInput.js +74 -0
- package/dist/components/CustomModal.d.ts +13 -0
- package/dist/components/CustomModal.js +16 -0
- package/dist/components/CustomRadioButton.d.ts +25 -0
- package/dist/components/CustomRadioButton.js +34 -0
- package/dist/components/CustomRichTextbox.d.ts +21 -0
- package/dist/components/CustomRichTextbox.js +41 -0
- package/dist/components/CustomSelect.d.ts +26 -0
- package/dist/components/CustomSelect.js +41 -0
- package/dist/components/CustomTab.d.ts +20 -0
- package/dist/components/CustomTab.js +65 -0
- package/dist/components/CustomText.d.ts +71 -0
- package/dist/components/CustomText.js +156 -0
- package/dist/components/CustomTextarea.d.ts +22 -0
- package/dist/components/CustomTextarea.js +33 -0
- package/dist/components/CustomTreeView.d.ts +15 -0
- package/dist/components/CustomTreeView.js +60 -0
- package/dist/index.d.ts +15 -3
- package/dist/index.js +29 -5
- package/package.json +7 -2
@@ -0,0 +1,74 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
3
|
+
if (k2 === undefined) k2 = k;
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
7
|
+
}
|
8
|
+
Object.defineProperty(o, k2, desc);
|
9
|
+
}) : (function(o, m, k, k2) {
|
10
|
+
if (k2 === undefined) k2 = k;
|
11
|
+
o[k2] = m[k];
|
12
|
+
}));
|
13
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
14
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
15
|
+
}) : function(o, v) {
|
16
|
+
o["default"] = v;
|
17
|
+
});
|
18
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
19
|
+
if (mod && mod.__esModule) return mod;
|
20
|
+
var result = {};
|
21
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
22
|
+
__setModuleDefault(result, mod);
|
23
|
+
return result;
|
24
|
+
};
|
25
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
26
|
+
exports.InputType = exports.CustomInput = void 0;
|
27
|
+
var react_1 = __importStar(require("react"));
|
28
|
+
var react_bootstrap_1 = require("react-bootstrap");
|
29
|
+
var fa_1 = require("react-icons/fa");
|
30
|
+
var InputType;
|
31
|
+
(function (InputType) {
|
32
|
+
InputType["TEXT"] = "text";
|
33
|
+
InputType["NUMBER"] = "number";
|
34
|
+
InputType["TEL"] = "tel";
|
35
|
+
InputType["PASSWORD"] = "password";
|
36
|
+
InputType["EMAIL"] = "email";
|
37
|
+
InputType["FILE"] = "file";
|
38
|
+
})(InputType || (InputType = {}));
|
39
|
+
exports.InputType = InputType;
|
40
|
+
var CustomInput = function (_a) {
|
41
|
+
var id = _a.id, name = _a.name, label = _a.label, _b = _a.inputType, inputType = _b === void 0 ? InputType.TEXT : _b, value = _a.value, placeholder = _a.placeholder, _c = _a.required, required = _c === void 0 ? false : _c, errorMessage = _a.errorMessage, _d = _a.conditionalErrorVisible, conditionalErrorVisible = _d === void 0 ? false : _d, conditionalErrorMessage = _a.conditionalErrorMessage, _e = _a.disabled, disabled = _e === void 0 ? false : _e, _f = _a.readOnly, readOnly = _f === void 0 ? false : _f, buttonIcon = _a.buttonIcon, buttonTooltip = _a.buttonTooltip, description = _a.description, tooltip = _a.tooltip, style = _a.style, className = _a.className, buttonOnClick = _a.buttonOnClick, onChange = _a.onChange;
|
42
|
+
var _g = (0, react_1.useState)(false), showPassword = _g[0], setShowPassword = _g[1];
|
43
|
+
var handleType = inputType === InputType.PASSWORD && showPassword ? InputType.TEXT : inputType;
|
44
|
+
var togglePasswordVisibility = function () {
|
45
|
+
setShowPassword(function (prev) { return !prev; });
|
46
|
+
};
|
47
|
+
return (react_1.default.createElement("div", { className: className },
|
48
|
+
react_1.default.createElement("div", { className: "form-group" },
|
49
|
+
react_1.default.createElement("label", { htmlFor: id, className: "form-label" }, label),
|
50
|
+
react_1.default.createElement("div", { className: "input-group position-relative" },
|
51
|
+
tooltip ? (react_1.default.createElement(react_bootstrap_1.OverlayTrigger, { placement: "bottom", overlay: react_1.default.createElement(react_bootstrap_1.Tooltip, { id: "tooltip-".concat(tooltip) }, tooltip) },
|
52
|
+
react_1.default.createElement("input", { id: id, name: name, type: handleType, value: value, placeholder: placeholder, onChange: onChange, className: "form-control", style: style, required: required, disabled: disabled, autoComplete: "new-password" // Modern tarayıcılarda autocomplete autofill engellemek için
|
53
|
+
}))) : (react_1.default.createElement("input", { id: id, name: name, type: handleType, value: value, placeholder: placeholder, onChange: onChange, className: "form-control", style: style, required: required, disabled: disabled, autoComplete: "new-password" // Modern tarayıcılarda autocomplete autofill engellemek için
|
54
|
+
})),
|
55
|
+
inputType === InputType.PASSWORD && (react_1.default.createElement("button", { type: "button", onClick: togglePasswordVisibility, className: "btn btn-outline-secondary", title: showPassword ? "Parolayı Gizle" : "Parolayı Göster" }, showPassword ? react_1.default.createElement(fa_1.FaEyeSlash, null) : react_1.default.createElement(fa_1.FaEye, null))),
|
56
|
+
buttonIcon && buttonOnClick && (react_1.default.createElement("button", { type: "button", onClick: buttonOnClick, className: "btn btn-outline-secondary", title: buttonTooltip || "" }, buttonIcon)),
|
57
|
+
required && (react_1.default.createElement("div", { className: "invalid-feedback text-danger" },
|
58
|
+
react_1.default.createElement("div", { className: "description-icon" },
|
59
|
+
react_1.default.createElement(fa_1.FaExclamationTriangle, null)),
|
60
|
+
react_1.default.createElement("div", { className: "description-text" },
|
61
|
+
react_1.default.createElement("span", null, errorMessage || 'Bu alan boş bırakılamaz.')))),
|
62
|
+
conditionalErrorVisible && (react_1.default.createElement("div", { className: "conditional-error-message text-warning" },
|
63
|
+
react_1.default.createElement("div", { className: "description-icon" },
|
64
|
+
react_1.default.createElement(fa_1.FaExclamationTriangle, null)),
|
65
|
+
react_1.default.createElement("div", { className: "description-text" },
|
66
|
+
react_1.default.createElement("span", null, conditionalErrorMessage)))),
|
67
|
+
description && (react_1.default.createElement("div", { className: "form-description text-secondary" },
|
68
|
+
react_1.default.createElement("div", { className: "description-icon" },
|
69
|
+
react_1.default.createElement(fa_1.FaInfoCircle, null)),
|
70
|
+
react_1.default.createElement("div", { className: "description-text" },
|
71
|
+
react_1.default.createElement("span", null, description))))))));
|
72
|
+
};
|
73
|
+
exports.CustomInput = CustomInput;
|
74
|
+
exports.default = CustomInput;
|
@@ -0,0 +1,13 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
interface CustomModalProps {
|
3
|
+
show: boolean;
|
4
|
+
title?: string;
|
5
|
+
size?: 'sm' | 'lg' | 'xl' | 'fullscreen';
|
6
|
+
onHide: () => void;
|
7
|
+
children?: React.ReactNode;
|
8
|
+
footer?: React.ReactNode;
|
9
|
+
style?: React.CSSProperties;
|
10
|
+
bodyStyle?: React.CSSProperties;
|
11
|
+
}
|
12
|
+
declare const CustomModal: React.FC<CustomModalProps>;
|
13
|
+
export default CustomModal;
|
@@ -0,0 +1,16 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
|
+
};
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
+
var react_1 = __importDefault(require("react"));
|
7
|
+
var react_bootstrap_1 = require("react-bootstrap");
|
8
|
+
var CustomModal = function (_a) {
|
9
|
+
var show = _a.show, _b = _a.title, title = _b === void 0 ? 'Default Title' : _b, _c = _a.size, size = _c === void 0 ? 'lg' : _c, onHide = _a.onHide, children = _a.children, footer = _a.footer, style = _a.style, bodyStyle = _a.bodyStyle;
|
10
|
+
return (react_1.default.createElement(react_bootstrap_1.Modal, { show: show, onHide: onHide, size: size !== 'fullscreen' ? size : undefined, fullscreen: size === 'fullscreen' ? true : undefined, centered: size !== 'fullscreen', style: style },
|
11
|
+
react_1.default.createElement(react_bootstrap_1.Modal.Header, { closeButton: true },
|
12
|
+
react_1.default.createElement(react_bootstrap_1.Modal.Title, null, title)),
|
13
|
+
react_1.default.createElement(react_bootstrap_1.Modal.Body, { style: bodyStyle }, children),
|
14
|
+
footer && react_1.default.createElement(react_bootstrap_1.Modal.Footer, null, footer)));
|
15
|
+
};
|
16
|
+
exports.default = CustomModal;
|
@@ -0,0 +1,25 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
interface CustomRadioButtonOption {
|
3
|
+
id: string;
|
4
|
+
label: string;
|
5
|
+
value: string;
|
6
|
+
}
|
7
|
+
interface CustomRadioButtonProps {
|
8
|
+
id?: string;
|
9
|
+
name?: string;
|
10
|
+
label: string;
|
11
|
+
options: CustomRadioButtonOption[];
|
12
|
+
value: string;
|
13
|
+
required?: boolean;
|
14
|
+
errorMessage?: string;
|
15
|
+
conditionalErrorVisible?: boolean;
|
16
|
+
conditionalErrorMessage?: string;
|
17
|
+
tooltip?: string;
|
18
|
+
description?: string | null;
|
19
|
+
disabled?: boolean;
|
20
|
+
className?: string;
|
21
|
+
style?: React.CSSProperties;
|
22
|
+
onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
|
23
|
+
}
|
24
|
+
declare const CustomRadioButton: React.FC<CustomRadioButtonProps>;
|
25
|
+
export default CustomRadioButton;
|
@@ -0,0 +1,34 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
|
+
};
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
+
var react_1 = __importDefault(require("react"));
|
7
|
+
var react_bootstrap_1 = require("react-bootstrap");
|
8
|
+
var fa_1 = require("react-icons/fa");
|
9
|
+
var CustomRadioButton = function (_a) {
|
10
|
+
var id = _a.id, name = _a.name, label = _a.label, options = _a.options, value = _a.value, _b = _a.required, required = _b === void 0 ? false : _b, errorMessage = _a.errorMessage, conditionalErrorVisible = _a.conditionalErrorVisible, conditionalErrorMessage = _a.conditionalErrorMessage, tooltip = _a.tooltip, description = _a.description, _c = _a.disabled, disabled = _c === void 0 ? false : _c, className = _a.className, style = _a.style, onChange = _a.onChange;
|
11
|
+
return (react_1.default.createElement("div", { className: className, style: style },
|
12
|
+
react_1.default.createElement("div", { className: "form-group" },
|
13
|
+
react_1.default.createElement("label", { className: "form-label" }, label),
|
14
|
+
react_1.default.createElement("div", { className: "radio-options" }, options.map(function (option, index) { return (react_1.default.createElement("div", { key: option.id, className: "form-check" },
|
15
|
+
react_1.default.createElement(react_bootstrap_1.OverlayTrigger, { placement: "bottom", overlay: tooltip ? (react_1.default.createElement(react_bootstrap_1.Tooltip, { id: "tooltip-".concat(option.id) }, tooltip)) : react_1.default.createElement(react_1.default.Fragment, null) },
|
16
|
+
react_1.default.createElement("input", { id: option.id, name: name || id, type: "radio", className: "form-check-input", value: option.value, checked: value === option.value, disabled: disabled, onChange: onChange, required: required })),
|
17
|
+
react_1.default.createElement("label", { htmlFor: option.id, className: "form-check-label" }, option.label),
|
18
|
+
required && !value && index === options.length - 1 && (react_1.default.createElement("div", { className: "invalid-feedback text-danger mt-2" },
|
19
|
+
react_1.default.createElement("div", { className: "description-icon" },
|
20
|
+
react_1.default.createElement(fa_1.FaExclamationTriangle, null)),
|
21
|
+
react_1.default.createElement("div", { className: "description-text" },
|
22
|
+
react_1.default.createElement("span", null, errorMessage || 'Seçim yapılması gerekmektedir.')))),
|
23
|
+
conditionalErrorVisible && index === options.length - 1 && (react_1.default.createElement("div", { className: "conditional-error-message text-warning mt-2" },
|
24
|
+
react_1.default.createElement("div", { className: "description-icon" },
|
25
|
+
react_1.default.createElement(fa_1.FaExclamationTriangle, null)),
|
26
|
+
react_1.default.createElement("div", { className: "description-text" },
|
27
|
+
react_1.default.createElement("span", null, conditionalErrorMessage)))),
|
28
|
+
description && index === options.length - 1 && (react_1.default.createElement("div", { className: "form-description text-secondary mt-2" },
|
29
|
+
react_1.default.createElement("div", { className: "description-icon" },
|
30
|
+
react_1.default.createElement(fa_1.FaInfoCircle, null)),
|
31
|
+
react_1.default.createElement("div", { className: "description-text" },
|
32
|
+
react_1.default.createElement("span", null, description)))))); })))));
|
33
|
+
};
|
34
|
+
exports.default = CustomRadioButton;
|
@@ -0,0 +1,21 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import 'react-quill/dist/quill.snow.css';
|
3
|
+
interface CustomRichTextboxProps {
|
4
|
+
id?: string;
|
5
|
+
name?: string;
|
6
|
+
label: string;
|
7
|
+
value: string;
|
8
|
+
placeholder?: string;
|
9
|
+
required?: boolean;
|
10
|
+
errorMessage?: string;
|
11
|
+
conditionalErrorVisible?: boolean;
|
12
|
+
conditionalErrorMessage?: string;
|
13
|
+
description?: string | null;
|
14
|
+
tooltip?: string;
|
15
|
+
disabled?: boolean;
|
16
|
+
style?: React.CSSProperties;
|
17
|
+
className?: string;
|
18
|
+
onChange: (value: string) => void;
|
19
|
+
}
|
20
|
+
declare const CustomRichTextbox: React.FC<CustomRichTextboxProps>;
|
21
|
+
export default CustomRichTextbox;
|
@@ -0,0 +1,41 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
|
+
};
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
+
var react_1 = __importDefault(require("react"));
|
7
|
+
var react_quill_1 = __importDefault(require("react-quill"));
|
8
|
+
require("react-quill/dist/quill.snow.css"); // Quill'in varsayılan stil dosyası
|
9
|
+
var react_bootstrap_1 = require("react-bootstrap");
|
10
|
+
var fa_1 = require("react-icons/fa");
|
11
|
+
var CustomRichTextbox = function (_a) {
|
12
|
+
var id = _a.id, name = _a.name, label = _a.label, value = _a.value, placeholder = _a.placeholder, _b = _a.required, required = _b === void 0 ? false : _b, errorMessage = _a.errorMessage, _c = _a.conditionalErrorVisible, conditionalErrorVisible = _c === void 0 ? false : _c, conditionalErrorMessage = _a.conditionalErrorMessage, description = _a.description, tooltip = _a.tooltip, _d = _a.disabled, disabled = _d === void 0 ? false : _d, _e = _a.style, style = _e === void 0 ? { border: 'none' } : _e, className = _a.className, onChange = _a.onChange;
|
13
|
+
var handleChange = function (content) {
|
14
|
+
onChange(content);
|
15
|
+
};
|
16
|
+
return (react_1.default.createElement("div", { className: className },
|
17
|
+
react_1.default.createElement("div", { className: "form-group" },
|
18
|
+
react_1.default.createElement("label", { htmlFor: id, className: "form-label" }, label),
|
19
|
+
react_1.default.createElement("div", { className: "position-relative" },
|
20
|
+
tooltip && (react_1.default.createElement(react_bootstrap_1.OverlayTrigger, { placement: "bottom", overlay: react_1.default.createElement(react_bootstrap_1.Tooltip, { id: "tooltip-".concat(id) }, tooltip) },
|
21
|
+
react_1.default.createElement("div", null,
|
22
|
+
react_1.default.createElement(react_quill_1.default, { id: id, value: value, placeholder: placeholder, readOnly: disabled, onChange: handleChange, className: "form-control", style: style, theme: "snow" // Kullanılan tema
|
23
|
+
})))),
|
24
|
+
!tooltip && (react_1.default.createElement(react_quill_1.default, { id: id, value: value, placeholder: placeholder, readOnly: disabled, onChange: handleChange, className: "form-control", style: style, theme: "snow" })),
|
25
|
+
required && !value && (react_1.default.createElement("div", { className: "invalid-feedback text-danger mt-2" },
|
26
|
+
react_1.default.createElement("div", { className: "description-icon" },
|
27
|
+
react_1.default.createElement(fa_1.FaExclamationTriangle, null)),
|
28
|
+
react_1.default.createElement("div", { className: "description-text" },
|
29
|
+
react_1.default.createElement("span", null, errorMessage || 'Bu alan boş bırakılamaz.')))),
|
30
|
+
conditionalErrorVisible && (react_1.default.createElement("div", { className: "conditional-error-message text-warning mt-2" },
|
31
|
+
react_1.default.createElement("div", { className: "description-icon" },
|
32
|
+
react_1.default.createElement(fa_1.FaExclamationTriangle, null)),
|
33
|
+
react_1.default.createElement("div", { className: "description-text" },
|
34
|
+
react_1.default.createElement("span", null, conditionalErrorMessage)))),
|
35
|
+
description && (react_1.default.createElement("div", { className: "form-description text-secondary mt-2" },
|
36
|
+
react_1.default.createElement("div", { className: "description-icon" },
|
37
|
+
react_1.default.createElement(fa_1.FaInfoCircle, null)),
|
38
|
+
react_1.default.createElement("div", { className: "description-text" },
|
39
|
+
react_1.default.createElement("span", null, description))))))));
|
40
|
+
};
|
41
|
+
exports.default = CustomRichTextbox;
|
@@ -0,0 +1,26 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
interface CustomSelectOption {
|
3
|
+
id: string;
|
4
|
+
label: string;
|
5
|
+
value: string;
|
6
|
+
}
|
7
|
+
interface CustomSelectProps {
|
8
|
+
id?: string;
|
9
|
+
name?: string;
|
10
|
+
label: string;
|
11
|
+
options: CustomSelectOption[];
|
12
|
+
value: string | string[];
|
13
|
+
required?: boolean;
|
14
|
+
multiple?: boolean;
|
15
|
+
errorMessage?: string;
|
16
|
+
conditionalErrorVisible?: boolean;
|
17
|
+
conditionalErrorMessage?: string;
|
18
|
+
tooltip?: string;
|
19
|
+
description?: string | null;
|
20
|
+
disabled?: boolean;
|
21
|
+
className?: string;
|
22
|
+
style?: React.CSSProperties;
|
23
|
+
onChange: (value: string | string[]) => void;
|
24
|
+
}
|
25
|
+
declare const CustomSelect: React.FC<CustomSelectProps>;
|
26
|
+
export default CustomSelect;
|
@@ -0,0 +1,41 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
|
+
};
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
+
var react_1 = __importDefault(require("react"));
|
7
|
+
var react_bootstrap_1 = require("react-bootstrap");
|
8
|
+
var fa_1 = require("react-icons/fa");
|
9
|
+
var CustomSelect = function (_a) {
|
10
|
+
var id = _a.id, name = _a.name, label = _a.label, options = _a.options, value = _a.value, _b = _a.required, required = _b === void 0 ? false : _b, _c = _a.multiple, multiple = _c === void 0 ? false : _c, errorMessage = _a.errorMessage, conditionalErrorVisible = _a.conditionalErrorVisible, conditionalErrorMessage = _a.conditionalErrorMessage, tooltip = _a.tooltip, description = _a.description, _d = _a.disabled, disabled = _d === void 0 ? false : _d, className = _a.className, style = _a.style, onChange = _a.onChange;
|
11
|
+
var handleChange = function (e) {
|
12
|
+
var selectedOptions = multiple
|
13
|
+
? Array.from(e.target.selectedOptions).map(function (option) { return option.value; })
|
14
|
+
: e.target.value;
|
15
|
+
onChange(selectedOptions); // Pass string or string[] as needed
|
16
|
+
};
|
17
|
+
return (react_1.default.createElement("div", { className: className, style: style },
|
18
|
+
react_1.default.createElement("div", { className: "form-group" },
|
19
|
+
react_1.default.createElement("label", { htmlFor: id, className: "form-label" }, label),
|
20
|
+
react_1.default.createElement("div", { className: "select-container" },
|
21
|
+
react_1.default.createElement(react_bootstrap_1.OverlayTrigger, { placement: "bottom", overlay: tooltip ? (react_1.default.createElement(react_bootstrap_1.Tooltip, { id: "tooltip-".concat(id || name) }, tooltip)) : react_1.default.createElement(react_1.default.Fragment, null) },
|
22
|
+
react_1.default.createElement("select", { id: id, name: name, className: "form-select", value: value, multiple: multiple, required: required, disabled: disabled, onChange: handleChange },
|
23
|
+
!multiple && (react_1.default.createElement("option", { value: "", disabled: true }, "Se\u00E7iniz")),
|
24
|
+
options.map(function (option) { return (react_1.default.createElement("option", { key: option.id, value: option.value }, option.label)); }))),
|
25
|
+
react_1.default.createElement("div", { className: "invalid-feedback text-danger mt-2" },
|
26
|
+
react_1.default.createElement("div", { className: "description-icon" },
|
27
|
+
react_1.default.createElement(fa_1.FaExclamationTriangle, null)),
|
28
|
+
react_1.default.createElement("div", { className: "description-text" },
|
29
|
+
react_1.default.createElement("span", null, errorMessage || 'Lütfen bir seçim yapınız.'))),
|
30
|
+
conditionalErrorVisible && (react_1.default.createElement("div", { className: "conditional-error-message text-warning mt-2" },
|
31
|
+
react_1.default.createElement("div", { className: "description-icon" },
|
32
|
+
react_1.default.createElement(fa_1.FaExclamationTriangle, null)),
|
33
|
+
react_1.default.createElement("div", { className: "description-text" },
|
34
|
+
react_1.default.createElement("span", null, conditionalErrorMessage)))),
|
35
|
+
description && (react_1.default.createElement("div", { className: "form-description text-secondary mt-2" },
|
36
|
+
react_1.default.createElement("div", { className: "description-icon" },
|
37
|
+
react_1.default.createElement(fa_1.FaInfoCircle, null)),
|
38
|
+
react_1.default.createElement("div", { className: "description-text" },
|
39
|
+
react_1.default.createElement("span", null, description))))))));
|
40
|
+
};
|
41
|
+
exports.default = CustomSelect;
|
@@ -0,0 +1,20 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
declare enum AlignTabs {
|
3
|
+
START = "start",
|
4
|
+
CENTER = "center",
|
5
|
+
END = "end"
|
6
|
+
}
|
7
|
+
interface TabItem {
|
8
|
+
key: string;
|
9
|
+
title: string;
|
10
|
+
content: React.ReactNode;
|
11
|
+
}
|
12
|
+
interface CustomTabProps {
|
13
|
+
tabs: TabItem[];
|
14
|
+
defaultActiveKey?: string;
|
15
|
+
align?: AlignTabs;
|
16
|
+
transparent?: boolean;
|
17
|
+
}
|
18
|
+
declare const CustomTab: React.FC<CustomTabProps>;
|
19
|
+
export { CustomTab, AlignTabs };
|
20
|
+
export default CustomTab;
|
@@ -0,0 +1,65 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
3
|
+
__assign = Object.assign || function(t) {
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
5
|
+
s = arguments[i];
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
7
|
+
t[p] = s[p];
|
8
|
+
}
|
9
|
+
return t;
|
10
|
+
};
|
11
|
+
return __assign.apply(this, arguments);
|
12
|
+
};
|
13
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
14
|
+
if (k2 === undefined) k2 = k;
|
15
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
16
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
17
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
18
|
+
}
|
19
|
+
Object.defineProperty(o, k2, desc);
|
20
|
+
}) : (function(o, m, k, k2) {
|
21
|
+
if (k2 === undefined) k2 = k;
|
22
|
+
o[k2] = m[k];
|
23
|
+
}));
|
24
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
25
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
26
|
+
}) : function(o, v) {
|
27
|
+
o["default"] = v;
|
28
|
+
});
|
29
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
30
|
+
if (mod && mod.__esModule) return mod;
|
31
|
+
var result = {};
|
32
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
33
|
+
__setModuleDefault(result, mod);
|
34
|
+
return result;
|
35
|
+
};
|
36
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
37
|
+
exports.AlignTabs = exports.CustomTab = void 0;
|
38
|
+
var react_1 = __importStar(require("react"));
|
39
|
+
var react_bootstrap_1 = require("react-bootstrap");
|
40
|
+
var AlignTabs;
|
41
|
+
(function (AlignTabs) {
|
42
|
+
AlignTabs["START"] = "start";
|
43
|
+
AlignTabs["CENTER"] = "center";
|
44
|
+
AlignTabs["END"] = "end";
|
45
|
+
})(AlignTabs || (AlignTabs = {}));
|
46
|
+
exports.AlignTabs = AlignTabs;
|
47
|
+
var CustomTab = function (_a) {
|
48
|
+
var _b;
|
49
|
+
var tabs = _a.tabs, defaultActiveKey = _a.defaultActiveKey, _c = _a.align, align = _c === void 0 ? AlignTabs.START : _c, _d = _a.transparent, transparent = _d === void 0 ? false : _d;
|
50
|
+
var _e = (0, react_1.useState)(defaultActiveKey || ((_b = tabs[0]) === null || _b === void 0 ? void 0 : _b.key) || ''), activeTabKey = _e[0], setActiveTabKey = _e[1];
|
51
|
+
var alignmentClass = align === AlignTabs.CENTER
|
52
|
+
? 'justify-content-center'
|
53
|
+
: align === AlignTabs.END
|
54
|
+
? 'justify-content-end'
|
55
|
+
: 'justify-content-start';
|
56
|
+
var navStyle = transparent ? { background: 'transparent' } : undefined;
|
57
|
+
return (react_1.default.createElement("div", { className: "card", style: { background: "transparent" } },
|
58
|
+
react_1.default.createElement("div", { className: "card-body" },
|
59
|
+
react_1.default.createElement(react_bootstrap_1.Tab.Container, { activeKey: activeTabKey, onSelect: function (tabKey) { var _a; return setActiveTabKey(tabKey || ((_a = tabs[0]) === null || _a === void 0 ? void 0 : _a.key) || ''); } },
|
60
|
+
react_1.default.createElement(react_bootstrap_1.Nav, { variant: "tabs", className: "d-flex ".concat(alignmentClass), style: __assign({ width: "100%" }, navStyle) }, tabs.map(function (tab) { return (react_1.default.createElement(react_bootstrap_1.Nav.Item, { key: tab.key },
|
61
|
+
react_1.default.createElement(react_bootstrap_1.Nav.Link, { eventKey: tab.key }, tab.title))); })),
|
62
|
+
react_1.default.createElement(react_bootstrap_1.Tab.Content, null, tabs.map(function (tab) { return (react_1.default.createElement(react_bootstrap_1.Tab.Pane, { eventKey: tab.key, key: tab.key }, tab.content)); }))))));
|
63
|
+
};
|
64
|
+
exports.CustomTab = CustomTab;
|
65
|
+
exports.default = CustomTab;
|
@@ -0,0 +1,71 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
declare enum TextType {
|
3
|
+
BOLDHEAD = "boldhead",
|
4
|
+
HEADING = "heading",
|
5
|
+
SUBHEADING = "subheading",
|
6
|
+
PARAGRAPH = "paragraph"
|
7
|
+
}
|
8
|
+
declare enum TextAlign {
|
9
|
+
START = "start",
|
10
|
+
CENTER = "center",
|
11
|
+
END = "end"
|
12
|
+
}
|
13
|
+
declare enum FontSize {
|
14
|
+
XXXXL = "96px",
|
15
|
+
XXXL = "72px",
|
16
|
+
XXL = "48px",
|
17
|
+
XL = "32px",
|
18
|
+
L = "24px",
|
19
|
+
M = "20px",
|
20
|
+
S = "18px",
|
21
|
+
XS = "16px",
|
22
|
+
XXS = "14px",
|
23
|
+
XXXS = "12px",
|
24
|
+
XXXXS = "10px"
|
25
|
+
}
|
26
|
+
declare enum LineHeight {
|
27
|
+
XXL = "5",
|
28
|
+
XL = "4",
|
29
|
+
L = "3",
|
30
|
+
M = "2.5",
|
31
|
+
S = "2",
|
32
|
+
XS = "1.5",
|
33
|
+
XXS = "1"
|
34
|
+
}
|
35
|
+
declare enum FontWeight {
|
36
|
+
BOLD = "800",
|
37
|
+
NORMAL = "600",
|
38
|
+
THIN = "400"
|
39
|
+
}
|
40
|
+
declare enum Color {
|
41
|
+
DEFAULT = "currentColor",
|
42
|
+
PRIMARY = "text-primary",
|
43
|
+
SECONDARY = "text-secondary",
|
44
|
+
SUCCESS = "text-success",
|
45
|
+
WARNING = "text-warning",
|
46
|
+
DANGER = "text-danger",
|
47
|
+
INFO = "text-info",
|
48
|
+
DARK = "text-dark",
|
49
|
+
LIGHT = "text-light"
|
50
|
+
}
|
51
|
+
interface CustomTextProps {
|
52
|
+
id?: string;
|
53
|
+
value: string;
|
54
|
+
className?: string;
|
55
|
+
style?: React.CSSProperties;
|
56
|
+
textType?: TextType;
|
57
|
+
color?: Color;
|
58
|
+
textAlign?: TextAlign;
|
59
|
+
fontSize?: FontSize;
|
60
|
+
lineHeight?: LineHeight;
|
61
|
+
fontWeight?: FontWeight;
|
62
|
+
underline?: boolean;
|
63
|
+
overline?: boolean;
|
64
|
+
linethrough?: boolean;
|
65
|
+
italic?: boolean;
|
66
|
+
textAlignClass?: string;
|
67
|
+
linkText?: string;
|
68
|
+
}
|
69
|
+
declare const CustomText: React.FC<CustomTextProps>;
|
70
|
+
export { CustomText, TextType, TextAlign, FontSize, LineHeight, FontWeight, Color };
|
71
|
+
export default CustomText;
|
@@ -0,0 +1,156 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
3
|
+
__assign = Object.assign || function(t) {
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
5
|
+
s = arguments[i];
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
7
|
+
t[p] = s[p];
|
8
|
+
}
|
9
|
+
return t;
|
10
|
+
};
|
11
|
+
return __assign.apply(this, arguments);
|
12
|
+
};
|
13
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
14
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
15
|
+
};
|
16
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
17
|
+
exports.Color = exports.FontWeight = exports.LineHeight = exports.FontSize = exports.TextAlign = exports.TextType = exports.CustomText = void 0;
|
18
|
+
var react_1 = __importDefault(require("react"));
|
19
|
+
var TextType;
|
20
|
+
(function (TextType) {
|
21
|
+
TextType["BOLDHEAD"] = "boldhead";
|
22
|
+
TextType["HEADING"] = "heading";
|
23
|
+
TextType["SUBHEADING"] = "subheading";
|
24
|
+
TextType["PARAGRAPH"] = "paragraph";
|
25
|
+
})(TextType || (TextType = {}));
|
26
|
+
exports.TextType = TextType;
|
27
|
+
var TextAlign;
|
28
|
+
(function (TextAlign) {
|
29
|
+
TextAlign["START"] = "start";
|
30
|
+
TextAlign["CENTER"] = "center";
|
31
|
+
TextAlign["END"] = "end";
|
32
|
+
})(TextAlign || (TextAlign = {}));
|
33
|
+
exports.TextAlign = TextAlign;
|
34
|
+
var FontSize;
|
35
|
+
(function (FontSize) {
|
36
|
+
FontSize["XXXXL"] = "96px";
|
37
|
+
FontSize["XXXL"] = "72px";
|
38
|
+
FontSize["XXL"] = "48px";
|
39
|
+
FontSize["XL"] = "32px";
|
40
|
+
FontSize["L"] = "24px";
|
41
|
+
FontSize["M"] = "20px";
|
42
|
+
FontSize["S"] = "18px";
|
43
|
+
FontSize["XS"] = "16px";
|
44
|
+
FontSize["XXS"] = "14px";
|
45
|
+
FontSize["XXXS"] = "12px";
|
46
|
+
FontSize["XXXXS"] = "10px";
|
47
|
+
})(FontSize || (FontSize = {}));
|
48
|
+
exports.FontSize = FontSize;
|
49
|
+
var LineHeight;
|
50
|
+
(function (LineHeight) {
|
51
|
+
LineHeight["XXL"] = "5";
|
52
|
+
LineHeight["XL"] = "4";
|
53
|
+
LineHeight["L"] = "3";
|
54
|
+
LineHeight["M"] = "2.5";
|
55
|
+
LineHeight["S"] = "2";
|
56
|
+
LineHeight["XS"] = "1.5";
|
57
|
+
LineHeight["XXS"] = "1";
|
58
|
+
})(LineHeight || (LineHeight = {}));
|
59
|
+
exports.LineHeight = LineHeight;
|
60
|
+
var FontWeight;
|
61
|
+
(function (FontWeight) {
|
62
|
+
FontWeight["BOLD"] = "800";
|
63
|
+
FontWeight["NORMAL"] = "600";
|
64
|
+
FontWeight["THIN"] = "400";
|
65
|
+
})(FontWeight || (FontWeight = {}));
|
66
|
+
exports.FontWeight = FontWeight;
|
67
|
+
var Color;
|
68
|
+
(function (Color) {
|
69
|
+
Color["DEFAULT"] = "currentColor";
|
70
|
+
Color["PRIMARY"] = "text-primary";
|
71
|
+
Color["SECONDARY"] = "text-secondary";
|
72
|
+
Color["SUCCESS"] = "text-success";
|
73
|
+
Color["WARNING"] = "text-warning";
|
74
|
+
Color["DANGER"] = "text-danger";
|
75
|
+
Color["INFO"] = "text-info";
|
76
|
+
Color["DARK"] = "text-dark";
|
77
|
+
Color["LIGHT"] = "text-light";
|
78
|
+
})(Color || (Color = {}));
|
79
|
+
exports.Color = Color;
|
80
|
+
var CustomText = function (_a) {
|
81
|
+
var _b;
|
82
|
+
var id = _a.id, value = _a.value, _c = _a.className, className = _c === void 0 ? '' : _c, _d = _a.style, style = _d === void 0 ? {} : _d, _e = _a.textType, textType = _e === void 0 ? TextType.PARAGRAPH : _e, // Varsayılan olarak 'paragraph'
|
83
|
+
color = _a.color, textAlign = _a.textAlign, fontSize = _a.fontSize, lineHeight = _a.lineHeight, fontWeight = _a.fontWeight, _f = _a.underline, underline = _f === void 0 ? false : _f, _g = _a.overline, overline = _g === void 0 ? false : _g, _h = _a.linethrough, linethrough = _h === void 0 ? false : _h, _j = _a.italic, italic = _j === void 0 ? false : _j, textAlignClass = _a.textAlignClass, linkText = _a.linkText;
|
84
|
+
// Varsayılan stiller
|
85
|
+
var defaultStyles = (_b = {},
|
86
|
+
_b[TextType.BOLDHEAD] = {
|
87
|
+
fontSize: FontSize.XL,
|
88
|
+
lineHeight: LineHeight.S,
|
89
|
+
fontWeight: FontWeight.BOLD,
|
90
|
+
},
|
91
|
+
_b[TextType.HEADING] = {
|
92
|
+
fontSize: FontSize.XL,
|
93
|
+
lineHeight: LineHeight.S,
|
94
|
+
fontWeight: FontWeight.NORMAL,
|
95
|
+
},
|
96
|
+
_b[TextType.SUBHEADING] = {
|
97
|
+
fontSize: FontSize.L,
|
98
|
+
lineHeight: LineHeight.XS,
|
99
|
+
fontWeight: FontWeight.NORMAL,
|
100
|
+
},
|
101
|
+
_b[TextType.PARAGRAPH] = {
|
102
|
+
fontSize: FontSize.XS,
|
103
|
+
lineHeight: LineHeight.XXS,
|
104
|
+
fontWeight: FontWeight.THIN,
|
105
|
+
},
|
106
|
+
_b);
|
107
|
+
// Dinamik sınıf ekleme
|
108
|
+
if (textType == TextType.BOLDHEAD && !color) {
|
109
|
+
color = Color.DARK;
|
110
|
+
}
|
111
|
+
else if (textType == TextType.HEADING && !color) {
|
112
|
+
color = Color.DARK;
|
113
|
+
}
|
114
|
+
else if (textType == TextType.SUBHEADING && !color) {
|
115
|
+
color = Color.DARK;
|
116
|
+
}
|
117
|
+
else if (textType == TextType.PARAGRAPH && !color) {
|
118
|
+
color = Color.DEFAULT;
|
119
|
+
}
|
120
|
+
if (textAlign == TextAlign.START) {
|
121
|
+
textAlignClass = "text-start";
|
122
|
+
}
|
123
|
+
else if (textAlign == TextAlign.CENTER) {
|
124
|
+
textAlignClass = "text-center";
|
125
|
+
}
|
126
|
+
else if (textAlign == TextAlign.END) {
|
127
|
+
textAlignClass = "text-end";
|
128
|
+
}
|
129
|
+
// Text decoration birleştirme
|
130
|
+
var textDecoration = [
|
131
|
+
underline ? 'underline' : '',
|
132
|
+
overline ? 'overline' : '',
|
133
|
+
linethrough ? 'line-through' : '',
|
134
|
+
]
|
135
|
+
.filter(Boolean)
|
136
|
+
.join(' ');
|
137
|
+
// Varsayılan stil ile kullanıcı stilini birleştir
|
138
|
+
var combinedStyle = __assign(__assign(__assign({}, defaultStyles[textType]), { textAlign: textAlign !== null && textAlign !== void 0 ? textAlign : defaultStyles[textType].textAlign, fontSize: fontSize !== null && fontSize !== void 0 ? fontSize : defaultStyles[textType].fontSize, lineHeight: lineHeight !== null && lineHeight !== void 0 ? lineHeight : defaultStyles[textType].lineHeight, fontWeight: fontWeight !== null && fontWeight !== void 0 ? fontWeight : defaultStyles[textType].fontWeight, textDecoration: textDecoration || undefined, fontStyle: italic ? 'italic' : undefined }), style);
|
139
|
+
var combinedClassName = "".concat(color, " ").concat(className).trim();
|
140
|
+
// URL'leri tıklanabilir hale getirme
|
141
|
+
var renderWithLinks = function (text, linkText) {
|
142
|
+
var urlRegex = /(https?:\/\/[^\s]+|www\.[^\s]+)/g; // URL'leri algılayan RegEx
|
143
|
+
var parts = text.split(urlRegex);
|
144
|
+
return parts.map(function (part, index) {
|
145
|
+
return urlRegex.test(part) ? (react_1.default.createElement("a", { key: index, href: part.startsWith('http') ? part : "https://".concat(part), target: "_blank", rel: "noopener noreferrer" },
|
146
|
+
linkText || part.replace(/https?:\/\/|www\.|\/$/g, ''),
|
147
|
+
" ")) : (part);
|
148
|
+
});
|
149
|
+
};
|
150
|
+
return (react_1.default.createElement("div", { className: "".concat(textAlignClass) },
|
151
|
+
react_1.default.createElement("span", { id: id || "custom-text-".concat(Date.now()), className: "custom-text ".concat(combinedClassName), style: combinedStyle },
|
152
|
+
renderWithLinks(value, linkText),
|
153
|
+
" ")));
|
154
|
+
};
|
155
|
+
exports.CustomText = CustomText;
|
156
|
+
exports.default = CustomText;
|
@@ -0,0 +1,22 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
interface CustomTextareaProps {
|
3
|
+
id?: string;
|
4
|
+
name?: string;
|
5
|
+
label: string;
|
6
|
+
value: string;
|
7
|
+
placeholder?: string;
|
8
|
+
required?: boolean;
|
9
|
+
errorMessage?: string;
|
10
|
+
conditionalErrorVisible?: boolean;
|
11
|
+
conditionalErrorMessage?: string;
|
12
|
+
disabled?: boolean;
|
13
|
+
readOnly?: boolean;
|
14
|
+
rows?: number;
|
15
|
+
description?: string | null;
|
16
|
+
tooltip?: string;
|
17
|
+
style?: React.CSSProperties;
|
18
|
+
className?: string;
|
19
|
+
onChange: (e: React.ChangeEvent<HTMLTextAreaElement>) => void;
|
20
|
+
}
|
21
|
+
declare const CustomTextarea: React.FC<CustomTextareaProps>;
|
22
|
+
export default CustomTextarea;
|