udp-stencil-component-library 1.0.0

package/dist/components/p-BlJaGZ4k.js

@@ -0,0 +1,366 @@
+import { C as ConfigService } from './p-Cn7PuhQz.js';
+import { m as makeApiCall } from './p-B-daVutk.js';
+
+var LogicalSearchOperator;
+(function (LogicalSearchOperator) {
+    LogicalSearchOperator[LogicalSearchOperator["And"] = 1] = "And";
+    LogicalSearchOperator[LogicalSearchOperator["Or"] = 2] = "Or";
+})(LogicalSearchOperator || (LogicalSearchOperator = {}));
+var SearchGroupingType;
+(function (SearchGroupingType) {
+    SearchGroupingType["None"] = "";
+    SearchGroupingType["Distinct"] = "Distinct";
+})(SearchGroupingType || (SearchGroupingType = {}));
+var SearchOperators;
+(function (SearchOperators) {
+    SearchOperators["EQUALS"] = "=";
+    SearchOperators["NOT_EQUALS"] = "!=";
+    SearchOperators["LIKE"] = "LIKE";
+    SearchOperators["GREATER_THAN"] = ">";
+    SearchOperators["GREATER_THAN_OR_EQUAL"] = ">=";
+    SearchOperators["LESS_THAN"] = "<";
+    SearchOperators["LESS_THAN_OR_EQUAL"] = "<=";
+    SearchOperators["IN"] = "IN";
+    SearchOperators["NOT_IN"] = "NOT IN";
+    SearchOperators["BETWEEN"] = "BETWEEN";
+    SearchOperators["STARTSWITH"] = "STARTSWITH";
+    SearchOperators["ENDSWITH"] = "ENDSWITH";
+})(SearchOperators || (SearchOperators = {}));
+class SearchBuilder {
+    constructor(pageNumber = 1, pageSize = 20) {
+        this.search = {
+            pageNumber,
+            pageSize,
+            filterElements: [],
+            orderElements: [],
+            filterGroups: [],
+            eagerLoad: false,
+            logicalSearchOperator: LogicalSearchOperator.And
+        };
+    }
+    /**
+     * Set eager loading
+     */
+    setEagerLoad(eagerLoad) {
+        this.search.eagerLoad = eagerLoad;
+        return this;
+    }
+    /**
+     * Set pagination
+     */
+    setPagination(pageNumber, pageSize) {
+        this.search.pageNumber = pageNumber;
+        this.search.pageSize = pageSize;
+        return this;
+    }
+    /**
+     * Set logical search operator (AND/OR)
+     */
+    setLogicalOperator(operator) {
+        this.search.logicalSearchOperator = operator;
+        return this;
+    }
+    /**
+     * Add a filter element
+     */
+    addFilter(searchField, searchValue, searchOperator = SearchOperators.EQUALS, searchValueType, groupId) {
+        this.search.filterElements.push({
+            searchField,
+            searchValue,
+            searchOperator,
+            searchValueType,
+            groupId
+        });
+        return this;
+    }
+    /**
+     * Add multiple filters
+     */
+    addFilters(filters) {
+        this.search.filterElements.push(...filters);
+        return this;
+    }
+    /**
+     * Add an order element
+     */
+    addOrder(sortColumn, sortDirection = 'ASC') {
+        this.search.orderElements.push({
+            sortColumn,
+            sortDirection
+        });
+        return this;
+    }
+    /**
+     * Add multiple order elements
+     */
+    addOrders(orders) {
+        this.search.orderElements.push(...orders);
+        return this;
+    }
+    /**
+     * Set grouping
+     */
+    setGrouping(groupingType, groupProperty, groupOperationList) {
+        this.search.groupingType = groupingType;
+        this.search.groupProperty = groupProperty;
+        this.search.groupOperationList = groupOperationList;
+        return this;
+    }
+    /**
+     * Add a filter group
+     */
+    addFilterGroup(groupId, groupOperator, parentGroupId) {
+        if (!this.search.filterGroups) {
+            this.search.filterGroups = [];
+        }
+        this.search.filterGroups.push({
+            groupId,
+            groupOperator,
+            parentGroupId
+        });
+        return this;
+    }
+    /**
+     * Clear all filters
+     */
+    clearFilters() {
+        this.search.filterElements = [];
+        return this;
+    }
+    /**
+     * Clear all orders
+     */
+    clearOrders() {
+        this.search.orderElements = [];
+        return this;
+    }
+    /**
+     * Clear all filter groups
+     */
+    clearFilterGroups() {
+        this.search.filterGroups = [];
+        return this;
+    }
+    /**
+     * Reset the search to default state
+     */
+    reset(pageNumber = 1, pageSize = 20) {
+        this.search = {
+            pageNumber,
+            pageSize,
+            filterElements: [],
+            orderElements: [],
+            filterGroups: [],
+            eagerLoad: false,
+            logicalSearchOperator: LogicalSearchOperator.And
+        };
+        return this;
+    }
+    /**
+     * Build and return the search object
+     */
+    build() {
+        return Object.assign({}, this.search);
+    }
+    /**
+     * Build and execute the search against a specific table/endpoint
+     */
+    async execute(tableName) {
+        const normalizedSearch = SearchUtilities.normalizeSearch(this.search);
+        return SearchUtilities.executeSearch(normalizedSearch, tableName);
+    }
+    /**
+     * Get a copy of the current search state
+     */
+    getSnapshot() {
+        return Object.assign({}, this.search);
+    }
+}
+/**
+ * Utility functions for search operations
+ */
+class SearchUtilities {
+    /**
+     * Create a basic search object
+     */
+    static createSearchObject(searchFilterElements = [], page = 1, pageSize = 20, eagerLoad = false, logicalSearchOperator = LogicalSearchOperator.And, searchFilterGroups = []) {
+        const searchObject = {
+            pageNumber: page,
+            pageSize: pageSize,
+            filterElements: [],
+            filterGroups: [],
+            orderElements: [],
+            groupingType: '',
+            groupProperty: [],
+            groupOperationList: [],
+            eagerLoad: eagerLoad,
+            logicalSearchOperator: logicalSearchOperator
+        };
+        if (searchFilterElements) {
+            searchFilterElements.forEach((property) => {
+                var _a;
+                const formattedPropertyName = property.searchField;
+                searchObject.filterElements = searchFilterElements;
+                // Add order elements if sort direction is specified
+                if (property.sortDirection) {
+                    const orderElement = {
+                        sortColumn: formattedPropertyName,
+                        sortDirection: property.sortDirection
+                    };
+                    searchObject.orderElements.push(orderElement);
+                }
+                // Handle distinct grouping
+                if (property.distinct) {
+                    searchObject.groupingType = SearchGroupingType.Distinct;
+                    (_a = searchObject.groupProperty) === null || _a === void 0 ? void 0 : _a.push(formattedPropertyName);
+                }
+            });
+        }
+        searchObject.filterGroups = searchFilterGroups;
+        return searchObject;
+    }
+    /**
+     * Create a simple filter
+     */
+    static createFilter(field, value, operator = SearchOperators.EQUALS, valueType, groupId) {
+        return {
+            searchField: field,
+            searchValue: value,
+            searchOperator: operator,
+            searchValueType: valueType,
+            groupId: groupId
+        };
+    }
+    /**
+     * Create a LIKE filter for text search
+     */
+    static createLikeFilter(field, value, groupId) {
+        return this.createFilter(field, `%${value}%`, SearchOperators.LIKE, undefined, groupId);
+    }
+    /**
+     * Create an IN filter for multiple values
+     */
+    static createInFilter(field, values, groupId) {
+        return this.createFilter(field, values.join(','), SearchOperators.IN, undefined, groupId);
+    }
+    /**
+     * Create a date range filter
+     */
+    static createDateRangeFilter(field, startDate, endDate, groupId) {
+        return this.createFilter(field, `${startDate},${endDate}`, SearchOperators.BETWEEN, undefined, groupId);
+    }
+    /**
+     * Create an order element
+     */
+    static createOrder(column, direction = 'ASC') {
+        return {
+            sortColumn: column,
+            sortDirection: direction
+        };
+    }
+    /**
+     * Merge multiple search objects
+     */
+    static mergeSearchObjects(...searches) {
+        if (searches.length === 0) {
+            throw new Error('At least one search object is required');
+        }
+        const merged = searches[0];
+        for (let i = 1; i < searches.length; i++) {
+            const search = searches[i];
+            merged.filterElements.push(...search.filterElements);
+            merged.orderElements.push(...search.orderElements);
+            if (search.filterGroups) {
+                merged.filterGroups = merged.filterGroups || [];
+                merged.filterGroups.push(...search.filterGroups);
+            }
+        }
+        return merged;
+    }
+    /**
+     * Validate a search object - only fails on critical issues
+     */
+    static validateSearch(search) {
+        const errors = [];
+        if (!search) {
+            errors.push('Search object is required');
+            return { isValid: false, errors };
+        }
+        // Only validate critical issues, not missing optional elements
+        if (search.pageNumber !== undefined && search.pageNumber < 1) {
+            errors.push('Page number must be greater than 0');
+        }
+        if (search.pageSize !== undefined && search.pageSize < 1) {
+            errors.push('Page size must be greater than 0');
+        }
+        // Don't require arrays to exist - they can be empty/missing for valid searches
+        return {
+            isValid: errors.length === 0,
+            errors
+        };
+    }
+    /**
+     * Normalize a search object - applies defaults for missing values
+     */
+    static normalizeSearch(search) {
+        return {
+            pageNumber: search.pageNumber || 1,
+            pageSize: search.pageSize || 15,
+            filterElements: search.filterElements || [],
+            orderElements: search.orderElements || [],
+            filterGroups: search.filterGroups || [],
+            eagerLoad: search.eagerLoad || false,
+            logicalSearchOperator: search.logicalSearchOperator || LogicalSearchOperator.And,
+            groupingType: search.groupingType || '',
+            groupProperty: search.groupProperty || [],
+            groupOperationList: search.groupOperationList || []
+        };
+    }
+    /**
+     * Execute a search against a specific database table/endpoint
+     */
+    static async executeSearch(search, tableName) {
+        const normalizedSearch = this.normalizeSearch(search);
+        // Validate the search
+        const validation = this.validateSearch(normalizedSearch);
+        if (!validation.isValid) {
+            throw new Error(`Invalid search: ${validation.errors.join(', ')}`);
+        }
+        // Build the API URL
+        const url = `${ConfigService.productV1ApiUrl}/${tableName}/search`;
+        // Execute the search
+        try {
+            const response = await makeApiCall('POST', url, normalizedSearch);
+            return response;
+        }
+        catch (error) {
+            console.error(`Error executing search for table ${tableName}:`, error);
+            throw error;
+        }
+    }
+    /**
+     * Execute a search with custom endpoint (for non-standard endpoints)
+     */
+    static async executeSearchWithEndpoint(search, endpoint) {
+        const normalizedSearch = this.normalizeSearch(search);
+        // Validate the search
+        const validation = this.validateSearch(normalizedSearch);
+        if (!validation.isValid) {
+            throw new Error(`Invalid search: ${validation.errors.join(', ')}`);
+        }
+        // Execute the search
+        try {
+            const response = await makeApiCall('POST', endpoint, normalizedSearch);
+            return response;
+        }
+        catch (error) {
+            console.error(`Error executing search for endpoint ${endpoint}:`, error);
+            throw error;
+        }
+    }
+}
+
+export { LogicalSearchOperator as L, SearchBuilder as S, SearchUtilities as a, SearchGroupingType as b, SearchOperators as c };
+//# sourceMappingURL=p-BlJaGZ4k.js.map
+
+//# sourceMappingURL=p-BlJaGZ4k.js.map

