@gpa-gemstone/react-forms 1.1.113 → 1.1.114
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/lib/AutoCompleteInput.js +12 -1
- package/lib/AutoCompleteMultiInput.d.ts +52 -0
- package/lib/AutoCompleteMultiInput.js +98 -0
- package/lib/AutoCompleteTextArea.js +12 -1
- package/lib/index.d.ts +2 -1
- package/lib/index.js +3 -1
- package/package.json +1 -1
package/lib/AutoCompleteInput.js
CHANGED
|
@@ -21,6 +21,17 @@
|
|
|
21
21
|
// Generated original version of source code.
|
|
22
22
|
//
|
|
23
23
|
// ******************************************************************************************************
|
|
24
|
+
var __assign = (this && this.__assign) || function () {
|
|
25
|
+
__assign = Object.assign || function(t) {
|
|
26
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
27
|
+
s = arguments[i];
|
|
28
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
29
|
+
t[p] = s[p];
|
|
30
|
+
}
|
|
31
|
+
return t;
|
|
32
|
+
};
|
|
33
|
+
return __assign.apply(this, arguments);
|
|
34
|
+
};
|
|
24
35
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
25
36
|
exports.getCurrentVariable = exports.getSuggestions = void 0;
|
|
26
37
|
exports.default = AutoCompleteInput;
|
|
@@ -122,7 +133,7 @@ function AutoCompleteInput(props) {
|
|
|
122
133
|
}
|
|
123
134
|
};
|
|
124
135
|
return (React.createElement("div", { ref: autoCompleteInput },
|
|
125
|
-
React.createElement(Input_1.default, {
|
|
136
|
+
React.createElement(Input_1.default, __assign({}, props, { InputRef: inputElement })),
|
|
126
137
|
position == null || !show ? null :
|
|
127
138
|
React.createElement(react_portal_1.Portal, null,
|
|
128
139
|
React.createElement("div", { ref: tableContainer, className: 'popover', style: {
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { Gemstone } from '@gpa-gemstone/application-typings';
|
|
3
|
+
interface IProps<T> extends Omit<Gemstone.TSX.Interfaces.IBaseFormProps<T>, 'Valid' | 'Feedback'> {
|
|
4
|
+
/**
|
|
5
|
+
* CSS styles to apply to the Input component
|
|
6
|
+
* @type {React.CSSProperties}
|
|
7
|
+
* @optional
|
|
8
|
+
*/
|
|
9
|
+
Style?: React.CSSProperties;
|
|
10
|
+
/**
|
|
11
|
+
* Default value to use when adding an item and when value is null
|
|
12
|
+
* @type {number | string}
|
|
13
|
+
*/
|
|
14
|
+
DefaultValue: number | string;
|
|
15
|
+
/**
|
|
16
|
+
* Flag to allow null values
|
|
17
|
+
* @type {boolean}
|
|
18
|
+
* @optional
|
|
19
|
+
*/
|
|
20
|
+
AllowNull?: boolean;
|
|
21
|
+
/**
|
|
22
|
+
* Function to determine the validity of a field
|
|
23
|
+
* @param value - The value of the item to check
|
|
24
|
+
* @param index - The index of the item in the array
|
|
25
|
+
* @param arr - The full array of items
|
|
26
|
+
* @returns {boolean}
|
|
27
|
+
*/
|
|
28
|
+
ItemValid?: (value: string | number, index: number, arr: Array<string | number>) => boolean;
|
|
29
|
+
/**
|
|
30
|
+
* Feedback message to show when input is invalid
|
|
31
|
+
* @param value - The value of the item to check
|
|
32
|
+
* @param index - The index of the item in the array
|
|
33
|
+
* @param arr - The full array of items
|
|
34
|
+
* @returns {string | undefined}
|
|
35
|
+
*/
|
|
36
|
+
ItemFeedback?: (value: string | number, index: number, arr: Array<string | number>) => string | undefined;
|
|
37
|
+
/**
|
|
38
|
+
* Flag to disable add button
|
|
39
|
+
*/
|
|
40
|
+
DisableAdd?: boolean;
|
|
41
|
+
/**
|
|
42
|
+
* Flag to disable all input fields
|
|
43
|
+
*/
|
|
44
|
+
Disabled?: boolean;
|
|
45
|
+
/**
|
|
46
|
+
* List of autocomplete suggestion options
|
|
47
|
+
* @type {string[]}
|
|
48
|
+
*/
|
|
49
|
+
Options: string[];
|
|
50
|
+
}
|
|
51
|
+
declare function AutoCompleteMultiInput<T>(props: IProps<T>): JSX.Element;
|
|
52
|
+
export default AutoCompleteMultiInput;
|
|
@@ -0,0 +1,98 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
// ******************************************************************************************************
|
|
3
|
+
// AutoCompleteMultiInput.tsx - Gbtc
|
|
4
|
+
//
|
|
5
|
+
// Copyright © 2026, Grid Protection Alliance. All Rights Reserved.
|
|
6
|
+
//
|
|
7
|
+
// Licensed to the Grid Protection Alliance (GPA) under one or more contributor license agreements. See
|
|
8
|
+
// the NOTICE file distributed with this work for additional information regarding copyright ownership.
|
|
9
|
+
// The GPA licenses this file to you under the MIT License (MIT), the "License"; you may not use this
|
|
10
|
+
// file except in compliance with the License. You may obtain a copy of the License at:
|
|
11
|
+
//
|
|
12
|
+
// http://opensource.org/licenses/MIT
|
|
13
|
+
//
|
|
14
|
+
// Unless agreed to in writing, the subject software distributed under the License is distributed on an
|
|
15
|
+
// "AS-IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. Refer to the
|
|
16
|
+
// License for the specific language governing permissions and limitations.
|
|
17
|
+
//
|
|
18
|
+
// Code Modification History:
|
|
19
|
+
// ----------------------------------------------------------------------------------------------------
|
|
20
|
+
// 02/26/2026 - Preston Crawford
|
|
21
|
+
// Generated original version of source code.
|
|
22
|
+
//
|
|
23
|
+
// ******************************************************************************************************
|
|
24
|
+
var __assign = (this && this.__assign) || function () {
|
|
25
|
+
__assign = Object.assign || function(t) {
|
|
26
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
27
|
+
s = arguments[i];
|
|
28
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
29
|
+
t[p] = s[p];
|
|
30
|
+
}
|
|
31
|
+
return t;
|
|
32
|
+
};
|
|
33
|
+
return __assign.apply(this, arguments);
|
|
34
|
+
};
|
|
35
|
+
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
36
|
+
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
37
|
+
if (ar || !(i in from)) {
|
|
38
|
+
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
|
39
|
+
ar[i] = from[i];
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
return to.concat(ar || Array.prototype.slice.call(from));
|
|
43
|
+
};
|
|
44
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
45
|
+
var React = require("react");
|
|
46
|
+
var AutoCompleteInput_1 = require("./AutoCompleteInput");
|
|
47
|
+
var gpa_symbols_1 = require("@gpa-gemstone/gpa-symbols");
|
|
48
|
+
var HelpIcon_1 = require("./HelpIcon");
|
|
49
|
+
function AutoCompleteMultiInput(props) {
|
|
50
|
+
var fieldArray = props.Record[props.Field];
|
|
51
|
+
if ((fieldArray === null || fieldArray === void 0 ? void 0 : fieldArray.constructor) !== Array) {
|
|
52
|
+
console.warn("AutoCompleteMultiInput: ".concat(props.Field.toString(), " is not of type array."));
|
|
53
|
+
return React.createElement(React.Fragment, null);
|
|
54
|
+
}
|
|
55
|
+
// Variables to control the rendering of label and help icon.
|
|
56
|
+
var showLabel = props.Label !== "";
|
|
57
|
+
var label = props.Label === undefined ? props.Field : props.Label;
|
|
58
|
+
return (React.createElement(React.Fragment, null,
|
|
59
|
+
fieldArray.length === 0 ?
|
|
60
|
+
React.createElement(React.Fragment, null, showLabel ?
|
|
61
|
+
React.createElement("label", { className: "d-flex align-items-center" },
|
|
62
|
+
React.createElement("span", null, showLabel ? label : ''),
|
|
63
|
+
React.createElement(HelpIcon_1.default, { Help: props.Help }))
|
|
64
|
+
: null)
|
|
65
|
+
: null,
|
|
66
|
+
fieldArray.map(function (r, index) {
|
|
67
|
+
var _a, _b, _c, _d, _e, _f;
|
|
68
|
+
return (React.createElement("div", { className: 'row no-gutters', key: index },
|
|
69
|
+
React.createElement("div", { className: 'col-10' },
|
|
70
|
+
React.createElement(AutoCompleteInput_1.default, { Record: fieldArray, Field: index, Label: index === 0 ? props.Label : '', AllowNull: props.AllowNull, Help: index === 0 ? props.Help : undefined, Feedback: (_b = (_a = props.ItemFeedback) === null || _a === void 0 ? void 0 : _a.call(props, r, index, fieldArray)) !== null && _b !== void 0 ? _b : undefined, Valid: function () { var _a, _b; return (_b = (_a = props.ItemValid) === null || _a === void 0 ? void 0 : _a.call(props, r, index, fieldArray)) !== null && _b !== void 0 ? _b : true; }, Style: props.Style, Disabled: props.Disabled, DefaultValue: typeof props.DefaultValue === 'number' ? props.DefaultValue : undefined, Options: props.Options, Setter: function (record) {
|
|
71
|
+
var _a;
|
|
72
|
+
var _b;
|
|
73
|
+
var newArray = __spreadArray([], fieldArray, true);
|
|
74
|
+
if (!((_b = props.AllowNull) !== null && _b !== void 0 ? _b : true) && record[index] === null)
|
|
75
|
+
newArray[index] = props.DefaultValue;
|
|
76
|
+
else
|
|
77
|
+
newArray[index] = record[index];
|
|
78
|
+
props.Setter(__assign(__assign({}, props.Record), (_a = {}, _a[props.Field] = newArray, _a)));
|
|
79
|
+
} })),
|
|
80
|
+
React.createElement("div", { className: "col-".concat(index === __spreadArray([], fieldArray, true).length - 1 ? 1 : 2, " ").concat(index === 0 ? 'd-flex align-items-center justify-content-center' : '') },
|
|
81
|
+
React.createElement("button", { className: 'btn', style: ((_c = props.Disabled) !== null && _c !== void 0 ? _c : false) ? { display: 'none' } : undefined, onClick: function () {
|
|
82
|
+
var _a;
|
|
83
|
+
var newRecords = __spreadArray([], fieldArray, true).filter(function (_, i) { return i !== index; });
|
|
84
|
+
props.Setter(__assign(__assign({}, props.Record), (_a = {}, _a[props.Field] = newRecords, _a)));
|
|
85
|
+
} },
|
|
86
|
+
React.createElement(gpa_symbols_1.ReactIcons.TrashCan, { Color: 'red' }))),
|
|
87
|
+
index === __spreadArray([], fieldArray, true).length - 1 ?
|
|
88
|
+
React.createElement("div", { className: "col-1 ".concat(index === 0 ? 'd-flex align-items-center justify-content-center' : '') },
|
|
89
|
+
React.createElement("button", { className: 'btn', style: ((_f = (((_d = props.DisableAdd) !== null && _d !== void 0 ? _d : false) || ((_e = props.Disabled) !== null && _e !== void 0 ? _e : false))) !== null && _f !== void 0 ? _f : false) ? { display: 'none' } : undefined, onClick: function () {
|
|
90
|
+
var _a;
|
|
91
|
+
var newRecords = __spreadArray(__spreadArray([], __spreadArray([], fieldArray, true), true), [props.DefaultValue], false);
|
|
92
|
+
props.Setter(__assign(__assign({}, props.Record), (_a = {}, _a[props.Field] = newRecords, _a)));
|
|
93
|
+
} },
|
|
94
|
+
React.createElement(gpa_symbols_1.ReactIcons.CirclePlus, null)))
|
|
95
|
+
: null));
|
|
96
|
+
})));
|
|
97
|
+
}
|
|
98
|
+
exports.default = AutoCompleteMultiInput;
|
|
@@ -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
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
14
|
exports.default = AutoCompleteTextArea;
|
|
4
15
|
var React = require("react");
|
|
@@ -101,7 +112,7 @@ function AutoCompleteTextArea(props) {
|
|
|
101
112
|
setSuggestions([]);
|
|
102
113
|
};
|
|
103
114
|
return (React.createElement("div", { ref: autoCompleteTextArea },
|
|
104
|
-
React.createElement(TextArea_1.default, {
|
|
115
|
+
React.createElement(TextArea_1.default, __assign({}, props, { TextAreaRef: textAreaElement, SpellCheck: false })),
|
|
105
116
|
position == null || !show ? React.createElement(React.Fragment, null) :
|
|
106
117
|
React.createElement(react_portal_1.Portal, null,
|
|
107
118
|
React.createElement("div", { ref: tableContainer, className: 'popover', style: {
|
package/lib/index.d.ts
CHANGED
|
@@ -23,4 +23,5 @@ import MultiSearchableSelect from './MultiSearchableSelect';
|
|
|
23
23
|
import AutoCompleteTextArea from './AutoCompleteTextArea';
|
|
24
24
|
import AutoCompleteInput from './AutoCompleteInput';
|
|
25
25
|
import HelpIcon from './HelpIcon';
|
|
26
|
-
|
|
26
|
+
import AutoCompleteMultiInput from './AutoCompleteMultiInput';
|
|
27
|
+
export { CheckBox, Input, DatePicker, Select, TextArea, DateRangePicker, EnumCheckBoxes, ArrayMultiSelect, ArrayCheckBoxes, MultiCheckBoxSelect, DoubleInput, TimePicker, StylableSelect, ColorPicker, SearchableSelect, ToggleSwitch, InputWithButton, RadioButtons, FileUpload, MultiInput, ToolTip, MultiSearchableSelect, HelpIcon, AutoCompleteTextArea, AutoCompleteInput, AutoCompleteMultiInput };
|
package/lib/index.js
CHANGED
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
//
|
|
23
23
|
// ******************************************************************************************************
|
|
24
24
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
25
|
-
exports.AutoCompleteInput = exports.AutoCompleteTextArea = exports.HelpIcon = exports.MultiSearchableSelect = exports.ToolTip = exports.MultiInput = exports.FileUpload = exports.RadioButtons = exports.InputWithButton = exports.ToggleSwitch = exports.SearchableSelect = exports.ColorPicker = exports.StylableSelect = exports.TimePicker = exports.DoubleInput = exports.MultiCheckBoxSelect = exports.ArrayCheckBoxes = exports.ArrayMultiSelect = exports.EnumCheckBoxes = exports.DateRangePicker = exports.TextArea = exports.Select = exports.DatePicker = exports.Input = exports.CheckBox = void 0;
|
|
25
|
+
exports.AutoCompleteMultiInput = exports.AutoCompleteInput = exports.AutoCompleteTextArea = exports.HelpIcon = exports.MultiSearchableSelect = exports.ToolTip = exports.MultiInput = exports.FileUpload = exports.RadioButtons = exports.InputWithButton = exports.ToggleSwitch = exports.SearchableSelect = exports.ColorPicker = exports.StylableSelect = exports.TimePicker = exports.DoubleInput = exports.MultiCheckBoxSelect = exports.ArrayCheckBoxes = exports.ArrayMultiSelect = exports.EnumCheckBoxes = exports.DateRangePicker = exports.TextArea = exports.Select = exports.DatePicker = exports.Input = exports.CheckBox = void 0;
|
|
26
26
|
var CheckBox_1 = require("./CheckBox");
|
|
27
27
|
exports.CheckBox = CheckBox_1.default;
|
|
28
28
|
var Input_1 = require("./Input");
|
|
@@ -73,3 +73,5 @@ var AutoCompleteInput_1 = require("./AutoCompleteInput");
|
|
|
73
73
|
exports.AutoCompleteInput = AutoCompleteInput_1.default;
|
|
74
74
|
var HelpIcon_1 = require("./HelpIcon");
|
|
75
75
|
exports.HelpIcon = HelpIcon_1.default;
|
|
76
|
+
var AutoCompleteMultiInput_1 = require("./AutoCompleteMultiInput");
|
|
77
|
+
exports.AutoCompleteMultiInput = AutoCompleteMultiInput_1.default;
|