UNPKG

devextreme-react

Version:

DevExtreme React UI and Visualization Components

124 lines (122 loc) 4.02 kB
/*! * devextreme-react * Version: 24.2.6 * Build date: Mon Mar 17 2025 * * Copyright (c) 2012 - 2025 Developer Express Inc. ALL RIGHTS RESERVED * * This software may be modified and distributed under the terms * of the MIT license. See the LICENSE file in the root of the project for details. * * https://github.com/DevExpress/devextreme-react */ "use client"; import * as React from "react"; import { memo, forwardRef, useImperativeHandle, useRef, useMemo } from "react"; import dxTreeView from "devextreme/ui/tree_view"; import { Component as BaseComponent } from "./core/component"; import NestedOption from "./core/nested-option"; const TreeView = memo(forwardRef((props, ref) => { const baseRef = useRef(null); useImperativeHandle(ref, () => ({ instance() { return baseRef.current?.getInstance(); } }), [baseRef.current]); const subscribableOptions = useMemo(() => (["items"]), []); const independentEvents = useMemo(() => (["onContentReady", "onDisposing", "onInitialized", "onItemClick", "onItemCollapsed", "onItemContextMenu", "onItemExpanded", "onItemHold", "onItemRendered", "onSelectAllValueChanged"]), []); const defaults = useMemo(() => ({ defaultItems: "items", }), []); const expectedChildren = useMemo(() => ({ item: { optionName: "items", isCollectionItem: true }, searchEditorOptions: { optionName: "searchEditorOptions", isCollectionItem: false } }), []); const templateProps = useMemo(() => ([ { tmplOption: "itemTemplate", render: "itemRender", component: "itemComponent" }, ]), []); return (React.createElement((BaseComponent), { WidgetClass: dxTreeView, ref: baseRef, subscribableOptions, independentEvents, defaults, expectedChildren, templateProps, ...props, })); })); const _componentButton = (props) => { return React.createElement((NestedOption), { ...props, elementDescriptor: { OptionName: "buttons", IsCollectionItem: true, ExpectedChildren: { options: { optionName: "options", isCollectionItem: false } }, }, }); }; const Button = Object.assign(_componentButton, { componentType: "option", }); const _componentItem = (props) => { return React.createElement((NestedOption), { ...props, elementDescriptor: { OptionName: "items", IsCollectionItem: true, ExpectedChildren: { item: { optionName: "items", isCollectionItem: true } }, TemplateProps: [{ tmplOption: "template", render: "render", component: "component" }], }, }); }; const Item = Object.assign(_componentItem, { componentType: "option", }); const _componentOptions = (props) => { return React.createElement((NestedOption), { ...props, elementDescriptor: { OptionName: "options", TemplateProps: [{ tmplOption: "template", render: "render", component: "component" }], }, }); }; const Options = Object.assign(_componentOptions, { componentType: "option", }); const _componentSearchEditorOptions = (props) => { return React.createElement((NestedOption), { ...props, elementDescriptor: { OptionName: "searchEditorOptions", DefaultsProps: { defaultValue: "value" }, ExpectedChildren: { button: { optionName: "buttons", isCollectionItem: true } }, }, }); }; const SearchEditorOptions = Object.assign(_componentSearchEditorOptions, { componentType: "option", }); export default TreeView; export { TreeView, Button, Item, Options, SearchEditorOptions };