udp-stencil-component-library 25.18.2-beta.9 → 25.18.3-beta.1

package/dist/components/advanced-search-builder2.js

@@ -1,458 +1 @@
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './index2.js';
-import { g as getAllowedSearchOperators, d as defineCustomElement$b } from './filter-group2.js';
-import { d as defineCustomElement$c } from './custom-button2.js';
-import { d as defineCustomElement$a } from './udp-ambient-tool-tip2.js';
-import { d as defineCustomElement$9 } from './udp-badge2.js';
-import { d as defineCustomElement$8 } from './udp-button2.js';
-import { d as defineCustomElement$7 } from './udp-chip2.js';
-import { d as defineCustomElement$6 } from './udp-icon2.js';
-import { d as defineCustomElement$5 } from './udp-icon-button2.js';
-import { d as defineCustomElement$4 } from './udp-menu2.js';
-import { d as defineCustomElement$3 } from './udp-menu-item2.js';
-import { d as defineCustomElement$2 } from './unity-typography2.js';
-import { d as defineCustomElement$1 } from './validation-chip2.js';
-
-const generateFilterString = (data) => {
-    // Return an empty string if there's no data or no groups
-    if (!data || !data.filterGroups || data.filterGroups.length === 0) {
-        return '';
-    }
-    // Recursive helper function to build the string for a given group
-    const buildStringForGroup = (groupId) => {
-        const groupInfo = data.filterGroups.find(g => g.groupId === groupId);
-        if (!groupInfo)
-            return '';
-        const logicalOperator = groupInfo.logicalSearchOperator === 1 ? 'AND' : 'OR';
-        const parts = [];
-        // 1. Process all filters in this group
-        const filtersInGroup = data.filterElements.filter(f => f.groupId === groupId);
-        filtersInGroup.forEach(filter => {
-            // Add quotes around string values
-            const value = typeof filter.searchValue === 'string' ? `"${filter.searchValue}"` : filter.searchValue;
-            parts.push(`[${filter.searchField}] ${filter.searchOperator} ${value}`);
-        });
-        // 2. Process all subgroups by calling this function recursively
-        const subGroups = data.filterGroups.filter(g => g.parentGroupId === groupId);
-        subGroups.forEach(subGroup => {
-            const subGroupString = buildStringForGroup(subGroup.groupId);
-            // Only add the part if the subgroup is not empty
-            if (subGroupString) {
-                parts.push(`(${subGroupString})`);
-            }
-        });
-        // 3. Join all the parts together with the correct operator
-        return parts.join(` ${logicalOperator} `);
-    };
-    // Find the root group (the one with no parent) and start the process
-    const rootGroup = data.filterGroups.find(g => g.parentGroupId === null);
-    return rootGroup ? buildStringForGroup(rootGroup.groupId) : '';
-};
-
-const advancedSearchBuilderCss = ":host{display:flex;flex-direction:column;font-family:sans-serif;box-sizing:border-box;overflow:visible}:host(.host-collapsed){resize:none;height:auto}:host(.host-expanded){overflow-y:auto}:host(.is-resizable.host-expanded){resize:vertical;min-height:180px;max-height:80vh;overflow:auto}.advanced-filter-container{display:flex;flex-direction:column;height:100%;width:100%;overflow:hidden}.collapsed-view{display:flex;align-items:center;gap:0.5rem;padding:10px;border-bottom:1px solid #eee}.anim-container{flex-grow:1;overflow-y:auto;overflow-x:auto;display:flex}.content-wrapper{padding-bottom:15px;flex-grow:1}.advanced-filter-footer{display:flex;justify-content:flex-end;border-top:1px solid #eee;padding:10px;flex-shrink:0;gap:10px;align-items:center}.string-display-input{width:100%;padding:8px;border:1px solid #ccc;border-radius:4px;background-color:#f5f5f5;box-sizing:border-box;cursor:default;user-select:none}.string-display-input:focus{outline:none}.search-button{opacity:0;transform:scale(0.95);pointer-events:none;margin-right:10px}.advanced-filter-container.is-expanded .anim-container{overflow-y:auto;min-height:130px}.advanced-filter-container.is-expanded .collapsed-view{display:none}.advanced-filter-container.is-expanded .search-button{opacity:1;transform:scale(1);pointer-events:auto}.advanced-filter-container:not(.is-expanded) .anim-container{max-height:0;min-height:0;overflow:hidden}.advanced-filter-container:not(.is-expanded) .advanced-filter-footer{opacity:0;height:0;padding:0;border:none;pointer-events:none;overflow:hidden}";
-
-const AdvancedSearchBuilder = /*@__PURE__*/ proxyCustomElement(class AdvancedSearchBuilder extends H {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.__attachShadow();
-        this.filterSave = createEvent(this, "filterSave");
-        this.change = createEvent(this, "change");
-        /**
-         * An array of `Field` objects that defines the available options in the
-         * "Fields" dropdown. This can be a nested structure for expandable fields.
-         */
-        this.fields = [];
-        /**
-         * A configuration object to control optional features of the component,
-         * such as enabling or disabling the collapsible and resizable behaviors.
-         */
-        this.config = {};
-        this.openAddMenuForGroupId = null;
-        this.filterString = '';
-        this.isExpanded = true;
-        this.isFilterValid = true;
-        this.errorMessages = [];
-        this.nextGroupId = 1;
-        this.handleSearch = () => {
-            if (this.isFilterValid && this.filterSave) {
-                this.filterSave.emit(this.currentFilterData);
-                this.filterString = generateFilterString(this.currentFilterData);
-                this.config.collapsible && this.toggleExpanded();
-            }
-            else {
-                console.warn('Cannot run search: filter is invalid.');
-            }
-        };
-        this.toggleExpanded = () => {
-            this.isExpanded = !this.isExpanded;
-            this.updateHostClasses();
-        };
-        this.handleToggleAddMenu = (event) => {
-            const groupId = event.detail;
-            // If clicking the same button, close the menu. Otherwise, open the new one.
-            this.openAddMenuForGroupId = this.openAddMenuForGroupId === groupId ? null : groupId;
-            if (this.openAddMenuForGroupId !== null) {
-                const el = this.animContainerEl;
-                if (el) {
-                    // We use requestAnimationFrame to ensure the scroll happens smoothly
-                    requestAnimationFrame(() => {
-                        el.scrollTop = el.scrollHeight;
-                    });
-                }
-            }
-        };
-        // --- Data Manipulation Methods ---
-        this.handleDrop = (event) => {
-            const dragEvent = event.detail.event;
-            const droppedOnFilterId = event.detail.targetFilterId;
-            // Get the dragged filter's ID from the dataTransfer object
-            const draggedFilterId = dragEvent.dataTransfer.getData('text/plain');
-            if (!draggedFilterId || draggedFilterId === droppedOnFilterId) {
-                return;
-            }
-            this.runUpdateCycle(newState => {
-                const elements = newState.filterElements;
-                const draggedItem = elements.find(f => f._id === draggedFilterId);
-                if (!draggedItem)
-                    return;
-                const fromIndex = elements.findIndex(f => f._id === draggedFilterId);
-                const toIndex = elements.findIndex(f => f._id === droppedOnFilterId);
-                elements.splice(fromIndex, 1);
-                elements.splice(toIndex, 0, draggedItem);
-            });
-        };
-        this.handleAddFilter = (groupId) => {
-            this.runUpdateCycle(newState => {
-                var _a, _b;
-                const defaultField = (_a = this.fields) === null || _a === void 0 ? void 0 : _a[0];
-                const allowedOperators = getAllowedSearchOperators(defaultField);
-                const defaultOperator = ((_b = allowedOperators === null || allowedOperators === void 0 ? void 0 : allowedOperators[0]) === null || _b === void 0 ? void 0 : _b.value) || '';
-                newState.filterElements.push({
-                    _id: `filter_${Math.random()}`,
-                    _type: defaultField === null || defaultField === void 0 ? void 0 : defaultField.type,
-                    groupId: groupId,
-                    searchField: defaultField === null || defaultField === void 0 ? void 0 : defaultField.name,
-                    searchOperator: defaultOperator, // Use the new default operator
-                    searchValue: '',
-                });
-            });
-            this.openAddMenuForGroupId = null;
-        };
-        this.handleAddGroup = (parentGroupId) => {
-            this.runUpdateCycle(newState => {
-                newState.filterGroups.push({
-                    groupId: this.nextGroupId++,
-                    parentGroupId: parentGroupId,
-                    logicalSearchOperator: 1,
-                });
-            });
-            this.openAddMenuForGroupId = null;
-        };
-        this.handleRemoveFilter = (filterId) => {
-            this.runUpdateCycle(newState => {
-                const index = newState.filterElements.findIndex(f => f._id === filterId);
-                if (index > -1)
-                    newState.filterElements.splice(index, 1);
-            });
-        };
-        this.handleRemoveGroup = (groupIdToRemove) => {
-            this.runUpdateCycle(newState => {
-                const findDescendantGroupIds = (parentGroupId) => {
-                    const children = newState.filterGroups.filter(g => g.parentGroupId === parentGroupId);
-                    let allDescendants = children.map(c => c.groupId);
-                    children.forEach(c => {
-                        allDescendants = [...allDescendants, ...findDescendantGroupIds(c.groupId)];
-                    });
-                    return allDescendants;
-                };
-                const allIdsToRemove = [groupIdToRemove, ...findDescendantGroupIds(groupIdToRemove)];
-                newState.filterGroups = newState.filterGroups.filter(g => !allIdsToRemove.includes(g.groupId));
-                newState.filterElements = newState.filterElements.filter(f => !allIdsToRemove.includes(f.groupId));
-            });
-        };
-        this.handleFilterChange = (event) => {
-            const { filterId, field, value, updates } = event.detail;
-            this.runUpdateCycle(newState => {
-                const filter = newState.filterElements.find(f => f._id === filterId);
-                if (filter) {
-                    if (updates) {
-                        // If there are multiple updates, apply them all
-                        Object.assign(filter, updates);
-                    }
-                    else {
-                        // Otherwise, apply the single update
-                        filter[field] = value;
-                    }
-                }
-            });
-        };
-        this.handleGroupChange = (event) => {
-            const { groupId, logicalSearchOperator } = event.detail;
-            this.runUpdateCycle(newState => {
-                const group = newState.filterGroups.find(g => g.groupId === groupId);
-                if (group)
-                    group.logicalSearchOperator = logicalSearchOperator;
-            });
-        };
-        this.handleDropOnGroup = (event) => {
-            const dragEvent = event.detail.event;
-            const targetGroupId = event.detail.targetGroupId;
-            // Read the type and ID from the dataTransfer object
-            const dragType = dragEvent.dataTransfer.getData('application/drag-type');
-            const draggedId = dragEvent.dataTransfer.getData('text/plain');
-            if (!draggedId)
-                return;
-            this.runUpdateCycle(newState => {
-                // --- Handle a dropped FILTER ---
-                if (dragType === 'filter') {
-                    const draggedFilter = newState.filterElements.find(f => f._id === draggedId);
-                    if (draggedFilter && draggedFilter.groupId !== targetGroupId) {
-                        draggedFilter.groupId = targetGroupId;
-                    }
-                }
-                // --- Handle a dropped GROUP ---
-                else if (dragType === 'group') {
-                    const draggedGroupId = parseInt(draggedId, 10);
-                    const draggedGroup = newState.filterGroups.find(g => g.groupId === draggedGroupId);
-                    // Safety checks:
-                    // 1. Can't drop a group on itself.
-                    // 2. Can't drop a group into its current parent.
-                    // 3. Can't drop a group into one of its own descendants.
-                    if (draggedGroup &&
-                        draggedGroupId !== targetGroupId &&
-                        draggedGroup.parentGroupId !== targetGroupId &&
-                        !this.isDescendant(targetGroupId, draggedGroupId, newState.filterGroups)) {
-                        // If all checks pass, update the group's parentGroupId
-                        draggedGroup.parentGroupId = targetGroupId;
-                    }
-                }
-            });
-        };
-    }
-    componentWillLoad() {
-        // Initialize the internal state from the prop
-        this.currentFilterData = this.getNormalizedData(this.initialFilterData);
-        this.updateNextGroupId(this.currentFilterData);
-    }
-    componentDidLoad() {
-        this.updateHostClasses();
-    }
-    updateHostClasses() {
-        if (this.isExpanded) {
-            this.el.classList.add('host-expanded');
-            this.el.classList.remove('host-collapsed');
-        }
-        else {
-            this.el.classList.add('host-collapsed');
-            this.el.classList.remove('host-expanded');
-            this.el.style.height = null;
-        }
-    }
-    updateNextGroupId(data) {
-        // Check if there are any groups to scan
-        if (data && data.filterGroups.length > 0) {
-            // Find the highest existing groupId and add 1
-            this.nextGroupId = Math.max(...data.filterGroups.map(g => g.groupId)) + 1;
-        }
-        else {
-            // If there are no groups, start with 2 (since the default root is 1)
-            this.nextGroupId = 2;
-        }
-    }
-    verifyFilterState(data) {
-        const errors = [];
-        const guidRegex = /^[0-9a-fA-F]{8}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{12}$/;
-        data.filterElements.forEach(filter => {
-            delete filter._error; // Clear old errors first
-            const isSearchFieldEmpty = filter.searchField === null ||
-                filter.searchField === undefined ||
-                filter.searchField === '';
-            const isValueEmpty = !filter.searchValue;
-            const operatorAllowsEmpty = filter.searchOperator === 'NULL' || filter.searchOperator === 'NOTNULL';
-            if (isSearchFieldEmpty) {
-                const errorMessage = `Search Field cannot be empty.`;
-                filter._error = errorMessage;
-                errors.push(errorMessage);
-            }
-            else if (filter.searchOperator === 'BETWEEN') {
-                const values = (filter.searchValue || '').split(',');
-                // Check if we have two values and that neither is an empty string.
-                if (values.length !== 2 || !values[0] || !values[1]) {
-                    const errorMessage = `Two values required when using BETWEEN operator for field "${filter.searchField}".`;
-                    filter._error = errorMessage;
-                    errors.push(errorMessage);
-                }
-            }
-            else if (isValueEmpty && !operatorAllowsEmpty) {
-                const errorMessage = `Value cannot be empty for field "${filter.searchField}".`;
-                filter._error = errorMessage;
-                errors.push(errorMessage);
-            }
-            else if (filter._type === 'guid' && !isValueEmpty && !guidRegex.test(filter.searchValue)) {
-                const errorMessage = `Invalid GUID for field "${filter.searchField}".`;
-                filter._error = errorMessage;
-                errors.push(errorMessage);
-            }
-        });
-        return { isValid: errors.length === 0, errors: errors };
-    }
-    getNormalizedData(data) {
-        var _a, _b;
-        if (data && ((_a = data.filterGroups) === null || _a === void 0 ? void 0 : _a.length) > 0) {
-            return data;
-        }
-        if (data && ((_b = data.filterElements) === null || _b === void 0 ? void 0 : _b.length) > 0) {
-            const rootGroupId = 1;
-            return Object.assign(Object.assign({}, data), { filterGroups: [
-                    {
-                        groupId: rootGroupId,
-                        parentGroupId: null,
-                        logicalSearchOperator: data.logicalSearchOperator || 1,
-                    },
-                ], filterElements: data.filterElements.map(el => (Object.assign(Object.assign({}, el), { groupId: rootGroupId }))) });
-        }
-        // Return a default structure if the prop is null or empty
-        return {
-            logicalSearchOperator: 1,
-            filterGroups: [{ groupId: 1, parentGroupId: null, logicalSearchOperator: 1 }],
-            filterElements: [],
-        };
-    }
-    runUpdateCycle(mutator) {
-        // Create a deep clone to avoid mutating the prop directly
-        const newState = JSON.parse(JSON.stringify(this.currentFilterData));
-        // Apply the mutations to the new state object
-        mutator(newState);
-        this.currentFilterData = newState;
-        const validationResult = this.verifyFilterState(this.currentFilterData);
-        this.isFilterValid = validationResult.isValid;
-        this.errorMessages = validationResult.errors;
-        this.change.emit(newState);
-    }
-    isDescendant(targetGroupId, draggedGroupId, allGroups) {
-        let currentGroup = allGroups.find(g => g.groupId === targetGroupId);
-        // Traverse up the tree from the target
-        while (currentGroup && currentGroup.parentGroupId !== null) {
-            // If we find the dragged group in the ancestry, it's a descendant
-            if (currentGroup.parentGroupId === draggedGroupId) {
-                return true;
-            }
-            currentGroup = allGroups.find(g => g.groupId === currentGroup.parentGroupId);
-        }
-        return false;
-    }
-    render() {
-        const rootGroup = this.currentFilterData.filterGroups.find(g => g.parentGroupId === null);
-        const isCollapsible = this.config.collapsible === true;
-        const isResizable = this.config.resizable !== false;
-        const showFooter = this.config.showFooter !== false;
-        const containerClasses = {
-            'advanced-filter-container': true,
-            'is-expanded': this.isExpanded,
-        };
-        const hostStyles = {};
-        // Only apply a height style when the component is expanded
-        if (this.isExpanded && this.config.height) {
-            // If not resizable, this will be the fixed height.
-            // If resizable, this will be the initial height, constrained by the CSS.
-            hostStyles['height'] = this.config.height;
-        }
-        return (h(Host, { key: '583fb7950382c83a9cf319973853d0ec857bbea9', style: hostStyles, class: {
-                'is-resizable': isResizable,
-                'host-expanded': this.isExpanded,
-                'host-collapsed': !this.isExpanded,
-            } }, h("div", { key: '7df6526ffce9426ff3f55415f99b992ff55c9511', class: containerClasses }, isCollapsible && (h("div", { key: 'bdbb944de64189d0c9179756f42a533c7b8da8f7', class: "collapsed-view" }, h("input", { key: '28904bfb74a84e8a62a0f6d36bdcca1535e3ac34', type: "text", readonly: true, value: this.filterString, class: "string-display-input" }), h("custom-button", { key: 'e7136b4da73db4220fd2cee00771999edf8dad4c', class: "toggle-button", size: "short", variant: "text", handleClick: this.toggleExpanded }, h("span", { key: '4c91e047f1dee9875c42d812320ad0f226ee700b' }, this.isExpanded ? 'Collapse' : 'Expand'), h("svg", { key: 'b3d46f11d64d46b25ffe2188564ec85ff0c91dbd', class: "toggle-icon", viewBox: "0 0 16 16" }, h("path", { key: '7f3fb545f8f65b58221dfc5afe4f69e9f5405ceb', d: "M4 6L8 10L12 6", stroke: "currentColor", "stroke-width": "2" }))))), h("div", { key: '19de05a6813e107e1e725eadf26f067627e21830', class: "anim-container", ref: el => (this.animContainerEl = el) }, h("div", { key: '67467dbead6e683cbc6afb03e0c92d874e180a92', class: "content-wrapper" }, (this.isExpanded || !isCollapsible) && rootGroup && (h("filter-group", { key: rootGroup.groupId, groupId: rootGroup.groupId, filterData: this.currentFilterData, fields: this.fields, isRoot: true, onAddFilter: e => this.handleAddFilter(e.detail), onAddGroup: e => this.handleAddGroup(e.detail), onRemoveFilter: e => this.handleRemoveFilter(e.detail), onRemoveGroup: e => this.handleRemoveGroup(e.detail), onFilterChange: this.handleFilterChange, onGroupChange: this.handleGroupChange, onDropOnFilter: this.handleDrop, openAddMenuForGroupId: this.openAddMenuForGroupId, onToggleAddMenu: this.handleToggleAddMenu, onDropOnGroup: this.handleDropOnGroup })))), showFooter && (h("div", { key: '0a9dfe2d54ea5a8be5af3dbf363092126dd36012', class: "advanced-filter-footer" }, h("validation-chip", { key: 'd275a7c66b573968bc9cca8fecdf8a2dd0f2dd0e', isValid: this.isFilterValid, errorMessages: this.errorMessages }), h("udp-button", { key: '7376ff4b438e1801394a5d9f99196ab80dc597e4', disabled: !this.isFilterValid, onClick: this.handleSearch, variant: "contained" }, "Search"))))));
-    }
-    get el() { return this; }
-    static get style() { return advancedSearchBuilderCss; }
-}, [257, "advanced-search-builder", {
-        "fields": [16],
-        "initialFilterData": [16],
-        "config": [16],
-        "openAddMenuForGroupId": [32],
-        "filterString": [32],
-        "isExpanded": [32],
-        "currentFilterData": [32],
-        "isFilterValid": [32],
-        "errorMessages": [32]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["advanced-search-builder", "custom-button", "filter-group", "udp-ambient-tool-tip", "udp-badge", "udp-button", "udp-chip", "udp-icon", "udp-icon-button", "udp-menu", "udp-menu-item", "unity-typography", "validation-chip"];
-    components.forEach(tagName => { switch (tagName) {
-        case "advanced-search-builder":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, AdvancedSearchBuilder);
-            }
-            break;
-        case "custom-button":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$c();
-            }
-            break;
-        case "filter-group":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$b();
-            }
-            break;
-        case "udp-ambient-tool-tip":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$a();
-            }
-            break;
-        case "udp-badge":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$9();
-            }
-            break;
-        case "udp-button":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$8();
-            }
-            break;
-        case "udp-chip":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$7();
-            }
-            break;
-        case "udp-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$6();
-            }
-            break;
-        case "udp-icon-button":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$5();
-            }
-            break;
-        case "udp-menu":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$4();
-            }
-            break;
-        case "udp-menu-item":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$3();
-            }
-            break;
-        case "unity-typography":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-        case "validation-chip":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-
-export { AdvancedSearchBuilder as A, defineCustomElement as d };
-//# sourceMappingURL=advanced-search-builder2.js.map
-
-//# sourceMappingURL=advanced-search-builder2.js.map
+import{p as e,H as t,c as i,h as s,d as o,t as n}from"./index2.js";import{g as a,d as r}from"./filter-group2.js";import{d}from"./custom-button2.js";import{d as l}from"./udp-ambient-tool-tip2.js";import{d as c}from"./udp-badge2.js";import{d as h}from"./udp-button2.js";import{d as p}from"./udp-chip2.js";import{d as u}from"./udp-icon2.js";import{d as f}from"./udp-icon-button2.js";import{d as m}from"./udp-menu2.js";import{d as b}from"./udp-menu-item2.js";import{d as g}from"./unity-typography2.js";import{d as v}from"./validation-chip2.js";const x=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.filterSave=i(this,"filterSave"),this.change=i(this,"change"),this.fields=[],this.config={},this.openAddMenuForGroupId=null,this.filterString="",this.isExpanded=!0,this.isFilterValid=!0,this.errorMessages=[],this.nextGroupId=1,this.handleSearch=()=>{this.isFilterValid&&this.filterSave?(this.filterSave.emit(this.currentFilterData),this.filterString=(e=>{if(!e||!e.filterGroups||0===e.filterGroups.length)return"";const t=i=>{const s=e.filterGroups.find((e=>e.groupId===i));if(!s)return"";const o=1===s.logicalSearchOperator?"AND":"OR",n=[];return e.filterElements.filter((e=>e.groupId===i)).forEach((e=>{n.push(`[${e.searchField}] ${e.searchOperator} ${"string"==typeof e.searchValue?`"${e.searchValue}"`:e.searchValue}`)})),e.filterGroups.filter((e=>e.parentGroupId===i)).forEach((e=>{const i=t(e.groupId);i&&n.push(`(${i})`)})),n.join(` ${o} `)},i=e.filterGroups.find((e=>null===e.parentGroupId));return i?t(i.groupId):""})(this.currentFilterData),this.config.collapsible&&this.toggleExpanded()):console.warn("Cannot run search: filter is invalid.")},this.toggleExpanded=()=>{this.isExpanded=!this.isExpanded,this.updateHostClasses()},this.handleToggleAddMenu=e=>{const t=e.detail;if(this.openAddMenuForGroupId=this.openAddMenuForGroupId===t?null:t,null!==this.openAddMenuForGroupId){const e=this.animContainerEl;e&&requestAnimationFrame((()=>{e.scrollTop=e.scrollHeight}))}},this.handleDrop=e=>{const t=e.detail.targetFilterId,i=e.detail.event.dataTransfer.getData("text/plain");i&&i!==t&&this.runUpdateCycle((e=>{const s=e.filterElements,o=s.find((e=>e._id===i));if(!o)return;const n=s.findIndex((e=>e._id===i)),a=s.findIndex((e=>e._id===t));s.splice(n,1),s.splice(a,0,o)}))},this.handleAddFilter=e=>{this.runUpdateCycle((t=>{var i,s;const o=null===(i=this.fields)||void 0===i?void 0:i[0],n=a(o),r=(null===(s=null==n?void 0:n[0])||void 0===s?void 0:s.value)||"";t.filterElements.push({_id:`filter_${Math.random()}`,_type:null==o?void 0:o.type,groupId:e,searchField:null==o?void 0:o.name,searchOperator:r,searchValue:""})})),this.openAddMenuForGroupId=null},this.handleAddGroup=e=>{this.runUpdateCycle((t=>{t.filterGroups.push({groupId:this.nextGroupId++,parentGroupId:e,logicalSearchOperator:1})})),this.openAddMenuForGroupId=null},this.handleRemoveFilter=e=>{this.runUpdateCycle((t=>{const i=t.filterElements.findIndex((t=>t._id===e));i>-1&&t.filterElements.splice(i,1)}))},this.handleRemoveGroup=e=>{this.runUpdateCycle((t=>{const i=e=>{const s=t.filterGroups.filter((t=>t.parentGroupId===e));let o=s.map((e=>e.groupId));return s.forEach((e=>{o=[...o,...i(e.groupId)]})),o},s=[e,...i(e)];t.filterGroups=t.filterGroups.filter((e=>!s.includes(e.groupId))),t.filterElements=t.filterElements.filter((e=>!s.includes(e.groupId)))}))},this.handleFilterChange=e=>{const{filterId:t,field:i,value:s,updates:o}=e.detail;this.runUpdateCycle((e=>{const n=e.filterElements.find((e=>e._id===t));n&&(o?Object.assign(n,o):n[i]=s)}))},this.handleGroupChange=e=>{const{groupId:t,logicalSearchOperator:i}=e.detail;this.runUpdateCycle((e=>{const s=e.filterGroups.find((e=>e.groupId===t));s&&(s.logicalSearchOperator=i)}))},this.handleDropOnGroup=e=>{const t=e.detail.event,i=e.detail.targetGroupId,s=t.dataTransfer.getData("application/drag-type"),o=t.dataTransfer.getData("text/plain");o&&this.runUpdateCycle((e=>{if("filter"===s){const t=e.filterElements.find((e=>e._id===o));t&&t.groupId!==i&&(t.groupId=i)}else if("group"===s){const t=parseInt(o,10),s=e.filterGroups.find((e=>e.groupId===t));s&&t!==i&&s.parentGroupId!==i&&!this.isDescendant(i,t,e.filterGroups)&&(s.parentGroupId=i)}}))}}componentWillLoad(){this.currentFilterData=this.getNormalizedData(this.initialFilterData),this.updateNextGroupId(this.currentFilterData)}componentDidLoad(){this.updateHostClasses()}updateHostClasses(){this.isExpanded?(this.el.classList.add("host-expanded"),this.el.classList.remove("host-collapsed")):(this.el.classList.add("host-collapsed"),this.el.classList.remove("host-expanded"),this.el.style.height=null)}updateNextGroupId(e){this.nextGroupId=e&&e.filterGroups.length>0?Math.max(...e.filterGroups.map((e=>e.groupId)))+1:2}verifyFilterState(e){const t=[],i=/^[0-9a-fA-F]{8}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{12}$/;return e.filterElements.forEach((e=>{delete e._error;const s=!e.searchValue,o="NULL"===e.searchOperator||"NOTNULL"===e.searchOperator;if(null==e.searchField||""===e.searchField){const i="Search Field cannot be empty.";e._error=i,t.push(i)}else if("BETWEEN"===e.searchOperator){const i=(e.searchValue||"").split(",");if(2!==i.length||!i[0]||!i[1]){const i=`Two values required when using BETWEEN operator for field "${e.searchField}".`;e._error=i,t.push(i)}}else if(s&&!o){const i=`Value cannot be empty for field "${e.searchField}".`;e._error=i,t.push(i)}else if("guid"===e._type&&!s&&!i.test(e.searchValue)){const i=`Invalid GUID for field "${e.searchField}".`;e._error=i,t.push(i)}})),{isValid:0===t.length,errors:t}}getNormalizedData(e){var t,i;if(e&&(null===(t=e.filterGroups)||void 0===t?void 0:t.length)>0)return e;if(e&&(null===(i=e.filterElements)||void 0===i?void 0:i.length)>0){const t=1;return Object.assign(Object.assign({},e),{filterGroups:[{groupId:t,parentGroupId:null,logicalSearchOperator:e.logicalSearchOperator||1}],filterElements:e.filterElements.map((e=>Object.assign(Object.assign({},e),{groupId:t})))})}return{logicalSearchOperator:1,filterGroups:[{groupId:1,parentGroupId:null,logicalSearchOperator:1}],filterElements:[]}}runUpdateCycle(e){const t=JSON.parse(JSON.stringify(this.currentFilterData));e(t),this.currentFilterData=t;const i=this.verifyFilterState(this.currentFilterData);this.isFilterValid=i.isValid,this.errorMessages=i.errors,this.change.emit(t)}isDescendant(e,t,i){let s=i.find((t=>t.groupId===e));for(;s&&null!==s.parentGroupId;){if(s.parentGroupId===t)return!0;s=i.find((e=>e.groupId===s.parentGroupId))}return!1}render(){const e=this.currentFilterData.filterGroups.find((e=>null===e.parentGroupId)),t=!0===this.config.collapsible,i=!1!==this.config.resizable,n=!1!==this.config.showFooter,a={"advanced-filter-container":!0,"is-expanded":this.isExpanded},r={};return this.isExpanded&&this.config.height&&(r.height=this.config.height),s(o,{key:"583fb7950382c83a9cf319973853d0ec857bbea9",style:r,class:{"is-resizable":i,"host-expanded":this.isExpanded,"host-collapsed":!this.isExpanded}},s("div",{key:"7df6526ffce9426ff3f55415f99b992ff55c9511",class:a},t&&s("div",{key:"bdbb944de64189d0c9179756f42a533c7b8da8f7",class:"collapsed-view"},s("input",{key:"28904bfb74a84e8a62a0f6d36bdcca1535e3ac34",type:"text",readonly:!0,value:this.filterString,class:"string-display-input"}),s("custom-button",{key:"e7136b4da73db4220fd2cee00771999edf8dad4c",class:"toggle-button",size:"short",variant:"text",handleClick:this.toggleExpanded},s("span",{key:"4c91e047f1dee9875c42d812320ad0f226ee700b"},this.isExpanded?"Collapse":"Expand"),s("svg",{key:"b3d46f11d64d46b25ffe2188564ec85ff0c91dbd",class:"toggle-icon",viewBox:"0 0 16 16"},s("path",{key:"7f3fb545f8f65b58221dfc5afe4f69e9f5405ceb",d:"M4 6L8 10L12 6",stroke:"currentColor","stroke-width":"2"})))),s("div",{key:"19de05a6813e107e1e725eadf26f067627e21830",class:"anim-container",ref:e=>this.animContainerEl=e},s("div",{key:"67467dbead6e683cbc6afb03e0c92d874e180a92",class:"content-wrapper"},(this.isExpanded||!t)&&e&&s("filter-group",{key:e.groupId,groupId:e.groupId,filterData:this.currentFilterData,fields:this.fields,isRoot:!0,onAddFilter:e=>this.handleAddFilter(e.detail),onAddGroup:e=>this.handleAddGroup(e.detail),onRemoveFilter:e=>this.handleRemoveFilter(e.detail),onRemoveGroup:e=>this.handleRemoveGroup(e.detail),onFilterChange:this.handleFilterChange,onGroupChange:this.handleGroupChange,onDropOnFilter:this.handleDrop,openAddMenuForGroupId:this.openAddMenuForGroupId,onToggleAddMenu:this.handleToggleAddMenu,onDropOnGroup:this.handleDropOnGroup}))),n&&s("div",{key:"0a9dfe2d54ea5a8be5af3dbf363092126dd36012",class:"advanced-filter-footer"},s("validation-chip",{key:"d275a7c66b573968bc9cca8fecdf8a2dd0f2dd0e",isValid:this.isFilterValid,errorMessages:this.errorMessages}),s("udp-button",{key:"7376ff4b438e1801394a5d9f99196ab80dc597e4",disabled:!this.isFilterValid,onClick:this.handleSearch,variant:"contained"},"Search"))))}get el(){return this}static get style(){return":host{display:flex;flex-direction:column;font-family:sans-serif;box-sizing:border-box;overflow:visible}:host(.host-collapsed){resize:none;height:auto}:host(.host-expanded){overflow-y:auto}:host(.is-resizable.host-expanded){resize:vertical;min-height:180px;max-height:80vh;overflow:auto}.advanced-filter-container{display:flex;flex-direction:column;height:100%;width:100%;overflow:hidden}.collapsed-view{display:flex;align-items:center;gap:0.5rem;padding:10px;border-bottom:1px solid #eee}.anim-container{flex-grow:1;overflow-y:auto;overflow-x:auto;display:flex}.content-wrapper{padding-bottom:15px;flex-grow:1}.advanced-filter-footer{display:flex;justify-content:flex-end;border-top:1px solid #eee;padding:10px;flex-shrink:0;gap:10px;align-items:center}.string-display-input{width:100%;padding:8px;border:1px solid #ccc;border-radius:4px;background-color:#f5f5f5;box-sizing:border-box;cursor:default;user-select:none}.string-display-input:focus{outline:none}.search-button{opacity:0;transform:scale(0.95);pointer-events:none;margin-right:10px}.advanced-filter-container.is-expanded .anim-container{overflow-y:auto;min-height:130px}.advanced-filter-container.is-expanded .collapsed-view{display:none}.advanced-filter-container.is-expanded .search-button{opacity:1;transform:scale(1);pointer-events:auto}.advanced-filter-container:not(.is-expanded) .anim-container{max-height:0;min-height:0;overflow:hidden}.advanced-filter-container:not(.is-expanded) .advanced-filter-footer{opacity:0;height:0;padding:0;border:none;pointer-events:none;overflow:hidden}"}},[1,"advanced-search-builder",{fields:[16],initialFilterData:[16],config:[16],openAddMenuForGroupId:[32],filterString:[32],isExpanded:[32],currentFilterData:[32],isFilterValid:[32],errorMessages:[32]}]);function y(){"undefined"!=typeof customElements&&["advanced-search-builder","custom-button","filter-group","udp-ambient-tool-tip","udp-badge","udp-button","udp-chip","udp-icon","udp-icon-button","udp-menu","udp-menu-item","unity-typography","validation-chip"].forEach((e=>{switch(e){case"advanced-search-builder":customElements.get(n(e))||customElements.define(n(e),x);break;case"custom-button":customElements.get(n(e))||d();break;case"filter-group":customElements.get(n(e))||r();break;case"udp-ambient-tool-tip":customElements.get(n(e))||l();break;case"udp-badge":customElements.get(n(e))||c();break;case"udp-button":customElements.get(n(e))||h();break;case"udp-chip":customElements.get(n(e))||p();break;case"udp-icon":customElements.get(n(e))||u();break;case"udp-icon-button":customElements.get(n(e))||f();break;case"udp-menu":customElements.get(n(e))||m();break;case"udp-menu-item":customElements.get(n(e))||b();break;case"unity-typography":customElements.get(n(e))||g();break;case"validation-chip":customElements.get(n(e))||v()}}))}export{x as A,y as d}

package/dist/components/advanced-search-grouped.js

@@ -1,9 +1 @@
-import { A as AdvancedSearchGrouped$1, d as defineCustomElement$1 } from './advanced-search-grouped2.js';
-
-const AdvancedSearchGrouped = AdvancedSearchGrouped$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { AdvancedSearchGrouped, defineCustomElement };
-//# sourceMappingURL=advanced-search-grouped.js.map
-
-//# sourceMappingURL=advanced-search-grouped.js.map
+import{A as a,d as o}from"./advanced-search-grouped2.js";const r=a,s=o;export{r as AdvancedSearchGrouped,s as defineCustomElement}