albinasoft-ui-package 1.0.11 → 1.0.13

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.
@@ -0,0 +1,22 @@
1
+ import React from 'react';
2
+ import './custom-autocomplete-input.css';
3
+ interface CustomAutocompleteInputProps {
4
+ id?: string;
5
+ name?: string;
6
+ label: string;
7
+ value: string;
8
+ placeholder?: string;
9
+ required?: boolean;
10
+ description?: string | null;
11
+ errorMessage?: string;
12
+ conditionalErrorVisible?: boolean;
13
+ conditionalErrorMessage?: string;
14
+ disabled?: boolean;
15
+ tooltip?: string;
16
+ className?: string;
17
+ style?: React.CSSProperties;
18
+ fetchOptions: (query: string) => string[];
19
+ onSelect: (value: string) => void;
20
+ }
21
+ declare const CustomAutocompleteInput: React.FC<CustomAutocompleteInputProps>;
22
+ export default CustomAutocompleteInput;
@@ -0,0 +1,139 @@
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
+ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
26
+ function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
27
+ return new (P || (P = Promise))(function (resolve, reject) {
28
+ function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
29
+ function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
30
+ function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
31
+ step((generator = generator.apply(thisArg, _arguments || [])).next());
32
+ });
33
+ };
34
+ var __generator = (this && this.__generator) || function (thisArg, body) {
35
+ var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
36
+ return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
37
+ function verb(n) { return function (v) { return step([n, v]); }; }
38
+ function step(op) {
39
+ if (f) throw new TypeError("Generator is already executing.");
40
+ while (g && (g = 0, op[0] && (_ = 0)), _) try {
41
+ if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
42
+ if (y = 0, t) op = [op[0] & 2, t.value];
43
+ switch (op[0]) {
44
+ case 0: case 1: t = op; break;
45
+ case 4: _.label++; return { value: op[1], done: false };
46
+ case 5: _.label++; y = op[1]; op = [0]; continue;
47
+ case 7: op = _.ops.pop(); _.trys.pop(); continue;
48
+ default:
49
+ if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
50
+ if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
51
+ if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
52
+ if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
53
+ if (t[2]) _.ops.pop();
54
+ _.trys.pop(); continue;
55
+ }
56
+ op = body.call(thisArg, _);
57
+ } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
58
+ if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
59
+ }
60
+ };
61
+ Object.defineProperty(exports, "__esModule", { value: true });
62
+ var react_1 = __importStar(require("react"));
63
+ var fa_1 = require("react-icons/fa");
64
+ var react_bootstrap_1 = require("react-bootstrap");
65
+ require("./custom-autocomplete-input.css");
66
+ var CustomAutocompleteInput = function (_a) {
67
+ 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, description = _a.description, errorMessage = _a.errorMessage, conditionalErrorVisible = _a.conditionalErrorVisible, conditionalErrorMessage = _a.conditionalErrorMessage, _c = _a.disabled, disabled = _c === void 0 ? false : _c, tooltip = _a.tooltip, _d = _a.className, className = _d === void 0 ? '' : _d, style = _a.style, fetchOptions = _a.fetchOptions, onSelect = _a.onSelect;
68
+ var _e = (0, react_1.useState)(value || ''), inputValue = _e[0], setInputValue = _e[1];
69
+ var _f = (0, react_1.useState)([]), options = _f[0], setOptions = _f[1];
70
+ var _g = (0, react_1.useState)(false), isDropdownVisible = _g[0], setIsDropdownVisible = _g[1];
71
+ var dropdownRef = (0, react_1.useRef)(null);
72
+ // Input değiştiğinde fetchOptions çağır
73
+ var handleInputChange = function (e) { return __awaiter(void 0, void 0, void 0, function () {
74
+ var value, fetchedOptions, error_1;
75
+ return __generator(this, function (_a) {
76
+ switch (_a.label) {
77
+ case 0:
78
+ value = e.target.value;
79
+ setInputValue(value);
80
+ if (!value) return [3 /*break*/, 5];
81
+ _a.label = 1;
82
+ case 1:
83
+ _a.trys.push([1, 3, , 4]);
84
+ return [4 /*yield*/, fetchOptions(value)];
85
+ case 2:
86
+ fetchedOptions = _a.sent();
87
+ setOptions(fetchedOptions);
88
+ setIsDropdownVisible(fetchedOptions.length > 0);
89
+ return [3 /*break*/, 4];
90
+ case 3:
91
+ error_1 = _a.sent();
92
+ console.error('Fetch options failed:', error_1);
93
+ setOptions([]);
94
+ setIsDropdownVisible(false);
95
+ return [3 /*break*/, 4];
96
+ case 4: return [3 /*break*/, 6];
97
+ case 5:
98
+ setOptions([]);
99
+ setIsDropdownVisible(false);
100
+ _a.label = 6;
101
+ case 6: return [2 /*return*/];
102
+ }
103
+ });
104
+ }); };
105
+ // Seçim yapıldığında onSelect çağır
106
+ var handleOptionClick = function (option) {
107
+ onSelect(option);
108
+ setIsDropdownVisible(false);
109
+ setInputValue(option);
110
+ };
111
+ // Dropdown dışında tıklanıldığında dropdown'u kapat
112
+ (0, react_1.useEffect)(function () {
113
+ var handleClickOutside = function (event) {
114
+ if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
115
+ setIsDropdownVisible(false);
116
+ }
117
+ };
118
+ document.addEventListener('mousedown', handleClickOutside);
119
+ return function () {
120
+ document.removeEventListener('mousedown', handleClickOutside);
121
+ };
122
+ }, []);
123
+ return (react_1.default.createElement("div", { className: "autocomplete-container ".concat(className), style: style },
124
+ react_1.default.createElement("div", { className: "form-group" },
125
+ react_1.default.createElement("label", { htmlFor: id, className: "form-label" }, label),
126
+ react_1.default.createElement(react_bootstrap_1.OverlayTrigger, { placement: "bottom", overlay: tooltip ? react_1.default.createElement(react_bootstrap_1.Tooltip, { id: "tooltip-".concat(id) }, tooltip) : react_1.default.createElement(react_1.default.Fragment, null) },
127
+ react_1.default.createElement("input", { id: id, name: name, type: "text", value: inputValue, onChange: handleInputChange, placeholder: placeholder, className: "form-control", required: required, disabled: disabled })),
128
+ isDropdownVisible && (react_1.default.createElement("div", { className: "autocomplete-dropdown", ref: dropdownRef }, options.map(function (option, index) { return (react_1.default.createElement("div", { key: index, className: "autocomplete-option", onClick: function () { return handleOptionClick(option); } }, option)); }))),
129
+ errorMessage && (react_1.default.createElement("div", { className: "invalid-feedback text-danger mt-2" },
130
+ react_1.default.createElement(fa_1.FaExclamationTriangle, { className: "me-1" }),
131
+ errorMessage)),
132
+ conditionalErrorVisible && conditionalErrorMessage && (react_1.default.createElement("div", { className: "conditional-error-message text-warning mt-2" },
133
+ react_1.default.createElement(fa_1.FaExclamationTriangle, { className: "me-1" }),
134
+ conditionalErrorMessage)),
135
+ description && (react_1.default.createElement("div", { className: "form-description text-secondary mt-2" },
136
+ react_1.default.createElement(fa_1.FaInfoCircle, { className: "me-1" }),
137
+ description)))));
138
+ };
139
+ exports.default = CustomAutocompleteInput;
@@ -11,7 +11,8 @@ declare enum ElementType {
11
11
  DIVIDER = "divider",
12
12
  RICHTEXTBOX = "richtextbox",
13
13
  TREEVIEW = "treeview",
14
- BUTTON = "button"
14
+ BUTTON = "button",
15
+ AUTOCOMPLETEINPUT = "autocompleteinput"
15
16
  }
