@ansible/ansible-ui-framework 0.0.374 → 0.0.376
Sign up to get free protection for your applications and to get access to all the features.
- package/cjs/BulkActionDialog.d.ts +1 -1
- package/cjs/BulkActionDialog.js +2 -2
- package/cjs/BulkConfirmationDialog.d.ts +1 -1
- package/cjs/BulkConfirmationDialog.js +2 -2
- package/cjs/{cells → PageCells}/BytesCell.d.ts +0 -0
- package/cjs/{cells → PageCells}/BytesCell.js +0 -0
- package/cjs/{cells → PageCells}/CapacityCell.d.ts +0 -0
- package/cjs/{cells → PageCells}/CapacityCell.js +0 -0
- package/cjs/{cells → PageCells}/CopyCell.d.ts +0 -0
- package/cjs/{cells → PageCells}/CopyCell.js +0 -0
- package/cjs/{cells → PageCells}/DateTimeCell.d.ts +0 -0
- package/cjs/{cells → PageCells}/DateTimeCell.js +0 -0
- package/cjs/{cells → PageCells}/ElapsedTimeCell.d.ts +0 -0
- package/cjs/{cells → PageCells}/ElapsedTimeCell.js +0 -0
- package/cjs/{cells → PageCells}/LabelsCell.d.ts +0 -0
- package/cjs/{cells → PageCells}/LabelsCell.js +0 -0
- package/cjs/{cells → PageCells}/TextCell.d.ts +0 -0
- package/cjs/{cells → PageCells}/TextCell.js +0 -0
- package/cjs/PageColumnModal.d.ts +1 -1
- package/cjs/PageDataList.d.ts +1 -1
- package/cjs/PageDataList.js +1 -1
- package/cjs/{PageForm.d.ts → PageForm/PageForm.d.ts} +1 -1
- package/cjs/{PageForm.js → PageForm/PageForm.js} +11 -16
- package/cjs/PageForm/PageFormSelectOption.d.ts +9 -0
- package/cjs/PageForm/PageFormSelectOption.js +29 -0
- package/cjs/{PagePagination.d.ts → PageTable/PagePagination.d.ts} +0 -0
- package/cjs/{PagePagination.js → PageTable/PagePagination.js} +2 -2
- package/cjs/{PageTable.d.ts → PageTable/PageTable.d.ts} +2 -2
- package/cjs/{PageTable.js → PageTable/PageTable.js} +12 -12
- package/cjs/{PageTableCard.d.ts → PageTable/PageTableCard.d.ts} +2 -2
- package/cjs/{PageTableCard.js → PageTable/PageTableCard.js} +3 -3
- package/cjs/{PageTableCards.d.ts → PageTable/PageTableCards.d.ts} +0 -0
- package/cjs/{PageTableCards.js → PageTable/PageTableCards.js} +1 -1
- package/cjs/{PageTableDetails.d.ts → PageTable/PageTableDetails.d.ts} +0 -0
- package/cjs/{PageTableDetails.js → PageTable/PageTableDetails.js} +1 -1
- package/cjs/{PageTableList.d.ts → PageTable/PageTableList.d.ts} +1 -1
- package/cjs/{PageTableList.js → PageTable/PageTableList.js} +2 -2
- package/cjs/{PageTableViewType.d.ts → PageTable/PageTableViewType.d.ts} +0 -0
- package/cjs/{PageTableViewType.js → PageTable/PageTableViewType.js} +0 -0
- package/cjs/{PageToolbar.d.ts → PageTable/PageToolbar.d.ts} +1 -1
- package/cjs/{PageToolbar.js → PageTable/PageToolbar.js} +8 -8
- package/cjs/{useTableItems.d.ts → PageTable/useTableItems.d.ts} +0 -0
- package/cjs/{useTableItems.js → PageTable/useTableItems.js} +0 -0
- package/cjs/Settings.js +6 -6
- package/cjs/components/PageFormGroup.d.ts +11 -0
- package/cjs/components/PageFormGroup.js +27 -0
- package/cjs/components/PageSelect.d.ts +16 -0
- package/cjs/components/PageSelect.js +54 -0
- package/cjs/components/PageSelectOption.d.ts +14 -0
- package/cjs/components/PageSelectOption.js +56 -0
- package/cjs/components/useOpen.d.ts +1 -1
- package/cjs/components/useOpen.js +5 -5
- package/cjs/index.d.ts +16 -13
- package/cjs/index.js +16 -13
- package/cjs/useInMemoryView.d.ts +3 -3
- package/cjs/useInMemoryView.js +1 -1
- package/cjs/useSelectDialog.d.ts +3 -3
- package/cjs/useSelectDialog.js +1 -1
- package/cjs/useSelectMultipleDialog.d.ts +3 -3
- package/cjs/useSelectMultipleDialog.js +1 -1
- package/package.json +1 -1
- package/cjs/components/SingleSelect.d.ts +0 -18
- package/cjs/components/SingleSelect.js +0 -70
@@ -1,5 +1,5 @@
|
|
1
1
|
/// <reference types="react" />
|
2
|
-
import { ITableColumn } from './PageTable';
|
2
|
+
import { ITableColumn } from './PageTable/PageTable';
|
3
3
|
export interface BulkActionDialogProps<T extends object> {
|
4
4
|
/** The title of the model.
|
5
5
|
* @link https://www.patternfly.org/v4/components/modal/design-guidelines#confirmation-dialogs
|
package/cjs/BulkActionDialog.js
CHANGED
@@ -94,9 +94,9 @@ var p_limit_1 = __importDefault(require("p-limit"));
|
|
94
94
|
var react_1 = require("react");
|
95
95
|
var pfcolors_1 = require("./components/pfcolors");
|
96
96
|
var PageDialog_1 = require("./PageDialog");
|
97
|
-
var PageTable_1 = require("./PageTable");
|
97
|
+
var PageTable_1 = require("./PageTable/PageTable");
|
98
|
+
var useTableItems_1 = require("./PageTable/useTableItems");
|
98
99
|
var useFrameworkTranslations_1 = require("./useFrameworkTranslations");
|
99
|
-
var useTableItems_1 = require("./useTableItems");
|
100
100
|
/**
|
101
101
|
* BulkActionDialog is a generic dialog for process bulk actions.
|
102
102
|
*
|
@@ -1,6 +1,6 @@
|
|
1
1
|
/// <reference types="react" />
|
2
2
|
import { BulkActionDialogProps } from './BulkActionDialog';
|
3
|
-
import { ITableColumn } from './PageTable';
|
3
|
+
import { ITableColumn } from './PageTable/PageTable';
|
4
4
|
export interface BulkConfirmationDialog<T extends object> {
|
5
5
|
/** The title of the model.
|
6
6
|
* @link https://www.patternfly.org/v4/components/modal/design-guidelines#confirmation-dialogs
|
@@ -33,9 +33,9 @@ var react_core_1 = require("@patternfly/react-core");
|
|
33
33
|
var react_1 = require("react");
|
34
34
|
var BulkActionDialog_1 = require("./BulkActionDialog");
|
35
35
|
var PageDialog_1 = require("./PageDialog");
|
36
|
-
var PageTable_1 = require("./PageTable");
|
36
|
+
var PageTable_1 = require("./PageTable/PageTable");
|
37
|
+
var useTableItems_1 = require("./PageTable/useTableItems");
|
37
38
|
var useFrameworkTranslations_1 = require("./useFrameworkTranslations");
|
38
|
-
var useTableItems_1 = require("./useTableItems");
|
39
39
|
function BulkConfirmationDialog(props) {
|
40
40
|
var title = props.title, items = props.items, keyFn = props.keyFn, confirmationColumns = props.confirmationColumns, onConfirm = props.onConfirm, onClose = props.onClose, confirmText = props.confirmText, actionButtonText = props.actionButtonText, isDanger = props.isDanger;
|
41
41
|
var _a = __read((0, PageDialog_1.usePageDialog)(), 2), _ = _a[0], setDialog = _a[1];
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
package/cjs/PageColumnModal.d.ts
CHANGED
@@ -1,5 +1,5 @@
|
|
1
1
|
/// <reference types="react" />
|
2
|
-
import { ITableColumn } from './PageTable';
|
2
|
+
import { ITableColumn } from './PageTable/PageTable';
|
3
3
|
export declare function useColumnModal<T extends object>(columns: ITableColumn<T>[], t?: (t: string) => string): {
|
4
4
|
openColumnModal: () => void;
|
5
5
|
columnModal: JSX.Element;
|
package/cjs/PageDataList.d.ts
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
import { Dispatch, ReactNode, SetStateAction } from 'react';
|
2
2
|
import { IPageAction } from './PageActions/PageAction';
|
3
3
|
import { PageHeaderProps } from './PageHeader';
|
4
|
-
import { IToolbarFilter } from './PageToolbar';
|
4
|
+
import { IToolbarFilter } from './PageTable/PageToolbar';
|
5
5
|
export type DataListPageProps<T extends object> = PageHeaderProps & PageDataListProps<T> & {
|
6
6
|
error?: Error;
|
7
7
|
};
|
package/cjs/PageDataList.js
CHANGED
@@ -22,7 +22,7 @@ var PageActionType_1 = require("./PageActions/PageActionType");
|
|
22
22
|
var PageBody_1 = require("./PageBody");
|
23
23
|
var PageHeader_1 = require("./PageHeader");
|
24
24
|
var PageLayout_1 = require("./PageLayout");
|
25
|
-
var PagePagination_1 = require("./PagePagination");
|
25
|
+
var PagePagination_1 = require("./PageTable/PagePagination");
|
26
26
|
var Settings_1 = require("./Settings");
|
27
27
|
function DataListPage(props) {
|
28
28
|
return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)(PageLayout_1.PageLayout, { children: [(0, jsx_runtime_1.jsx)(PageHeader_1.PageHeader, __assign({}, props)), (0, jsx_runtime_1.jsx)(PageBody_1.PageBody, { children: (0, jsx_runtime_1.jsx)(PageDataList, __assign({}, props)) })] }) }));
|
@@ -2,7 +2,7 @@ import { JSONSchema6 } from 'json-schema';
|
|
2
2
|
import { CSSProperties, ReactNode } from 'react';
|
3
3
|
import { DeepPartial, ErrorOption, FieldPath, FieldValues, SubmitHandler, UseFormReturn } from 'react-hook-form';
|
4
4
|
import { PartialDeep } from 'type-fest';
|
5
|
-
import { PageHeaderProps } from '
|
5
|
+
import { PageHeaderProps } from '../PageHeader';
|
6
6
|
export type FormPageProps<T extends object> = PageHeaderProps & {
|
7
7
|
children?: ReactNode;
|
8
8
|
defaultValues?: PartialDeep<T>;
|
@@ -38,10 +38,11 @@ var react_icons_1 = require("@patternfly/react-icons");
|
|
38
38
|
var fast_deep_equal_1 = __importDefault(require("fast-deep-equal"));
|
39
39
|
var react_1 = require("react");
|
40
40
|
var react_hook_form_1 = require("react-hook-form");
|
41
|
-
var Scrollable_1 = require("
|
42
|
-
var useBreakPoint_1 = require("
|
43
|
-
var PageHeader_1 = require("
|
44
|
-
var Settings_1 = require("
|
41
|
+
var Scrollable_1 = require("../components/Scrollable");
|
42
|
+
var useBreakPoint_1 = require("../components/useBreakPoint");
|
43
|
+
var PageHeader_1 = require("../PageHeader");
|
44
|
+
var Settings_1 = require("../Settings");
|
45
|
+
var PageFormSelectOption_1 = require("./PageFormSelectOption");
|
45
46
|
function FormPage(props) {
|
46
47
|
// const methods = useForm<PartialDeep<T>>({
|
47
48
|
// defaultValues: props.defaultValues,
|
@@ -110,9 +111,7 @@ function FormTextInput(props) {
|
|
110
111
|
var _c = __read((0, react_1.useState)(false), 2), showSecret = _c[0], setShowSecret = _c[1];
|
111
112
|
return ((0, jsx_runtime_1.jsx)(react_core_1.FormGroup, __assign({ id: "".concat(id, "-form-group"), fieldId: id, label: props.label, helperText: props.helperText, isRequired: props.required, validated: (error === null || error === void 0 ? void 0 : error.message) ? 'error' : undefined, helperTextInvalid: error === null || error === void 0 ? void 0 : error.message }, { children: (0, jsx_runtime_1.jsxs)(react_core_1.InputGroup, { children: [(0, jsx_runtime_1.jsx)(react_core_1.TextInput, __assign({ id: id, type: props.secret && !showSecret ? 'password' : 'text', "aria-describedby": "".concat(id, "-form-group"), isRequired: props.required, validated: (error === null || error === void 0 ? void 0 : error.message) ? 'error' : undefined, autoFocus: props.autoFocus, placeholder: props.placeholder }, registration, { onChange: function (v, e) {
|
112
113
|
void registration.onChange(e);
|
113
|
-
},
|
114
|
-
// innerRef={registration.ref}
|
115
|
-
isReadOnly: isSubmitting })), props.secret && ((0, jsx_runtime_1.jsx)(react_core_1.Button, __assign({ variant: "control", onClick: function () { return setShowSecret(!showSecret); }, "aria-label": "Options menu", isDisabled: isSubmitting }, { children: showSecret ? (0, jsx_runtime_1.jsx)(react_icons_1.EyeIcon, {}) : (0, jsx_runtime_1.jsx)(react_icons_1.EyeSlashIcon, {}) })))] }) })));
|
114
|
+
}, isReadOnly: isSubmitting })), props.secret && ((0, jsx_runtime_1.jsx)(react_core_1.Button, __assign({ variant: "control", onClick: function () { return setShowSecret(!showSecret); }, "aria-label": "Options menu", isDisabled: isSubmitting }, { children: showSecret ? (0, jsx_runtime_1.jsx)(react_icons_1.EyeIcon, {}) : (0, jsx_runtime_1.jsx)(react_icons_1.EyeSlashIcon, {}) })))] }) })));
|
116
115
|
}
|
117
116
|
exports.FormTextInput = FormTextInput;
|
118
117
|
function FormTextArea(props) {
|
@@ -204,7 +203,7 @@ function FormSelect(props) {
|
|
204
203
|
setOpen(false);
|
205
204
|
}, [field, options]);
|
206
205
|
var index = 0;
|
207
|
-
return ((0, jsx_runtime_1.jsx)(react_core_1.FormGroup, __assign({ id: "".concat(id, "-form-group"), fieldId: id, label: props.label, helperTextInvalid: error, helperText: props.help, isRequired: props.required, validated: error ? 'error' : undefined }, { children: (0, jsx_runtime_1.jsx)(react_core_1.Select, __assign({ id: id, variant: react_core_1.SelectVariant.single, "aria-describedby": "".concat(id, "-helper"), validated: error ? 'error' : undefined }, field, { isOpen: open, onToggle: function () { return setOpen(!open); }, selections: selectedIndex === -1 ? '' : selectedIndex.toString(), onSelect: onSelect, isCreatable: props.create, isInputFilterPersisted: props.create, placeholderText: props.placeholder, isGrouped: isGrouped, footer: ((_b = props.footer) === null || _b === void 0 ? void 0 : _b.label) && ((0, jsx_runtime_1.jsx)(react_core_1.Button, __assign({ variant: "link", isInline: true, onClick: function () {
|
206
|
+
return ((0, jsx_runtime_1.jsx)(react_core_1.FormGroup, __assign({ id: "".concat(id, "-form-group"), fieldId: id, label: props.label, helperTextInvalid: error, helperText: props.help, isRequired: props.required, validated: error ? 'error' : undefined }, { children: (0, jsx_runtime_1.jsx)(react_core_1.Select, __assign({ id: id, variant: react_core_1.SelectVariant.single, "aria-describedby": "".concat(id, "-helper"), validated: error ? 'error' : undefined }, field, { isOpen: open, onToggle: function () { return setOpen(!open); }, selections: selectedIndex === -1 ? '' : selectedIndex.toString(), onSelect: onSelect, isCreatable: props.create, isInputFilterPersisted: props.create, placeholderText: props.placeholder, isGrouped: isGrouped, ref: field.ref, footer: ((_b = props.footer) === null || _b === void 0 ? void 0 : _b.label) && ((0, jsx_runtime_1.jsx)(react_core_1.Button, __assign({ variant: "link", isInline: true, onClick: function () {
|
208
207
|
var _a, _b;
|
209
208
|
setOpen(false);
|
210
209
|
(_b = (_a = props.footer) === null || _a === void 0 ? void 0 : _a.click) === null || _b === void 0 ? void 0 : _b.call(_a);
|
@@ -282,7 +281,7 @@ function FormSchema(props) {
|
|
282
281
|
case 'select': {
|
283
282
|
if ('options' in property) {
|
284
283
|
var formSelectProps = property;
|
285
|
-
p.push((0, jsx_runtime_1.jsx)(
|
284
|
+
p.push((0, jsx_runtime_1.jsx)(PageFormSelectOption_1.PageFormSelectOption, { name: base + propertyName, label: title, placeholder: placeholder, isRequired: required, options: formSelectProps.options, footer: formSelectProps.footer }, base + propertyName));
|
286
285
|
}
|
287
286
|
else {
|
288
287
|
p.push((0, jsx_runtime_1.jsx)(FormTextSelect, { name: base + propertyName, label: title, placeholder: placeholder, required: required, selectTitle: property.selectTitle, selectValue: property.selectValue, selectOpen: property.selectOpen }, base + propertyName));
|
@@ -353,14 +352,10 @@ function PageForm(props) {
|
|
353
352
|
flexGrow: 1,
|
354
353
|
overflow: props.disableScrolling ? undefined : 'hidden',
|
355
354
|
gap: 0,
|
356
|
-
} }, { children: [props.disableScrolling ? ((0, jsx_runtime_1.jsx)(react_core_1.
|
357
|
-
// padding={{ default: props.onCancel ? 'padding' : 'noPadding' }}
|
358
|
-
variant: "light", style: { maxWidth: maxWidth } }, { children: (0, jsx_runtime_1.jsxs)(react_core_1.Grid, __assign({ hasGutter: true, span: 12, sm: sm, md: md, lg: lg, xl: xl, xl2: xl2 }, { children: [props.schema && (0, jsx_runtime_1.jsx)(FormSchema, { schema: props.schema }), props.children] })) }))) : ((0, jsx_runtime_1.jsx)(Scrollable_1.Scrollable, __assign({ style: { height: '100%', flexGrow: 1 } }, { children: (0, jsx_runtime_1.jsx)(react_core_1.PageSection, __assign({ isFilled: true,
|
359
|
-
// padding={{ default: props.onCancel ? 'padding' : 'noPadding' }}
|
360
|
-
variant: "light", style: { maxWidth: maxWidth } }, { children: (0, jsx_runtime_1.jsxs)(react_core_1.Grid, __assign({ hasGutter: true, span: 12, sm: sm, md: md, lg: lg, xl: xl, xl2: xl2 }, { children: [props.schema && (0, jsx_runtime_1.jsx)(FormSchema, { schema: props.schema }), props.children] })) })) }))), error && ((0, jsx_runtime_1.jsx)(react_core_1.Alert, { variant: "danger", title: error !== null && error !== void 0 ? error : '', isInline: true, style: { paddingLeft: isMd && props.onCancel ? 190 : undefined } })), props.onCancel ? ((0, jsx_runtime_1.jsx)(react_core_1.PageSection, __assign({ isFilled: false, style: {
|
361
|
-
borderTop: 'thin solid var(--pf-global--BorderColor--100)',
|
355
|
+
} }, { children: [props.disableScrolling ? ((0, jsx_runtime_1.jsx)("div", __assign({ style: { maxWidth: maxWidth, padding: 24 } }, { children: (0, jsx_runtime_1.jsxs)(react_core_1.Grid, __assign({ hasGutter: true, span: 12, sm: sm, md: md, lg: lg, xl: xl, xl2: xl2 }, { children: [props.schema && (0, jsx_runtime_1.jsx)(FormSchema, { schema: props.schema }), props.children] })) }))) : ((0, jsx_runtime_1.jsx)(Scrollable_1.Scrollable, __assign({ style: { height: '100%', flexGrow: 1 } }, { children: (0, jsx_runtime_1.jsx)("div", __assign({ style: { maxWidth: maxWidth, padding: 24 } }, { children: (0, jsx_runtime_1.jsxs)(react_core_1.Grid, __assign({ hasGutter: true, span: 12, sm: sm, md: md, lg: lg, xl: xl, xl2: xl2 }, { children: [props.schema && (0, jsx_runtime_1.jsx)(FormSchema, { schema: props.schema }), props.children] })) })) }))), error && ((0, jsx_runtime_1.jsx)(react_core_1.Alert, { variant: "danger", title: error !== null && error !== void 0 ? error : '', isInline: true, style: { paddingLeft: isMd && props.onCancel ? 190 : undefined } })), props.onCancel ? ((0, jsx_runtime_1.jsx)("div", __assign({ style: {
|
362
356
|
backgroundColor: settings.theme === 'dark' ? 'var(--pf-global--BackgroundColor--400)' : undefined,
|
363
|
-
|
357
|
+
padding: 24,
|
358
|
+
} }, { children: (0, jsx_runtime_1.jsxs)(react_core_1.ActionGroup, __assign({ style: { marginTop: 0 } }, { children: [(0, jsx_runtime_1.jsx)(PageFormSubmitButton, { children: props.submitText }), props.onCancel && ((0, jsx_runtime_1.jsx)(PageFormCancelButton, __assign({ onCancel: props.onCancel }, { children: props.cancelText })))] })) }))) : ((0, jsx_runtime_1.jsx)(PageFormSubmitButton, __assign({ style: { marginTop: 48 } }, { children: props.submitText })))] })) }))
|
364
359
|
// </PageBody>
|
365
360
|
);
|
366
361
|
}
|
@@ -0,0 +1,9 @@
|
|
1
|
+
/// <reference types="react" />
|
2
|
+
import { PageSelectOptionProps } from '../components/PageSelectOption';
|
3
|
+
export type PageFormSelectOption<T> = {
|
4
|
+
name: string;
|
5
|
+
} & Omit<PageSelectOptionProps<T>, 'onSelect' | 'value'>;
|
6
|
+
/**
|
7
|
+
* A PageSelectOption for use in PageForms
|
8
|
+
*/
|
9
|
+
export declare function PageFormSelectOption<T>(props: PageFormSelectOption<T>): JSX.Element;
|
@@ -0,0 +1,29 @@
|
|
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
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
14
|
+
exports.PageFormSelectOption = void 0;
|
15
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
16
|
+
var react_hook_form_1 = require("react-hook-form");
|
17
|
+
var PageSelectOption_1 = require("../components/PageSelectOption");
|
18
|
+
/**
|
19
|
+
* A PageSelectOption for use in PageForms
|
20
|
+
*/
|
21
|
+
function PageFormSelectOption(props) {
|
22
|
+
var _a = (0, react_hook_form_1.useFormContext)(), control = _a.control, isSubmitting = _a.formState.isSubmitting;
|
23
|
+
var name = props.name;
|
24
|
+
return ((0, jsx_runtime_1.jsx)(react_hook_form_1.Controller, { name: name, control: control, render: function (_a) {
|
25
|
+
var _b = _a.field, onChange = _b.onChange, value = _b.value, error = _a.fieldState.error;
|
26
|
+
return ((0, jsx_runtime_1.jsx)(PageSelectOption_1.PageSelectOption, __assign({}, props, { value: value, onSelect: onChange, helperTextInvalid: error === null || error === void 0 ? void 0 : error.message, readOnly: isSubmitting })));
|
27
|
+
} }));
|
28
|
+
}
|
29
|
+
exports.PageFormSelectOption = PageFormSelectOption;
|
File without changes
|
@@ -15,8 +15,8 @@ exports.PagePagination = void 0;
|
|
15
15
|
var jsx_runtime_1 = require("react/jsx-runtime");
|
16
16
|
var react_core_1 = require("@patternfly/react-core");
|
17
17
|
var react_1 = require("react");
|
18
|
-
var useBreakPoint_1 = require("
|
19
|
-
var Settings_1 = require("
|
18
|
+
var useBreakPoint_1 = require("../components/useBreakPoint");
|
19
|
+
var Settings_1 = require("../Settings");
|
20
20
|
function PagePagination(props) {
|
21
21
|
var setPage = props.setPage, setPerPage = props.setPerPage;
|
22
22
|
var onSetPage = (0, react_1.useCallback)(function (_event, page) { return setPage(page); }, [setPage]);
|
@@ -1,6 +1,6 @@
|
|
1
1
|
import { Dispatch, ReactNode, SetStateAction } from 'react';
|
2
|
-
import { IPageAction } from '
|
3
|
-
import { PageHeaderProps } from '
|
2
|
+
import { IPageAction } from '../PageActions/PageAction';
|
3
|
+
import { PageHeaderProps } from '../PageHeader';
|
4
4
|
import { PageTableViewType } from './PageTableViewType';
|
5
5
|
import { IToolbarFilter } from './PageToolbar';
|
6
6
|
export type TablePageProps<T extends object> = PageHeaderProps & PageTableProps<T> & {
|
@@ -37,23 +37,23 @@ var react_icons_1 = require("@patternfly/react-icons");
|
|
37
37
|
var react_table_1 = require("@patternfly/react-table");
|
38
38
|
var resize_observer_1 = __importDefault(require("@react-hook/resize-observer"));
|
39
39
|
var react_1 = require("react");
|
40
|
-
var
|
41
|
-
var
|
42
|
-
var
|
43
|
-
var
|
44
|
-
var
|
45
|
-
var
|
46
|
-
var
|
47
|
-
var
|
48
|
-
var PageColumnModal_1 = require("
|
49
|
-
var PageHeader_1 = require("
|
50
|
-
var PageLayout_1 = require("
|
40
|
+
var Scrollable_1 = require("../components/Scrollable");
|
41
|
+
var useBreakPoint_1 = require("../components/useBreakPoint");
|
42
|
+
var PageActions_1 = require("../PageActions/PageActions");
|
43
|
+
var PageActionType_1 = require("../PageActions/PageActionType");
|
44
|
+
var PageBody_1 = require("../PageBody");
|
45
|
+
var DateTimeCell_1 = require("../PageCells/DateTimeCell");
|
46
|
+
var LabelsCell_1 = require("../PageCells/LabelsCell");
|
47
|
+
var TextCell_1 = require("../PageCells/TextCell");
|
48
|
+
var PageColumnModal_1 = require("../PageColumnModal");
|
49
|
+
var PageHeader_1 = require("../PageHeader");
|
50
|
+
var PageLayout_1 = require("../PageLayout");
|
51
|
+
var Settings_1 = require("../Settings");
|
51
52
|
var PagePagination_1 = require("./PagePagination");
|
52
53
|
var PageTableCards_1 = require("./PageTableCards");
|
53
54
|
var PageTableList_1 = require("./PageTableList");
|
54
55
|
var PageTableViewType_1 = require("./PageTableViewType");
|
55
56
|
var PageToolbar_1 = require("./PageToolbar");
|
56
|
-
var Settings_1 = require("./Settings");
|
57
57
|
function TablePage(props) {
|
58
58
|
return ((0, jsx_runtime_1.jsxs)(PageLayout_1.PageLayout, { children: [(0, jsx_runtime_1.jsx)(PageHeader_1.PageHeader, __assign({}, props)), (0, jsx_runtime_1.jsx)(PageTable, __assign({}, props))] }));
|
59
59
|
}
|
@@ -1,6 +1,6 @@
|
|
1
1
|
import { ReactNode } from 'react';
|
2
|
-
import { LabelColor } from '
|
3
|
-
import { IPageAction } from '
|
2
|
+
import { LabelColor } from '../components/pfcolors';
|
3
|
+
import { IPageAction } from '../PageActions/PageAction';
|
4
4
|
import { ITableColumn } from './PageTable';
|
5
5
|
export interface IPageTableCard {
|
6
6
|
id: string | number;
|
@@ -28,9 +28,9 @@ var jsx_runtime_1 = require("react/jsx-runtime");
|
|
28
28
|
/* eslint-disable @typescript-eslint/no-empty-function */
|
29
29
|
var react_core_1 = require("@patternfly/react-core");
|
30
30
|
var react_1 = require("react");
|
31
|
-
var Details_1 = require("
|
32
|
-
var IconWrapper_1 = require("
|
33
|
-
var PageActions_1 = require("
|
31
|
+
var Details_1 = require("../components/Details");
|
32
|
+
var IconWrapper_1 = require("../components/IconWrapper");
|
33
|
+
var PageActions_1 = require("../PageActions/PageActions");
|
34
34
|
var PageTable_1 = require("./PageTable");
|
35
35
|
function PageTableCard(props) {
|
36
36
|
var _a;
|
File without changes
|
@@ -15,7 +15,7 @@ exports.PageTableCards = void 0;
|
|
15
15
|
var jsx_runtime_1 = require("react/jsx-runtime");
|
16
16
|
var react_core_1 = require("@patternfly/react-core");
|
17
17
|
var react_1 = require("react");
|
18
|
-
var Grid_1 = require("
|
18
|
+
var Grid_1 = require("../components/Grid");
|
19
19
|
var PageTableCard_1 = require("./PageTableCard");
|
20
20
|
function PageTableCards(props) {
|
21
21
|
var keyFn = props.keyFn, items = props.pageItems, tableColumns = props.tableColumns, isSelected = props.isSelected, selectItem = props.selectItem, unselectItem = props.unselectItem, rowActions = props.rowActions, showSelect = props.showSelect, defaultCardSubtitle = props.defaultSubtitle;
|
File without changes
|
@@ -15,7 +15,7 @@ exports.TableDetails = void 0;
|
|
15
15
|
var jsx_runtime_1 = require("react/jsx-runtime");
|
16
16
|
/* eslint-disable @typescript-eslint/no-non-null-assertion */
|
17
17
|
/* eslint-disable @typescript-eslint/no-empty-function */
|
18
|
-
var Details_1 = require("
|
18
|
+
var Details_1 = require("../components/Details");
|
19
19
|
var PageTable_1 = require("./PageTable");
|
20
20
|
function TableDetails(props) {
|
21
21
|
var item = props.item, columns = props.columns;
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import { ReactNode } from 'react';
|
2
|
-
import { IPageAction } from '
|
2
|
+
import { IPageAction } from '../PageActions/PageAction';
|
3
3
|
import { ITableColumn, PageTableProps } from './PageTable';
|
4
4
|
export type PageTableListProps<T extends object> = PageTableProps<T>;
|
5
5
|
export declare function PageTableList<T extends object>(props: PageTableListProps<T>): JSX.Element;
|
@@ -26,8 +26,8 @@ exports.useColumnsToDataList = exports.PageTableList = void 0;
|
|
26
26
|
var jsx_runtime_1 = require("react/jsx-runtime");
|
27
27
|
var react_core_1 = require("@patternfly/react-core");
|
28
28
|
var react_1 = require("react");
|
29
|
-
var IconWrapper_1 = require("
|
30
|
-
var PageActions_1 = require("
|
29
|
+
var IconWrapper_1 = require("../components/IconWrapper");
|
30
|
+
var PageActions_1 = require("../PageActions/PageActions");
|
31
31
|
var PageTable_1 = require("./PageTable");
|
32
32
|
function PageTableList(props) {
|
33
33
|
var keyFn = props.keyFn, pageItems = props.pageItems, tableColumns = props.tableColumns, isSelected = props.isSelected, selectItem = props.selectItem, unselectItem = props.unselectItem, rowActions = props.rowActions, defaultCardSubtitle = props.defaultSubtitle, showSelect = props.showSelect;
|
File without changes
|
File without changes
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import { Dispatch, SetStateAction } from 'react';
|
2
|
-
import { IPageAction } from '
|
2
|
+
import { IPageAction } from '../PageActions/PageAction';
|
3
3
|
import { PageTableViewType } from './PageTableViewType';
|
4
4
|
export interface IItemFilter<T extends object> {
|
5
5
|
label: string;
|
@@ -43,14 +43,14 @@ var jsx_runtime_1 = require("react/jsx-runtime");
|
|
43
43
|
var react_core_1 = require("@patternfly/react-core");
|
44
44
|
var react_icons_1 = require("@patternfly/react-icons");
|
45
45
|
var react_1 = require("react");
|
46
|
-
var BulkSelector_1 = require("
|
47
|
-
var
|
48
|
-
var useBreakPoint_1 = require("
|
49
|
-
var PageActions_1 = require("
|
50
|
-
var PageActionType_1 = require("
|
46
|
+
var BulkSelector_1 = require("../components/BulkSelector");
|
47
|
+
var PageSelect_1 = require("../components/PageSelect");
|
48
|
+
var useBreakPoint_1 = require("../components/useBreakPoint");
|
49
|
+
var PageActions_1 = require("../PageActions/PageActions");
|
50
|
+
var PageActionType_1 = require("../PageActions/PageActionType");
|
51
|
+
var Settings_1 = require("../Settings");
|
52
|
+
var useFrameworkTranslations_1 = require("../useFrameworkTranslations");
|
51
53
|
var PageTableViewType_1 = require("./PageTableViewType");
|
52
|
-
var Settings_1 = require("./Settings");
|
53
|
-
var useFrameworkTranslations_1 = require("./useFrameworkTranslations");
|
54
54
|
function toolbarActionsHaveBulkActions(actions) {
|
55
55
|
var e_1, _a;
|
56
56
|
if (!actions)
|
@@ -112,7 +112,7 @@ function PageTableToolbar(props) {
|
|
112
112
|
paddingBottom: sm ? undefined : 8,
|
113
113
|
paddingTop: sm ? undefined : 8,
|
114
114
|
backgroundColor: settings.theme === 'dark' ? 'var(--pf-global--BackgroundColor--300)' : undefined,
|
115
|
-
} }, { children: (0, jsx_runtime_1.jsxs)(react_core_1.ToolbarContent, { children: [showSelect && ((0, jsx_runtime_1.jsx)(react_core_1.ToolbarGroup, { children: (0, jsx_runtime_1.jsx)(react_core_1.ToolbarItem, __assign({ variant: "bulk-select" }, { children: (0, jsx_runtime_1.jsx)(BulkSelector_1.BulkSelector, __assign({}, props)) })) })), toolbarFilters && toolbarFilters.length > 0 && ((0, jsx_runtime_1.jsx)(react_core_1.ToolbarToggleGroup, __assign({ toggleIcon: (0, jsx_runtime_1.jsx)(react_icons_1.FilterIcon, {}), breakpoint: "md", style: { zIndex: 302 } }, { children: (0, jsx_runtime_1.jsxs)(react_core_1.ToolbarGroup, __assign({ variant: "filter-group" }, { children: [(0, jsx_runtime_1.jsx)(react_core_1.ToolbarItem, { children: (0, jsx_runtime_1.jsx)(
|
115
|
+
} }, { children: (0, jsx_runtime_1.jsxs)(react_core_1.ToolbarContent, { children: [showSelect && ((0, jsx_runtime_1.jsx)(react_core_1.ToolbarGroup, { children: (0, jsx_runtime_1.jsx)(react_core_1.ToolbarItem, __assign({ variant: "bulk-select" }, { children: (0, jsx_runtime_1.jsx)(BulkSelector_1.BulkSelector, __assign({}, props)) })) })), toolbarFilters && toolbarFilters.length > 0 && ((0, jsx_runtime_1.jsx)(react_core_1.ToolbarToggleGroup, __assign({ toggleIcon: (0, jsx_runtime_1.jsx)(react_icons_1.FilterIcon, {}), breakpoint: "md", style: { zIndex: 302 } }, { children: (0, jsx_runtime_1.jsxs)(react_core_1.ToolbarGroup, __assign({ variant: "filter-group" }, { children: [(0, jsx_runtime_1.jsx)(react_core_1.ToolbarItem, { children: (0, jsx_runtime_1.jsx)(PageSelect_1.PageSelect, __assign({ onSelect: setSeletedFilter, value: selectedFilter }, { children: toolbarFilters.map(function (filter) { return ((0, jsx_runtime_1.jsx)(react_core_1.SelectOption, __assign({ value: filter.key }, { children: (0, jsx_runtime_1.jsxs)(react_core_1.Flex, __assign({ spaceItems: { default: 'spaceItemsNone' }, alignItems: { default: 'alignItemsCenter' }, flexWrap: { default: 'nowrap' } }, { children: [(0, jsx_runtime_1.jsx)(react_core_1.FlexItem, __assign({ style: { paddingLeft: 4, paddingRight: 8 } }, { children: (0, jsx_runtime_1.jsx)(react_icons_1.FilterIcon, {}) })), (0, jsx_runtime_1.jsx)(react_core_1.FlexItem, { children: filter.label })] })) }), filter.key)); }) })) }), (0, jsx_runtime_1.jsx)(react_core_1.ToolbarItem, { children: (0, jsx_runtime_1.jsx)(ToolbarFilterInput, { filter: toolbarFilters.find(function (filter) { return filter.key === selectedFilter; }), addFilter: function (value) {
|
116
116
|
var _a;
|
117
117
|
var values = filters === null || filters === void 0 ? void 0 : filters[selectedFilter];
|
118
118
|
if (!values)
|
File without changes
|
File without changes
|
package/cjs/Settings.js
CHANGED
@@ -31,7 +31,7 @@ exports.SettingsDialog = exports.useSettingsDialog = exports.SettingsProvider =
|
|
31
31
|
var jsx_runtime_1 = require("react/jsx-runtime");
|
32
32
|
var react_core_1 = require("@patternfly/react-core");
|
33
33
|
var react_1 = require("react");
|
34
|
-
var
|
34
|
+
var PageSelect_1 = require("./components/PageSelect");
|
35
35
|
var PageDialog_1 = require("./PageDialog");
|
36
36
|
var useFrameworkTranslations_1 = require("./useFrameworkTranslations");
|
37
37
|
exports.SettingsContext = (0, react_1.createContext)([
|
@@ -110,14 +110,14 @@ function SettingsDialog(props) {
|
|
110
110
|
var _f = __read((0, useFrameworkTranslations_1.useFrameworkTranslations)(), 1), translations = _f[0];
|
111
111
|
return ((0, jsx_runtime_1.jsx)(react_core_1.Modal, __assign({ title: "Settings", isOpen: props.open, onClose: onClose, variant: react_core_1.ModalVariant.medium, tabIndex: 0, actions: [
|
112
112
|
(0, jsx_runtime_1.jsx)(react_core_1.Button, __assign({ variant: "primary", onClick: onClose }, { children: translations.closeText }), "close"),
|
113
|
-
] }, { children: (0, jsx_runtime_1.jsxs)(react_core_1.Form, __assign({ isHorizontal: settings.formLayout === 'horizontal' }, { children: [(0, jsx_runtime_1.jsxs)(
|
113
|
+
] }, { children: (0, jsx_runtime_1.jsxs)(react_core_1.Form, __assign({ isHorizontal: settings.formLayout === 'horizontal' }, { children: [(0, jsx_runtime_1.jsxs)(PageSelect_1.PageSelect, __assign({ label: "Theme", value: (_a = settings.theme) !== null && _a !== void 0 ? _a : 'system', onSelect: function (theme) {
|
114
114
|
return setSettings(__assign(__assign({}, settings), { theme: theme }));
|
115
|
-
} }, { children: [(0, jsx_runtime_1.jsx)(react_core_1.SelectOption, __assign({ value: "system" }, { children: 'System default' })), (0, jsx_runtime_1.jsx)(react_core_1.SelectOption, __assign({ value: "light" }, { children: 'Light' })), (0, jsx_runtime_1.jsx)(react_core_1.SelectOption, __assign({ value: "dark" }, { children: 'Dark' }))] })), (0, jsx_runtime_1.jsxs)(
|
115
|
+
} }, { children: [(0, jsx_runtime_1.jsx)(react_core_1.SelectOption, __assign({ value: "system" }, { children: 'System default' })), (0, jsx_runtime_1.jsx)(react_core_1.SelectOption, __assign({ value: "light" }, { children: 'Light' })), (0, jsx_runtime_1.jsx)(react_core_1.SelectOption, __assign({ value: "dark" }, { children: 'Dark' }))] })), (0, jsx_runtime_1.jsxs)(PageSelect_1.PageSelect, __assign({ label: "Table Layout", value: (_b = settings.tableLayout) !== null && _b !== void 0 ? _b : 'comfortable', onSelect: function (tableLayout) {
|
116
116
|
return setSettings(__assign(__assign({}, settings), { tableLayout: tableLayout }));
|
117
|
-
} }, { children: [(0, jsx_runtime_1.jsx)(react_core_1.SelectOption, __assign({ value: "comfortable" }, { children: 'Comfortable' })), (0, jsx_runtime_1.jsx)(react_core_1.SelectOption, __assign({ value: "compact" }, { children: 'Compact' }))] })), (0, jsx_runtime_1.jsxs)(
|
117
|
+
} }, { children: [(0, jsx_runtime_1.jsx)(react_core_1.SelectOption, __assign({ value: "comfortable" }, { children: 'Comfortable' })), (0, jsx_runtime_1.jsx)(react_core_1.SelectOption, __assign({ value: "compact" }, { children: 'Compact' }))] })), (0, jsx_runtime_1.jsxs)(PageSelect_1.PageSelect, __assign({ label: "Form Columns", value: (_c = settings.formColumns) !== null && _c !== void 0 ? _c : 'multiple', onSelect: function (formColumns) {
|
118
118
|
return setSettings(__assign(__assign({}, settings), { formColumns: formColumns }));
|
119
|
-
} }, { children: [(0, jsx_runtime_1.jsx)(react_core_1.SelectOption, __assign({ value: "multiple" }, { children: 'Multiple columns' })), (0, jsx_runtime_1.jsx)(react_core_1.SelectOption, __assign({ value: "single" }, { children: 'Single column' }))] })), (0, jsx_runtime_1.jsxs)(
|
119
|
+
} }, { children: [(0, jsx_runtime_1.jsx)(react_core_1.SelectOption, __assign({ value: "multiple" }, { children: 'Multiple columns' })), (0, jsx_runtime_1.jsx)(react_core_1.SelectOption, __assign({ value: "single" }, { children: 'Single column' }))] })), (0, jsx_runtime_1.jsxs)(PageSelect_1.PageSelect, __assign({ label: "Form Layout", value: (_d = settings.formLayout) !== null && _d !== void 0 ? _d : 'vertical', onSelect: function (formLayout) {
|
120
120
|
return setSettings(__assign(__assign({}, settings), { formLayout: formLayout }));
|
121
|
-
} }, { children: [(0, jsx_runtime_1.jsx)(react_core_1.SelectOption, __assign({ value: "vertical" }, { children: 'Vertical labels' })), (0, jsx_runtime_1.jsx)(react_core_1.SelectOption, __assign({ value: "horizontal" }, { children: 'Horizontal labels' }))] })), (0, jsx_runtime_1.jsxs)(
|
121
|
+
} }, { children: [(0, jsx_runtime_1.jsx)(react_core_1.SelectOption, __assign({ value: "vertical" }, { children: 'Vertical labels' })), (0, jsx_runtime_1.jsx)(react_core_1.SelectOption, __assign({ value: "horizontal" }, { children: 'Horizontal labels' }))] })), (0, jsx_runtime_1.jsxs)(PageSelect_1.PageSelect, __assign({ label: "Borders", value: settings.borders ? 'true' : 'false', onSelect: function (value) { return setSettings(__assign(__assign({}, settings), { borders: value === 'true' })); } }, { children: [(0, jsx_runtime_1.jsx)(react_core_1.SelectOption, __assign({ value: "true" }, { children: 'Yes' })), (0, jsx_runtime_1.jsx)(react_core_1.SelectOption, __assign({ value: "false" }, { children: 'No' }))] }))] })) })));
|
122
122
|
}
|
123
123
|
exports.SettingsDialog = SettingsDialog;
|
@@ -0,0 +1,11 @@
|
|
1
|
+
import { ReactNode } from 'react';
|
2
|
+
export type PageFormGroupProps = {
|
3
|
+
children: ReactNode;
|
4
|
+
helperText?: ReactNode | undefined;
|
5
|
+
helperTextInvalid?: ReactNode | undefined;
|
6
|
+
id?: string;
|
7
|
+
isRequired?: boolean;
|
8
|
+
label?: string;
|
9
|
+
};
|
10
|
+
/** Wrapper over the PatternFly FormGroup making it optional based on if label is given. */
|
11
|
+
export declare function PageFormGroup(props: PageFormGroupProps): JSX.Element;
|
@@ -0,0 +1,27 @@
|
|
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
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
14
|
+
exports.PageFormGroup = void 0;
|
15
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
16
|
+
var react_core_1 = require("@patternfly/react-core");
|
17
|
+
/** Wrapper over the PatternFly FormGroup making it optional based on if label is given. */
|
18
|
+
function PageFormGroup(props) {
|
19
|
+
var _a;
|
20
|
+
var children = props.children, helperText = props.helperText, helperTextInvalid = props.helperTextInvalid, isRequired = props.isRequired, label = props.label;
|
21
|
+
if (!label) {
|
22
|
+
return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: props.children });
|
23
|
+
}
|
24
|
+
var id = (_a = props.id) !== null && _a !== void 0 ? _a : label === null || label === void 0 ? void 0 : label.toLocaleLowerCase().split(' ').join('-');
|
25
|
+
return ((0, jsx_runtime_1.jsx)(react_core_1.FormGroup, __assign({ fieldId: id, helperText: helperText, helperTextInvalid: helperTextInvalid, id: "".concat(id, "-form-group"), isRequired: isRequired, label: label, validated: helperTextInvalid ? 'error' : undefined }, { children: children })));
|
26
|
+
}
|
27
|
+
exports.PageFormGroup = PageFormGroup;
|
@@ -0,0 +1,16 @@
|
|
1
|
+
import React, { ChangeEvent, ReactNode } from 'react';
|
2
|
+
import { PageFormGroupProps } from './PageFormGroup';
|
3
|
+
export type PageSelectProps = {
|
4
|
+
footer?: ReactNode;
|
5
|
+
isCreatable?: boolean;
|
6
|
+
isGrouped?: boolean | undefined;
|
7
|
+
onSelect: (value: string, event: React.MouseEvent<Element, MouseEvent> | ChangeEvent<Element>) => void;
|
8
|
+
placeholder?: string;
|
9
|
+
value: string | undefined;
|
10
|
+
readOnly?: boolean;
|
11
|
+
} & PageFormGroupProps;
|
12
|
+
/** Wrapper over a PatternFly Select.
|
13
|
+
* Simplifies the PatternFly Select.
|
14
|
+
* Supports a PageFormGroup with label if label is specififed.
|
15
|
+
*/
|
16
|
+
export declare function PageSelect(props: PageSelectProps): JSX.Element;
|
@@ -0,0 +1,54 @@
|
|
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 __read = (this && this.__read) || function (o, n) {
|
14
|
+
var m = typeof Symbol === "function" && o[Symbol.iterator];
|
15
|
+
if (!m) return o;
|
16
|
+
var i = m.call(o), r, ar = [], e;
|
17
|
+
try {
|
18
|
+
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
|
19
|
+
}
|
20
|
+
catch (error) { e = { error: error }; }
|
21
|
+
finally {
|
22
|
+
try {
|
23
|
+
if (r && !r.done && (m = i["return"])) m.call(i);
|
24
|
+
}
|
25
|
+
finally { if (e) throw e.error; }
|
26
|
+
}
|
27
|
+
return ar;
|
28
|
+
};
|
29
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
30
|
+
exports.PageSelect = void 0;
|
31
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
32
|
+
var react_core_1 = require("@patternfly/react-core");
|
33
|
+
var react_1 = require("react");
|
34
|
+
var PageFormGroup_1 = require("./PageFormGroup");
|
35
|
+
/** Wrapper over a PatternFly Select.
|
36
|
+
* Simplifies the PatternFly Select.
|
37
|
+
* Supports a PageFormGroup with label if label is specififed.
|
38
|
+
*/
|
39
|
+
function PageSelect(props) {
|
40
|
+
var _a;
|
41
|
+
var children = props.children, footer = props.footer, helperTextInvalid = props.helperTextInvalid, isCreatable = props.isCreatable, isGrouped = props.isGrouped, isReadonly = props.readOnly, label = props.label, onSelect = props.onSelect, placeholder = props.placeholder, value = props.value;
|
42
|
+
var _b = __read((0, react_1.useState)(false), 2), open = _b[0], setOpen = _b[1];
|
43
|
+
var onToggle = (0, react_1.useCallback)(function () { return setOpen(function (open) { return !open; }); }, []);
|
44
|
+
var onSelectHandler = (0, react_1.useCallback)(function (event, value) {
|
45
|
+
if (typeof value === 'string')
|
46
|
+
onSelect(value, event);
|
47
|
+
else
|
48
|
+
onSelect(value.toString(), event);
|
49
|
+
setOpen(false);
|
50
|
+
}, [onSelect]);
|
51
|
+
var id = (_a = props.id) !== null && _a !== void 0 ? _a : label === null || label === void 0 ? void 0 : label.toLocaleLowerCase().split(' ').join('-');
|
52
|
+
return ((0, jsx_runtime_1.jsx)(PageFormGroup_1.PageFormGroup, __assign({}, props, { children: (0, jsx_runtime_1.jsx)(react_core_1.Select, __assign({ "aria-describedby": id ? "".concat(id, "-form-group") : undefined, footer: footer, id: id, isCreatable: isCreatable, isGrouped: isGrouped, isInputFilterPersisted: isCreatable, isOpen: open, maxHeight: 280, onSelect: onSelectHandler, onToggle: onToggle, placeholderText: placeholder, selections: value, validated: helperTextInvalid ? 'error' : undefined, variant: react_core_1.SelectVariant.single, isDisabled: isReadonly }, { children: children })) })));
|
53
|
+
}
|
54
|
+
exports.PageSelect = PageSelect;
|
@@ -0,0 +1,14 @@
|
|
1
|
+
import { ChangeEvent } from 'react';
|
2
|
+
import { PageSelectProps } from './PageSelect';
|
3
|
+
export interface IPageSelectOption<T> {
|
4
|
+
group?: string;
|
5
|
+
label: string;
|
6
|
+
description?: string;
|
7
|
+
value: T;
|
8
|
+
}
|
9
|
+
export type PageSelectOptionProps<T> = {
|
10
|
+
options: IPageSelectOption<T>[];
|
11
|
+
onSelect: (value: T | undefined, event: React.MouseEvent<Element, MouseEvent> | ChangeEvent<Element>) => void;
|
12
|
+
value: T | undefined;
|
13
|
+
} & Omit<PageSelectProps, 'onSelect' | 'value' | 'children'>;
|
14
|
+
export declare function PageSelectOption<T>(props: PageSelectOptionProps<T>): JSX.Element;
|
@@ -0,0 +1,56 @@
|
|
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
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
14
|
+
exports.PageSelectOption = void 0;
|
15
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
16
|
+
var react_core_1 = require("@patternfly/react-core");
|
17
|
+
var react_1 = require("react");
|
18
|
+
var PageSelect_1 = require("./PageSelect");
|
19
|
+
function PageSelectOption(props) {
|
20
|
+
var onSelect = props.onSelect, value = props.value;
|
21
|
+
var onSelectHandler = (0, react_1.useCallback)(function (label, event) {
|
22
|
+
var _a;
|
23
|
+
onSelect((_a = props.options.find(function (option) { return option.label === label; })) === null || _a === void 0 ? void 0 : _a.value, event);
|
24
|
+
}, [onSelect, props.options]);
|
25
|
+
var options = props.options;
|
26
|
+
options.sort(function (l, r) {
|
27
|
+
var _a, _b, _c, _d;
|
28
|
+
if (((_a = l.group) !== null && _a !== void 0 ? _a : '') < ((_b = r.group) !== null && _b !== void 0 ? _b : ''))
|
29
|
+
return -1;
|
30
|
+
if (((_c = l.group) !== null && _c !== void 0 ? _c : '') > ((_d = r.group) !== null && _d !== void 0 ? _d : ''))
|
31
|
+
return 1;
|
32
|
+
if (l.label < r.label)
|
33
|
+
return -1;
|
34
|
+
if (l.label > r.label)
|
35
|
+
return 1;
|
36
|
+
return 0;
|
37
|
+
});
|
38
|
+
var groups = options.reduce(function (groups, option) {
|
39
|
+
var _a;
|
40
|
+
var group = (_a = option.group) !== null && _a !== void 0 ? _a : '';
|
41
|
+
var optionsArray = groups[group];
|
42
|
+
if (!optionsArray) {
|
43
|
+
optionsArray = [];
|
44
|
+
groups[group] = optionsArray;
|
45
|
+
}
|
46
|
+
optionsArray.push(option);
|
47
|
+
return groups;
|
48
|
+
}, {});
|
49
|
+
var isGrouped = Object.keys(groups).length > 1 ||
|
50
|
+
(Object.keys(groups).length === 1 && Object.keys(groups)[0] !== '');
|
51
|
+
var selected = props.options.find(function (option) { return option.value === value; });
|
52
|
+
return ((0, jsx_runtime_1.jsx)(PageSelect_1.PageSelect, __assign({}, props, { value: selected === null || selected === void 0 ? void 0 : selected.label, onSelect: onSelectHandler, isGrouped: isGrouped }, { children: !isGrouped
|
53
|
+
? options.map(function (option) { return ((0, jsx_runtime_1.jsx)(react_core_1.SelectOption, __assign({ value: option.label, label: option.label, description: option.description }, { children: option.label }), option.label)); })
|
54
|
+
: Object.keys(groups).map(function (group) { return ((0, jsx_runtime_1.jsx)(react_core_1.SelectGroup, __assign({ label: group }, { children: groups[group].map(function (option) { return ((0, jsx_runtime_1.jsx)(react_core_1.SelectOption, __assign({ value: option.label, label: option.label, description: option.description }, { children: option.label }), option.label)); }) }), group)); }) })));
|
55
|
+
}
|
56
|
+
exports.PageSelectOption = PageSelectOption;
|
@@ -19,14 +19,14 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
19
19
|
exports.useOpen = void 0;
|
20
20
|
var react_1 = require("react");
|
21
21
|
function useOpen(props) {
|
22
|
-
var _a = __read((0, react_1.useState)(function () { var _a; return (_a = props.open) !== null && _a !== void 0 ? _a : false; }), 2), open = _a[0], setOpenState = _a[1];
|
22
|
+
var _a = __read((0, react_1.useState)(function () { var _a; return (_a = props === null || props === void 0 ? void 0 : props.open) !== null && _a !== void 0 ? _a : false; }), 2), open = _a[0], setOpenState = _a[1];
|
23
23
|
(0, react_1.useEffect)(function () {
|
24
|
-
if (props.open !== undefined) {
|
25
|
-
setOpenState(props.open);
|
24
|
+
if ((props === null || props === void 0 ? void 0 : props.open) !== undefined) {
|
25
|
+
setOpenState(props === null || props === void 0 ? void 0 : props.open);
|
26
26
|
}
|
27
|
-
}, [props.open, setOpenState]);
|
27
|
+
}, [props === null || props === void 0 ? void 0 : props.open, setOpenState]);
|
28
28
|
var setOpen = (0, react_1.useCallback)(function (open) {
|
29
|
-
props.setOpen ? props.setOpen(open) : setOpenState(open);
|
29
|
+
(props === null || props === void 0 ? void 0 : props.setOpen) ? props === null || props === void 0 ? void 0 : props.setOpen(open) : setOpenState(open);
|
30
30
|
}, [props]);
|
31
31
|
var onToggle = (0, react_1.useCallback)(function () {
|
32
32
|
setOpen(!open);
|
package/cjs/index.d.ts
CHANGED
@@ -1,17 +1,12 @@
|
|
1
1
|
export * from './BulkActionDialog';
|
2
2
|
export * from './BulkConfirmationDialog';
|
3
|
-
export * from './cells/BytesCell';
|
4
|
-
export * from './cells/CapacityCell';
|
5
|
-
export * from './cells/CopyCell';
|
6
|
-
export * from './cells/DateTimeCell';
|
7
|
-
export * from './cells/ElapsedTimeCell';
|
8
|
-
export * from './cells/LabelsCell';
|
9
|
-
export * from './cells/TextCell';
|
10
3
|
export * from './components/BulkSelector';
|
11
4
|
export * from './components/Collapse';
|
12
5
|
export * from './components/Details';
|
13
6
|
export * from './components/Help';
|
14
7
|
export * from './components/icons/RunningIcon';
|
8
|
+
export * from './components/PageSelect';
|
9
|
+
export * from './components/PageSelectOption';
|
15
10
|
export * from './components/pfcolors';
|
16
11
|
export * from './components/Scrollable';
|
17
12
|
export * from './components/useBreakPoint';
|
@@ -20,21 +15,29 @@ export * from './PageActions/PageActions';
|
|
20
15
|
export * from './PageActions/PageActionType';
|
21
16
|
export * from './PageAlertToaster';
|
22
17
|
export * from './PageBody';
|
18
|
+
export * from './PageCells/BytesCell';
|
19
|
+
export * from './PageCells/CapacityCell';
|
20
|
+
export * from './PageCells/CopyCell';
|
21
|
+
export * from './PageCells/DateTimeCell';
|
22
|
+
export * from './PageCells/ElapsedTimeCell';
|
23
|
+
export * from './PageCells/LabelsCell';
|
24
|
+
export * from './PageCells/TextCell';
|
23
25
|
export * from './PageDataList';
|
24
26
|
export * from './PageDialog';
|
25
|
-
export * from './PageForm';
|
27
|
+
export * from './PageForm/PageForm';
|
28
|
+
export * from './PageForm/PageFormSelectOption';
|
26
29
|
export * from './PageFramework';
|
27
30
|
export * from './PageHeader';
|
28
31
|
export * from './PageLayout';
|
29
|
-
export * from './PageTable';
|
30
|
-
export * from './PageTableCards';
|
31
|
-
export * from './PageTableDetails';
|
32
|
+
export * from './PageTable/PageTable';
|
33
|
+
export * from './PageTable/PageTableCards';
|
34
|
+
export * from './PageTable/PageTableDetails';
|
35
|
+
export * from './PageTable/PageToolbar';
|
36
|
+
export * from './PageTable/useTableItems';
|
32
37
|
export * from './PageTabs';
|
33
|
-
export * from './PageToolbar';
|
34
38
|
export * from './Settings';
|
35
39
|
export * from './useFrameworkTranslations';
|
36
40
|
export * from './useInMemoryView';
|
37
41
|
export * from './useSelectDialog';
|
38
42
|
export * from './useSelectMultipleDialog';
|
39
|
-
export * from './useTableItems';
|
40
43
|
export * from './utils/compare';
|
package/cjs/index.js
CHANGED
@@ -16,18 +16,13 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
16
16
|
Object.defineProperty(exports, "__esModule", { value: true });
|
17
17
|
__exportStar(require("./BulkActionDialog"), exports);
|
18
18
|
__exportStar(require("./BulkConfirmationDialog"), exports);
|
19
|
-
__exportStar(require("./cells/BytesCell"), exports);
|
20
|
-
__exportStar(require("./cells/CapacityCell"), exports);
|
21
|
-
__exportStar(require("./cells/CopyCell"), exports);
|
22
|
-
__exportStar(require("./cells/DateTimeCell"), exports);
|
23
|
-
__exportStar(require("./cells/ElapsedTimeCell"), exports);
|
24
|
-
__exportStar(require("./cells/LabelsCell"), exports);
|
25
|
-
__exportStar(require("./cells/TextCell"), exports);
|
26
19
|
__exportStar(require("./components/BulkSelector"), exports);
|
27
20
|
__exportStar(require("./components/Collapse"), exports);
|
28
21
|
__exportStar(require("./components/Details"), exports);
|
29
22
|
__exportStar(require("./components/Help"), exports);
|
30
23
|
__exportStar(require("./components/icons/RunningIcon"), exports);
|
24
|
+
__exportStar(require("./components/PageSelect"), exports);
|
25
|
+
__exportStar(require("./components/PageSelectOption"), exports);
|
31
26
|
__exportStar(require("./components/pfcolors"), exports);
|
32
27
|
__exportStar(require("./components/Scrollable"), exports);
|
33
28
|
__exportStar(require("./components/useBreakPoint"), exports);
|
@@ -36,21 +31,29 @@ __exportStar(require("./PageActions/PageActions"), exports);
|
|
36
31
|
__exportStar(require("./PageActions/PageActionType"), exports);
|
37
32
|
__exportStar(require("./PageAlertToaster"), exports);
|
38
33
|
__exportStar(require("./PageBody"), exports);
|
34
|
+
__exportStar(require("./PageCells/BytesCell"), exports);
|
35
|
+
__exportStar(require("./PageCells/CapacityCell"), exports);
|
36
|
+
__exportStar(require("./PageCells/CopyCell"), exports);
|
37
|
+
__exportStar(require("./PageCells/DateTimeCell"), exports);
|
38
|
+
__exportStar(require("./PageCells/ElapsedTimeCell"), exports);
|
39
|
+
__exportStar(require("./PageCells/LabelsCell"), exports);
|
40
|
+
__exportStar(require("./PageCells/TextCell"), exports);
|
39
41
|
__exportStar(require("./PageDataList"), exports);
|
40
42
|
__exportStar(require("./PageDialog"), exports);
|
41
|
-
__exportStar(require("./PageForm"), exports);
|
43
|
+
__exportStar(require("./PageForm/PageForm"), exports);
|
44
|
+
__exportStar(require("./PageForm/PageFormSelectOption"), exports);
|
42
45
|
__exportStar(require("./PageFramework"), exports);
|
43
46
|
__exportStar(require("./PageHeader"), exports);
|
44
47
|
__exportStar(require("./PageLayout"), exports);
|
45
|
-
__exportStar(require("./PageTable"), exports);
|
46
|
-
__exportStar(require("./PageTableCards"), exports);
|
47
|
-
__exportStar(require("./PageTableDetails"), exports);
|
48
|
+
__exportStar(require("./PageTable/PageTable"), exports);
|
49
|
+
__exportStar(require("./PageTable/PageTableCards"), exports);
|
50
|
+
__exportStar(require("./PageTable/PageTableDetails"), exports);
|
51
|
+
__exportStar(require("./PageTable/PageToolbar"), exports);
|
52
|
+
__exportStar(require("./PageTable/useTableItems"), exports);
|
48
53
|
__exportStar(require("./PageTabs"), exports);
|
49
|
-
__exportStar(require("./PageToolbar"), exports);
|
50
54
|
__exportStar(require("./Settings"), exports);
|
51
55
|
__exportStar(require("./useFrameworkTranslations"), exports);
|
52
56
|
__exportStar(require("./useInMemoryView"), exports);
|
53
57
|
__exportStar(require("./useSelectDialog"), exports);
|
54
58
|
__exportStar(require("./useSelectMultipleDialog"), exports);
|
55
|
-
__exportStar(require("./useTableItems"), exports);
|
56
59
|
__exportStar(require("./utils/compare"), exports);
|
package/cjs/useInMemoryView.d.ts
CHANGED
@@ -1,6 +1,6 @@
|
|
1
|
-
import { ITableColumn } from './PageTable';
|
2
|
-
import { IToolbarFilter } from './PageToolbar';
|
3
|
-
import { ISelected } from './useTableItems';
|
1
|
+
import { ITableColumn } from './PageTable/PageTable';
|
2
|
+
import { IToolbarFilter } from './PageTable/PageToolbar';
|
3
|
+
import { ISelected } from './PageTable/useTableItems';
|
4
4
|
import { IView } from './useView';
|
5
5
|
export type IInMemoryView<T extends object> = IView & ISelected<T> & {
|
6
6
|
itemCount: number | undefined;
|
package/cjs/useInMemoryView.js
CHANGED
@@ -28,7 +28,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
28
28
|
exports.useInMemoryView = void 0;
|
29
29
|
var get_value_1 = __importDefault(require("get-value"));
|
30
30
|
var react_1 = require("react");
|
31
|
-
var useTableItems_1 = require("./useTableItems");
|
31
|
+
var useTableItems_1 = require("./PageTable/useTableItems");
|
32
32
|
var useView_1 = require("./useView");
|
33
33
|
var compare_1 = require("./utils/compare");
|
34
34
|
function useInMemoryView(options) {
|
package/cjs/useSelectDialog.d.ts
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
/// <reference types="react" />
|
2
|
-
import { ITableColumn } from './PageTable';
|
3
|
-
import { IToolbarFilter } from './PageToolbar';
|
4
|
-
import { ISelected } from './useTableItems';
|
2
|
+
import { ITableColumn } from './PageTable/PageTable';
|
3
|
+
import { IToolbarFilter } from './PageTable/PageToolbar';
|
4
|
+
import { ISelected } from './PageTable/useTableItems';
|
5
5
|
import { IView } from './useView';
|
6
6
|
interface ISelectDialogOptions<T extends object> {
|
7
7
|
view: IView & ISelected<T> & {
|
package/cjs/useSelectDialog.js
CHANGED
@@ -33,7 +33,7 @@ var react_core_1 = require("@patternfly/react-core");
|
|
33
33
|
var react_1 = require("react");
|
34
34
|
var Collapse_1 = require("./components/Collapse");
|
35
35
|
var PageDialog_1 = require("./PageDialog");
|
36
|
-
var PageTable_1 = require("./PageTable");
|
36
|
+
var PageTable_1 = require("./PageTable/PageTable");
|
37
37
|
function useSelectDialog(options) {
|
38
38
|
var view = options.view, tableColumns = options.tableColumns, toolbarFilters = options.toolbarFilters, confirm = options.confirm, cancel = options.cancel, selected = options.selected;
|
39
39
|
var _a = __read((0, react_1.useState)(''), 2), title = _a[0], setTitle = _a[1];
|
@@ -1,7 +1,7 @@
|
|
1
1
|
/// <reference types="react" />
|
2
|
-
import { ITableColumn } from './PageTable';
|
3
|
-
import { IToolbarFilter } from './PageToolbar';
|
4
|
-
import { ISelected } from './useTableItems';
|
2
|
+
import { ITableColumn } from './PageTable/PageTable';
|
3
|
+
import { IToolbarFilter } from './PageTable/PageToolbar';
|
4
|
+
import { ISelected } from './PageTable/useTableItems';
|
5
5
|
import { IView } from './useView';
|
6
6
|
export type SelectMultipleDialogProps<T extends object> = {
|
7
7
|
title: string;
|
@@ -32,7 +32,7 @@ var jsx_runtime_1 = require("react/jsx-runtime");
|
|
32
32
|
var react_core_1 = require("@patternfly/react-core");
|
33
33
|
var react_1 = require("react");
|
34
34
|
var PageDialog_1 = require("./PageDialog");
|
35
|
-
var PageTable_1 = require("./PageTable");
|
35
|
+
var PageTable_1 = require("./PageTable/PageTable");
|
36
36
|
var useFrameworkTranslations_1 = require("./useFrameworkTranslations");
|
37
37
|
function SelectMultipleDialog(props) {
|
38
38
|
var _a, _b;
|
package/package.json
CHANGED
@@ -1,18 +0,0 @@
|
|
1
|
-
import { CSSProperties, ReactNode } from 'react';
|
2
|
-
export declare function SingleSelect(props: {
|
3
|
-
id?: string;
|
4
|
-
label: string;
|
5
|
-
value: string;
|
6
|
-
onChange: (value: string) => void;
|
7
|
-
children: ReactNode;
|
8
|
-
style?: CSSProperties;
|
9
|
-
open?: boolean;
|
10
|
-
setOpen?: (open: boolean) => void;
|
11
|
-
}): JSX.Element;
|
12
|
-
export declare function SingleSelect2(props: {
|
13
|
-
id?: string;
|
14
|
-
children: ReactNode;
|
15
|
-
value?: string;
|
16
|
-
onChange: (value: string) => void;
|
17
|
-
label?: string;
|
18
|
-
}): JSX.Element;
|
@@ -1,70 +0,0 @@
|
|
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 __read = (this && this.__read) || function (o, n) {
|
14
|
-
var m = typeof Symbol === "function" && o[Symbol.iterator];
|
15
|
-
if (!m) return o;
|
16
|
-
var i = m.call(o), r, ar = [], e;
|
17
|
-
try {
|
18
|
-
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
|
19
|
-
}
|
20
|
-
catch (error) { e = { error: error }; }
|
21
|
-
finally {
|
22
|
-
try {
|
23
|
-
if (r && !r.done && (m = i["return"])) m.call(i);
|
24
|
-
}
|
25
|
-
finally { if (e) throw e.error; }
|
26
|
-
}
|
27
|
-
return ar;
|
28
|
-
};
|
29
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
30
|
-
exports.SingleSelect2 = exports.SingleSelect = void 0;
|
31
|
-
var jsx_runtime_1 = require("react/jsx-runtime");
|
32
|
-
var react_core_1 = require("@patternfly/react-core");
|
33
|
-
var react_1 = require("react");
|
34
|
-
var useOpen_1 = require("./useOpen");
|
35
|
-
function SingleSelect(props) {
|
36
|
-
var _a;
|
37
|
-
var onChange = props.onChange;
|
38
|
-
var _b = __read((0, useOpen_1.useOpen)(props), 3), open = _b[0], setOpen = _b[1], onToggle = _b[2];
|
39
|
-
var onSelect = (0, react_1.useCallback)(function (_e, v) {
|
40
|
-
if (typeof v === 'string') {
|
41
|
-
onChange(v);
|
42
|
-
}
|
43
|
-
else {
|
44
|
-
onChange(v.toString());
|
45
|
-
}
|
46
|
-
setOpen(false);
|
47
|
-
}, [onChange, setOpen]);
|
48
|
-
var id = (_a = props.id) !== null && _a !== void 0 ? _a : props.label.toLocaleLowerCase().split(' ').join('-');
|
49
|
-
return ((0, jsx_runtime_1.jsx)(react_core_1.FormGroup, __assign({ label: props.label, fieldId: id, style: props.style }, { children: (0, jsx_runtime_1.jsx)(react_core_1.Select, __assign({ id: id, selections: props.value, isOpen: open, onToggle: onToggle, onSelect: onSelect }, { children: props.children })) })));
|
50
|
-
}
|
51
|
-
exports.SingleSelect = SingleSelect;
|
52
|
-
function SingleSelect2(props) {
|
53
|
-
var onChange = props.onChange;
|
54
|
-
var id = props.id;
|
55
|
-
var _a = __read((0, react_1.useState)(false), 2), open = _a[0], setOpen = _a[1];
|
56
|
-
var onToggle = (0, react_1.useCallback)(function () {
|
57
|
-
setOpen(function (open) { return !open; });
|
58
|
-
}, []);
|
59
|
-
var onSelect = (0, react_1.useCallback)(function (_e, v) {
|
60
|
-
if (typeof v === 'string') {
|
61
|
-
onChange(v);
|
62
|
-
}
|
63
|
-
else {
|
64
|
-
onChange(v.toString());
|
65
|
-
}
|
66
|
-
setOpen(false);
|
67
|
-
}, [onChange]);
|
68
|
-
return ((0, jsx_runtime_1.jsx)(react_core_1.Select, __assign({ id: id, selections: props.value, isOpen: open, onToggle: onToggle, onSelect: onSelect }, { children: props.children })));
|
69
|
-
}
|
70
|
-
exports.SingleSelect2 = SingleSelect2;
|