@balena/ui-shared-components 15.2.4-build-remove-column-management-experimental-code-79be8f7aaed914004e675a86a775e5a02eb4daa0-1 → 15.2.4-build-fix-objectFieldTemplate-63ae8e40c32b990bc092da9f17c7b56160563864-1
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.
|
@@ -1,17 +1,22 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
-
import Grid from '@mui/material
|
|
2
|
+
import { Grid } from '@mui/material';
|
|
3
3
|
import { canExpand, descriptionId, getTemplate, getUiOptions, titleId, } from '@rjsf/utils';
|
|
4
4
|
export const ObjectFieldTemplate = (props) => {
|
|
5
5
|
var _a, _b;
|
|
6
|
-
const { description, title, properties, required, disabled, readonly, uiSchema, fieldPathId, schema, formData, onAddProperty, registry, } = props;
|
|
6
|
+
const { description, title, properties, required, disabled, readonly, uiSchema, fieldPathId, schema, formData, optionalDataControl, onAddProperty, registry, } = props;
|
|
7
7
|
const uiOptions = getUiOptions(uiSchema);
|
|
8
8
|
const TitleFieldTemplate = getTemplate('TitleFieldTemplate', registry, uiOptions);
|
|
9
9
|
const DescriptionFieldTemplate = getTemplate('DescriptionFieldTemplate', registry, uiOptions);
|
|
10
|
+
const showOptionalDataControlInTitle = !readonly && !disabled;
|
|
10
11
|
const { ButtonTemplates: { AddButton }, } = registry.templates;
|
|
11
|
-
return (_jsxs(_Fragment, { children: [title && (_jsx(TitleFieldTemplate, { id: titleId(fieldPathId), title: title, required: required, schema: schema, uiSchema: uiSchema, registry: registry })), description && (_jsx(DescriptionFieldTemplate, { id: descriptionId(fieldPathId), description: description, schema: schema, uiSchema: uiSchema, registry: registry })), _jsxs(Grid, Object.assign({ container: true, spacing: 2, style: { marginTop: '10px' } }, ((_b = (_a = uiSchema === null || uiSchema === void 0 ? void 0 : uiSchema['ui:grid']) === null || _a === void 0 ? void 0 : _a.container) !== null && _b !== void 0 ? _b : {}), { children: [properties.map((element, index) => {
|
|
12
|
+
return (_jsxs(_Fragment, { children: [title && (_jsx(TitleFieldTemplate, { id: titleId(fieldPathId), title: title, required: required, schema: schema, uiSchema: uiSchema, registry: registry, optionalDataControl: showOptionalDataControlInTitle ? optionalDataControl : undefined })), description && (_jsx(DescriptionFieldTemplate, { id: descriptionId(fieldPathId), description: description, schema: schema, uiSchema: uiSchema, registry: registry })), _jsxs(Grid, Object.assign({ container: true, spacing: 2, style: { marginTop: '10px' } }, ((_b = (_a = uiSchema === null || uiSchema === void 0 ? void 0 : uiSchema['ui:grid']) === null || _a === void 0 ? void 0 : _a.container) !== null && _b !== void 0 ? _b : {}), { children: [!showOptionalDataControlInTitle ? optionalDataControl : undefined, properties.map((element, index) => {
|
|
12
13
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
14
|
+
// Remove the <Grid> if the inner element is hidden as the <Grid>
|
|
15
|
+
// itself would otherwise still take up space.
|
|
16
|
+
return element.hidden ? (element.content) : (_jsx(Grid, Object.assign({ size: { xs: 12 },
|
|
17
|
+
// TODO: remove as soon as MUI versions are same between RJSF and our internal.
|
|
18
|
+
width: "100%", style: { marginBottom: '10px' } }, ((_g = (_e = (_c = (_b = (_a = uiSchema === null || uiSchema === void 0 ? void 0 : uiSchema[element.name]) === null || _a === void 0 ? void 0 : _a['ui:grid']) === null || _b === void 0 ? void 0 : _b.item) !== null && _c !== void 0 ? _c : (_d = uiSchema === null || uiSchema === void 0 ? void 0 : uiSchema['ui:grid']) === null || _d === void 0 ? void 0 : _d[element.name]) !== null && _e !== void 0 ? _e : (_f = uiSchema === null || uiSchema === void 0 ? void 0 : uiSchema['ui:grid']) === null || _f === void 0 ? void 0 : _f.item) !== null && _g !== void 0 ? _g : {}), { children: element.content }), index));
|
|
19
|
+
})] })), canExpand(schema, uiSchema, formData) && (_jsx(Grid, { container: true, justifyContent: "flex-end", children: _jsx(Grid, { children: _jsx(AddButton, { id: fieldPathId.$id + 'add', className: "rjsf-object-property-expand", onClick: onAddProperty,
|
|
20
|
+
// eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing -- If `disabled` is false, we still want to disable the button if `readonly` is true
|
|
21
|
+
disabled: disabled || readonly, uiSchema: uiSchema, registry: registry }) }) }))] }));
|
|
17
22
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import type RJSFCoreForm from '@rjsf/core';
|
|
2
2
|
import type { FormProps as RjsFormProps, IChangeEvent } from '@rjsf/core';
|
|
3
3
|
import type { BoxProps, ButtonProps } from '@mui/material';
|
|
4
|
-
import type { FieldTemplateProps, WidgetProps, RJSFValidationError, UiSchema, FormValidation } from '@rjsf/utils';
|
|
4
|
+
import type { FieldTemplateProps, WidgetProps, FieldProps, RJSFSchema, RJSFValidationError, UiSchema, FormValidation } from '@rjsf/utils';
|
|
5
5
|
import { Templates } from '@rjsf/mui';
|
|
6
6
|
export interface RJSFormProps extends Omit<RjsFormProps, 'validator' | 'onFocus' | 'onBlur'>, Pick<BoxProps, 'sx' | 'onFocus' | 'onBlur' | 'onClick'>, Partial<Pick<RjsFormProps, 'validator'>> {
|
|
7
7
|
/** If true, do not display the form submit button */
|
|
@@ -11,6 +11,6 @@ export interface RJSFormProps extends Omit<RjsFormProps, 'validator' | 'onFocus'
|
|
|
11
11
|
/** If passed, it will show a secondary button, these are the same props used for the [`Button`](#button) component */
|
|
12
12
|
actionButtons?: ButtonProps[];
|
|
13
13
|
}
|
|
14
|
-
export declare const RJSForm: import("react").ForwardRefExoticComponent<Omit<RJSFormProps, "ref"> & import("react").RefAttributes<RJSFCoreForm<any,
|
|
15
|
-
export type { IChangeEvent, FieldTemplateProps, WidgetProps, RJSFValidationError, UiSchema, FormValidation, };
|
|
14
|
+
export declare const RJSForm: import("react").ForwardRefExoticComponent<Omit<RJSFormProps, "ref"> & import("react").RefAttributes<RJSFCoreForm<any, RJSFSchema, any>>>;
|
|
15
|
+
export type { IChangeEvent, FieldTemplateProps, WidgetProps, RJSFValidationError, UiSchema, FormValidation, FieldProps, RJSFSchema, };
|
|
16
16
|
export { Templates };
|
|
@@ -8,20 +8,25 @@ import { token } from '../../../../utils/token';
|
|
|
8
8
|
import { DndContext } from '@dnd-kit/core';
|
|
9
9
|
import { CSS } from '@dnd-kit/utilities';
|
|
10
10
|
import { arrayMove, SortableContext, useSortable } from '@dnd-kit/sortable';
|
|
11
|
+
import { useAnalyticsContext } from '../../../../contexts/AnalyticsContext';
|
|
11
12
|
const SortableItem = ({ column, handleColumnSelection, }) => {
|
|
13
|
+
var _a, _b, _c, _d;
|
|
14
|
+
const { state: analyticsState } = useAnalyticsContext();
|
|
12
15
|
const { attributes, listeners, setNodeRef, transform, transition } = useSortable({ id: column.key });
|
|
13
|
-
return (_jsxs(MenuItem, Object.assign({ ref: setNodeRef }, attributes, { sx: { transform: CSS.Transform.toString(transform), transition }, children: [
|
|
16
|
+
return (_jsxs(MenuItem, Object.assign({ ref: setNodeRef }, attributes, { sx: { transform: CSS.Transform.toString(transform), transition }, children: [(((_b = (_a = analyticsState.featureFlags) === null || _a === void 0 ? void 0 : _a['column-ordering']) === null || _b === void 0 ? void 0 : _b.value) === 'on' ||
|
|
17
|
+
((_d = (_c = analyticsState.featureFlags) === null || _c === void 0 ? void 0 : _c['reduced-default-device-columns-and-reordering']) === null || _d === void 0 ? void 0 : _d.value) === 'on') && (_jsx(ListItemIcon, Object.assign({}, listeners, { sx: {
|
|
14
18
|
cursor: 'grab',
|
|
15
19
|
pr: 2,
|
|
16
20
|
mx: 0,
|
|
17
21
|
minWidth: 'auto !important',
|
|
18
|
-
}, children: _jsx(FontAwesomeIcon, { icon: faGripVertical }) })), _jsx(FormControlLabel, { sx: { flex: 1, width: '100%', m: 0 }, control: _jsx(Checkbox, { sx: { m: 0 }, onClick: () => {
|
|
22
|
+
}, children: _jsx(FontAwesomeIcon, { icon: faGripVertical }) }))), _jsx(FormControlLabel, { sx: { flex: 1, width: '100%', m: 0 }, control: _jsx(Checkbox, { sx: { m: 0 }, onClick: () => {
|
|
19
23
|
handleColumnSelection(column);
|
|
20
24
|
}, checked: column.selected }), label: typeof column.label === 'string' ? column.label : column.title })] })));
|
|
21
25
|
};
|
|
22
26
|
export const TableActions = ({ columns, actions, onColumnPreferencesChange, onManageColumnsOpen, }) => {
|
|
23
27
|
const [anchorEl, setAnchorEl] = React.useState();
|
|
24
28
|
const theme = useTheme();
|
|
29
|
+
const { state: analyticsState } = useAnalyticsContext();
|
|
25
30
|
const matches = useMediaQuery(theme.breakpoints.up('sm'));
|
|
26
31
|
const open = Boolean(anchorEl);
|
|
27
32
|
const handleClick = (event) => {
|
|
@@ -43,8 +48,13 @@ export const TableActions = ({ columns, actions, onColumnPreferencesChange, onMa
|
|
|
43
48
|
onColumnPreferencesChange(newColumns, 'display');
|
|
44
49
|
}, [columns, onColumnPreferencesChange]);
|
|
45
50
|
const handleDragEnd = (event) => {
|
|
51
|
+
var _a, _b, _c, _d;
|
|
46
52
|
const { active, over } = event;
|
|
47
|
-
if (!active ||
|
|
53
|
+
if (!active ||
|
|
54
|
+
!over ||
|
|
55
|
+
!onColumnPreferencesChange ||
|
|
56
|
+
(!(((_b = (_a = analyticsState.featureFlags) === null || _a === void 0 ? void 0 : _a['column-reordering']) === null || _b === void 0 ? void 0 : _b.value) === 'on') &&
|
|
57
|
+
!(((_d = (_c = analyticsState.featureFlags) === null || _c === void 0 ? void 0 : _c['reduced-default-device-columns-and-reordering']) === null || _d === void 0 ? void 0 : _d.value) === 'on'))) {
|
|
48
58
|
return;
|
|
49
59
|
}
|
|
50
60
|
const oldIndex = columns.findIndex((c) => c.key === active.id);
|
package/dist/index.d.ts
CHANGED
|
@@ -12,7 +12,7 @@ export type { CookiesBannerProps, Cookie } from './components/CookiesBanner';
|
|
|
12
12
|
export type { FormProps as RjsCoreFormProps } from '@rjsf/core';
|
|
13
13
|
export type { ArrayFieldTemplateProps, ObjectFieldTemplateProps, } from '@rjsf/utils';
|
|
14
14
|
export { RJSForm, Templates as RjsfTemplates } from './components/Form';
|
|
15
|
-
export type { RJSFormProps, IChangeEvent, FieldTemplateProps, WidgetProps, RJSFValidationError, UiSchema, FormValidation, } from './components/Form';
|
|
15
|
+
export type { RJSFormProps, IChangeEvent, FieldTemplateProps, WidgetProps, FieldProps, RJSFValidationError, UiSchema, FormValidation, } from './components/Form';
|
|
16
16
|
export { FileWidget } from './components/Form/Widgets/FileWidget';
|
|
17
17
|
export type { OnFileReadParams } from './components/Form/Widgets/FileWidget';
|
|
18
18
|
export { PasswordWidget } from './components/Form/Widgets/PasswordWidget';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@balena/ui-shared-components",
|
|
3
|
-
"version": "15.2.4-build-
|
|
3
|
+
"version": "15.2.4-build-fix-objectFieldTemplate-63ae8e40c32b990bc092da9f17c7b56160563864-1",
|
|
4
4
|
"main": "./dist/index.js",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"files": [
|
|
@@ -135,7 +135,7 @@
|
|
|
135
135
|
},
|
|
136
136
|
"homepage": "https://github.com/balena-io/ui-shared-components#readme",
|
|
137
137
|
"versionist": {
|
|
138
|
-
"publishedAt": "2025-11-
|
|
138
|
+
"publishedAt": "2025-11-17T15:31:05.029Z"
|
|
139
139
|
},
|
|
140
140
|
"overrides": {
|
|
141
141
|
"storybook": "$storybook",
|