16
17
  interface InputElement {
17
18
  id?: string;
@@ -125,13 +126,13 @@ interface TreeViewElement {
125
126
  id?: string;
126
127
  type: ElementType;
127
128
  label?: string;
128
- value: string[];
129
+ value: string;
129
130
  treeData: TreeNode[];
130
131
  rowId?: number;
131
132
  colId?: number;
132
133
  innerRowId?: number;
133
134
  colClass?: string;
134
- onChange: (selected: string[]) => void;
135
+ onChange: (selected: string) => void;
135
136
  }
136
137
  interface ButtonElement {
137
138
  id?: string;
@@ -144,7 +145,19 @@ interface ButtonElement {
144
145
  innerRowId?: number;
145
146
  colClass?: string;
146
147
  }
147
- type FormElement = InputElement | TextareaElement | CheckboxElement | RadioButtonElement | SelectElement | DateTimePickerElement | TextElement | DividerElement | RichTextboxElement | TreeViewElement | ButtonElement;
148
+ interface AutoCompleteInputElement {
149
+ id?: string;
150
+ type: ElementType;
151
+ label: string;
152
+ value: string;
153
+ rowId?: number;
154
+ colId?: number;
155
+ innerRowId?: number;
156
+ colClass?: string;
157
+ fetchOptions: (query: string) => string[];
158
+ onSelect: (value: string) => void;
159
+ }
160
+ type FormElement = InputElement | TextareaElement | CheckboxElement | RadioButtonElement | SelectElement | DateTimePickerElement | TextElement | DividerElement | RichTextboxElement | TreeViewElement | ButtonElement | AutoCompleteInputElement;
148
161
  interface CustomFormProps {
149
162
  elements: FormElement[];
150
163
  onSubmit: (formValues: Record<string, any>) => void;
@@ -40,7 +40,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
40
40
  exports.ElementType = exports.CustomForm = void 0;
41
41
  var react_1 = __importStar(require("react"));
42
42
  var react_toastify_1 = require("react-toastify");
43
- var CustomButton_1 = __importDefault(require("../components/CustomButton"));
43
+ var CustomButton_1 = __importDefault(require("./CustomButton"));
44
44
  var CustomInput_1 = __importDefault(require("./CustomInput"));
45
45
  var CustomTextarea_1 = __importDefault(require("./CustomTextarea"));
46
46
  var CustomCheckbox_1 = __importDefault(require("./CustomCheckbox"));
@@ -51,6 +51,7 @@ var CustomText_1 = __importDefault(require("./CustomText"));
51
51
  var CustomDivider_1 = __importDefault(require("./CustomDivider"));
52
52
  var CustomRichTextbox_1 = __importDefault(require("./CustomRichTextbox"));
53
53
  var CustomTreeView_1 = __importDefault(require("./CustomTreeView"));
54
+ var CustomAutocompleteInput_1 = __importDefault(require("./CustomAutocompleteInput"));
54
55
  var ElementType;
55
56
  (function (ElementType) {
56
57
  ElementType["INPUT"] = "input";
@@ -64,6 +65,7 @@ var ElementType;
64
65
  ElementType["RICHTEXTBOX"] = "richtextbox";
65
66
  ElementType["TREEVIEW"] = "treeview";
66
67
  ElementType["BUTTON"] = "button";
68
+ ElementType["AUTOCOMPLETEINPUT"] = "autocompleteinput";
67
69
  })(ElementType || (ElementType = {}));
68
70
  exports.ElementType = ElementType;
69
71
  var CustomForm = function (_a) {
@@ -115,8 +117,6 @@ var CustomForm = function (_a) {
115
117
  formValues_1[element.id] = element.value; // RichTextbox değerini ekleme
116
118
  }
117
119
  });
118
- // Form verilerini JSON olarak çıktıya yazdır
119
- console.log(JSON.stringify(formValues_1, null, 2));
120
120
  onSubmit(formValues_1);
121
121
  }
122
122
  else {
@@ -145,12 +145,19 @@ var CustomForm = function (_a) {
145
145
  var colId = _a[0], innerRows = _a[1];
146
146
  return (react_1.default.createElement("div", { className: "col", key: "col-".concat(rowId, "-").concat(colId) }, Object.entries(innerRows).map(function (_a) {
147
147
  var innerRowId = _a[0], elements = _a[1];
148
- return (react_1.default.createElement("div", { className: "row", key: "inner-row-".concat(rowId, "-").concat(colId, "-").concat(innerRowId) }, elements.map(function (element) { return (react_1.default.createElement("div", { className: element.colClass || 'col-12', key: element.id }, element.type === ElementType.TEXT ? (react_1.default.createElement(CustomText_1.default, __assign({}, element))) : element.type === ElementType.INPUT ? (react_1.default.createElement(CustomInput_1.default, __assign({}, element))) : element.type === ElementType.TEXTAREA ? (react_1.default.createElement(CustomTextarea_1.default, __assign({}, element))) : element.type === ElementType.CHECKBOX ? (react_1.default.createElement(CustomCheckbox_1.default, __assign({}, element))) : element.type === ElementType.RADIO ? (react_1.default.createElement(CustomRadioButton_1.default, __assign({}, element))) : element.type === ElementType.SELECT ? (react_1.default.createElement(CustomSelect_1.default, __assign({}, element))) : element.type === ElementType.DATETIMEPICKER ? (react_1.default.createElement(CustomDateTimePicker_1.default, __assign({}, element))) : element.type === ElementType.DIVIDER ? (react_1.default.createElement(CustomDivider_1.default, __assign({}, element))) : element.type === ElementType.RICHTEXTBOX ? (react_1.default.createElement(CustomRichTextbox_1.default, __assign({}, element))) :
149
- element.type === ElementType.TREEVIEW ? (react_1.default.createElement(CustomTreeView_1.default, __assign({}, element))) :
150
- element.type === ElementType.BUTTON ? (react_1.default.createElement(CustomButton_1.default, __assign({}, element))
151
- // ) : element.type === ElementType.UPLOADER ? (
152
- // <CustomUploader {...(element as UploaderElement)} />
153
- ) : null)); })));
148
+ return (react_1.default.createElement("div", { className: "row", key: "inner-row-".concat(rowId, "-").concat(colId, "-").concat(innerRowId) }, elements.map(function (element) { return (react_1.default.createElement("div", { className: element.colClass || 'col-12', key: element.id }, element.type === ElementType.TEXT ?
149
+ (react_1.default.createElement(CustomText_1.default, __assign({}, element))) : element.type === ElementType.INPUT ?
150
+ (react_1.default.createElement(CustomInput_1.default, __assign({}, element))) : element.type === ElementType.TEXTAREA ?
151
+ (react_1.default.createElement(CustomTextarea_1.default, __assign({}, element))) : element.type === ElementType.CHECKBOX ?
152
+ (react_1.default.createElement(CustomCheckbox_1.default, __assign({}, element))) : element.type === ElementType.RADIO ?
153
+ (react_1.default.createElement(CustomRadioButton_1.default, __assign({}, element))) : element.type === ElementType.SELECT ?
154
+ (react_1.default.createElement(CustomSelect_1.default, __assign({}, element))) : element.type === ElementType.DATETIMEPICKER ?
155
+ (react_1.default.createElement(CustomDateTimePicker_1.default, __assign({}, element))) : element.type === ElementType.DIVIDER ?
156
+ (react_1.default.createElement(CustomDivider_1.default, __assign({}, element))) : element.type === ElementType.RICHTEXTBOX ?
157
+ (react_1.default.createElement(CustomRichTextbox_1.default, __assign({}, element))) : element.type === ElementType.TREEVIEW ?
158
+ (react_1.default.createElement(CustomTreeView_1.default, __assign({}, element))) : element.type === ElementType.BUTTON ?
159
+ (react_1.default.createElement(CustomButton_1.default, __assign({}, element))) : element.type === ElementType.AUTOCOMPLETEINPUT ?
160
+ (react_1.default.createElement(CustomAutocompleteInput_1.default, __assign({}, element))) : null)); })));
154
161
  })));
155
162
  })));
