@bigbinary/neeto-fields-frontend 1.3.8 → 1.3.10
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/README.md +44 -3
- package/dist/index.cjs.js +394 -214
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.js +396 -217
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/types.d.ts +10 -0
package/README.md
CHANGED
|
@@ -18,6 +18,7 @@ referred as custom fields) for the resources across neeto products.
|
|
|
18
18
|
- [FieldsPane](#2-fieldspane)
|
|
19
19
|
- [FieldValuesContainer](#3-fieldvaluescontainer)
|
|
20
20
|
- [FieldInputs](#4-fieldinputs)
|
|
21
|
+
- [InlineFieldValueInputProps](#5-inlinefieldvalueinput)
|
|
21
22
|
- [Functions](#functions)
|
|
22
23
|
- [mergeInitialValues](#1-neetofieldsutilsmergeinitialvalues)
|
|
23
24
|
- [transformValues](#2-neetofieldsutilstransformvalues)
|
|
@@ -478,6 +479,46 @@ const HostForm = () => {
|
|
|
478
479
|
};
|
|
479
480
|
```
|
|
480
481
|
|
|
482
|
+
### 5. `InlineFieldValueInput`
|
|
483
|
+
|
|
484
|
+
The InlineFieldValueInput component render the field value input UI. It accepts
|
|
485
|
+
the following props:
|
|
486
|
+
|
|
487
|
+
#### Props:
|
|
488
|
+
|
|
489
|
+
1. `fields`: An array of all the fetched fields.
|
|
490
|
+
2. `fieldValues`: Field values associated with the resource.
|
|
491
|
+
3. `resourceType`: The type of resource.
|
|
492
|
+
4. `resourceId`: The ID of the resource.
|
|
493
|
+
5. `ownerId`: The ID of the owner in case the owner is not an organization.
|
|
494
|
+
6. `onMutationSuccess`: The callback function which is triggered on the success
|
|
495
|
+
of mutation functions of field value.
|
|
496
|
+
|
|
497
|
+
#### Usage:
|
|
498
|
+
|
|
499
|
+
Usually this is used as a component for inline editing of field values in
|
|
500
|
+
tables. The example shows one such usage of building the `columnData` for table
|
|
501
|
+
with inline editable field value inputs in cell.
|
|
502
|
+
|
|
503
|
+
```jsx
|
|
504
|
+
const buildColumnDataForFields = (fields, onFieldValueUpdateSuccess) =>
|
|
505
|
+
fields.map(field => ({
|
|
506
|
+
dataIndex: "field.id",
|
|
507
|
+
key: field.id,
|
|
508
|
+
title: field.name,
|
|
509
|
+
width: 250,
|
|
510
|
+
render: (_, user) => (
|
|
511
|
+
<InlineFieldValueInput
|
|
512
|
+
{...{ field }}
|
|
513
|
+
fieldValues={user.fieldValues}
|
|
514
|
+
resourceId={user.id}
|
|
515
|
+
resourceType="users"
|
|
516
|
+
onMutationSuccess={onFieldValueUpdateSuccess}
|
|
517
|
+
/>
|
|
518
|
+
),
|
|
519
|
+
}));
|
|
520
|
+
```
|
|
521
|
+
|
|
481
522
|
## Functions
|
|
482
523
|
|
|
483
524
|
The package exports the `neetoFieldsUtils`, which contains two utility
|
|
@@ -640,9 +681,9 @@ In order to customize the engine's default behavior, we have several ways.
|
|
|
640
681
|
`NeetoFieldsEngine::Fields::Customizable` or
|
|
641
682
|
`NeetoFieldsEngine::FieldValues::Customizable` depending on the context.
|
|
642
683
|
|
|
643
|
-
> _Eg: If you want to do something before the update action of
|
|
644
|
-
> then define it in `before_update_process` method inside
|
|
645
|
-
> `NeetoFieldsEngine::Fields::Customizable` concern._
|
|
684
|
+
> _Eg: If you want to do something before the update action of
|
|
685
|
+
> `FieldsController`, then define it in `before_update_process` method inside
|
|
686
|
+
> the `NeetoFieldsEngine::Fields::Customizable` concern._
|
|
646
687
|
|
|
647
688
|
# Development instructions
|
|
648
689
|
|