devextreme-react
Version: 
DevExtreme React UI and Visualization Components
369 lines (367 loc) • 12.4 kB
JavaScript
/*!
 * devextreme-react
 * Version: 25.1.6
 * Build date: Mon Oct 13 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";
;
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
    if (k2 === undefined) k2 = k;
    var desc = Object.getOwnPropertyDescriptor(m, k);
    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
      desc = { enumerable: true, get: function() { return m[k]; } };
    }
    Object.defineProperty(o, k2, desc);
}) : (function(o, m, k, k2) {
    if (k2 === undefined) k2 = k;
    o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
    Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
    o["default"] = v;
});
var __importStar = (this && this.__importStar) || function (mod) {
    if (mod && mod.__esModule) return mod;
    var result = {};
    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
    __setModuleDefault(result, mod);
    return result;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.ToolbarItem = exports.To = exports.Show = exports.Position = exports.Options = exports.Offset = exports.My = exports.Item = exports.Hide = exports.From = exports.DropDownOptions = exports.Collision = exports.Button = exports.BoundaryOffset = exports.At = exports.Animation = exports.TagBox = void 0;
const React = __importStar(require("react"));
const react_1 = require("react");
const tag_box_1 = __importDefault(require("devextreme/ui/tag_box"));
const component_1 = require("./core/component");
const nested_option_1 = __importDefault(require("./core/nested-option"));
const TagBox = (0, react_1.memo)((0, react_1.forwardRef)((props, ref) => {
    const baseRef = (0, react_1.useRef)(null);
    (0, react_1.useImperativeHandle)(ref, () => ({
        instance() {
            return baseRef.current?.getInstance();
        }
    }), []);
    const subscribableOptions = (0, react_1.useMemo)(() => (["opened", "value"]), []);
    const independentEvents = (0, react_1.useMemo)(() => (["onChange", "onClosed", "onContentReady", "onCustomItemCreating", "onDisposing", "onEnterKey", "onFocusIn", "onFocusOut", "onInitialized", "onInput", "onItemClick", "onKeyDown", "onKeyUp", "onMultiTagPreparing", "onOpened", "onSelectAllValueChanged", "onValueChanged"]), []);
    const defaults = (0, react_1.useMemo)(() => ({
        defaultOpened: "opened",
        defaultValue: "value",
    }), []);
    const expectedChildren = (0, react_1.useMemo)(() => ({
        button: { optionName: "buttons", isCollectionItem: true },
        dropDownOptions: { optionName: "dropDownOptions", isCollectionItem: false },
        item: { optionName: "items", isCollectionItem: true }
    }), []);
    const templateProps = (0, react_1.useMemo)(() => ([
        {
            tmplOption: "dropDownButtonTemplate",
            render: "dropDownButtonRender",
            component: "dropDownButtonComponent"
        },
        {
            tmplOption: "fieldTemplate",
            render: "fieldRender",
            component: "fieldComponent"
        },
        {
            tmplOption: "groupTemplate",
            render: "groupRender",
            component: "groupComponent"
        },
        {
            tmplOption: "itemTemplate",
            render: "itemRender",
            component: "itemComponent"
        },
        {
            tmplOption: "tagTemplate",
            render: "tagRender",
            component: "tagComponent"
        },
    ]), []);
    return (React.createElement((component_1.Component), {
        WidgetClass: tag_box_1.default,
        ref: baseRef,
        subscribableOptions,
        independentEvents,
        defaults,
        expectedChildren,
        templateProps,
        ...props,
    }));
}));
exports.TagBox = TagBox;
const _componentAnimation = (props) => {
    return React.createElement((nested_option_1.default), {
        ...props,
        elementDescriptor: {
            OptionName: "animation",
            ExpectedChildren: {
                hide: { optionName: "hide", isCollectionItem: false },
                show: { optionName: "show", isCollectionItem: false }
            },
        },
    });
};
const Animation = Object.assign(_componentAnimation, {
    componentType: "option",
});
exports.Animation = Animation;
const _componentAt = (props) => {
    return React.createElement((nested_option_1.default), {
        ...props,
        elementDescriptor: {
            OptionName: "at",
        },
    });
};
const At = Object.assign(_componentAt, {
    componentType: "option",
});
exports.At = At;
const _componentBoundaryOffset = (props) => {
    return React.createElement((nested_option_1.default), {
        ...props,
        elementDescriptor: {
            OptionName: "boundaryOffset",
        },
    });
};
const BoundaryOffset = Object.assign(_componentBoundaryOffset, {
    componentType: "option",
});
exports.BoundaryOffset = BoundaryOffset;
const _componentButton = (props) => {
    return React.createElement((nested_option_1.default), {
        ...props,
        elementDescriptor: {
            OptionName: "buttons",
            IsCollectionItem: true,
            ExpectedChildren: {
                options: { optionName: "options", isCollectionItem: false }
            },
        },
    });
};
const Button = Object.assign(_componentButton, {
    componentType: "option",
});
exports.Button = Button;
const _componentCollision = (props) => {
    return React.createElement((nested_option_1.default), {
        ...props,
        elementDescriptor: {
            OptionName: "collision",
        },
    });
};
const Collision = Object.assign(_componentCollision, {
    componentType: "option",
});
exports.Collision = Collision;
const _componentDropDownOptions = (props) => {
    return React.createElement((nested_option_1.default), {
        ...props,
        elementDescriptor: {
            OptionName: "dropDownOptions",
            DefaultsProps: {
                defaultHeight: "height",
                defaultPosition: "position",
                defaultVisible: "visible",
                defaultWidth: "width"
            },
            ExpectedChildren: {
                animation: { optionName: "animation", isCollectionItem: false },
                position: { optionName: "position", isCollectionItem: false },
                toolbarItem: { optionName: "toolbarItems", isCollectionItem: true }
            },
            TemplateProps: [{
                    tmplOption: "contentTemplate",
                    render: "contentRender",
                    component: "contentComponent"
                }, {
                    tmplOption: "titleTemplate",
                    render: "titleRender",
                    component: "titleComponent"
                }],
        },
    });
};
const DropDownOptions = Object.assign(_componentDropDownOptions, {
    componentType: "option",
});
exports.DropDownOptions = DropDownOptions;
const _componentFrom = (props) => {
    return React.createElement((nested_option_1.default), {
        ...props,
        elementDescriptor: {
            OptionName: "from",
            ExpectedChildren: {
                position: { optionName: "position", isCollectionItem: false }
            },
        },
    });
};
const From = Object.assign(_componentFrom, {
    componentType: "option",
});
exports.From = From;
const _componentHide = (props) => {
    return React.createElement((nested_option_1.default), {
        ...props,
        elementDescriptor: {
            OptionName: "hide",
            ExpectedChildren: {
                from: { optionName: "from", isCollectionItem: false },
                to: { optionName: "to", isCollectionItem: false }
            },
        },
    });
};
const Hide = Object.assign(_componentHide, {
    componentType: "option",
});
exports.Hide = Hide;
const _componentItem = (props) => {
    return React.createElement((nested_option_1.default), {
        ...props,
        elementDescriptor: {
            OptionName: "items",
            IsCollectionItem: true,
            TemplateProps: [{
                    tmplOption: "template",
                    render: "render",
                    component: "component"
                }],
        },
    });
};
const Item = Object.assign(_componentItem, {
    componentType: "option",
});
exports.Item = Item;
const _componentMy = (props) => {
    return React.createElement((nested_option_1.default), {
        ...props,
        elementDescriptor: {
            OptionName: "my",
        },
    });
};
const My = Object.assign(_componentMy, {
    componentType: "option",
});
exports.My = My;
const _componentOffset = (props) => {
    return React.createElement((nested_option_1.default), {
        ...props,
        elementDescriptor: {
            OptionName: "offset",
        },
    });
};
const Offset = Object.assign(_componentOffset, {
    componentType: "option",
});
exports.Offset = Offset;
const _componentOptions = (props) => {
    return React.createElement((nested_option_1.default), {
        ...props,
        elementDescriptor: {
            OptionName: "options",
            TemplateProps: [{
                    tmplOption: "template",
                    render: "render",
                    component: "component"
                }],
        },
    });
};
const Options = Object.assign(_componentOptions, {
    componentType: "option",
});
exports.Options = Options;
const _componentPosition = (props) => {
    return React.createElement((nested_option_1.default), {
        ...props,
        elementDescriptor: {
            OptionName: "position",
            ExpectedChildren: {
                at: { optionName: "at", isCollectionItem: false },
                boundaryOffset: { optionName: "boundaryOffset", isCollectionItem: false },
                collision: { optionName: "collision", isCollectionItem: false },
                my: { optionName: "my", isCollectionItem: false },
                offset: { optionName: "offset", isCollectionItem: false }
            },
        },
    });
};
const Position = Object.assign(_componentPosition, {
    componentType: "option",
});
exports.Position = Position;
const _componentShow = (props) => {
    return React.createElement((nested_option_1.default), {
        ...props,
        elementDescriptor: {
            OptionName: "show",
            ExpectedChildren: {
                from: { optionName: "from", isCollectionItem: false },
                to: { optionName: "to", isCollectionItem: false }
            },
        },
    });
};
const Show = Object.assign(_componentShow, {
    componentType: "option",
});
exports.Show = Show;
const _componentTo = (props) => {
    return React.createElement((nested_option_1.default), {
        ...props,
        elementDescriptor: {
            OptionName: "to",
            ExpectedChildren: {
                position: { optionName: "position", isCollectionItem: false }
            },
        },
    });
};
const To = Object.assign(_componentTo, {
    componentType: "option",
});
exports.To = To;
const _componentToolbarItem = (props) => {
    return React.createElement((nested_option_1.default), {
        ...props,
        elementDescriptor: {
            OptionName: "toolbarItems",
            IsCollectionItem: true,
            TemplateProps: [{
                    tmplOption: "menuItemTemplate",
                    render: "menuItemRender",
                    component: "menuItemComponent"
                }, {
                    tmplOption: "template",
                    render: "render",
                    component: "component"
                }],
        },
    });
};
const ToolbarItem = Object.assign(_componentToolbarItem, {
    componentType: "option",
});
exports.ToolbarItem = ToolbarItem;
exports.default = TagBox;