156
163
  }),
@@ -2,9 +2,9 @@ import React from 'react';
2
2
  import 'react-checkbox-tree/lib/react-checkbox-tree.css';
3
3
  interface CustomTreeViewProps {
4
4
  label?: string;
5
- value: string[];
5
+ value: string;
6
6
  treeData: TreeNode[];
7
- onChange: (selected: string[]) => void;
7
+ onChange: (selected: string) => void;
8
8
  }
9
9
  export interface TreeNode {
10
10
  label: string;
@@ -1,4 +1,15 @@
1
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
+ };
2
13
  var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
14
  if (k2 === undefined) k2 = k;
4
15
  var desc = Object.getOwnPropertyDescriptor(m, k);
@@ -22,6 +33,15 @@ var __importStar = (this && this.__importStar) || function (mod) {
22
33
  __setModuleDefault(result, mod);
23
34
  return result;
24
35
  };
36
+ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
37
+ if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
38
+ if (ar || !(i in from)) {
39
+ if (!ar) ar = Array.prototype.slice.call(from, 0, i);
40
+ ar[i] = from[i];
41
+ }
42
+ }
43
+ return to.concat(ar || Array.prototype.slice.call(from));
44
+ };
25
45
  var __importDefault = (this && this.__importDefault) || function (mod) {
26
46
  return (mod && mod.__esModule) ? mod : { "default": mod };
27
47
  };
