Members
(constant) ActionsProvider
ActionsContext is responsible for store which field is being hovered or active
- Source:
(constant) ConfigProvider
A provider to store any configuration or property that has no
side effect during the life cycle of the application.
Maintaining configuration properties with side effect properties
in the same `store` may be rendering unnecessary components
that use only configuration properties.
- Source:
(constant) context
Context stores all instances of schemas created by key to avoid recreating
a new instance of the same Schema in different components.
- Source:
(constant) createReducer
Copyright (c) 2000-present Liferay, Inc. All rights reserved.
This library is free software; you can redistribute it and/or modify it under
the terms of the GNU Lesser General Public License as published by the Free
Software Foundation; either version 2.1 of the License, or (at your option)
any later version.
This library is distributed in the hope that it will be useful, but WITHOUT
ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
FOR A PARTICULAR PURPOSE. See the GNU Lesser General Public License for more
details.
- Source:
(constant) FIELD_NAME_REGEX
Copyright (c) 2000-present Liferay, Inc. All rights reserved.
This library is free software; you can redistribute it and/or modify it under
the terms of the GNU Lesser General Public License as published by the Free
Software Foundation; either version 2.1 of the License, or (at your option)
any later version.
This library is distributed in the hope that it will be useful, but WITHOUT
ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
FOR A PARTICULAR PURPOSE. See the GNU Lesser General Public License for more
details.
- Source:
(constant) FormFieldSettings
Render a new form to be used in the Sidebar so that can edit the
properties of a field, a new FormProvider is needed to control
the reducers of a Field's settingsContext structure.
(constant) FormFieldSettingsAdapter
This component is temporary and for exclusive use for Sidebar
in Metal.js, this creates a form for editing the properties
of a field in Form Builder.
(constant) FormNoopProvider
This is a no-op implementation for the store, a dispatch call will
not call any action on the FormProvider and the state will always
be the value passed through the value property.
This is a temporary implementation that works as an intermediate
provider and compatibility layer for the React and Metal.js frontier
in FormBuilder. The one who actually causes an action is the
LayoutProvider when that component is used.
-> Metal.js
-> Metal.js
-> React.js with Adapter
-> React.js
...
- Source:
(constant) FormProvider
Form Provider is a "store" that is compatible with the concept of
thunk but has no coupling to any specific reducer, the reducers
can be configured through the property, as well as configuring
the data init function and the initial state.
...
Reducers receive the extra config property in addition to state
and action, it is mandatory that ConfigProvider be declared
before FormProvider.
...
FormProvider is built to be composed and can be declared more
than once in the application to deal with the same structure in
some part of the application tree. The real example is Sidebar,
which has the same `pages` structure that needs to be manipulated
but is isolated from the application and the main store.
<- Main Store
<- Isolated state
- Source:
(constant) FormView
Exports the default application to render the form
for the user.
- Source:
(constant) getFormNode
Copyright (c) 2000-present Liferay, Inc. All rights reserved.
This library is free software; you can redistribute it and/or modify it under
the terms of the GNU Lesser General Public License as published by the Free
Software Foundation; either version 2.1 of the License, or (at your option)
any later version.
This library is distributed in the hope that it will be useful, but WITHOUT
ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
FOR A PARTICULAR PURPOSE. See the GNU Lesser General Public License for more
details.
- Source:
(constant) INITIAL_PAGES
Copyright (c) 2000-present Liferay, Inc. All rights reserved.
This library is free software; you can redistribute it and/or modify it under
the terms of the GNU Lesser General Public License as published by the Free
Software Foundation; either version 2.1 of the License, or (at your option)
any later version.
This library is distributed in the hope that it will be useful, but WITHOUT
ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
FOR A PARTICULAR PURPOSE. See the GNU Lesser General Public License for more
details.
- Source:
(constant) LEGACY_EVENTS
Copyright (c) 2000-present Liferay, Inc. All rights reserved.
This library is free software; you can redistribute it and/or modify it under
the terms of the GNU Lesser General Public License as published by the Free
Software Foundation; either version 2.1 of the License, or (at your option)
any later version.
This library is distributed in the hope that it will be useful, but WITHOUT
ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
FOR A PARTICULAR PURPOSE. See the GNU Lesser General Public License for more
details.
- Source:
(constant) LegacyFormBuilder
Render a form just for preview without actions/reducer just with FormNoopProvider,
this component is for compatibility with the FormBuilder in Metal.js.
(constant) localDataStorage
Copyright (c) 2000-present Liferay, Inc. All rights reserved.
This library is free software; you can redistribute it and/or modify it under
the terms of the GNU Lesser General Public License as published by the Free
Software Foundation; either version 2.1 of the License, or (at your option)
any later version.
This library is distributed in the hope that it will be useful, but WITHOUT
ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
FOR A PARTICULAR PURPOSE. See the GNU Lesser General Public License for more
details.
- Source:
(constant) MAPPED_EVENT_TYPES
Event mapping for compatibility with events for
the LayoutProvider component.
- Source:
(constant) PAGINATION
Copyright (c) 2000-present Liferay, Inc. All rights reserved.
This library is free software; you can redistribute it and/or modify it under
the terms of the GNU Lesser General Public License as published by the Free
Software Foundation; either version 2.1 of the License, or (at your option)
any later version.
This library is distributed in the hope that it will be useful, but WITHOUT
ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
FOR A PARTICULAR PURPOSE. See the GNU Lesser General Public License for more
details.
- Source:
(constant) PAGINATION_MODE_MAPPED
Maps the representation of pagination mode in the builder environment
in the form view.
- Source:
(constant) setValue
Copyright (c) 2000-present Liferay, Inc. All rights reserved.
This library is free software; you can redistribute it and/or modify it under
the terms of the GNU Lesser General Public License as published by the Free
Software Foundation; either version 2.1 of the License, or (at your option)
any later version.
This library is distributed in the hope that it will be useful, but WITHOUT
ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
FOR A PARTICULAR PURPOSE. See the GNU Lesser General Public License for more
details.
- Source:
(constant) SYMBOL_CONTEXT
Copyright (c) 2000-present Liferay, Inc. All rights reserved.
This library is free software; you can redistribute it and/or modify it under
the terms of the GNU Lesser General Public License as published by the Free
Software Foundation; either version 2.1 of the License, or (at your option)
any later version.
This library is distributed in the hope that it will be useful, but WITHOUT
ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
FOR A PARTICULAR PURPOSE. See the GNU Lesser General Public License for more
details.
- Source:
(constant) useDataView
UseDataView creates a representation of the data based on the passed
schema otherwise nothing is done. It should not be used directly, it
is exposed through `useFormState`.
- Source:
(constant) useEvaluate
This hook is a partial function that removes the need to pass the same
properties every time they are called, this is only for thunks that use
the `evaluate` function.
- Source:
(constant) useStorage
Simple implementation to create a local storage that can be shared
independently of the React tree, Form Renderer is not an application
and can be reused more than once on the same page, so we need to share
requests and fields, they are loaded on demand, so as not to make
unnecessary requests. Use the `useStorage` hook as a way to cache data.
- Source:
Methods
getConnectedReactComponentAdapter(ReactComponent)
The Adapter creates a communication bridge between the Metal and React components.
The Adapter when it is rendered for the first time uses `ReactDOM.render` to assemble
the component and subsequent renderings are done by React. We created a tunnel with
an Observer that updates the internal state of the component in React that makes a
wrapper over the main component to force React to render at the best time, we also
ignore the rendering of Metal.
Parameters:
| Name | Type | Description |
|---|---|---|
ReactComponent |
React.createElement |
- Source:
Examples
// import getConnectedReactComponentAdapter from '/path/ReactComponentAdapter.es';
//
// const ReactComponent = ({children, className}) => <div className={className}>{children}</div>;
// const ReactComponentAdapter = getConnectedReactComponentAdapter(
// ReactComponent
// );
//
// In the rendering of Metal
// render() {
// return (
// <ReactComponentAdapter className="h1-title">
// <h1>{'Title'}</h1>
// </ReactComponentAdapter>
// );
// }
To call the React component in the context of Metal + soy, where varient is not an option,
you can use Metal's `Soy.register` to create a fake component so that you can call the React
component in Soy. The use of children from Soy components for React does not work.// import Soy from 'metal-soy';
// import getConnectedReactComponentAdapter from '/path/ReactComponentAdapter.es';
// import templates from './FakeAdapter.soy';
//
// const ReactComponent = ({className}) => <div className={className} />;
// const ReactComponentAdapter = getConnectedReactComponentAdapter(
// ReactComponent
// );
// Soy.register(ReactComponentAdapter, templates);
//
// In soy
// {call FakeAdapter.render}
// {param className: 'test' /}
// {/call}getFieldNameGenerator()
This is a literary copy of the logic of the old LayoutProvider,
check the documentation for more details.
identity()
Copyright (c) 2000-present Liferay, Inc. All rights reserved.
This library is free software; you can redistribute it and/or modify it under
the terms of the GNU Lesser General Public License as published by the Free
Software Foundation; either version 2.1 of the License, or (at your option)
any later version.
This library is distributed in the hope that it will be useful, but WITHOUT
ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
FOR A PARTICULAR PURPOSE. See the GNU Lesser General Public License for more
details.
- Source:
isDroppingFieldIntoFieldAndSameGroup()
Determines whether are moving the source Field into inside the Field
in the same FieldGroup to create another FieldGroup but with only
two fields.
- Source:
isDroppingFieldIntoSingleField()
Determines whether the source Field is being moved into inside a Field
where its parent is a FieldGroup with just that element.
- Source:
isFieldGroupMovingIntoItself()
Just check if the Field is a FieldGroup before checking if it is moving into
itself. The index of the source and target are added to the loc, at the
level where `useDrop` is used it is not visible the loc of the Field being
rendered.
- Source:
isMovingIntoItself()
Checks whether Field is moving into itself. In conventional mode, we would be
visiting all the fields within it to check if the target belongs to the Field
root (in this case the source), but this can be very slow depending on the
depth and it is very expensive in this hot path instead this method implement
heuristic algorithm based on two assumptions:
- The target indexes are the same as the source indexes
- The target depth is greater than the source
The indexes are an Array
- Source:
isStaleRaw()
Compare the values of the properties at the reference level, the properties
should only be for readonly, the raw object and props will always be different
objects because props contain all the properties of the store but raw only
the properties that the schema needs.
- Source:
mountStruct()
This only assembles the expected structure of the Forms field
event, creates a makeup to maintain compatibility with the
mechanism, the fields in React do not need to assemble this
structure, they must only provide a native event or value in
the case of an onChange
ObserverSubscribe()
Adds a sub observer to maintain the updated state of the
component.
- Source:
Page()
Renderer is the main component for dealing with Forms `pages` structure,
you can use the renderer to render fields from different layouts.
Renderer supports some rendering modes by default
- multi_pages
- paginated
- single-page
- success
- tabbed
- wizard
You can replace all major components or just a few to change the layout
structure, consider the following components
- Container
- Page
- Rows
- Row
- Column
Use the `overrides` API to pass the components you want to replace,
an example of Page.
children
}}
/>
StateSync()
Updates the state of the FieldSettings when any value coming
from layers above changes.
useFormSubmit()
This is a copy of the old implementation made in Metal.js, deals with
the submit of the Form in the User View, removes the default behavior
of the submit and uses Liferay.Util.submitForm.
- Source:
usePropagateAction()
Propagate Action is used in conjunction with useReducer that "listens"
for any action in a dispatch call.
const [state, dispatch] = usePropagateAction(useReducer(...));
- Source:
usePublicAPI()
Exposes methods to manipulate some states within the application in
User View through the ref via React and exposed by the
Liferay.Component register.
- Source:
validator()
The validator only removes properties with the value undefined to allow
the initialProps to be added.
- Source: