akeyless-client-commons 1.0.10 → 1.0.12
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/components/index.d.mts +3 -1
- package/dist/components/index.d.ts +3 -1
- package/dist/components/index.js +77 -36
- package/dist/components/index.js.map +1 -1
- package/dist/components/index.mjs +79 -38
- package/dist/components/index.mjs.map +1 -1
- package/dist/types/index.d.mts +1 -0
- package/dist/types/index.d.ts +1 -0
- package/package.json +2 -2
|
@@ -163,6 +163,7 @@ interface SearchSelectProps {
|
|
|
163
163
|
value?: SearchSelectOptions["value"];
|
|
164
164
|
disabled?: boolean;
|
|
165
165
|
direction?: Direction;
|
|
166
|
+
createNewOptionLabel?: string;
|
|
166
167
|
}
|
|
167
168
|
|
|
168
169
|
interface BaseElementProps {
|
|
@@ -251,6 +252,7 @@ interface SelectWithSearchProps extends BaseElementProps {
|
|
|
251
252
|
sortDirection?: "abc" | "cba";
|
|
252
253
|
sortAsNumber?: boolean;
|
|
253
254
|
disabled?: boolean;
|
|
255
|
+
createNewOptionLabel?: string;
|
|
254
256
|
}
|
|
255
257
|
interface InternationalInputProps extends Omit<BaseElementProps, "elementClassName"> {
|
|
256
258
|
type?: "internationalPhoneInput";
|
|
@@ -492,7 +494,7 @@ declare const useSortValues: (options: any[], sortDirection: "abc" | "cba", sort
|
|
|
492
494
|
declare const InputContainer: ({ validationError, name, inputType, labelContent, defaultValue, validationName, containerClassName, labelClassName, elementClassName, required, placeholder, props, minLength, onKeyDown, onChange, direction, value, }: InputContainerProps) => react_jsx_runtime.JSX.Element;
|
|
493
495
|
declare const SelectContainer: ({ name, labelContent, containerClassName, labelClassName, defaultValue, elementClassName, optionClassName, required, options, optionsContainerClassName, sortDirection, sortAsNumber, direction, onChange, }: SelectContainerProps) => react_jsx_runtime.JSX.Element;
|
|
494
496
|
declare function MultiSelect({ onChange, selectedOptions, emptyOptionsElement, unremovableOptions, options, styles, name, placeholder, labelContent, required, labelClassName, groupBy, onSearch, onSearchSync, triggerSearchOnFocus, sortDirection, sortAsNumber, direction, createNewOptionLabel, searchInputProps, }: MultiSelectProps): react_jsx_runtime.JSX.Element;
|
|
495
|
-
declare const SelectWithSearch: ({ options, labelClassName, labelContent, name, onChange, value, placeholder, required, defaultValue, notFoundLabel, searchPlaceholder, containerClassName, dropdownClassName, dropdownOptionClassName, elementClassName, notFoundLabelClassName, searchClassName, selectButtonClassName, sortDirection, sortAsNumber, disabled, direction, }: SelectWithSearchProps) => react_jsx_runtime.JSX.Element;
|
|
497
|
+
declare const SelectWithSearch: ({ options, labelClassName, labelContent, name, onChange, value, placeholder, required, defaultValue, notFoundLabel, searchPlaceholder, containerClassName, dropdownClassName, dropdownOptionClassName, elementClassName, notFoundLabelClassName, searchClassName, selectButtonClassName, sortDirection, sortAsNumber, disabled, direction, createNewOptionLabel, }: SelectWithSearchProps) => react_jsx_runtime.JSX.Element;
|
|
496
498
|
declare const TextAreaContainer: ({ name, labelContent, defaultValue, containerClassName, labelClassName, elementClassName, required, placeholder, props, minLength, onKeyDown, onChange, direction, }: TextAreaContainerProps) => react_jsx_runtime.JSX.Element;
|
|
497
499
|
declare const ElementLabel: ({ labelContent, labelClassName, name, required, withDots, direction, }: Omit<BaseElementProps, "containerClassName" | "elementClassName"> & {
|
|
498
500
|
withDots?: boolean;
|
|
@@ -163,6 +163,7 @@ interface SearchSelectProps {
|
|
|
163
163
|
value?: SearchSelectOptions["value"];
|
|
164
164
|
disabled?: boolean;
|
|
165
165
|
direction?: Direction;
|
|
166
|
+
createNewOptionLabel?: string;
|
|
166
167
|
}
|
|
167
168
|
|
|
168
169
|
interface BaseElementProps {
|
|
@@ -251,6 +252,7 @@ interface SelectWithSearchProps extends BaseElementProps {
|
|
|
251
252
|
sortDirection?: "abc" | "cba";
|
|
252
253
|
sortAsNumber?: boolean;
|
|
253
254
|
disabled?: boolean;
|
|
255
|
+
createNewOptionLabel?: string;
|
|
254
256
|
}
|
|
255
257
|
interface InternationalInputProps extends Omit<BaseElementProps, "elementClassName"> {
|
|
256
258
|
type?: "internationalPhoneInput";
|
|
@@ -492,7 +494,7 @@ declare const useSortValues: (options: any[], sortDirection: "abc" | "cba", sort
|
|
|
492
494
|
declare const InputContainer: ({ validationError, name, inputType, labelContent, defaultValue, validationName, containerClassName, labelClassName, elementClassName, required, placeholder, props, minLength, onKeyDown, onChange, direction, value, }: InputContainerProps) => react_jsx_runtime.JSX.Element;
|
|
493
495
|
declare const SelectContainer: ({ name, labelContent, containerClassName, labelClassName, defaultValue, elementClassName, optionClassName, required, options, optionsContainerClassName, sortDirection, sortAsNumber, direction, onChange, }: SelectContainerProps) => react_jsx_runtime.JSX.Element;
|
|
494
496
|
declare function MultiSelect({ onChange, selectedOptions, emptyOptionsElement, unremovableOptions, options, styles, name, placeholder, labelContent, required, labelClassName, groupBy, onSearch, onSearchSync, triggerSearchOnFocus, sortDirection, sortAsNumber, direction, createNewOptionLabel, searchInputProps, }: MultiSelectProps): react_jsx_runtime.JSX.Element;
|
|
495
|
-
declare const SelectWithSearch: ({ options, labelClassName, labelContent, name, onChange, value, placeholder, required, defaultValue, notFoundLabel, searchPlaceholder, containerClassName, dropdownClassName, dropdownOptionClassName, elementClassName, notFoundLabelClassName, searchClassName, selectButtonClassName, sortDirection, sortAsNumber, disabled, direction, }: SelectWithSearchProps) => react_jsx_runtime.JSX.Element;
|
|
497
|
+
declare const SelectWithSearch: ({ options, labelClassName, labelContent, name, onChange, value, placeholder, required, defaultValue, notFoundLabel, searchPlaceholder, containerClassName, dropdownClassName, dropdownOptionClassName, elementClassName, notFoundLabelClassName, searchClassName, selectButtonClassName, sortDirection, sortAsNumber, disabled, direction, createNewOptionLabel, }: SelectWithSearchProps) => react_jsx_runtime.JSX.Element;
|
|
496
498
|
declare const TextAreaContainer: ({ name, labelContent, defaultValue, containerClassName, labelClassName, elementClassName, required, placeholder, props, minLength, onKeyDown, onChange, direction, }: TextAreaContainerProps) => react_jsx_runtime.JSX.Element;
|
|
497
499
|
declare const ElementLabel: ({ labelContent, labelClassName, name, required, withDots, direction, }: Omit<BaseElementProps, "containerClassName" | "elementClassName"> & {
|
|
498
500
|
withDots?: boolean;
|
package/dist/components/index.js
CHANGED
|
@@ -4213,19 +4213,36 @@ var import_lucide_react4 = require("lucide-react");
|
|
|
4213
4213
|
var import_react6 = require("react");
|
|
4214
4214
|
var import_jsx_runtime16 = require("react/jsx-runtime");
|
|
4215
4215
|
function SearchSelect(param) {
|
|
4216
|
-
var options = param.options, name = param.name, _param_selectPlaceholder = param.selectPlaceholder, selectPlaceholder = _param_selectPlaceholder === void 0 ? "Select" : _param_selectPlaceholder, defaultValue = param.defaultValue,
|
|
4216
|
+
var options = param.options, name = param.name, _param_selectPlaceholder = param.selectPlaceholder, selectPlaceholder = _param_selectPlaceholder === void 0 ? "Select" : _param_selectPlaceholder, defaultValue = param.defaultValue, _param_searchPlaceholder = param.searchPlaceholder, searchPlaceholder = _param_searchPlaceholder === void 0 ? "Search" : _param_searchPlaceholder, dropdownClassName = param.dropdownClassName, dropdownOptionClassName = param.dropdownOptionClassName, notFoundLabel = param.notFoundLabel, notFoundLabelClassName = param.notFoundLabelClassName, elementClassName = param.elementClassName, searchClassName = param.searchClassName, selectButtonClassName = param.selectButtonClassName, value = param.value, disabled = param.disabled, onChange = param.onChange, direction = param.direction, createNewOptionLabel = param.createNewOptionLabel;
|
|
4217
4217
|
var id = (0, import_react6.useId)();
|
|
4218
4218
|
var _ref = _sliced_to_array((0, import_react6.useState)(false), 2), open = _ref[0], setOpen = _ref[1];
|
|
4219
4219
|
var _ref1;
|
|
4220
4220
|
var _ref2 = _sliced_to_array((0, import_react6.useState)((_ref1 = value !== null && value !== void 0 ? value : defaultValue) !== null && _ref1 !== void 0 ? _ref1 : ""), 2), selectedValue = _ref2[0], setSelectedValue = _ref2[1];
|
|
4221
|
+
var _ref3 = _sliced_to_array((0, import_react6.useState)(""), 2), searchQuery = _ref3[0], setSearchQuery = _ref3[1];
|
|
4222
|
+
var _ref4 = _sliced_to_array((0, import_react6.useState)([]), 2), newOptions = _ref4[0], setNewOptions = _ref4[1];
|
|
4223
|
+
var allOptions = (0, import_react6.useMemo)(function() {
|
|
4224
|
+
return _to_consumable_array(options).concat(_to_consumable_array(newOptions));
|
|
4225
|
+
}, [
|
|
4226
|
+
options,
|
|
4227
|
+
newOptions
|
|
4228
|
+
]);
|
|
4229
|
+
var filteredOptions = (0, import_react6.useMemo)(function() {
|
|
4230
|
+
if (!searchQuery) return allOptions;
|
|
4231
|
+
return allOptions.filter(function(option) {
|
|
4232
|
+
return option.label.toLowerCase().includes(searchQuery.toLowerCase());
|
|
4233
|
+
});
|
|
4234
|
+
}, [
|
|
4235
|
+
allOptions,
|
|
4236
|
+
searchQuery
|
|
4237
|
+
]);
|
|
4221
4238
|
var selectLabel = (0, import_react6.useMemo)(function() {
|
|
4222
|
-
var
|
|
4223
|
-
return selectedValue ? (
|
|
4239
|
+
var _allOptions_find;
|
|
4240
|
+
return selectedValue ? (_allOptions_find = allOptions.find(function(item) {
|
|
4224
4241
|
return item.value === selectedValue;
|
|
4225
|
-
})) === null ||
|
|
4242
|
+
})) === null || _allOptions_find === void 0 ? void 0 : _allOptions_find.label : selectPlaceholder;
|
|
4226
4243
|
}, [
|
|
4227
4244
|
selectedValue,
|
|
4228
|
-
|
|
4245
|
+
allOptions,
|
|
4229
4246
|
selectPlaceholder
|
|
4230
4247
|
]);
|
|
4231
4248
|
return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", {
|
|
@@ -4236,7 +4253,10 @@ function SearchSelect(param) {
|
|
|
4236
4253
|
children: [
|
|
4237
4254
|
/* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(Popover, {
|
|
4238
4255
|
open: open,
|
|
4239
|
-
onOpenChange:
|
|
4256
|
+
onOpenChange: function(isOpen) {
|
|
4257
|
+
setOpen(isOpen);
|
|
4258
|
+
if (!isOpen) setSearchQuery("");
|
|
4259
|
+
},
|
|
4240
4260
|
children: [
|
|
4241
4261
|
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(PopoverTrigger, {
|
|
4242
4262
|
asChild: true,
|
|
@@ -4270,37 +4290,57 @@ function SearchSelect(param) {
|
|
|
4270
4290
|
direction: direction
|
|
4271
4291
|
},
|
|
4272
4292
|
className: cn(searchClassName),
|
|
4273
|
-
placeholder: searchPlaceholder
|
|
4293
|
+
placeholder: searchPlaceholder,
|
|
4294
|
+
value: searchQuery,
|
|
4295
|
+
onValueChange: function(val) {
|
|
4296
|
+
return setSearchQuery(val);
|
|
4297
|
+
}
|
|
4274
4298
|
}),
|
|
4275
|
-
/* @__PURE__ */ (0, import_jsx_runtime16.
|
|
4276
|
-
children:
|
|
4277
|
-
|
|
4278
|
-
|
|
4279
|
-
|
|
4280
|
-
|
|
4281
|
-
|
|
4282
|
-
|
|
4283
|
-
|
|
4284
|
-
|
|
4285
|
-
|
|
4286
|
-
|
|
4287
|
-
|
|
4288
|
-
|
|
4289
|
-
|
|
4290
|
-
|
|
4291
|
-
|
|
4292
|
-
|
|
4293
|
-
|
|
4294
|
-
|
|
4295
|
-
|
|
4296
|
-
|
|
4297
|
-
|
|
4298
|
-
|
|
4299
|
-
|
|
4300
|
-
|
|
4301
|
-
|
|
4299
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(CommandList, {
|
|
4300
|
+
children: filteredOptions.length === 0 && searchQuery ? createNewOptionLabel ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(CommandItem, {
|
|
4301
|
+
onSelect: function() {
|
|
4302
|
+
var newOption = {
|
|
4303
|
+
value: searchQuery,
|
|
4304
|
+
label: searchQuery
|
|
4305
|
+
};
|
|
4306
|
+
setNewOptions(function(prev) {
|
|
4307
|
+
return _to_consumable_array(prev).concat([
|
|
4308
|
+
newOption
|
|
4309
|
+
]);
|
|
4310
|
+
});
|
|
4311
|
+
setSelectedValue(newOption.value);
|
|
4312
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(newOption.value);
|
|
4313
|
+
setOpen(false);
|
|
4314
|
+
setSearchQuery("");
|
|
4315
|
+
},
|
|
4316
|
+
className: "hover:bg-[#cccbcb] cursor-pointer",
|
|
4317
|
+
children: "".concat(createNewOptionLabel, ": ").concat(searchQuery)
|
|
4318
|
+
}) : /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(CommandEmpty, {
|
|
4319
|
+
className: cn("w-full py-2 text-center", notFoundLabelClassName),
|
|
4320
|
+
children: notFoundLabel
|
|
4321
|
+
}) : /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(CommandGroup, {
|
|
4322
|
+
className: cn("max-h-52 overflow-y-auto", dropdownClassName),
|
|
4323
|
+
children: filteredOptions.map(function(option) {
|
|
4324
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(CommandItem, {
|
|
4325
|
+
className: cn("hover:bg-[#cccbcb] cursor-pointer", dropdownOptionClassName, selectedValue === option.value && "bg-[#cccbcb]"),
|
|
4326
|
+
value: JSON.stringify(option),
|
|
4327
|
+
onSelect: function(currentValue) {
|
|
4328
|
+
var parsedValue = JSON.parse(currentValue);
|
|
4329
|
+
setSelectedValue(parsedValue.value);
|
|
4330
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(parsedValue.value);
|
|
4331
|
+
setOpen(false);
|
|
4332
|
+
setSearchQuery("");
|
|
4333
|
+
},
|
|
4334
|
+
children: [
|
|
4335
|
+
option.label,
|
|
4336
|
+
selectedValue === option.value && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_lucide_react4.CheckIcon, {
|
|
4337
|
+
size: 16,
|
|
4338
|
+
className: "ml-auto"
|
|
4339
|
+
})
|
|
4340
|
+
]
|
|
4341
|
+
}, option.value);
|
|
4302
4342
|
})
|
|
4303
|
-
|
|
4343
|
+
})
|
|
4304
4344
|
})
|
|
4305
4345
|
]
|
|
4306
4346
|
})
|
|
@@ -5144,7 +5184,7 @@ function MultiSelect(param) {
|
|
|
5144
5184
|
});
|
|
5145
5185
|
}
|
|
5146
5186
|
var SelectWithSearch = function(param) {
|
|
5147
|
-
var options = param.options, labelClassName = param.labelClassName, labelContent = param.labelContent, name = param.name, onChange = param.onChange, value = param.value, placeholder = param.placeholder, required = param.required, defaultValue = param.defaultValue, notFoundLabel = param.notFoundLabel, searchPlaceholder = param.searchPlaceholder, containerClassName = param.containerClassName, dropdownClassName = param.dropdownClassName, dropdownOptionClassName = param.dropdownOptionClassName, elementClassName = param.elementClassName, notFoundLabelClassName = param.notFoundLabelClassName, searchClassName = param.searchClassName, selectButtonClassName = param.selectButtonClassName, _param_sortDirection = param.sortDirection, sortDirection = _param_sortDirection === void 0 ? "abc" : _param_sortDirection, sortAsNumber = param.sortAsNumber, disabled = param.disabled, direction = param.direction;
|
|
5187
|
+
var options = param.options, labelClassName = param.labelClassName, labelContent = param.labelContent, name = param.name, onChange = param.onChange, value = param.value, placeholder = param.placeholder, required = param.required, defaultValue = param.defaultValue, notFoundLabel = param.notFoundLabel, searchPlaceholder = param.searchPlaceholder, containerClassName = param.containerClassName, dropdownClassName = param.dropdownClassName, dropdownOptionClassName = param.dropdownOptionClassName, elementClassName = param.elementClassName, notFoundLabelClassName = param.notFoundLabelClassName, searchClassName = param.searchClassName, selectButtonClassName = param.selectButtonClassName, _param_sortDirection = param.sortDirection, sortDirection = _param_sortDirection === void 0 ? "abc" : _param_sortDirection, sortAsNumber = param.sortAsNumber, disabled = param.disabled, direction = param.direction, createNewOptionLabel = param.createNewOptionLabel;
|
|
5148
5188
|
var sortOptions = useSortValues(options, sortDirection, sortAsNumber);
|
|
5149
5189
|
return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", {
|
|
5150
5190
|
className: cn("flex justify-between items-center w-full", containerClassName),
|
|
@@ -5158,6 +5198,7 @@ var SelectWithSearch = function(param) {
|
|
|
5158
5198
|
}),
|
|
5159
5199
|
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)(SearchSelect, {
|
|
5160
5200
|
direction: direction,
|
|
5201
|
+
createNewOptionLabel: createNewOptionLabel,
|
|
5161
5202
|
options: sortOptions,
|
|
5162
5203
|
value: value,
|
|
5163
5204
|
onChange: onChange,
|