@@ -30,31 +50,89 @@ var react_1 = __importStar(require("react"));
30
50
  var react_checkbox_tree_1 = __importDefault(require("react-checkbox-tree"));
31
51
  require("react-checkbox-tree/lib/react-checkbox-tree.css");
32
52
  var fa_1 = require("react-icons/fa");
53
+ var CustomInput_1 = __importStar(require("./CustomInput"));
33
54
  var CustomTreeView = function (_a) {
34
55
  var label = _a.label, value = _a.value, treeData = _a.treeData, onChange = _a.onChange;
35
- var _b = (0, react_1.useState)(value), checked = _b[0], setChecked = _b[1]; // Seçilen düğümler
36
- var _c = (0, react_1.useState)([]), expanded = _c[0], setExpanded = _c[1]; // Genişletilen düğümler
56
+ var _b = (0, react_1.useState)(value ? [value] : []), checked = _b[0], setChecked = _b[1];
57
+ var _c = (0, react_1.useState)([]), expanded = _c[0], setExpanded = _c[1];
58
+ var _d = (0, react_1.useState)(''), filterTerm = _d[0], setFilterTerm = _d[1];
59
+ var _e = (0, react_1.useState)(treeData), filteredTreeData = _e[0], setFilteredTreeData = _e[1];
60
+ var _f = (0, react_1.useState)([]), selectedPath = _f[0], setSelectedPath = _f[1]; // 🔥 Seçilen path
61
+ // 🚀 Recursive function to add `showCheckbox` only for leaf nodes
62
+ var markLeafCheckboxOnly = function (nodes) {
63
+ return nodes.map(function (node) { return (__assign(__assign({}, node), { showCheckbox: !(Array.isArray(node.children) && node.children.length > 0), children: node.children ? markLeafCheckboxOnly(node.children) : undefined })); });
64
+ };
65
+ // 🚀 Parent Path'i Bulma (recursive)
66
+ var findParentPath = function (nodes, targetValue, path) {
67
+ if (path === void 0) { path = []; }
68
+ for (var _i = 0, nodes_1 = nodes; _i < nodes_1.length; _i++) {
69
+ var node = nodes_1[_i];
70
+ var currentPath = __spreadArray(__spreadArray([], path, true), [node.value], false);
71
+ if (node.value === targetValue) {
72
+ return currentPath;
73
+ }
74
+ if (node.children) {
75
+ var result = findParentPath(node.children, targetValue, currentPath);
76
+ if (result)
77
+ return result;
78
+ }
79
+ }
80
+ return null;
81
+ };
82
+ // 🚀 Filtreleme fonksiyonu (path'leri de genişletiyoruz)
83
+ var filterTreeData = function (nodes, searchTerm) {
84
+ var pathsToExpand = [];
85
+ var filteredNodes = nodes.map(function (node) {
86
+ var nodeMatches = node.label.toLowerCase().includes(searchTerm.toLowerCase());
87
+ var children = node.children ? filterTreeData(node.children, searchTerm) : { filteredNodes: [], pathsToExpand: [] };
88
+ var childMatches = children.filteredNodes.length > 0;
89
+ if (nodeMatches || childMatches) {
90
+ pathsToExpand = __spreadArray(__spreadArray(__spreadArray([], pathsToExpand, true), [node.value], false), children.pathsToExpand, true);
91
+ return __assign(__assign({}, node), { children: childMatches ? children.filteredNodes : node.children });
92
+ }
93
+ return null;
94
+ }).filter(Boolean);
95
+ return { filteredNodes: filteredNodes, pathsToExpand: pathsToExpand };
96
+ };
97
+ // 🚀 Filtreleme işlemi
98
+ (0, react_1.useEffect)(function () {
99
+ if (filterTerm.trim() === '') {
100
+ setFilteredTreeData(treeData);
101
+ setExpanded(__spreadArray([], selectedPath, true)); // 🔥 Seçim yapılmış path açık kalsın
102
+ }
103
+ else {
104
+ var _a = filterTreeData(treeData, filterTerm), filteredNodes = _a.filteredNodes, pathsToExpand = _a.pathsToExpand;
105
+ setFilteredTreeData(filteredNodes);
106
+ setExpanded(Array.from(new Set(__spreadArray(__spreadArray([], pathsToExpand, true), selectedPath, true)))); // 🔥 Genişletilecek tüm path'leri belirle
107
+ }
108
+ }, [filterTerm, treeData, selectedPath]);
109
+ // 🚀 Kullanıcı bir leaf seçtiğinde, o leaf'in parent'larını genişlet
37
110
  var handleCheck = function (checkedNodes) {
38
- setChecked(checkedNodes);
39
- onChange(checkedNodes);
111
+ var newlySelected = checkedNodes.find(function (node) { return !checked.includes(node); });
112
+ var selectedLeaf = newlySelected || '';
113
+ setChecked(selectedLeaf ? [selectedLeaf] : []);
114
+ if (selectedLeaf) {
115
+ var parentPath = findParentPath(treeData, selectedLeaf);
116
+ if (parentPath) {
117
+ setSelectedPath(parentPath); // 🔥 Kalıcı olarak bu path'i hatırla
118
+ setExpanded(parentPath); // 🔥 Yalnızca bu leaf'in parent path'i açık kalacak
119
+ }
120
+ }
121
+ setFilterTerm(''); // 🔥 Arama kutusunu temizle
122
+ onChange(selectedLeaf);
40
123
  };
41
124
  return (react_1.default.createElement("div", null,
42
125
  label && react_1.default.createElement("label", null, label),
43
- react_1.default.createElement(react_checkbox_tree_1.default, { nodes: treeData, checked: checked, expanded: expanded, onCheck: handleCheck, onExpand: setExpanded, icons: {
126
+ react_1.default.createElement(CustomInput_1.default, { id: "tree-search", label: "Ara", value: filterTerm, inputType: CustomInput_1.InputType.TEXT, placeholder: "Ara...", onChange: function (e) { return setFilterTerm(e.target.value); } }),
127
+ react_1.default.createElement(react_checkbox_tree_1.default, { nodes: markLeafCheckboxOnly(filteredTreeData), checked: checked, expanded: expanded, onCheck: handleCheck, onExpand: setExpanded, icons: {
44
128
  check: react_1.default.createElement(fa_1.FaCheckSquare, { color: "#4caf50" }),
45
- //uncheck: <FaSquare color="#f44336" />,
46
129
  uncheck: react_1.default.createElement(fa_1.FaSquare, { color: "currentColor" }),
47
130
  halfCheck: react_1.default.createElement(fa_1.FaMinusSquare, { color: "#ff9800" }),
48
131
  expandClose: react_1.default.createElement(fa_1.FaChevronRight, { color: "#3f51b5" }),
49
132
  expandOpen: react_1.default.createElement(fa_1.FaChevronDown, { color: "#3f51b5" }),
50
- expandAll: react_1.default.createElement(fa_1.FaChevronRight, { color: "#2196f3" }),
51
- collapseAll: react_1.default.createElement(fa_1.FaChevronDown, { color: "#2196f3" }),
52
133
  parentClose: react_1.default.createElement(fa_1.FaFolder, { color: "#ff9800" }),
53
134
  parentOpen: react_1.default.createElement(fa_1.FaFolderOpen, { color: "#ff9800" }),
54
135
  leaf: react_1.default.createElement(fa_1.FaFile, { color: "#607d8b" }),
55
- // parentClose: null,
56
- // parentOpen: null,
57
- // leaf: null,
58
136
  } })));
59
137
  };
60
138
  exports.default = CustomTreeView;
package/dist/index.d.ts CHANGED
@@ -12,4 +12,5 @@ import CustomTab from './components/CustomTab';
12
12
  import CustomText from './components/CustomText';
13
13
  import CustomTextarea from './components/CustomTextarea';
14
14
  import CustomTreeView from './components/CustomTreeView';
15
- export { CustomButton, CustomCheckbox, CustomDateTimePicker, CustomDivider, CustomForm, CustomInput, CustomModal, CustomRadioButton, CustomRichTextbox, CustomSelect, CustomTab, CustomText, CustomTextarea, CustomTreeView, };
15
+ import CustomAutocompleteInput from './components/CustomAutocompleteInput';
16
+ export { CustomButton, CustomCheckbox, CustomDateTimePicker, CustomDivider, CustomForm, CustomInput, CustomModal, CustomRadioButton, CustomRichTextbox, CustomSelect, CustomTab, CustomText, CustomTextarea, CustomTreeView, CustomAutocompleteInput, };
package/dist/index.js CHANGED
@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
3
3
  return (mod && mod.__esModule) ? mod : { "default": mod };
4
4
  };
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
- exports.CustomTreeView = exports.CustomTextarea = exports.CustomText = exports.CustomTab = exports.CustomSelect = exports.CustomRichTextbox = exports.CustomRadioButton = exports.CustomModal = exports.CustomInput = exports.CustomForm = exports.CustomDivider = exports.CustomDateTimePicker = exports.CustomCheckbox = exports.CustomButton = void 0;
6
+ exports.CustomAutocompleteInput = exports.CustomTreeView = exports.CustomTextarea = exports.CustomText = exports.CustomTab = exports.CustomSelect = exports.CustomRichTextbox = exports.CustomRadioButton = exports.CustomModal = exports.CustomInput = exports.CustomForm = exports.CustomDivider = exports.CustomDateTimePicker = exports.CustomCheckbox = exports.CustomButton = void 0;
7
7
  var CustomButton_1 = __importDefault(require("./components/CustomButton"));
8
8
  exports.CustomButton = CustomButton_1.default;
9
9
  var CustomCheckbox_1 = __importDefault(require("./components/CustomCheckbox"));
@@ -32,3 +32,5 @@ var CustomTextarea_1 = __importDefault(require("./components/CustomTextarea"));
32
32
  exports.CustomTextarea = CustomTextarea_1.default;
33
33
  var CustomTreeView_1 = __importDefault(require("./components/CustomTreeView"));
34
34
  exports.CustomTreeView = CustomTreeView_1.default;
35
+ var CustomAutocompleteInput_1 = __importDefault(require("./components/CustomAutocompleteInput"));
36
+ exports.CustomAutocompleteInput = CustomAutocompleteInput_1.default;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "albinasoft-ui-package",
3
- "version": "1.0.11",
3
+ "version": "1.0.13",
4
4
  "main": "dist/index.js",
5
5
  "types": "dist/index.d.ts",
6
6
  "scripts": {