package/dist/components/p-BlJaGZ4k.js.map

@@ -0,0 +1 @@
+{"file":"p-BlJaGZ4k.js","mappings":"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","names":[],"sources":["src/udp-utilities/search/SearchBuilder.ts"],"sourcesContent":["import { Nullable } from '../../global/types';\nimport { ConfigService } from '../api-config';\nimport { makeApiCall } from '../api/makeApiCall/makeApiCall';\n\nexport interface SearchFilters {\n  searchField: string;\n  searchValue: string;\n  searchOperator: string;\n  searchValueType?: number;\n  groupId?: Nullable<number>;\n}\n\nexport interface SearchFilterGroups {\n  groupId: number;\n  groupOperator: number;\n  parentGroupId: number;\n}\n\nexport interface GroupOperation {\n  operation: string; // i.e. SUM, AVG, COUNT, MIN, MAX\n  property: string;\n}\n\nexport interface OrderElement {\n  sortColumn: string;\n  sortDirection: string;\n}\n\nexport interface Search {\n  eagerLoad?: boolean;\n  pageNumber: number;\n  pageSize: number;\n  groupingType?: string;\n  groupProperty?: string[];\n  groupOperationList?: GroupOperation[];\n  orderElements: OrderElement[];\n  filterElements: SearchFilters[];\n  filterGroups?: SearchFilterGroups[];\n  logicalSearchOperator?: number;\n}\n\nexport enum LogicalSearchOperator {\n  And = 1,\n  Or = 2\n}\n\nexport enum SearchGroupingType {\n  None = '',\n  Distinct = 'Distinct'\n}\n\nexport enum SearchOperators {\n  EQUALS = '=',\n  NOT_EQUALS = '!=',\n  LIKE = 'LIKE',\n  GREATER_THAN = '>',\n  GREATER_THAN_OR_EQUAL = '>=',\n  LESS_THAN = '<',\n  LESS_THAN_OR_EQUAL = '<=',\n  IN = 'IN',\n  NOT_IN = 'NOT IN',\n  BETWEEN = 'BETWEEN',\n  STARTSWITH = 'STARTSWITH',\n  ENDSWITH = 'ENDSWITH'\n}\n\nexport class SearchBuilder {\n  private search: Search;\n\n  constructor(pageNumber: number = 1, pageSize: number = 20) {\n    this.search = {\n      pageNumber,\n      pageSize,\n      filterElements: [],\n      orderElements: [],\n      filterGroups: [],\n      eagerLoad: false,\n      logicalSearchOperator: LogicalSearchOperator.And\n    };\n  }\n\n  /**\n   * Set eager loading\n   */\n  setEagerLoad(eagerLoad: boolean): SearchBuilder {\n    this.search.eagerLoad = eagerLoad;\n    return this;\n  }\n\n  /**\n   * Set pagination\n   */\n  setPagination(pageNumber: number, pageSize: number): SearchBuilder {\n    this.search.pageNumber = pageNumber;\n    this.search.pageSize = pageSize;\n    return this;\n  }\n\n  /**\n   * Set logical search operator (AND/OR)\n   */\n  setLogicalOperator(operator: LogicalSearchOperator): SearchBuilder {\n    this.search.logicalSearchOperator = operator;\n    return this;\n  }\n\n  /**\n   * Add a filter element\n   */\n  addFilter(\n    searchField: string,\n    searchValue: string,\n    searchOperator: string = SearchOperators.EQUALS,\n    searchValueType?: number,\n    groupId?: Nullable<number>\n  ): SearchBuilder {\n    this.search.filterElements.push({\n      searchField,\n      searchValue,\n      searchOperator,\n      searchValueType,\n      groupId\n    });\n    return this;\n  }\n\n  /**\n   * Add multiple filters\n   */\n  addFilters(filters: SearchFilters[]): SearchBuilder {\n    this.search.filterElements.push(...filters);\n    return this;\n  }\n\n  /**\n   * Add an order element\n   */\n  addOrder(sortColumn: string, sortDirection: string = 'ASC'): SearchBuilder {\n    this.search.orderElements.push({\n      sortColumn,\n      sortDirection\n    });\n    return this;\n  }\n\n  /**\n   * Add multiple order elements\n   */\n  addOrders(orders: OrderElement[]): SearchBuilder {\n    this.search.orderElements.push(...orders);\n    return this;\n  }\n\n  /**\n   * Set grouping\n   */\n  setGrouping(\n    groupingType: string,\n    groupProperty?: string[],\n    groupOperationList?: GroupOperation[]\n  ): SearchBuilder {\n    this.search.groupingType = groupingType;\n    this.search.groupProperty = groupProperty;\n    this.search.groupOperationList = groupOperationList;\n    return this;\n  }\n\n  /**\n   * Add a filter group\n   */\n  addFilterGroup(\n    groupId: number,\n    groupOperator: number,\n    parentGroupId: number\n  ): SearchBuilder {\n    if (!this.search.filterGroups) {\n      this.search.filterGroups = [];\n    }\n    this.search.filterGroups.push({\n      groupId,\n      groupOperator,\n      parentGroupId\n    });\n    return this;\n  }\n\n  /**\n   * Clear all filters\n   */\n  clearFilters(): SearchBuilder {\n    this.search.filterElements = [];\n    return this;\n  }\n\n  /**\n   * Clear all orders\n   */\n  clearOrders(): SearchBuilder {\n    this.search.orderElements = [];\n    return this;\n  }\n\n  /**\n   * Clear all filter groups\n   */\n  clearFilterGroups(): SearchBuilder {\n    this.search.filterGroups = [];\n    return this;\n  }\n\n  /**\n   * Reset the search to default state\n   */\n  reset(pageNumber: number = 1, pageSize: number = 20): SearchBuilder {\n    this.search = {\n      pageNumber,\n      pageSize,\n      filterElements: [],\n      orderElements: [],\n      filterGroups: [],\n      eagerLoad: false,\n      logicalSearchOperator: LogicalSearchOperator.And\n    };\n    return this;\n  }\n\n  /**\n   * Build and return the search object\n   */\n  build(): Search {\n    return { ...this.search };\n  }\n\n  /**\n   * Build and execute the search against a specific table/endpoint\n   */\n  async execute(tableName: string): Promise<any> {\n    const normalizedSearch = SearchUtilities.normalizeSearch(this.search);\n    return SearchUtilities.executeSearch(normalizedSearch, tableName);\n  }\n\n  /**\n   * Get a copy of the current search state\n   */\n  getSnapshot(): Search {\n    return { ...this.search };\n  }\n}\n\n/**\n * Utility functions for search operations\n */\nexport class SearchUtilities {\n  /**\n   * Create a basic search object\n   */\n  static createSearchObject(\n    searchFilterElements: SearchFilters[] = [],\n    page: number = 1,\n    pageSize: number = 20,\n    eagerLoad: boolean = false,\n    logicalSearchOperator: LogicalSearchOperator = LogicalSearchOperator.And,\n    searchFilterGroups: SearchFilterGroups[] = []\n  ): Search {\n    const searchObject: Search = {\n      pageNumber: page,\n      pageSize: pageSize,\n      filterElements: [],\n      filterGroups: [],\n      orderElements: [],\n      groupingType: '',\n      groupProperty: [],\n      groupOperationList: [],\n      eagerLoad: eagerLoad,\n      logicalSearchOperator: logicalSearchOperator\n    };\n\n    if (searchFilterElements) {\n      searchFilterElements.forEach((property) => {\n        const formattedPropertyName = property.searchField;\n        searchObject.filterElements = searchFilterElements;\n\n        // Add order elements if sort direction is specified\n        if ((property as any).sortDirection) {\n          const orderElement = {\n            sortColumn: formattedPropertyName,\n            sortDirection: (property as any).sortDirection\n          };\n          searchObject.orderElements.push(orderElement);\n        }\n\n        // Handle distinct grouping\n        if ((property as any).distinct) {\n          searchObject.groupingType = SearchGroupingType.Distinct;\n          searchObject.groupProperty?.push(formattedPropertyName);\n        }\n      });\n    }\n\n    searchObject.filterGroups = searchFilterGroups;\n    return searchObject;\n  }\n\n  /**\n   * Create a simple filter\n   */\n  static createFilter(\n    field: string,\n    value: string,\n    operator: string = SearchOperators.EQUALS,\n    valueType?: number,\n    groupId?: Nullable<number>\n  ): SearchFilters {\n    return {\n      searchField: field,\n      searchValue: value,\n      searchOperator: operator,\n      searchValueType: valueType,\n      groupId: groupId\n    };\n  }\n\n  /**\n   * Create a LIKE filter for text search\n   */\n  static createLikeFilter(field: string, value: string, groupId?: Nullable<number>): SearchFilters {\n    return this.createFilter(field, `%${value}%`, SearchOperators.LIKE, undefined, groupId);\n  }\n\n  /**\n   * Create an IN filter for multiple values\n   */\n  static createInFilter(field: string, values: string[], groupId?: Nullable<number>): SearchFilters {\n    return this.createFilter(field, values.join(','), SearchOperators.IN, undefined, groupId);\n  }\n\n  /**\n   * Create a date range filter\n   */\n  static createDateRangeFilter(\n    field: string,\n    startDate: string,\n    endDate: string,\n    groupId?: Nullable<number>\n  ): SearchFilters {\n    return this.createFilter(field, `${startDate},${endDate}`, SearchOperators.BETWEEN, undefined, groupId);\n  }\n\n  /**\n   * Create an order element\n   */\n  static createOrder(column: string, direction: 'ASC' | 'DESC' = 'ASC'): OrderElement {\n    return {\n      sortColumn: column,\n      sortDirection: direction\n    };\n  }\n\n  /**\n   * Merge multiple search objects\n   */\n  static mergeSearchObjects(...searches: Search[]): Search {\n    if (searches.length === 0) {\n      throw new Error('At least one search object is required');\n    }\n\n    const merged = searches[0];\n\n    for (let i = 1; i < searches.length; i++) {\n      const search = searches[i];\n      merged.filterElements.push(...search.filterElements);\n      merged.orderElements.push(...search.orderElements);\n      if (search.filterGroups) {\n        merged.filterGroups = merged.filterGroups || [];\n        merged.filterGroups.push(...search.filterGroups);\n      }\n    }\n\n    return merged;\n  }\n\n  /**\n   * Validate a search object - only fails on critical issues\n   */\n  static validateSearch(search: Search): { isValid: boolean; errors: string[] } {\n    const errors: string[] = [];\n\n    if (!search) {\n      errors.push('Search object is required');\n      return { isValid: false, errors };\n    }\n\n    // Only validate critical issues, not missing optional elements\n    if (search.pageNumber !== undefined && search.pageNumber < 1) {\n      errors.push('Page number must be greater than 0');\n    }\n\n    if (search.pageSize !== undefined && search.pageSize < 1) {\n      errors.push('Page size must be greater than 0');\n    }\n\n    // Don't require arrays to exist - they can be empty/missing for valid searches\n    return {\n      isValid: errors.length === 0,\n      errors\n    };\n  }\n\n  /**\n   * Normalize a search object - applies defaults for missing values\n   */\n  static normalizeSearch(search: Partial<Search>): Search {\n    return {\n      pageNumber: search.pageNumber || 1,\n      pageSize: search.pageSize || 15,\n      filterElements: search.filterElements || [],\n      orderElements: search.orderElements || [],\n      filterGroups: search.filterGroups || [],\n      eagerLoad: search.eagerLoad || false,\n      logicalSearchOperator: search.logicalSearchOperator || LogicalSearchOperator.And,\n      groupingType: search.groupingType || '',\n      groupProperty: search.groupProperty || [],\n      groupOperationList: search.groupOperationList || []\n    };\n  }\n\n  /**\n   * Execute a search against a specific database table/endpoint\n   */\n  static async executeSearch(search: Search | Partial<Search>, tableName: string): Promise<any> {\n    const normalizedSearch = this.normalizeSearch(search);\n    \n    // Validate the search\n    const validation = this.validateSearch(normalizedSearch);\n    if (!validation.isValid) {\n      throw new Error(`Invalid search: ${validation.errors.join(', ')}`);\n    }\n\n    // Build the API URL\n    const url = `${ConfigService.productV1ApiUrl}/${tableName}/search`;\n    \n    // Execute the search\n    try {\n      const response = await makeApiCall('POST', url, normalizedSearch);\n      return response;\n    } catch (error) {\n      console.error(`Error executing search for table ${tableName}:`, error);\n      throw error;\n    }\n  }\n\n  /**\n   * Execute a search with custom endpoint (for non-standard endpoints)\n   */\n  static async executeSearchWithEndpoint(search: Search | Partial<Search>, endpoint: string): Promise<any> {\n    const normalizedSearch = this.normalizeSearch(search);\n    \n    // Validate the search\n    const validation = this.validateSearch(normalizedSearch);\n    if (!validation.isValid) {\n      throw new Error(`Invalid search: ${validation.errors.join(', ')}`);\n    }\n\n    // Execute the search\n    try {\n      const response = await makeApiCall('POST', endpoint, normalizedSearch);\n      return response;\n    } catch (error) {\n      console.error(`Error executing search for endpoint ${endpoint}:`, error);\n      throw error;\n    }\n  }\n}\n"],"version":3}

package/dist/components/p-BmbhN5rI.js

@@ -0,0 +1,179 @@
+import { p as proxyCustomElement, H, c as createEvent, h } from './p-DPon6DDX.js';
+import { d as defineCustomElement$3 } from './p-B0DDn0I9.js';
+import { d as defineCustomElement$2 } from './p-CpGuVcRn.js';
+import { d as defineCustomElement$1 } from './p-DkppmXNM.js';
+
+const udpDynamicContainerWithMenuCss = ".container{width:100%;overflow:hidden;display:flex;flex-wrap:nowrap;flex:1;min-width:600px;}.menu{display:flex;flex-direction:column;gap:8px}.chips{display:flex;gap:8px;flex-grow:1;}.overflow{display:flex}";
+
+//import Menu16 from '@carbon/icons/es/menu/16';
+function debounce(func, wait) {
+    let timeout = null;
+    return (...args) => {
+        if (timeout) {
+            clearTimeout(timeout);
+        }
+        timeout = setTimeout(() => {
+            func(...args);
+        }, wait);
+    };
+}
+const DynamicContainerWithMenu = /*@__PURE__*/ proxyCustomElement(class DynamicContainerWithMenu extends H {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.udpChipClicked = createEvent(this, "udpChipClicked");
+        this.visibleChildren = null;
+        this.menuChildren = [];
+        this.anchorEl = null;
+        this.containerWidth = 0;
+        this.rerender = 0;
+        this.renderReady = false; // a flag to indicate readiness to render
+        this.popoverOpen = false;
+        this.externalToggle = '';
+        this.menuItems = []; // renamed from children
+        this.open = false;
+        this.id = '';
+        // handlePopoverClick(event?: Event) {
+        //   if (!event) return;
+        //   this.anchorEl = event.target as HTMLElement;
+        //   this.open = Boolean(this.anchorEl);
+        //   this.id = this.open ? 'simple-popover' : undefined;
+        // }
+        // handlePopoverClose() {
+        //   this.anchorEl = null;
+        //   this.open = false;
+        // }
+        this.handlePopover = () => {
+            this.popoverOpen = !this.popoverOpen;
+        };
+        this.boundCalculateChildren = debounce(this.calculateChildren.bind(this), 300);
+    }
+    // Was causing a loop when connected to the api
+    // connectedCallback() {
+    //   this.calculateChildren();
+    // }
+    componentWillLoad() {
+        // This lifecycle hook will be called before the first render,
+        // ensuring calculateChildren is called before the component renders
+        // this.calculateChildren();
+    }
+    componentWillUpdate() {
+        // This lifecycle hook will be called before every update (re-render),
+        // ensuring calculateChildren is called before the component re-renders
+        // this.calculateChildren();
+    }
+    async calculateChildren() {
+        if (!this.el.shadowRoot)
+            return;
+        console.log('Calculating children...');
+        console.log('Menu Items:', JSON.stringify(this.menuItems));
+        const container = this.el.shadowRoot.querySelector('.container');
+        console.log('Container:', container);
+        if (container) {
+            this.containerWidth = container.offsetWidth;
+            console.log('Container Width:', this.containerWidth);
+        }
+        let currentWidth = 0;
+        const newVisibleChildren = [];
+        const newMenuChildren = [];
+        this.menuItems.forEach((child) => {
+            var _a;
+            if (child) {
+                const childWidth = ((_a = child.props) === null || _a === void 0 ? void 0 : _a.width) || 100;
+                // console.log(`Child[${index}] Width:`, childWidth);
+                if (currentWidth + childWidth <= this.containerWidth) {
+                    currentWidth += childWidth;
+                    newVisibleChildren.push(child);
+                }
+                else {
+                    newMenuChildren.push(child);
+                }
+            }
+        });
+        this.visibleChildren = [...newVisibleChildren];
+        this.menuChildren = [...newMenuChildren];
+        this.rerender += 1;
+    }
+    childrenChanged() {
+        this.calculateChildren();
+    }
+    async componentDidLoad() {
+        // Existing logic
+        await this.calculateChildren().then(() => {
+            this.renderReady = true; // set the flag to true after calculating
+        });
+        window.addEventListener('resize', this.boundCalculateChildren);
+        // New logic for listening to stencil-chip click events
+        const chips = Array.from(document.querySelectorAll('stencil-chip'));
+        chips.forEach(chip => {
+            chip.addEventListener('chipClicked', (event) => {
+                // Forward this data to the upper-level parent
+                const chipText = event.detail;
+                this.handleChipClick(chipText);
+            });
+        });
+    }
+    disconnectedCallback() {
+        window.removeEventListener('resize', this.boundCalculateChildren);
+    }
+    // handleChipClick = (event: CustomEvent) => {
+    //   const chipLabel = event.detail;
+    // }
+    handleChipClick(chipText) {
+        this.udpChipClicked.emit(chipText);
+    }
+    render() {
+        return (h("div", { key: '788fbdc6bbff378de0df16fa536ed59794cf2949', class: "container" }, h("div", { key: '847f4955e73406f94e23a3368a85a790bbadb3b9', class: "chips" }, console.log('Received data for chips via executeQwith', this.visibleChildren), this.visibleChildren && this.visibleChildren.map((child, index) => (h("stencil-chip", { color: "secondary", key: index, text: child.description, "show-delete": "false", externalToggleString: this.externalToggle })))), h("div", { key: '24dddaf21877dbda9af36d8618a5db780df27959', class: "overflow" }, h("udp-pop-over", { key: '43e992c11cf4ff441b192b44919491589a139341', isOpen: this.popoverOpen, anchorElement: document.getElementById('anchorElement') }, h("div", { key: '1638e9b65aec05a380bd880f66a3bbad3cbccbc8', class: "menu" }, this.menuChildren && this.menuChildren.map((child, index) => (h("stencil-chip", { key: index, text: child.label, "show-delete": "false" }, " "))))))));
+    }
+    get el() { return this; }
+    static get watchers() { return {
+        "menuItems": ["childrenChanged"]
+    }; }
+    static get style() { return udpDynamicContainerWithMenuCss; }
+}, [1, "udp-dynamic-container-with-menu", {
+        "externalToggle": [1, "external-toggle"],
+        "menuItems": [16, "menu-items"],
+        "visibleChildren": [32],
+        "menuChildren": [32],
+        "anchorEl": [32],
+        "rerender": [32],
+        "renderReady": [32],
+        "popoverOpen": [32],
+        "calculateChildren": [64]
+    }, undefined, {
+        "menuItems": ["childrenChanged"]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["udp-dynamic-container-with-menu", "stencil-chip", "udp-pop-over", "unity-typography"];
+    components.forEach(tagName => { switch (tagName) {
+        case "udp-dynamic-container-with-menu":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, DynamicContainerWithMenu);
+            }
+            break;
+        case "stencil-chip":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "udp-pop-over":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+        case "unity-typography":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+
+export { DynamicContainerWithMenu as D, defineCustomElement as d };
+//# sourceMappingURL=p-BmbhN5rI.js.map
+
+//# sourceMappingURL=p-BmbhN5rI.js.map

package/dist/components/p-BmbhN5rI.js.map

@@ -0,0 +1 @@
+{"file":"p-BmbhN5rI.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/udp-utilities/layout/udp-dynamic-container-with-menu/udp-dynamic-container-with-menu.css?tag=udp-dynamic-container-with-menu&encapsulation=shadow","src/udp-utilities/layout/udp-dynamic-container-with-menu/udp-dynamic-container-with-menu.tsx"],"sourcesContent":[".container {\n    width: 100%;\n    overflow: hidden;\n    display: flex;\n    flex-wrap: nowrap;\n    flex: 1;\n    min-width: 600px;\n    /* background-color: azure; */\n  }\n  \n.menu {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n}\n\n.chips {\n  display: flex; \n  gap: 8px; \n  flex-grow: 1;\n  /* padding-top: 8px;\n  padding-bottom: 8px; */\n}\n\n.overflow {\n  display: flex;\n}","import { Component, State, h, Prop, Element, Watch, Method, Event, EventEmitter } from '@stencil/core';\n//import Menu16 from '@carbon/icons/es/menu/16';\n\nfunction debounce(func: (...args: any[]) => void, wait: number): (...args: any[]) => void {\n  let timeout: NodeJS.Timeout | null = null;\n  return (...args: any[]) => {\n    if (timeout) {\n      clearTimeout(timeout);\n    }\n    timeout = setTimeout(() => {\n      func(...args);\n    }, wait);\n  };\n}\n\n@Component({\n  tag: 'udp-dynamic-container-with-menu',\n  styleUrl: 'udp-dynamic-container-with-menu.css',\n  shadow: true,\n})\nexport class DynamicContainerWithMenu {\n  @Element() el: HTMLElement;\n  @State() visibleChildren: any[] | null = null;\n\n  @State() menuChildren = [];\n  @State() anchorEl: HTMLElement | null = null;\n  containerWidth: number = 0;\n  @State() rerender: number = 0;\n  @State() renderReady: boolean = false; // a flag to indicate readiness to render\n  @State() popoverOpen: boolean = false;\n  @Prop() externalToggle: string = '';\n\n  @Prop() menuItems: any[] = []; // renamed from children\n\n  @Event() udpChipClicked: EventEmitter<string>;\n\n  open: boolean = false;\n  id: string = '';\n  boundCalculateChildren: any;\n\n  constructor() {\n    this.boundCalculateChildren = debounce(this.calculateChildren.bind(this), 300);\n  }\n  \n// Was causing a loop when connected to the api\n  // connectedCallback() {\n  //   this.calculateChildren();\n  // }\n\n\n  componentWillLoad() {\n    // This lifecycle hook will be called before the first render,\n    // ensuring calculateChildren is called before the component renders\n    // this.calculateChildren();\n  }\n\n  componentWillUpdate() {\n    // This lifecycle hook will be called before every update (re-render),\n    // ensuring calculateChildren is called before the component re-renders\n    // this.calculateChildren();\n  }\n\n  \n  \n\n\n  @Method()\n  async calculateChildren() {\n    if (!this.el.shadowRoot) return;\n  \n    console.log('Calculating children...');\n    console.log('Menu Items:', JSON.stringify(this.menuItems));\n    \n    const container: HTMLElement | null = this.el.shadowRoot.querySelector('.container')  ;\n    console.log('Container:', container);\n\n\n    \n    if (container) {\n      this.containerWidth = container.offsetWidth ;\n      console.log('Container Width:', this.containerWidth);\n    }\n  \n    let currentWidth = 0;\n    const newVisibleChildren = [];\n    const newMenuChildren = [];\n  \n    this.menuItems.forEach((child) => {\n      if (child) {\n        const childWidth = (child as any).props?.width || 100;\n        // console.log(`Child[${index}] Width:`, childWidth);\n        \n        if (currentWidth + childWidth <= this.containerWidth) {\n          currentWidth += childWidth;\n          newVisibleChildren.push(child);\n        } else {\n          newMenuChildren.push(child);\n        }\n      }\n    });\n\n    \n    this.visibleChildren = [...newVisibleChildren];\n    this.menuChildren = [...newMenuChildren];\n    this.rerender += 1;\n  }\n  \n\n  @Watch('menuItems')\n  childrenChanged() {\n    this.calculateChildren();\n  }\n\n  async componentDidLoad() {\n    // Existing logic\n    await this.calculateChildren().then(() => {\n      this.renderReady = true;  // set the flag to true after calculating\n    });\n    window.addEventListener('resize', this.boundCalculateChildren);\n\n    // New logic for listening to stencil-chip click events\n    const chips = Array.from(document.querySelectorAll('stencil-chip'));\n    chips.forEach(chip => {\n      chip.addEventListener('chipClicked', (event: CustomEvent) => {\n        // Forward this data to the upper-level parent\n        const chipText = event.detail;\n        this.handleChipClick(chipText);\n      });\n    });\n  }\n\n  disconnectedCallback() {\n    window.removeEventListener('resize', this.boundCalculateChildren);\n  }\n\n  // handlePopoverClick(event?: Event) {\n  //   if (!event) return;\n  //   this.anchorEl = event.target as HTMLElement;\n  //   this.open = Boolean(this.anchorEl);\n  //   this.id = this.open ? 'simple-popover' : undefined;\n  // }\n\n  // handlePopoverClose() {\n  //   this.anchorEl = null;\n  //   this.open = false;\n  // }\n\n  handlePopover = () => {\n    this.popoverOpen = !this.popoverOpen;\n  }\n\n\n  // handleChipClick = (event: CustomEvent) => {\n  //   const chipLabel = event.detail;\n   \n  // }\n\n  handleChipClick(chipText: string) {\n    this.udpChipClicked.emit(chipText);\n  }\n\n\n  render() {\n  \n    return (\n      <div class=\"container\">\n        {/* <div class=\"chips\">\n          {this.visibleChildren && this.visibleChildren.map((child, index) => (\n            <stencil-chip color=\"secondary\" key={index} text={child.label} show-delete=\"false\" > </stencil-chip>\n          ))}\n        </div> */}\n\n<div class=\"chips\">\n{console.log('Received data for chips via executeQwith', this.visibleChildren)}\n      {this.visibleChildren && this.visibleChildren.map((child, index) => (\n        <stencil-chip\n          color=\"secondary\"\n          key={index}\n          text={child.description\n          }\n          show-delete=\"false\"\n          externalToggleString={this.externalToggle}\n        >\n        </stencil-chip>\n      ))}\n      \n    </div>\n\n\n    <div class=\"overflow\" >\n      {/* @todo: overflow button commented out */}\n        {/* <stencil-icon-button showLabel={false}  icon={Menu16}  onClick={this.handlePopover}></stencil-icon-button> */}\n        <udp-pop-over isOpen={this.popoverOpen} anchorElement={document.getElementById('anchorElement')}>\n            <div class=\"menu\" >\n            {this.menuChildren && this.menuChildren.map((child, index) => (\n                        <stencil-chip key={index} text={child.label}  show-delete=\"false\" > </stencil-chip>\n            ))}\n            </div>\n        </udp-pop-over>\n       \n        </div>      \n      </div>\n    );\n  }\n  \n  \n\n}\n"],"version":3}