Dive into secure and efficient coding practices with our curated list of the top 10 examples showcasing 'react-dock' in functional components in JavaScript. Our advanced machine learning engine meticulously scans each line of code, cross-referencing millions of open source libraries to ensure your implementation is not just functional, but also robust and secure. Elevate your React applications to new heights by mastering the art of handling side effects, API calls, and asynchronous operations with confidence and precision.
onToggleUnsavedStyleModal: toggleUnsavedStyleModal,
onToggleUnsavedGeometryModal: toggleUnsavedGeometryModal,
onConfirmRemove: confirmRemoveAnnotation,
onCancelClose: cancelCloseAnnotations,
onConfirmClose: confirmCloseAnnotations,
onAdd: newAnnotation,
onHighlight: highlight,
onCleanHighlight: cleanHighlight,
onDetail: showAnnotation,
onFilter: filterAnnotations,
onDownload: download,
onLoadAnnotations: loadAnnotations
})(require('../components/mapcontrols/annotations/Annotations'));
const ContainerDimensions = require('react-container-dimensions').default;
const Dock = require('react-dock').default;
class AnnotationsPanel extends React.Component {
static propTypes = {
id: PropTypes.string,
active: PropTypes.bool,
wrap: PropTypes.bool,
wrapWithPanel: PropTypes.bool,
panelStyle: PropTypes.object,
panelClassName: PropTypes.string,
toggleControl: PropTypes.func,
closeGlyph: PropTypes.string,
buttonStyle: PropTypes.object,
style: PropTypes.object,
dockProps: PropTypes.object,
// side panel properties
/*
* Copyright 2018, GeoSolutions Sas.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree.
*/
const React = require('react');
const Dock = require('react-dock').default;
const BorderLayout = require('../../layout/BorderLayout');
const {withState} = require('recompose');
const PanelHeader = require('./PanelHeader');
/**
* Component for rendering a DockPanel
* @memberof components.misc.panels
* @name DockPanel
* @class
* @prop {bool} fluid true calculates the size as a fraction of screen width/height
* @prop {string} className additional class name
* @prop {string} position side of the screen where the panel is located, top, bottom, left and right
* @prop {bool} open show/hide component
* @prop {number} size size of panel 0.0 to 1.0 if fluid instead of px value
* @prop {object} style style of dock panel
* @prop {number} zIndex panel z index
/*
* Copyright 2017, GeoSolutions Sas.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree.
*/
const React = require('react');
const Dock = require('react-dock').default;
const PropTypes = require('prop-types');
/**
* Component for rendering a dockablePanel panel.
* @memberof components.dockablePanel
* @class
* @prop {string} id. The <div> id value of the dockable panel
* @prop {string} dimMode. If none - content is not dimmed, if transparent - pointer events are disabled (so you can click through it), if opaque - click on dim area closes the dock. Default is none
* @prop {number} dockSize. Size of dock panel (width or height, depending on position). Is a % value [0~1]
* @prop {bool} isVisible. If true, dock is visible. Default is true.
* @prop {number} maxDockSize. The maximum extension in %. Default 1.0
* @prop {number} minDockSize. The minimum extension in %. Default 0.1
* @prop {string} position. Side to dock (left, right, top or bottom). Default is bottom.
* @prop {bool} fluid. If true, resize dock proportionally on window resize. Default is true.
* @prop {function} setDockSize. The metod called when the dockable panel is resized
* @prop {object} toolbar. it contains the toolbar</div>
const PropTypes = require('prop-types');
const React = require('react');
const {connect} = require('react-redux');
const {isObject, isEqual, head} = require('lodash');
const Dock = require('react-dock').default;
const {Button, Glyphicon} = require('react-bootstrap');
const Modal = require('../../../components/misc/Modal');
const FilterUtils = require('../../../utils/FilterUtils');
const FeatureGrid = connect((state) => {
return {
select: state.featuregrid && state.featuregrid.select || [],
selectAllActive: state.featuregrid && state.featuregrid.selectAll
};
}, {})(require('./FeatureGrid'));
const I18N = require('../../../components/I18N/I18N');
const Spinner = require('react-spinkit');
const assign = require('object-assign');
const BorderLayout = require('../components/layout/BorderLayout');
const EMPTY_ARR = [];
const EMPTY_OBJ = {};
const {gridTools, gridEvents, pageEvents, toolbarEvents} = require('./featuregrid/index');
const { initPlugin, sizeChange, setUp} = require('../actions/featuregrid');
const ContainerDimensions = require('react-container-dimensions').default;
const {mapLayoutValuesSelector} = require('../selectors/maplayout');
const Dock = connect(createSelector(
getDockSize,
state => mapLayoutValuesSelector(state, {transform: true}),
(size, dockStyle) => ({
size,
dockStyle
})
)
)(require('react-dock').default);
/**
* @name FeatureEditor
* @memberof plugins
* @class
* @prop {object} cfg.customEditorsOptions Set of options used to connect the custom editors to the featuregrid
* @prop {object} cfg.editingAllowedRoles array of user roles allowed to enter in edit mode
* @prop {boolean} cfg.virtualScroll default true. Activates virtualScroll. When false the grid uses normal pagination
* @prop {number} cfg.maxStoredPages default 5. In virtual Scroll mode determines the size of the loaded pages cache
* @prop {number} cfg.vsOverScan default 20. Number of rows to load above/below the visible slice of the grid
* @prop {number} cfg.scrollDebounce default 50. milliseconds of debounce interval between two scroll event
* @prop {boolean} cfg.showFilteredObject default false. Displays spatial filter selection area when true
* @prop {boolean} cfg.showTimeSync default false. Shows the button to enable time sync
* @prop {boolean} cfg.timeSync default false. If true, the timeSync is active by default.
* @classdesc
* FeatureEditor Plugin Provides functionalities to browse/edit data via WFS. The grid can be configured to use paging or
* <br>virtual scroll mechanisms. By default virtual scroll is enabled. When on virtual scroll mode, the maxStoredPages param
/*
* Copyright 2017, GeoSolutions Sas.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree.
*/
const React = require('react');
const PropTypes = require('prop-types');
const Message = require('../I18N/Message');
const {Glyphicon, Panel} = require('react-bootstrap');
const Dock = require('react-dock').default;
const BorderLayout = require('../layout/BorderLayout');
const {NO_DETAILS_AVAILABLE} = require('../../actions/maps');
const LocaleUtils = require('../../utils/LocaleUtils');
const Spinner = require('react-spinkit');
const ResizeDetector = require('react-resize-detector').default;
class DetailsPanel extends React.Component {
static propTypes = {
id: PropTypes.string,
active: PropTypes.bool,
closeGlyph: PropTypes.string,
panelStyle: PropTypes.object,
panelClassName: PropTypes.string,
style: PropTypes.object,
onClose: PropTypes.func,
dockProps: PropTypes.object,