udp-stencil-component-library 25.18.1-beta.6 → 25.18.1-beta.8

package/dist/esm/udp-forms-list-card.entry.js

@@ -19,19 +19,19 @@ const UdpFormsListCard = class {
         };
     }
     render() {
-        const contentJsx = (h(Fragment, { key: '86922a9f530c257641a1e9763380bd8301930fa6' }, h("unity-typography", { key: 'ca878765706008f05d07d44545305f655500769f', variant: "body1", color: "textSecondary" }, "Version: ", this.data.version), !this.isSideSheetList && (h("unity-typography", { key: '6c72d85939583f423cbb587e905eca34d3c81447', variant: "body1", color: "textSecondary" }, "Last Modified: ", new Date(this.data.lastModifiedOn).toLocaleDateString())), h("unity-typography", { key: '8f4e7bdf40cd6f75aaa4ce6d44e47fe8e0d7ff9b', variant: "body1", color: "textSecondary" }, "Created On: ", this.isSideSheetList ? new Date(this.data.createdOn).toLocaleDateString() : new Date(this.data.initialCreatedOn).toLocaleDateString()), h("unity-typography", { key: '93151c42c577d98e0de4baf953ae8b672b93d04b', variant: "body1", color: "textSecondary" }, "Form Type: ", UdpFormsTypeEnum[this.data.type])));
-        const actionsJsx = (h(Fragment, { key: 'c981118cbef8130ea3ba4b544389d09b0672e7c7' }, h("stencil-icon-button", { key: 'fb62c37e3aba0d6385e76bd88c7052f50505aa15', icon: Edit16, tooltip: "Open in Form Builder", onClick: e => {
+        const contentJsx = (h(Fragment, { key: '65c992b567d2b0e80b93819c760400ea0ee2b813' }, h("unity-typography", { key: '327ad8c6680dedd7fa1c12b50d62b2bd5763428b', variant: "body1", color: "textSecondary" }, "Version: ", this.data.version), !this.isSideSheetList && (h("unity-typography", { key: '78cfdb94dfc0dff690c18e23e0d07263c25c94c3', variant: "body1", color: "textSecondary" }, "Last Modified: ", new Date(this.data.lastModifiedOn).toLocaleDateString())), h("unity-typography", { key: '0b381c323f4910e5727ad848178065b37fc24e83', variant: "body1", color: "textSecondary" }, "Created On: ", this.isSideSheetList ? new Date(this.data.createdOn).toLocaleDateString() : new Date(this.data.initialCreatedOn).toLocaleDateString()), h("unity-typography", { key: '62137e05a5c76a334369f839ce589b8bc71a1f9b', variant: "body1", color: "textSecondary" }, "Form Type: ", UdpFormsTypeEnum[this.data.type])));
+        const actionsJsx = (h(Fragment, { key: '11b0965f017d6bcfc290bf81892e8bd3dd18730d' }, h("stencil-icon-button", { key: 'b976c977cbdbce0a843b54845147837dbd553f20', icon: Edit16, tooltip: "Open in Form Builder", onClick: e => {
                 e.stopPropagation();
                 this.formBuilderHandler();
-            } }), !this.isSideSheetList && (h("stencil-icon-button", { key: '7a25e4056e44d455ef7621b10df945f513da1645', icon: View16, tooltip: "View in Form Renderer", onClick: e => {
+            } }), !this.isSideSheetList && (h("stencil-icon-button", { key: 'da6b8f48a2004f82765561b34cfd6f2c5b99dc9e', icon: View16, tooltip: "View in Form Renderer", onClick: e => {
                 e.stopPropagation();
                 this.formRendererHandler();
-            } })), !this.isSideSheetList && (h("stencil-icon-button", { key: '63363b40d0c5f0372ab1c1d02a966ce73021405e', icon: ChevronRight24, tooltip: "See Version History", onClick: e => {
+            } })), !this.isSideSheetList && (h("stencil-icon-button", { key: '081db624c49cd5cbc5888c349a601c177f96b8ef', icon: ChevronRight24, tooltip: "See Version History", onClick: e => {
                 var _a;
                 e.stopPropagation();
                 (_a = this.openSideSheet) === null || _a === void 0 ? void 0 : _a.call(this);
             } }))));
-        return (h("udp-card", { key: 'd72660c61bd32cf09a41267c53d77c1a873d51e6', cardTitle: this.data.name, subheader: this.data.description, actions: actionsJsx, onTitleClick: this.handleTitleClick, disableContentPadding: true, adornmentStatus: 'info' }, contentJsx));
+        return (h("udp-card", { key: '6e0572787731e49edb74b9b8d3e9f04e0f09ce57', cardTitle: this.data.name, subheader: this.data.description, actions: actionsJsx, onTitleClick: this.handleTitleClick, disableContentPadding: true, adornmentStatus: 'info' }, contentJsx));
     }
 };
 

package/dist/esm/udp-forms-list.entry.js

@@ -177,7 +177,7 @@ const UdpFormsList = class {
         return this.errorMessage ? (h("div", { class: "error-banner" }, h("unity-typography", { variant: "body2" }, this.errorMessage))) : null;
     }
     render() {
-        return (h("div", { key: '60071b428c63df117043430fc230836c10e8eb99', class: "udp-forms-list-container" }, h("primary-action-header", { key: '126e440554abed576b6c570c1b31acbb72f99607', title: "UDP Forms", primaryActionClick: () => this.handleHeaderPrimaryActionClick(), actionButtonLabel: "Create New Form", tabs: false }), this.isLoading && h("udp-linear-loader", { key: '3b9ad9fa0c242925bc2ddeeadc63098064fdb193' }), this.renderSideSheet(), h("udp-container", { key: '809799a2cba6f52c2bc835cefe2eb4c81e3c879a', maxWidth: "lg" }, this.renderErrorMessage(), this.renderFilters(), h("udp-list-renderer", { key: '36adc31b62301fc9454b345c582dbf9b2fc3e434', itemComponent: "udp-forms-list-card", data: this.mainFormsList, pagination: true, isServerSide: true, isLoading: this.isLoading, itemsPerPage: this.MAIN_PAGE_SIZE, currentPage: this.mainListPageNumber, totalItems: this.mainTotalItems, onPageChange: e => this.handleMainPageChange(e.detail), componentDataMap: this.componentMap, spacing: 'md' })), h("udp-forms-list-card", { key: '9b901f2693ca6dfaa2396d3903fe62933dd22084', style: { display: 'none' } }), h("div", { key: '8ab0c733c8bbb60cb67a4ef1ae6f6b9b1f82bec3', style: { height: '60px' } })));
+        return (h("div", { key: 'e10e187f8b796620e07cbe5de09304b3ff806f9d', class: "udp-forms-list-container" }, h("primary-action-header", { key: 'c07a9deced2ebc01319ac7aa75ff81458e810b7d', title: "UDP Forms", primaryActionClick: () => this.handleHeaderPrimaryActionClick(), actionButtonLabel: "Create New Form", tabs: false }), this.isLoading && h("udp-linear-loader", { key: 'bd0b7aa584dd74d1aa610d276166a7ade78ec39b' }), this.renderSideSheet(), h("udp-container", { key: '9db380a8bc34671684f133f35d2af4634bfe13c4', maxWidth: "lg" }, this.renderErrorMessage(), this.renderFilters(), h("udp-list-renderer", { key: '80570f32e8d09872019514651de334327c7797af', itemComponent: "udp-forms-list-card", data: this.mainFormsList, pagination: true, isServerSide: true, isLoading: this.isLoading, itemsPerPage: this.MAIN_PAGE_SIZE, currentPage: this.mainListPageNumber, totalItems: this.mainTotalItems, onPageChange: e => this.handleMainPageChange(e.detail), componentDataMap: this.componentMap, spacing: 'md' })), h("udp-forms-list-card", { key: '83c6afb79ecbd9154229bb4ee571290af0ce43cc', style: { display: 'none' } }), h("div", { key: '5f8ee58dc8cdd79db5cf8f4c8e487ddb3b005e9d', style: { height: '60px' } })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/udp-forms-renderer.entry.js

@@ -948,7 +948,7 @@ const UdpFormsRenderer = class {
         return (h("udp-side-sheet", { title: "Link a Follow Up Form", open: this.isFollowUpFormsSideSheetOpen, onUdpSideSheetClose: () => this.handleSideSheetClose(), position: "right", width: "md" }, this.isLoading && this.isFollowUpFormsSideSheetOpen && h("udp-linear-loader", null), h("udp-list-renderer", { itemComponent: "udp-forms-follow-up-list-card", data: this.sideSheetFollowUpFormsList, pagination: true, isServerSide: true, isLoading: this.isLoading, itemsPerPage: this.FOLLOW_UP_SIDE_SHEET_PAGE_SIZE, currentPage: this.followUpSideSheetListPageNumber, totalItems: this.followUpSideSheetTotalItems, onPageChange: e => this.handleSideSheetPageChange(e.detail), componentDataMap: this.componentMap, spacing: 'md' })));
     }
     render() {
-        return (h("div", { key: '32d6b68c4bdbae35e0e57a7b408acdb8182e3498', class: "forms-renderer-container" }, this.renderFollowUpSideSheet(), h("udp-forms-ui", { udpForm: this.udpForm, initialValues: this.initialValues, udpFormSubmission: this.udpFormSubmission, submitSuccessful: this.submitSuccessful, isSaving: this.isSaving, saveErrorMessage: this.saveErrorMessage,
+        return (h("div", { key: 'd14ce715fb3aff8f995332816c18c501e88b1ade', class: "forms-renderer-container" }, this.renderFollowUpSideSheet(), h("udp-forms-ui", { udpForm: this.udpForm, initialValues: this.initialValues, udpFormSubmission: this.udpFormSubmission, submitSuccessful: this.submitSuccessful, isSaving: this.isSaving, saveErrorMessage: this.saveErrorMessage,
             // showAutoSaveStatus={this.formSubmissionHandler.supportsAutoSave() && !!this.userId}
             readonly: this.isSubmitted, handleSubmit: this.handleSubmit.bind(this), handleSave: values => Promise.resolve(this.debouncedManualSave(values)), handleChange: this.handleFormChange, handleAction: this.triggerAction, handleFinish: this.handleFinish, userId: this.userId, isSubmitted: this.isSubmitted, dynamicSections: this.dynamicSections, duplicateRepeatableSection: this.duplicateRepeatableSection, deleteRepeatableSection: this.deleteRepeatableSection, ref: el => (this.formsUiEl = el), key: `form-rerender-key-${this.reRenderKey}`, isShowManualSaveIcon: this.isShowManualSaveIcon(), isLoading: this.isLoading, performBackgroundSaveAndUpdateLocalSubmissionState: this.performBackgroundSaveAndUpdateLocalSubmissionState })));
     }

package/dist/esm/udp-list-renderer.udp-pagination.udp-side-sheet.entry.js.map

@@ -1 +1 @@
-{"version":3,"file":"udp-list-renderer.udp-pagination.udp-side-sheet.entry.js","sources":["src/components/my-component/UI/data-display/list-renderer/udp-list-renderer.css?tag=udp-list-renderer&encapsulation=shadow","src/components/my-component/UI/data-display/list-renderer/udp-list-renderer.tsx","src/components/my-component/UI/navigation/pagination/udp-pagination.css?tag=udp-pagination&encapsulation=shadow","src/components/my-component/UI/navigation/pagination/udp-pagination.tsx","src/components/my-component/UI/drawers/udp-side-sheet/udp-side-sheet.css?tag=udp-side-sheet&encapsulation=shadow","src/components/my-component/UI/drawers/udp-side-sheet/udp-side-sheet.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.udp-list-renderer-container {\n  display: flex;\n  flex-direction: column;\n}\n\n.item-list-container   {\n  display: flex;\n  flex-direction: column;\n}\n\n/* Spacing variants */\n.item-list-container.spacing-xs {\n  gap: var(--spacing-02);\n}\n\n.item-list-container.spacing-sm {\n  gap: var(--spacing-03);\n}\n\n.item-list-container.spacing-md {\n  gap: var(--spacing-04);\n}\n\n.item-list-container.spacing-lg {\n  gap: var(--spacing-06);\n}\n\n.item-list-container.spacing-condensed {\n  gap: var(--spacing-01);\n}\n\n.loading-container {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  padding: var(--spacing-07); /* 2rem */\n  min-height: 100px; /* Adjust as needed, or use a spacing variable if appropriate */\n} ","import { Component, Prop, h, State, Watch, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n  tag: 'udp-list-renderer',\n  styleUrl: 'udp-list-renderer.css',\n  shadow: true,\n})\nexport class UdpItemList {\n  /**\n   * The tag name of the component to render for each item in the list.\n   * For example, 'my-item-component'.\n   */\n  @Prop() itemComponent: string;\n\n  /**\n   * Array of objects to be rendered in the list.\n   */\n  @Prop() data: any[] = [];\n\n  /**\n   * Object mapping source data fields to prop names for the item component.\n   * Example: {元のフィールド: '新しいフィールド'}\n   * This will pass props to ItemComponent as: <ItemComponent newField={sourceData.originalField} />\n   */\n  @Prop() componentDataMap: { [key: string]: string };\n\n  /**\n   * Whether to enable pagination.\n   */\n  @Prop() pagination: boolean = false;\n\n  /**\n   * Number of items to display per page.\n   */\n  @Prop() itemsPerPage: number = 10;\n\n  /**\n   * Whether pagination is handled server-side.\n   */\n  @Prop() isServerSide: boolean = false;\n\n  /**\n   * Total number of items (required for server-side pagination).\n   */\n  @Prop() totalItems: number = 0;\n\n  /**\n   * Callback function for page changes. Required when isServerSide is true.\n   * Emits the new page number.\n   */\n  @Event() pageChange: EventEmitter<number>;\n\n  /**\n   * Current page number (used for server-side pagination or can be controlled externally).\n   * Defaults to 1.\n   */\n  @Prop({ mutable: true, reflect: true }) currentPage: number = 1;\n\n  /**\n   * Whether the list is in a loading state.\n   */\n  @Prop() isLoading: boolean = false;\n\n  /**\n   * Defines the spacing between items.\n   * Options: 'xs', 'sm', 'md', 'lg', 'condensed'\n   * Default: 'sm'\n   */\n  @Prop({ reflect: true }) spacing: 'xs' | 'sm' | 'md' | 'lg' | 'condensed' = 'md';\n\n  @State() internalCurrentPage: number = 1;\n\n  @Watch('currentPage')\n  currentPageChanged(newValue: number) {\n    if (newValue !== this.internalCurrentPage) {\n      this.internalCurrentPage = newValue;\n    }\n  }\n\n  componentWillLoad() {\n    this.internalCurrentPage = this.currentPage;\n  }\n\n  private getPaginatedData() {\n    if (!this.pagination || this.isServerSide) {\n      return this.data;\n    }\n    const startIndex = (this.internalCurrentPage - 1) * this.itemsPerPage;\n    const endIndex = startIndex + this.itemsPerPage;\n    return this.data.slice(startIndex, endIndex);\n  }\n\n  private getTotalPages(): number {\n    if (!this.pagination) return 1;\n    if (this.isServerSide) {\n      if (this.totalItems === 0 || this.itemsPerPage === 0) return 1;\n      return Math.ceil(this.totalItems / this.itemsPerPage);\n    }\n    if (this.data.length === 0 || this.itemsPerPage === 0) return 1;\n    return Math.ceil(this.data.length / this.itemsPerPage);\n  }\n\n  private handlePageChange(newPage: number) {\n    if (this.isLoading) return;\n    if (newPage >= 1 && newPage <= this.getTotalPages()) {\n      if (this.isServerSide) {\n        this.pageChange.emit(newPage);\n      } else {\n        this.internalCurrentPage = newPage;\n        this.currentPage = newPage;\n        this.pageChange.emit(newPage);\n      }\n    }\n  }\n\n  private renderItems() {\n    if (!this.itemComponent) {\n      console.warn('[udp-item-list] itemComponent prop is required.');\n      return <p>Error: itemComponent prop is not defined.</p>;\n    }\n    if (!this.componentDataMap) {\n      console.warn('[udp-item-list] componentDataMap prop is required.');\n      return <p>Error: componentDataMap prop is not defined.</p>;\n    }\n\n    const itemsToRender = this.getPaginatedData();\n\n    if (!itemsToRender || itemsToRender.length === 0) {\n      return <p>No items to display.</p>;\n    }\n\n    return itemsToRender.map(item => {\n      const props = {};\n      for (const sourceKey in this.componentDataMap) {\n        if (item.hasOwnProperty(sourceKey)) {\n          const targetKey = this.componentDataMap[sourceKey];\n          props[targetKey] = item[sourceKey];\n        }\n      }\n      const ItemCmp = this.itemComponent;\n      return <ItemCmp {...props} />;\n    });\n  }\n\n  render() {\n    if (this.isLoading && (!this.data || this.data.length === 0)) {\n      return (\n        <div class=\"loading-container\">\n          <p>Loading...</p>\n        </div>\n      );\n    }\n\n    const containerClasses = {\n      'item-list-container': true,\n      [`spacing-${this.spacing}`]: true,\n    };\n\n    return (\n      <host>\n        <div class={containerClasses}>{this.renderItems()}</div>\n        {this.pagination && this.getTotalPages() > 1 && (\n          <udp-pagination\n            currentPage={this.internalCurrentPage}\n            totalPages={this.getTotalPages()}\n            isLoading={this.isLoading}\n            onPageChange={event => this.handlePageChange(event.detail)}\n          ></udp-pagination>\n        )}\n      </host>\n    );\n  }\n}\n",":host {\n  display: block;\n  font-family: var(--font-family);\n}\n\n.pagination-controls {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  padding: var(--spacing-03); /* 0.5rem */\n  gap: var(--spacing-02); /* 0.25rem, replaces margin on individual buttons */\n}\n\n/* Styles for udp-button are handled by the component itself. \n   We might only need to ensure proper alignment or specific overrides if necessary.\n   The udp-button already has variants for 'active', 'disabled' etc. */\n\n.pagination-controls span.ellipsis {\n  /* background-color: transparent; -- Already default for span */\n  /* border: none; -- Already default for span */\n  color: var(--text-secondary); /* Using a global variable for text color */\n  padding: var(--spacing-02) var(--spacing-01); /* Adjust padding using variables */\n  display: inline-flex; /* To align with buttons */\n  align-items: center; /* To align with buttons */\n  justify-content: center; /* To align with buttons */\n  min-width: 36px; /* Approximate width of a small icon button, adjust as needed */\n  min-height: 36px; /* Approximate height of a small icon button, adjust as needed */\n}\n\n/* Remove specific button styling for .prev-button, .next-button, etc. as udp-button handles it */\n/* .prev-button,\n.next-button,\n.first-page,\n.last-page {\n  Additional specific styles if needed\n} */ ","import { Component, Prop, h, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n  tag: 'udp-pagination',\n  styleUrl: './udp-pagination.css',\n  shadow: true,\n})\nexport class UdpPagination {\n  /**\n   * The currently active page number.\n   */\n  @Prop() currentPage: number = 1;\n\n  /**\n   * The total number of pages available.\n   */\n  @Prop() totalPages: number = 1;\n\n  /**\n   * Optional: Whether the component consuming pagination is in a loading state.\n   * If true, pagination controls will be disabled.\n   */\n  @Prop() isLoading: boolean = false;\n\n  /**\n   * Emitted when the page is changed by the user.\n   * The event detail will contain the new page number.\n   */\n  @Event() pageChange: EventEmitter<number>;\n\n  private navigateToPage(page: number) {\n    if (this.isLoading || page < 1 || page > this.totalPages || page === this.currentPage) {\n      return;\n    }\n    this.pageChange.emit(page);\n  }\n\n  // Basic page number generation. Could be made more sophisticated (e.g., with ellipses for many pages)\n  private renderPageNumbers() {\n    const pageNumbers = [];\n    const maxPagesToShow = 5; // Max number of page buttons to show directly\n    const halfMaxPages = Math.floor(maxPagesToShow / 2);\n\n    let startPage = Math.max(1, this.currentPage - halfMaxPages);\n    let endPage = Math.min(this.totalPages, this.currentPage + halfMaxPages);\n\n    if (this.currentPage - halfMaxPages < 1) {\n      endPage = Math.min(this.totalPages, maxPagesToShow);\n    }\n\n    if (this.currentPage + halfMaxPages > this.totalPages) {\n      startPage = Math.max(1, this.totalPages - maxPagesToShow + 1);\n    }\n\n    if (this.totalPages <= maxPagesToShow) {\n      startPage = 1;\n      endPage = this.totalPages;\n    }\n\n    // Always show first page if not in range\n    if (startPage > 1) {\n      pageNumbers.push(\n        <udp-button onClick={() => this.navigateToPage(1)} disabled={this.isLoading} variant=\"outlined\" ariaLabel=\"Go to first page\">\n          1\n        </udp-button>,\n      );\n      if (startPage > 2) {\n        pageNumbers.push(<span class=\"ellipsis\">...</span>);\n      }\n    }\n\n    for (let i = startPage; i <= endPage; i++) {\n      pageNumbers.push(\n        <udp-button\n          onClick={() => this.navigateToPage(i)}\n          disabled={this.isLoading}\n          variant={i === this.currentPage ? 'contained' : 'outlined'}\n          color={i === this.currentPage ? 'primary' : 'inherit'}\n          ariaLabel={`Go to page ${i}`}\n          aria-current={i === this.currentPage ? 'page' : undefined}\n        >\n          {i}\n        </udp-button>,\n      );\n    }\n\n    // Always show last page if not in range\n    if (endPage < this.totalPages) {\n      if (endPage < this.totalPages - 1) {\n        pageNumbers.push(<span class=\"ellipsis\">...</span>);\n      }\n      pageNumbers.push(\n        <udp-button onClick={() => this.navigateToPage(this.totalPages)} disabled={this.isLoading} variant=\"outlined\" ariaLabel=\"Go to last page\">\n          {this.totalPages}\n        </udp-button>,\n      );\n    }\n\n    return pageNumbers;\n  }\n\n  render() {\n    if (this.totalPages <= 1) {\n      return null; // Don't render pagination if there's only one page or less\n    }\n\n    return (\n      <div class=\"pagination-controls\">\n        <udp-button onClick={() => this.navigateToPage(this.currentPage - 1)} disabled={this.isLoading || this.currentPage <= 1} variant=\"text\" ariaLabel=\"Go to previous page\">\n          Previous\n        </udp-button>\n\n        {this.renderPageNumbers()}\n\n        <udp-button\n          onClick={() => this.navigateToPage(this.currentPage + 1)}\n          disabled={this.isLoading || this.currentPage >= this.totalPages}\n          variant=\"text\"\n          ariaLabel=\"Go to next page\"\n        >\n          Next\n        </udp-button>\n      </div>\n    );\n  }\n}\n",":host {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100vw;\n  height: 100vh;\n  z-index: 9999;\n  visibility: hidden;\n  transition: visibility 0s 0.2s;\n}\n\n:host(.is-visible) {\n  visibility: visible;\n  transition-delay: 0s;\n}\n\n.backdrop {\n  background: rgba(0, 0, 0, 0.5);\n  width: 100%;\n  height: 100%;\n  position: fixed;\n  top: 0;\n  left: 0;\n  opacity: 0;\n  transition: opacity 0.2s ease-in-out;\n}\n\n:host(.is-visible) .backdrop {\n  opacity: 1;\n}\n\n.sheet {\n  background: white;\n  height: 100vh;\n  position: fixed;\n  top: 0;\n  display: flex;\n  flex-direction: column;\n  box-shadow: 0 0 4px rgba(0, 0, 0, 0.3);\n  transition: transform 0.2s ease-in-out;\n  width: 100%;\n}\n\n.sheet.right {\n  right: 0;\n  transform: translateX(100%);\n}\n\n.sheet.left {\n  left: 0;\n  transform: translateX(-100%);\n}\n\n:host(.is-visible) .sheet {\n  transform: translateX(0);\n}\n\n.sheet.sm { max-width: 360px; }\n.sheet.md { max-width: 600px; }\n.sheet.lg { max-width: 960px; }\n.sheet.full { max-width: 100%; }\n.sheet.custom-width { /* max-width is set via inline style */ }\n\n/* Updated title container for new layout */\n.title-container {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  flex-shrink: 0;\n  box-shadow: var(--elevation-01, 0 4px 8px rgba(0, 0, 0, 0.1));\n  gap: var(--spacing-02)\n}\n\n.title-text {\n  flex-grow: 1;\n  text-align: left; /* Ensure title stays left-aligned */\n}\n\n.close-button {\n  flex-shrink: 0;\n}\n\n/* Added styles for the new button's container */\n.header-action-button {\n  flex-shrink: 0;\n}\n\n.content {\n  overflow-y: auto;\n  flex-grow: 1;\n  background-color: var(--gray-01);\n}\n\n.content.padding {\n  padding: var(--spacing-05, 24px);\n}\n\n.footer {\n  padding: var(--spacing-05, 24px);\n  border-top: 1px solid #ccc;\n  display: flex;\n  justify-content: flex-end;\n  flex-shrink: 0;\n}\n\n\n/* This container reserves the space for the loader (4px height).\n  This prevents the content below it from shifting up and down\n  when the loader appears or disappears.\n*/\n.loader-container {\n  height: 4px;\n  width: 100%;\n  background-color: var(--gray-01);\n}\n\n/*\n  By default, the loader is instantly hidden.\n  There is no transition applied in its hidden state.\n*/\n.loader-container udp-linear-loader {\n  visibility: hidden;\n  opacity: 0;\n  transition: none;\n}\n\n/*\n  When the .is-loading class is applied, we make the loader visible\n  AND apply a transition so it fades in smoothly. When the class is removed,\n  it reverts to the rule above and disappears instantly.\n*/\n.loader-container udp-linear-loader.is-loading {\n  visibility: visible;\n  opacity: 1;\n  /* transition: opacity 0.3s ease-in-out; */\n}\n\n","import { Component, h, Prop, Element, Watch, Event, EventEmitter } from '@stencil/core';\nimport Close24 from '@carbon/icons/es/close/24';\n\n@Component({\n  tag: 'udp-side-sheet',\n  styleUrl: 'udp-side-sheet.css',\n  shadow: true,\n})\nexport class UdpSideSheet {\n  @Element() hostEl!: HTMLElement;\n\n  @Prop({ reflect: true, mutable: true }) open = false;\n  @Prop() title: string;\n  @Prop() position: 'left' | 'right' = 'right';\n  @Prop() width: 'sm' | 'md' | 'lg' | 'full' | number = 'md';\n  @Prop() padding = true;\n  @Prop() loading: boolean = false;\n\n  // Props for the new header action button\n  @Prop() headerActionButtonLabel: string;\n  @Prop() headerActionButtonDisabled = false;\n  @Prop() headerActionButtonIcon: string;\n\n  // Props for the existing footer button\n  @Prop() primaryButtonLabel: string;\n  @Prop() primaryButtonDisabled = false;\n  @Prop() primaryButtonIcon: string;\n\n  @Event() udpSideSheetClose: EventEmitter<void>;\n  @Event() udpPrimaryButtonClick: EventEmitter<void>;\n  // Event for the new header action button\n  @Event() udpHeaderActionButtonClick: EventEmitter<void>;\n\n  private originalBodyOverflow: string = '';\n\n  @Watch('open')\n  handleOpenChange(newValue: boolean, oldValue: boolean) {\n    if (newValue === oldValue) {\n      return;\n    }\n\n    if (newValue) {\n      this.originalBodyOverflow = document.body.style.overflow;\n      document.body.style.overflow = 'hidden';\n      document.body.appendChild(this.hostEl);\n\n      requestAnimationFrame(() => {\n        this.hostEl.classList.add('is-visible');\n      });\n    } else {\n      this.hostEl.classList.remove('is-visible');\n      document.body.style.overflow = this.originalBodyOverflow;\n      this.hostEl.addEventListener('transitionend', this.handleTransitionEnd, { once: true });\n    }\n  }\n\n  private handleTransitionEnd = () => {\n    if (!this.open && this.hostEl.parentElement === document.body) {\n      document.body.removeChild(this.hostEl);\n    }\n  };\n\n  disconnectedCallback() {\n    if (document.body.style.overflow === 'hidden') {\n      document.body.style.overflow = this.originalBodyOverflow;\n    }\n  }\n\n  private onClose = () => {\n    this.open = false;\n    this.udpSideSheetClose.emit();\n  };\n\n  private onPrimaryButtonClick = () => {\n    this.udpPrimaryButtonClick.emit();\n  };\n\n  // Handler for the new header action button click\n  private onHeaderActionButtonClick = () => {\n    this.udpHeaderActionButtonClick.emit();\n  };\n\n  render() {\n    const widthClass = typeof this.width === 'number' ? 'custom-width' : this.width;\n    const sideSheetStyle = typeof this.width === 'number' ? { maxWidth: `${this.width}px` } : {};\n\n    return (\n      <div class=\"backdrop\" onClick={this.onClose}>\n        <div\n          class={{ sheet: true, [this.position]: true, [widthClass]: true }}\n          style={sideSheetStyle}\n          onClick={e => e.stopPropagation()}\n        >\n          {/* Header layout has been changed here */}\n          <div class=\"title-container\">\n            <div class=\"close-button\">\n              <stencil-icon-button\n                icon={Close24}\n                onClick={this.onClose}\n                secondary\n              ></stencil-icon-button>\n            </div>\n            <div class=\"title-text\">\n              <unity-typography variant=\"h6\">{this.title}</unity-typography>\n            </div>\n            {/* Conditionally render the new header action button */}\n            {this.headerActionButtonLabel && (\n              <div class=\"header-action-button\">\n                <udp-button\n                  disabled={this.headerActionButtonDisabled}\n                  onClick={this.onHeaderActionButtonClick}\n                  startIcon={<udp-icon iconName={this.headerActionButtonIcon} color={'inherit'} />}\n                  variant=\"contained\"\n                >\n                  {this.headerActionButtonLabel}\n                </udp-button>\n              </div>\n            )}\n          </div>\n          <div class=\"loader-container\">\n              <udp-linear-loader class={{ 'is-loading': this.loading }} color=\"primary\" />\n            </div>\n\n          <div class={{ content: true, padding: this.padding }}>\n\n            <slot />\n          </div>\n          {this.primaryButtonLabel && (\n            <div class=\"footer\">\n              <udp-button\n                variant=\"contained\"\n                size=\"large\"\n                disabled={this.primaryButtonDisabled}\n                onClick={this.onPrimaryButtonClick}\n                endIcon={this.primaryButtonIcon}\n              >\n                {this.primaryButtonLabel}\n              </udp-button>\n            </div>\n          )}\n        </div>\n      </div>\n    );\n  }\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"udp-list-renderer.udp-pagination.udp-side-sheet.entry.js","sources":["src/components/my-component/UI/data-display/list-renderer/udp-list-renderer.css?tag=udp-list-renderer&encapsulation=shadow","src/components/my-component/UI/data-display/list-renderer/udp-list-renderer.tsx","src/components/my-component/UI/navigation/pagination/udp-pagination.css?tag=udp-pagination&encapsulation=shadow","src/components/my-component/UI/navigation/pagination/udp-pagination.tsx","src/components/my-component/UI/drawers/udp-side-sheet/udp-side-sheet.css?tag=udp-side-sheet&encapsulation=shadow","src/components/my-component/UI/drawers/udp-side-sheet/udp-side-sheet.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.udp-list-renderer-container {\n  display: flex;\n  flex-direction: column;\n}\n\n.item-list-container   {\n  display: flex;\n  flex-direction: column;\n}\n\n/* Spacing variants */\n.item-list-container.spacing-xs {\n  gap: var(--spacing-02);\n}\n\n.item-list-container.spacing-sm {\n  gap: var(--spacing-03);\n}\n\n.item-list-container.spacing-md {\n  gap: var(--spacing-04);\n}\n\n.item-list-container.spacing-lg {\n  gap: var(--spacing-06);\n}\n\n.item-list-container.spacing-condensed {\n  gap: var(--spacing-01);\n}\n\n.loading-container {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  padding: var(--spacing-07); /* 2rem */\n  min-height: 100px; /* Adjust as needed, or use a spacing variable if appropriate */\n} ","import { Component, Prop, h, State, Watch, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n  tag: 'udp-list-renderer',\n  styleUrl: 'udp-list-renderer.css',\n  shadow: true,\n})\nexport class UdpItemList {\n  /**\n   * The tag name of the component to render for each item in the list.\n   * For example, 'my-item-component'.\n   */\n  @Prop() itemComponent: string;\n\n  /**\n   * Array of objects to be rendered in the list.\n   */\n  @Prop() data: any[] = [];\n\n  /**\n   * Object mapping source data fields to prop names for the item component.\n   * Example: {元のフィールド: '新しいフィールド'}\n   * This will pass props to ItemComponent as: <ItemComponent newField={sourceData.originalField} />\n   */\n  @Prop() componentDataMap: { [key: string]: string };\n\n  /**\n   * Whether to enable pagination.\n   */\n  @Prop() pagination: boolean = false;\n\n  /**\n   * Number of items to display per page.\n   */\n  @Prop() itemsPerPage: number = 10;\n\n  /**\n   * Whether pagination is handled server-side.\n   */\n  @Prop() isServerSide: boolean = false;\n\n  /**\n   * Total number of items (required for server-side pagination).\n   */\n  @Prop() totalItems: number = 0;\n\n  /**\n   * Callback function for page changes. Required when isServerSide is true.\n   * Emits the new page number.\n   */\n  @Event() pageChange: EventEmitter<number>;\n\n  /**\n   * Current page number (used for server-side pagination or can be controlled externally).\n   * Defaults to 1.\n   */\n  @Prop({ mutable: true, reflect: true }) currentPage: number = 1;\n\n  /**\n   * Whether the list is in a loading state.\n   */\n  @Prop() isLoading: boolean = false;\n\n  /**\n   * Defines the spacing between items.\n   * Options: 'xs', 'sm', 'md', 'lg', 'condensed'\n   * Default: 'sm'\n   */\n  @Prop({ reflect: true }) spacing: 'xs' | 'sm' | 'md' | 'lg' | 'condensed' = 'md';\n\n  @State() internalCurrentPage: number = 1;\n\n  @Watch('currentPage')\n  currentPageChanged(newValue: number) {\n    if (newValue !== this.internalCurrentPage) {\n      this.internalCurrentPage = newValue;\n    }\n  }\n\n  componentWillLoad() {\n    this.internalCurrentPage = this.currentPage;\n  }\n\n  private getPaginatedData() {\n    if (!this.pagination || this.isServerSide) {\n      return this.data;\n    }\n    const startIndex = (this.internalCurrentPage - 1) * this.itemsPerPage;\n    const endIndex = startIndex + this.itemsPerPage;\n    return this.data.slice(startIndex, endIndex);\n  }\n\n  private getTotalPages(): number {\n    if (!this.pagination) return 1;\n    if (this.isServerSide) {\n      if (this.totalItems === 0 || this.itemsPerPage === 0) return 1;\n      return Math.ceil(this.totalItems / this.itemsPerPage);\n    }\n    if (this.data.length === 0 || this.itemsPerPage === 0) return 1;\n    return Math.ceil(this.data.length / this.itemsPerPage);\n  }\n\n  private handlePageChange(newPage: number) {\n    if (this.isLoading) return;\n    if (newPage >= 1 && newPage <= this.getTotalPages()) {\n      if (this.isServerSide) {\n        this.pageChange.emit(newPage);\n      } else {\n        this.internalCurrentPage = newPage;\n        this.currentPage = newPage;\n        this.pageChange.emit(newPage);\n      }\n    }\n  }\n\n  private renderItems() {\n    if (!this.itemComponent) {\n      console.warn('[udp-item-list] itemComponent prop is required.');\n      return <p>Error: itemComponent prop is not defined.</p>;\n    }\n    if (!this.componentDataMap) {\n      console.warn('[udp-item-list] componentDataMap prop is required.');\n      return <p>Error: componentDataMap prop is not defined.</p>;\n    }\n\n    const itemsToRender = this.getPaginatedData();\n\n    if (!itemsToRender || itemsToRender.length === 0) {\n      return <p>No items to display.</p>;\n    }\n\n    return itemsToRender.map(item => {\n      const props = {};\n      for (const sourceKey in this.componentDataMap) {\n        if (item.hasOwnProperty(sourceKey)) {\n          const targetKey = this.componentDataMap[sourceKey];\n          props[targetKey] = item[sourceKey];\n        }\n      }\n      const ItemCmp = this.itemComponent;\n      return <ItemCmp {...props} />;\n    });\n  }\n\n  render() {\n    if (this.isLoading && (!this.data || this.data.length === 0)) {\n      return (\n        <div class=\"loading-container\">\n          <p>Loading...</p>\n        </div>\n      );\n    }\n\n    const containerClasses = {\n      'item-list-container': true,\n      [`spacing-${this.spacing}`]: true,\n    };\n\n    return (\n      <host>\n        <div class={containerClasses}>{this.renderItems()}</div>\n        {this.pagination && this.getTotalPages() > 1 && (\n          <udp-pagination\n            currentPage={this.internalCurrentPage}\n            totalPages={this.getTotalPages()}\n            isLoading={this.isLoading}\n            onPageChange={event => this.handlePageChange(event.detail)}\n          ></udp-pagination>\n        )}\n      </host>\n    );\n  }\n}\n",":host {\n  display: block;\n  font-family: var(--font-family);\n}\n\n.pagination-controls {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  padding: var(--spacing-03); /* 0.5rem */\n  gap: var(--spacing-02); /* 0.25rem, replaces margin on individual buttons */\n}\n\n/* Styles for udp-button are handled by the component itself. \n   We might only need to ensure proper alignment or specific overrides if necessary.\n   The udp-button already has variants for 'active', 'disabled' etc. */\n\n.pagination-controls span.ellipsis {\n  /* background-color: transparent; -- Already default for span */\n  /* border: none; -- Already default for span */\n  color: var(--text-secondary); /* Using a global variable for text color */\n  padding: var(--spacing-02) var(--spacing-01); /* Adjust padding using variables */\n  display: inline-flex; /* To align with buttons */\n  align-items: center; /* To align with buttons */\n  justify-content: center; /* To align with buttons */\n  min-width: 36px; /* Approximate width of a small icon button, adjust as needed */\n  min-height: 36px; /* Approximate height of a small icon button, adjust as needed */\n}\n\n/* Remove specific button styling for .prev-button, .next-button, etc. as udp-button handles it */\n/* .prev-button,\n.next-button,\n.first-page,\n.last-page {\n  Additional specific styles if needed\n} */ ","import { Component, Prop, h, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n  tag: 'udp-pagination',\n  styleUrl: './udp-pagination.css',\n  shadow: true,\n})\nexport class UdpPagination {\n  /**\n   * The currently active page number.\n   */\n  @Prop() currentPage: number = 1;\n\n  /**\n   * The total number of pages available.\n   */\n  @Prop() totalPages: number = 1;\n\n  /**\n   * Optional: Whether the component consuming pagination is in a loading state.\n   * If true, pagination controls will be disabled.\n   */\n  @Prop() isLoading: boolean = false;\n\n  /**\n   * Emitted when the page is changed by the user.\n   * The event detail will contain the new page number.\n   */\n  @Event() pageChange: EventEmitter<number>;\n\n  private navigateToPage(page: number) {\n    if (this.isLoading || page < 1 || page > this.totalPages || page === this.currentPage) {\n      return;\n    }\n    this.pageChange.emit(page);\n  }\n\n  // Basic page number generation. Could be made more sophisticated (e.g., with ellipses for many pages)\n  private renderPageNumbers() {\n    const pageNumbers = [];\n    const maxPagesToShow = 5; // Max number of page buttons to show directly\n    const halfMaxPages = Math.floor(maxPagesToShow / 2);\n\n    let startPage = Math.max(1, this.currentPage - halfMaxPages);\n    let endPage = Math.min(this.totalPages, this.currentPage + halfMaxPages);\n\n    if (this.currentPage - halfMaxPages < 1) {\n      endPage = Math.min(this.totalPages, maxPagesToShow);\n    }\n\n    if (this.currentPage + halfMaxPages > this.totalPages) {\n      startPage = Math.max(1, this.totalPages - maxPagesToShow + 1);\n    }\n\n    if (this.totalPages <= maxPagesToShow) {\n      startPage = 1;\n      endPage = this.totalPages;\n    }\n\n    // Always show first page if not in range\n    if (startPage > 1) {\n      pageNumbers.push(\n        <udp-button onClick={() => this.navigateToPage(1)} disabled={this.isLoading} variant=\"outlined\" ariaLabel=\"Go to first page\">\n          1\n        </udp-button>,\n      );\n      if (startPage > 2) {\n        pageNumbers.push(<span class=\"ellipsis\">...</span>);\n      }\n    }\n\n    for (let i = startPage; i <= endPage; i++) {\n      pageNumbers.push(\n        <udp-button\n          onClick={() => this.navigateToPage(i)}\n          disabled={this.isLoading}\n          variant={i === this.currentPage ? 'contained' : 'outlined'}\n          color={i === this.currentPage ? 'primary' : 'inherit'}\n          ariaLabel={`Go to page ${i}`}\n          aria-current={i === this.currentPage ? 'page' : undefined}\n        >\n          {i}\n        </udp-button>,\n      );\n    }\n\n    // Always show last page if not in range\n    if (endPage < this.totalPages) {\n      if (endPage < this.totalPages - 1) {\n        pageNumbers.push(<span class=\"ellipsis\">...</span>);\n      }\n      pageNumbers.push(\n        <udp-button onClick={() => this.navigateToPage(this.totalPages)} disabled={this.isLoading} variant=\"outlined\" ariaLabel=\"Go to last page\">\n          {this.totalPages}\n        </udp-button>,\n      );\n    }\n\n    return pageNumbers;\n  }\n\n  render() {\n    if (this.totalPages <= 1) {\n      return null; // Don't render pagination if there's only one page or less\n    }\n\n    return (\n      <div class=\"pagination-controls\">\n        <udp-button onClick={() => this.navigateToPage(this.currentPage - 1)} disabled={this.isLoading || this.currentPage <= 1} variant=\"text\" ariaLabel=\"Go to previous page\">\n          Previous\n        </udp-button>\n\n        {this.renderPageNumbers()}\n\n        <udp-button\n          onClick={() => this.navigateToPage(this.currentPage + 1)}\n          disabled={this.isLoading || this.currentPage >= this.totalPages}\n          variant=\"text\"\n          ariaLabel=\"Go to next page\"\n        >\n          Next\n        </udp-button>\n      </div>\n    );\n  }\n}\n",":host {\r\n  position: fixed;\r\n  top: 0;\r\n  left: 0;\r\n  width: 100vw;\r\n  height: 100vh;\r\n  z-index: 9999;\r\n  visibility: hidden;\r\n  transition: visibility 0s 0.2s;\r\n}\r\n\r\n:host(.is-visible) {\r\n  visibility: visible;\r\n  transition-delay: 0s;\r\n}\r\n\r\n.backdrop {\r\n  background: rgba(0, 0, 0, 0.5);\r\n  width: 100%;\r\n  height: 100%;\r\n  position: fixed;\r\n  top: 0;\r\n  left: 0;\r\n  opacity: 0;\r\n  transition: opacity 0.2s ease-in-out;\r\n}\r\n\r\n:host(.is-visible) .backdrop {\r\n  opacity: 1;\r\n}\r\n\r\n.sheet {\r\n  background: white;\r\n  height: 100vh;\r\n  position: fixed;\r\n  top: 0;\r\n  display: flex;\r\n  flex-direction: column;\r\n  box-shadow: 0 0 4px rgba(0, 0, 0, 0.3);\r\n  transition: transform 0.2s ease-in-out;\r\n  width: 100%;\r\n}\r\n\r\n.sheet.right {\r\n  right: 0;\r\n  transform: translateX(100%);\r\n}\r\n\r\n.sheet.left {\r\n  left: 0;\r\n  transform: translateX(-100%);\r\n}\r\n\r\n:host(.is-visible) .sheet {\r\n  transform: translateX(0);\r\n}\r\n\r\n.sheet.sm { max-width: 360px; }\r\n.sheet.md { max-width: 600px; }\r\n.sheet.lg { max-width: 960px; }\r\n.sheet.full { max-width: 100%; }\r\n.sheet.custom-width { /* max-width is set via inline style */ }\r\n\r\n/* Updated title container for new layout */\r\n.title-container {\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: center;\r\n  flex-shrink: 0;\r\n  box-shadow: var(--elevation-01, 0 4px 8px rgba(0, 0, 0, 0.1));\r\n  gap: var(--spacing-02)\r\n}\r\n\r\n.title-text {\r\n  flex-grow: 1;\r\n  text-align: left; /* Ensure title stays left-aligned */\r\n}\r\n\r\n.close-button {\r\n  flex-shrink: 0;\r\n}\r\n\r\n/* Added styles for the new button's container */\r\n.header-action-button {\r\n  flex-shrink: 0;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: var(--spacing-02, 4px);\r\n  padding: var(--spacing-03, 8px) var(--spacing-03, 8px) var(--spacing-03, 8px) 0;\r\n}\r\n\r\n.content {\r\n  overflow-y: auto;\r\n  flex-grow: 1;\r\n  background-color: var(--gray-01);\r\n}\r\n\r\n.content.padding {\r\n  padding: var(--spacing-05, 24px);\r\n}\r\n\r\n.footer {\r\n  padding: var(--spacing-03, 8px);\r\n  box-shadow: var(--elevation-01, 0 4px 8px rgba(0, 0, 0, 0.1));\r\n  display: flex;\r\n  justify-content: flex-end;\r\n  flex-shrink: 0;\r\n  width: 100%;\r\n  gap: var(--spacing-02, 4px);\r\n  align-items: center;\r\n}\r\n\r\n.footer.secondary-button-overflow{\r\n  flex-direction: row-reverse;\r\n}\r\n\r\n.footer-secondary-buttons-container{\r\n  flex-grow: 2;\r\n  width: 100%;\r\n}\r\n\r\n.footer-secondary-buttons{\r\n  display: flex;\r\n  justify-content: flex-end;\r\n  gap: var(--spacing-02, 4px);\r\n  align-items: center;\r\n}\r\n\r\n.footer-secondary-buttons.secondary-button-overflow{\r\n  flex-grow: 1;\r\n}\r\n\r\n/* This container reserves the space for the loader (4px height).\r\n  This prevents the content below it from shifting up and down\r\n  when the loader appears or disappears.\r\n*/\r\n.loader-container {\r\n  height: 4px;\r\n  width: 100%;\r\n  background-color: var(--gray-01);\r\n}\r\n\r\n/*\r\n  By default, the loader is instantly hidden.\r\n  There is no transition applied in its hidden state.\r\n*/\r\n.loader-container udp-linear-loader {\r\n  visibility: hidden;\r\n  opacity: 0;\r\n  transition: none;\r\n}\r\n\r\n/*\r\n  When the .is-loading class is applied, we make the loader visible\r\n  AND apply a transition so it fades in smoothly. When the class is removed,\r\n  it reverts to the rule above and disappears instantly.\r\n*/\r\n.loader-container udp-linear-loader.is-loading {\r\n  visibility: visible;\r\n  opacity: 1;\r\n  /* transition: opacity 0.3s ease-in-out; */\r\n}\r\n\r\n","/* eslint-disable stencil/strict-boolean-conditions */\r\nimport {\r\n  Component,\r\n  h,\r\n  Prop,\r\n  Element,\r\n  Watch,\r\n  Event,\r\n  EventEmitter,\r\n  State,\r\n  Build,\r\n} from '@stencil/core';\r\nimport Close24 from '@carbon/icons/es/close/24';\r\nimport { SecondaryButton } from './types';\r\n\r\n/**\r\n * Side sheet component used for contextual drawers.\r\n */\r\n@Component({\r\n  tag: 'udp-side-sheet',\r\n  styleUrl: 'udp-side-sheet.css',\r\n  shadow: true,\r\n})\r\nexport class UdpSideSheet {\r\n  /** Host element reference for portal behavior */\r\n  @Element() hostEl!: HTMLElement;\r\n\r\n  /** When true, the side sheet is open and visible */\r\n  @Prop({ reflect: true, mutable: true }) open = false;\r\n\r\n  /** Title text displayed in the header */\r\n  @Prop() title: string;\r\n\r\n  /** Position of the sheet on the screen */\r\n  @Prop() position: 'left' | 'right' = 'right';\r\n\r\n  /** Width preset or a numeric pixel width */\r\n  @Prop() width: 'sm' | 'md' | 'lg' | 'full' | number = 'md';\r\n\r\n  /** Controls whether default inner padding is applied */\r\n  @Prop() padding = true;\r\n\r\n  /** When true, shows a top loader */\r\n  @Prop() loading: boolean = false;\r\n\r\n  // Header action button props\r\n\r\n  /** Label for the header primary action button */\r\n  @Prop() headerActionButtonLabel: string;\r\n\r\n  /** Whether the header action button is disabled */\r\n  @Prop() headerActionButtonDisabled = false;\r\n\r\n  /** Icon name for the header action button */\r\n  @Prop() headerActionButtonIcon: string;\r\n\r\n  /** Additional secondary buttons to render in the header */\r\n  @Prop() headerSecondaryButtons: SecondaryButton[];\r\n\r\n  // Footer / primary button props\r\n\r\n  /** Label for the primary footer action button */\r\n  @Prop() primaryButtonLabel: string;\r\n\r\n  /** Whether the primary footer button is disabled */\r\n  @Prop() primaryButtonDisabled = false;\r\n\r\n  /** Icon name for the primary footer button */\r\n  @Prop() primaryButtonIcon: string;\r\n\r\n  /** Secondary buttons to render in the footer */\r\n  @Prop() footerSecondaryButtons?: SecondaryButton[];\r\n\r\n  /** Emitted when the sheet is closed */\r\n  @Event() udpSideSheetClose: EventEmitter<void>;\r\n\r\n  /** Emitted when the primary footer button is clicked */\r\n  @Event() udpPrimaryButtonClick: EventEmitter<void>;\r\n\r\n  /** Emitted when the header action button is clicked */\r\n  @Event() udpHeaderActionButtonClick: EventEmitter<void>;\r\n\r\n  /** Whether the footer should show the overflow \"More\" button */\r\n  @State() showOverflowButton: boolean = false;\r\n\r\n  /** Whether the overflow popover is open */\r\n  @State() openOverflowMenu: boolean = false;\r\n\r\n  /** Anchor element for the overflow popover */\r\n  @State() overflowMenuAnchor: HTMLElement;\r\n\r\n  @State() visibleSecondaryButtons: SecondaryButton[] = [];\r\n  @State() overflowSecondaryButtons: SecondaryButton[] = [];\r\n\r\n  /** Saved original document.body.overflow value to restore on close */\r\n  private originalBodyOverflow: string = '';\r\n\r\n  /** ResizeObserver instance watching footer size changes */\r\n  private resizeObserver: ResizeObserver;\r\n\r\n  /** Reference to the footer element */\r\n  private footerRef: HTMLElement;\r\n\r\n  /** Offscreen measurement container for buttons */\r\n  private measurementContainerRef: HTMLElement;\r\n\r\n  /** Saved original document.body.paddingRight value to restore on close */\r\n  private originalBodyPaddingRight: string = '';\r\n\r\n  /**\r\n   * Watcher for `open` prop. Handles portal append/removal and body scroll lock.\r\n   *\r\n   * @param newValue - new value of the `open` prop\r\n   * @param oldValue - previous value of the `open` prop\r\n   */\r\n  @Watch('open')\r\n  handleOpenChange(newValue: boolean, oldValue: boolean) {\r\n    if (newValue === oldValue) {\r\n      return;\r\n    }\r\n\r\n    if (newValue) {\r\n      // Calculate scrollbar width before hiding it\r\n      const scrollbarWidth = window.innerWidth - document.documentElement.clientWidth;\r\n\r\n      // Save original values\r\n      this.originalBodyOverflow = document.body.style.overflow;\r\n      this.originalBodyPaddingRight = document.body.style.paddingRight;\r\n\r\n      document.body.appendChild(this.hostEl);\r\n\r\n      // Add padding to compensate for scrollbar\r\n      if (scrollbarWidth > 0) {\r\n        const currentPadding = parseInt(window.getComputedStyle(document.body).paddingRight) || 0;\r\n        document.body.style.paddingRight = `${currentPadding + scrollbarWidth}px`;\r\n      }\r\n\r\n      document.body.style.overflow = 'hidden';\r\n\r\n      requestAnimationFrame(() => {\r\n        this.hostEl.classList.add('is-visible');\r\n        // Check overflow after the side sheet is visible\r\n        setTimeout(() => this.checkOverflow(), 50);\r\n      });\r\n    } else {\r\n      this.hostEl.classList.remove('is-visible');\r\n      document.body.style.overflow = this.originalBodyOverflow;\r\n      document.body.style.paddingRight = this.originalBodyPaddingRight;\r\n      this.hostEl.addEventListener('transitionend', this.handleTransitionEnd, { once: true });\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Watcher for footer secondary buttons changes. Triggers overflow recalculation.\r\n   */\r\n  @Watch('footerSecondaryButtons')\r\n  handleSecondaryButtonsChange() {\r\n    // Recheck overflow when buttons change\r\n    setTimeout(() => this.checkOverflow(), 50);\r\n  }\r\n\r\n  /**\r\n   * Measures footer buttons in an offscreen container and sets `showOverflowButton`.\r\n   * Safely returns early if required refs are unavailable.\r\n   */\r\n  private checkOverflow() {\r\n    if (!this.footerRef || !this.measurementContainerRef) {\r\n      return;\r\n    }\r\n\r\n    if (!this.footerSecondaryButtons || this.footerSecondaryButtons.length === 0) {\r\n      this.showOverflowButton = false;\r\n      return;\r\n    }\r\n\r\n    // Get the footer container width (minus padding)\r\n    const footerWidth = this.footerRef.offsetWidth;\r\n    const footerStyle = window.getComputedStyle(this.footerRef);\r\n    const footerPaddingLeft = parseFloat(footerStyle.paddingLeft);\r\n    const footerPaddingRight = parseFloat(footerStyle.paddingRight);\r\n    const availableWidth = footerWidth - footerPaddingLeft - footerPaddingRight;\r\n\r\n    // Measure all buttons in the hidden measurement container\r\n    const measurementButtons = this.measurementContainerRef.querySelectorAll('udp-button');\r\n    let totalWidth = 0;\r\n\r\n    measurementButtons.forEach((button, index) => {\r\n      const buttonWidth = button && button instanceof HTMLElement ? button.offsetWidth : 0;\r\n      totalWidth += buttonWidth;\r\n\r\n      // Add gap spacing between buttons (except for the last one)\r\n      if (index < measurementButtons.length - 1) {\r\n        const containerStyle = window.getComputedStyle(this.measurementContainerRef);\r\n        const gap = parseFloat(containerStyle.gap) || 4; // Default gap from CSS\r\n        totalWidth += gap;\r\n      }\r\n    });\r\n\r\n    // Add a small buffer to prevent edge cases\r\n    const buffer = 10;\r\n    const isOverflowing = totalWidth + buffer > availableWidth;\r\n\r\n    this.showOverflowButton = isOverflowing;\r\n  }\r\n\r\n  /**\r\n   * Transition end handler used to remove the host element from body after close.\r\n   *\r\n   * @private\r\n   */\r\n  private handleTransitionEnd = () => {\r\n    if (!this.open && this.hostEl.parentElement === document.body) {\r\n      document.body.removeChild(this.hostEl);\r\n    }\r\n  };\r\n\r\n  /**\r\n   * Lifecycle: componentDidLoad. Sets up ResizeObserver and initial overflow check.\r\n   *\r\n   * @private\r\n   */\r\n  componentDidLoad() {\r\n    if (Build.isBrowser) {\r\n      // Set up ResizeObserver to watch for footer size changes\r\n      this.resizeObserver = new ResizeObserver(() => {\r\n        this.checkOverflow();\r\n      });\r\n\r\n      // Initial check after a small delay to ensure DOM is ready\r\n      requestAnimationFrame(() => {\r\n        setTimeout(() => {\r\n          if (this.footerRef) {\r\n            this.resizeObserver.observe(this.footerRef);\r\n          }\r\n          this.checkOverflow();\r\n        }, 100);\r\n      });\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Lifecycle: disconnectedCallback. Restores body styles and disconnects observers.\r\n   *\r\n   * @private\r\n   */\r\n  disconnectedCallback() {\r\n    if (document.body.style.overflow === 'hidden') {\r\n      document.body.style.overflow = this.originalBodyOverflow;\r\n      document.body.style.paddingRight = this.originalBodyPaddingRight;\r\n    }\r\n\r\n    // Clean up ResizeObserver\r\n    if (this.resizeObserver) {\r\n      this.resizeObserver.disconnect();\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Close the side sheet and emit close event.\r\n   *\r\n   * @private\r\n   */\r\n  private onClose = () => {\r\n    this.open = false;\r\n    this.udpSideSheetClose.emit();\r\n  };\r\n\r\n  /**\r\n   * Backdrop click handler. Only closes when clicking the backdrop itself.\r\n   *\r\n   * @param e - MouseEvent from the backdrop click\r\n   * @private\r\n   */\r\n  private onCloseBackdrop = (e: MouseEvent) => {\r\n    if (e.target === e.currentTarget) {\r\n      this.onClose();\r\n    }\r\n  };\r\n\r\n  /**\r\n   * Emit primary footer button click event.\r\n   *\r\n   * @private\r\n   */\r\n  private onPrimaryButtonClick = () => {\r\n    this.udpPrimaryButtonClick.emit();\r\n  };\r\n\r\n  /**\r\n   * Emit header action button click event.\r\n   *\r\n   * @private\r\n   */\r\n  private onHeaderActionButtonClick = () => {\r\n    this.udpHeaderActionButtonClick.emit();\r\n  };\r\n\r\n  /**\r\n   * Open overflow menu anchored to the clicked element.\r\n   *\r\n   * @param event - MouseEvent from the \"More\" button click\r\n   * @private\r\n   */\r\n  private onMoreActionButtonClick = (event: MouseEvent) => {\r\n    this.overflowMenuAnchor = event.currentTarget as HTMLElement;\r\n    this.openOverflowMenu = true;\r\n  };\r\n\r\n  /**\r\n   * Close the overflow popover.\r\n   *\r\n   * @param e - optional KeyboardEvent or MouseEvent (unused)\r\n   * @private\r\n   */\r\n  private handleCloseOverflowMenu = () => {\r\n    this.openOverflowMenu = false;\r\n  };\r\n\r\n  /**\r\n   * Render the component UI.\r\n   *\r\n   * @returns JSX element tree\r\n   * @private\r\n   */\r\n  render() {\r\n    const widthClass = typeof this.width === 'number' ? 'custom-width' : this.width;\r\n    const sideSheetStyle = typeof this.width === 'number' ? { maxWidth: `${this.width}px` } : {};\r\n    // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\r\n    const headerStartIcon = Boolean(this.headerActionButtonIcon) ? (\r\n      <udp-icon iconName={this.headerActionButtonIcon} color=\"inherit\" />\r\n    ) : undefined;\r\n    // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\r\n    const overflowIcon = <udp-icon iconName=\"overflowMenuVertical\" color=\"inherit\" />;\r\n\r\n    return (\r\n      <div class=\"backdrop\" onClick={this.onCloseBackdrop}>\r\n        <div\r\n          class={{ sheet: true, [this.position]: true, [widthClass]: true }}\r\n          style={sideSheetStyle}\r\n        >\r\n          {/* Header layout has been changed here */}\r\n          <div class=\"title-container\">\r\n            <div class=\"close-button\">\r\n              <stencil-icon-button\r\n                // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\r\n                icon={Close24}\r\n                onClick={this.onClose}\r\n                secondary\r\n              ></stencil-icon-button>\r\n            </div>\r\n            <div class=\"title-text\">\r\n              <unity-typography variant=\"h6\">{this.title}</unity-typography>\r\n            </div>\r\n            {/* Conditionally render the new header action button */}\r\n            {(this.headerActionButtonLabel || this.headerSecondaryButtons?.length > 0) && (\r\n              <div class=\"header-action-button\">\r\n                {this.headerSecondaryButtons?.map((item: SecondaryButton) => (\r\n                  <udp-button\r\n                    variant=\"outlined\"\r\n                    disabled={item.disabled}\r\n                    onClick={item.onClick}\r\n                    endIcon={item.icon}\r\n                  >\r\n                    {item.label}\r\n                  </udp-button>\r\n                ))}\r\n                {this.headerActionButtonLabel && (\r\n                  <udp-button\r\n                    disabled={this.headerActionButtonDisabled}\r\n                    onClick={this.onHeaderActionButtonClick}\r\n                    // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\r\n                    startIcon={headerStartIcon}\r\n                    variant=\"contained\"\r\n                  >\r\n                    {this.headerActionButtonLabel}\r\n                  </udp-button>\r\n                )}\r\n              </div>\r\n            )}\r\n          </div>\r\n          <div class=\"loader-container\">\r\n            <udp-linear-loader class={{ 'is-loading': this.loading }} color=\"primary\" />\r\n          </div>\r\n\r\n          <div class={{ content: true, padding: this.padding }}>\r\n            <slot />\r\n          </div>\r\n          {(this.primaryButtonLabel || this.footerSecondaryButtons?.length > 0) && (\r\n            <div>\r\n              <div class=\"loader-container\"></div>\r\n              <div\r\n                class={{\r\n                  footer: true,\r\n                }}\r\n                ref={el => (this.footerRef = el)}\r\n              >\r\n                {/* Visible buttons container */}\r\n                {!this.showOverflowButton && this.footerSecondaryButtons?.length > 0 && (\r\n                  <div class=\"footer-secondary-buttons-container\">\r\n                    <div class=\"footer-secondary-buttons\">\r\n                      {this.footerSecondaryButtons?.map((item: SecondaryButton) => (\r\n                        <udp-button\r\n                          variant=\"outlined\"\r\n                          disabled={item.disabled}\r\n                          onClick={item.onClick}\r\n                          endIcon={item.icon}\r\n                        >\r\n                          {item.label}\r\n                        </udp-button>\r\n                      ))}\r\n                    </div>\r\n                  </div>\r\n                )}\r\n\r\n                {/* More button when overflowing */}\r\n                {this.showOverflowButton && (\r\n                  <udp-button\r\n                    variant=\"outlined\"\r\n                    onClick={this.onMoreActionButtonClick}\r\n                    color=\"secondary\"\r\n                    // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\r\n                    endIcon={overflowIcon}\r\n                  >\r\n                    More\r\n                  </udp-button>\r\n                )}\r\n\r\n                {/* Primary button */}\r\n                {this.primaryButtonLabel && (\r\n                  <udp-button\r\n                    variant=\"contained\"\r\n                    disabled={this.primaryButtonDisabled}\r\n                    onClick={this.onPrimaryButtonClick}\r\n                    endIcon={this.primaryButtonIcon}\r\n                  >\r\n                    {this.primaryButtonLabel}\r\n                  </udp-button>\r\n                )}\r\n\r\n                {/* Overflow menu */}\r\n                {this.showOverflowButton && (\r\n                  <udp-pop-over\r\n                    anchorElement={this.overflowMenuAnchor}\r\n                    isOpen={this.openOverflowMenu}\r\n                    popoverWidth={'200px'}\r\n                    popoverMaxHeight={'300px'}\r\n                    handleOnClose={this.handleCloseOverflowMenu}\r\n                  >\r\n                    <div class=\"menu\">\r\n                      {this.footerSecondaryButtons?.map(item => (\r\n                        <udp-menu-item\r\n                          label={item?.label}\r\n                          iconName={item?.icon}\r\n                          onItemClick={() => {\r\n                            item?.onClick();\r\n                            this.handleCloseOverflowMenu();\r\n                          }}\r\n                          disabled={item?.disabled}\r\n                        />\r\n                      ))}\r\n                    </div>\r\n                  </udp-pop-over>\r\n                )}\r\n\r\n                {/* Hidden measurement container - renders all buttons for measurement */}\r\n                <div\r\n                  ref={el => (this.measurementContainerRef = el)}\r\n                  style={{\r\n                    position: 'absolute',\r\n                    visibility: 'hidden',\r\n                    pointerEvents: 'none',\r\n                    display: 'flex',\r\n                    gap: 'var(--spacing-02, 4px)',\r\n                  }}\r\n                  aria-hidden=\"true\"\r\n                >\r\n                  {this.footerSecondaryButtons?.map((item: SecondaryButton) => (\r\n                    <udp-button\r\n                      variant=\"text\"\r\n                      size=\"medium\"\r\n                      disabled={item.disabled}\r\n                      endIcon={item.icon}\r\n                    >\r\n                      {item.label}\r\n                    </udp-button>\r\n                  ))}\r\n                  {this.primaryButtonLabel && (\r\n                    <udp-button\r\n                      variant=\"contained\"\r\n                      size=\"medium\"\r\n                      disabled={this.primaryButtonDisabled}\r\n                      endIcon={this.primaryButtonIcon}\r\n                    >\r\n                      {this.primaryButtonLabel}\r\n                    </udp-button>\r\n                  )}\r\n                </div>\r\n              </div>\r\n            </div>\r\n          )}\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"],"names":[],"mappings":"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"}

package/dist/esm/udp-list-renderer_3.entry.js

@@ -198,7 +198,7 @@ const UdpPagination = class {
 };
 UdpPagination.style = udpPaginationCss;
 
-const udpSideSheetCss = ":host{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:9999;visibility:hidden;transition:visibility 0s 0.2s}:host(.is-visible){visibility:visible;transition-delay:0s}.backdrop{background:rgba(0, 0, 0, 0.5);width:100%;height:100%;position:fixed;top:0;left:0;opacity:0;transition:opacity 0.2s ease-in-out}:host(.is-visible) .backdrop{opacity:1}.sheet{background:white;height:100vh;position:fixed;top:0;display:flex;flex-direction:column;box-shadow:0 0 4px rgba(0, 0, 0, 0.3);transition:transform 0.2s ease-in-out;width:100%}.sheet.right{right:0;transform:translateX(100%)}.sheet.left{left:0;transform:translateX(-100%)}:host(.is-visible) .sheet{transform:translateX(0)}.sheet.sm{max-width:360px}.sheet.md{max-width:600px}.sheet.lg{max-width:960px}.sheet.full{max-width:100%}.sheet.custom-width{}.title-container{display:flex;justify-content:space-between;align-items:center;flex-shrink:0;box-shadow:var(--elevation-01, 0 4px 8px rgba(0, 0, 0, 0.1));gap:var(--spacing-02)}.title-text{flex-grow:1;text-align:left;}.close-button{flex-shrink:0}.header-action-button{flex-shrink:0}.content{overflow-y:auto;flex-grow:1;background-color:var(--gray-01)}.content.padding{padding:var(--spacing-05, 24px)}.footer{padding:var(--spacing-05, 24px);border-top:1px solid #ccc;display:flex;justify-content:flex-end;flex-shrink:0}.loader-container{height:4px;width:100%;background-color:var(--gray-01)}.loader-container udp-linear-loader{visibility:hidden;opacity:0;transition:none}.loader-container udp-linear-loader.is-loading{visibility:visible;opacity:1;}";
+const udpSideSheetCss = ":host{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:9999;visibility:hidden;transition:visibility 0s 0.2s}:host(.is-visible){visibility:visible;transition-delay:0s}.backdrop{background:rgba(0, 0, 0, 0.5);width:100%;height:100%;position:fixed;top:0;left:0;opacity:0;transition:opacity 0.2s ease-in-out}:host(.is-visible) .backdrop{opacity:1}.sheet{background:white;height:100vh;position:fixed;top:0;display:flex;flex-direction:column;box-shadow:0 0 4px rgba(0, 0, 0, 0.3);transition:transform 0.2s ease-in-out;width:100%}.sheet.right{right:0;transform:translateX(100%)}.sheet.left{left:0;transform:translateX(-100%)}:host(.is-visible) .sheet{transform:translateX(0)}.sheet.sm{max-width:360px}.sheet.md{max-width:600px}.sheet.lg{max-width:960px}.sheet.full{max-width:100%}.sheet.custom-width{}.title-container{display:flex;justify-content:space-between;align-items:center;flex-shrink:0;box-shadow:var(--elevation-01, 0 4px 8px rgba(0, 0, 0, 0.1));gap:var(--spacing-02)}.title-text{flex-grow:1;text-align:left;}.close-button{flex-shrink:0}.header-action-button{flex-shrink:0;display:flex;align-items:center;gap:var(--spacing-02, 4px);padding:var(--spacing-03, 8px) var(--spacing-03, 8px) var(--spacing-03, 8px) 0}.content{overflow-y:auto;flex-grow:1;background-color:var(--gray-01)}.content.padding{padding:var(--spacing-05, 24px)}.footer{padding:var(--spacing-03, 8px);box-shadow:var(--elevation-01, 0 4px 8px rgba(0, 0, 0, 0.1));display:flex;justify-content:flex-end;flex-shrink:0;width:100%;gap:var(--spacing-02, 4px);align-items:center}.footer.secondary-button-overflow{flex-direction:row-reverse}.footer-secondary-buttons-container{flex-grow:2;width:100%}.footer-secondary-buttons{display:flex;justify-content:flex-end;gap:var(--spacing-02, 4px);align-items:center}.footer-secondary-buttons.secondary-button-overflow{flex-grow:1}.loader-container{height:4px;width:100%;background-color:var(--gray-01)}.loader-container udp-linear-loader{visibility:hidden;opacity:0;transition:none}.loader-container udp-linear-loader.is-loading{visibility:visible;opacity:1;}";
 
 const UdpSideSheet = class {
     constructor(hostRef) {
@@ -206,62 +206,251 @@ const UdpSideSheet = class {
         this.udpSideSheetClose = createEvent(this, "udpSideSheetClose");
         this.udpPrimaryButtonClick = createEvent(this, "udpPrimaryButtonClick");
         this.udpHeaderActionButtonClick = createEvent(this, "udpHeaderActionButtonClick");
+        /** When true, the side sheet is open and visible */
         this.open = false;
+        /** Position of the sheet on the screen */
         this.position = 'right';
+        /** Width preset or a numeric pixel width */
         this.width = 'md';
+        /** Controls whether default inner padding is applied */
         this.padding = true;
+        /** When true, shows a top loader */
         this.loading = false;
+        /** Whether the header action button is disabled */
         this.headerActionButtonDisabled = false;
+        /** Whether the primary footer button is disabled */
         this.primaryButtonDisabled = false;
+        /** Whether the footer should show the overflow "More" button */
+        this.showOverflowButton = false;
+        /** Whether the overflow popover is open */
+        this.openOverflowMenu = false;
+        this.visibleSecondaryButtons = [];
+        this.overflowSecondaryButtons = [];
+        /** Saved original document.body.overflow value to restore on close */
         this.originalBodyOverflow = '';
+        /** Saved original document.body.paddingRight value to restore on close */
+        this.originalBodyPaddingRight = '';
+        /**
+         * Transition end handler used to remove the host element from body after close.
+         *
+         * @private
+         */
         this.handleTransitionEnd = () => {
             if (!this.open && this.hostEl.parentElement === document.body) {
                 document.body.removeChild(this.hostEl);
             }
         };
+        /**
+         * Close the side sheet and emit close event.
+         *
+         * @private
+         */
         this.onClose = () => {
             this.open = false;
             this.udpSideSheetClose.emit();
         };
+        /**
+         * Backdrop click handler. Only closes when clicking the backdrop itself.
+         *
+         * @param e - MouseEvent from the backdrop click
+         * @private
+         */
+        this.onCloseBackdrop = (e) => {
+            if (e.target === e.currentTarget) {
+                this.onClose();
+            }
+        };
+        /**
+         * Emit primary footer button click event.
+         *
+         * @private
+         */
         this.onPrimaryButtonClick = () => {
             this.udpPrimaryButtonClick.emit();
         };
-        // Handler for the new header action button click
+        /**
+         * Emit header action button click event.
+         *
+         * @private
+         */
         this.onHeaderActionButtonClick = () => {
             this.udpHeaderActionButtonClick.emit();
         };
+        /**
+         * Open overflow menu anchored to the clicked element.
+         *
+         * @param event - MouseEvent from the "More" button click
+         * @private
+         */
+        this.onMoreActionButtonClick = (event) => {
+            this.overflowMenuAnchor = event.currentTarget;
+            this.openOverflowMenu = true;
+        };
+        /**
+         * Close the overflow popover.
+         *
+         * @param e - optional KeyboardEvent or MouseEvent (unused)
+         * @private
+         */
+        this.handleCloseOverflowMenu = () => {
+            this.openOverflowMenu = false;
+        };
     }
+    /**
+     * Watcher for `open` prop. Handles portal append/removal and body scroll lock.
+     *
+     * @param newValue - new value of the `open` prop
+     * @param oldValue - previous value of the `open` prop
+     */
     handleOpenChange(newValue, oldValue) {
         if (newValue === oldValue) {
             return;
         }
         if (newValue) {
+            // Calculate scrollbar width before hiding it
+            const scrollbarWidth = window.innerWidth - document.documentElement.clientWidth;
+            // Save original values
             this.originalBodyOverflow = document.body.style.overflow;
-            document.body.style.overflow = 'hidden';
+            this.originalBodyPaddingRight = document.body.style.paddingRight;
             document.body.appendChild(this.hostEl);
+            // Add padding to compensate for scrollbar
+            if (scrollbarWidth > 0) {
+                const currentPadding = parseInt(window.getComputedStyle(document.body).paddingRight) || 0;
+                document.body.style.paddingRight = `${currentPadding + scrollbarWidth}px`;
+            }
+            document.body.style.overflow = 'hidden';
             requestAnimationFrame(() => {
                 this.hostEl.classList.add('is-visible');
+                // Check overflow after the side sheet is visible
+                setTimeout(() => this.checkOverflow(), 50);
             });
         }
         else {
             this.hostEl.classList.remove('is-visible');
             document.body.style.overflow = this.originalBodyOverflow;
+            document.body.style.paddingRight = this.originalBodyPaddingRight;
             this.hostEl.addEventListener('transitionend', this.handleTransitionEnd, { once: true });
         }
     }
+    /**
+     * Watcher for footer secondary buttons changes. Triggers overflow recalculation.
+     */
+    handleSecondaryButtonsChange() {
+        // Recheck overflow when buttons change
+        setTimeout(() => this.checkOverflow(), 50);
+    }
+    /**
+     * Measures footer buttons in an offscreen container and sets `showOverflowButton`.
+     * Safely returns early if required refs are unavailable.
+     */
+    checkOverflow() {
+        if (!this.footerRef || !this.measurementContainerRef) {
+            return;
+        }
+        if (!this.footerSecondaryButtons || this.footerSecondaryButtons.length === 0) {
+            this.showOverflowButton = false;
+            return;
+        }
+        // Get the footer container width (minus padding)
+        const footerWidth = this.footerRef.offsetWidth;
+        const footerStyle = window.getComputedStyle(this.footerRef);
+        const footerPaddingLeft = parseFloat(footerStyle.paddingLeft);
+        const footerPaddingRight = parseFloat(footerStyle.paddingRight);
+        const availableWidth = footerWidth - footerPaddingLeft - footerPaddingRight;
+        // Measure all buttons in the hidden measurement container
+        const measurementButtons = this.measurementContainerRef.querySelectorAll('udp-button');
+        let totalWidth = 0;
+        measurementButtons.forEach((button, index) => {
+            const buttonWidth = button && button instanceof HTMLElement ? button.offsetWidth : 0;
+            totalWidth += buttonWidth;
+            // Add gap spacing between buttons (except for the last one)
+            if (index < measurementButtons.length - 1) {
+                const containerStyle = window.getComputedStyle(this.measurementContainerRef);
+                const gap = parseFloat(containerStyle.gap) || 4; // Default gap from CSS
+                totalWidth += gap;
+            }
+        });
+        // Add a small buffer to prevent edge cases
+        const buffer = 10;
+        const isOverflowing = totalWidth + buffer > availableWidth;
+        this.showOverflowButton = isOverflowing;
+    }
+    /**
+     * Lifecycle: componentDidLoad. Sets up ResizeObserver and initial overflow check.
+     *
+     * @private
+     */
+    componentDidLoad() {
+        {
+            // Set up ResizeObserver to watch for footer size changes
+            this.resizeObserver = new ResizeObserver(() => {
+                this.checkOverflow();
+            });
+            // Initial check after a small delay to ensure DOM is ready
+            requestAnimationFrame(() => {
+                setTimeout(() => {
+                    if (this.footerRef) {
+                        this.resizeObserver.observe(this.footerRef);
+                    }
+                    this.checkOverflow();
+                }, 100);
+            });
+        }
+    }
+    /**
+     * Lifecycle: disconnectedCallback. Restores body styles and disconnects observers.
+     *
+     * @private
+     */
     disconnectedCallback() {
         if (document.body.style.overflow === 'hidden') {
             document.body.style.overflow = this.originalBodyOverflow;
+            document.body.style.paddingRight = this.originalBodyPaddingRight;
+        }
+        // Clean up ResizeObserver
+        if (this.resizeObserver) {
+            this.resizeObserver.disconnect();
         }
     }
+    /**
+     * Render the component UI.
+     *
+     * @returns JSX element tree
+     * @private
+     */
     render() {
+        var _a, _b, _c, _d, _e, _f, _g;
         const widthClass = typeof this.width === 'number' ? 'custom-width' : this.width;
         const sideSheetStyle = typeof this.width === 'number' ? { maxWidth: `${this.width}px` } : {};
-        return (h("div", { key: '3071b6fbf443030422ad30d2fc7a86a3c71d060a', class: "backdrop", onClick: this.onClose }, h("div", { key: '75ae7c0f6bc4da076a3cd04579fc09252f701eb3', class: { sheet: true, [this.position]: true, [widthClass]: true }, style: sideSheetStyle, onClick: e => e.stopPropagation() }, h("div", { key: 'ec51c197afe4b00084881abb8688ca8f4f994a30', class: "title-container" }, h("div", { key: 'f382e9b4bf63314092b0b5d326069a9ca2316272', class: "close-button" }, h("stencil-icon-button", { key: 'ff449c9a65921a12207f2f4f6daaa45d9ff652c0', icon: Close24, onClick: this.onClose, secondary: true })), h("div", { key: '72e80626b9f519098dd069ebb357061f5e7008f8', class: "title-text" }, h("unity-typography", { key: 'fa7de8f448021ef6ac8a34d4825dcad745124dd2', variant: "h6" }, this.title)), this.headerActionButtonLabel && (h("div", { key: 'bcce55c18c3ff2b80cea48f471468ece741dc0bd', class: "header-action-button" }, h("udp-button", { key: '09d1343460e8b0d7fdceb8769ed8387647ab5a34', disabled: this.headerActionButtonDisabled, onClick: this.onHeaderActionButtonClick, startIcon: h("udp-icon", { iconName: this.headerActionButtonIcon, color: 'inherit' }), variant: "contained" }, this.headerActionButtonLabel)))), h("div", { key: '594932ae9ee30cfd5415fefcd48765c3d3f21aea', class: "loader-container" }, h("udp-linear-loader", { key: 'f3d09a98c7ac6bd22699339d2d0a7325c035e63d', class: { 'is-loading': this.loading }, color: "primary" })), h("div", { key: '59e987c1780a950dcdc8f56f012087a0ba55acb0', class: { content: true, padding: this.padding } }, h("slot", { key: 'fda6cf654587b15f3a28443b47a30f7564b2bf57' })), this.primaryButtonLabel && (h("div", { key: 'c6434be80f44e6f8a277bdff49503f67db5cdca7', class: "footer" }, h("udp-button", { key: '522a0e7bb290472cb1704bc4f61bf2a22ebda668', variant: "contained", size: "large", disabled: this.primaryButtonDisabled, onClick: this.onPrimaryButtonClick, endIcon: this.primaryButtonIcon }, this.primaryButtonLabel))))));
+        // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+        const headerStartIcon = Boolean(this.headerActionButtonIcon) ? (h("udp-icon", { iconName: this.headerActionButtonIcon, color: "inherit" })) : undefined;
+        // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+        const overflowIcon = h("udp-icon", { key: '3262baafbf833e25e0b4d1128b24fb503d1dd157', iconName: "overflowMenuVertical", color: "inherit" });
+        return (h("div", { key: '780c5705588899683400da7bce6569ad8ce15d30', class: "backdrop", onClick: this.onCloseBackdrop }, h("div", { key: 'a68811f8a6c59239c60c048453bb63eae7ed7ee0', class: { sheet: true, [this.position]: true, [widthClass]: true }, style: sideSheetStyle }, h("div", { key: '82207996d3f164f4e4a27132a64d6ce6b82ac401', class: "title-container" }, h("div", { key: 'e29501f861893b9e61f72509c44c337e7d1a5fb1', class: "close-button" }, h("stencil-icon-button", { key: '8980a42b0d47582a0fd91998cafe5c57982e9c04',
+            // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+            icon: Close24, onClick: this.onClose, secondary: true })), h("div", { key: '6b71ecb62ed1bac4560ca3e8e4ff1f643ee98555', class: "title-text" }, h("unity-typography", { key: 'b5f420d289dd23f040100d82def0ff635038cafd', variant: "h6" }, this.title)), (this.headerActionButtonLabel || ((_a = this.headerSecondaryButtons) === null || _a === void 0 ? void 0 : _a.length) > 0) && (h("div", { key: '65b8198f2a63096839fa678b6b69761ea2a93196', class: "header-action-button" }, (_b = this.headerSecondaryButtons) === null || _b === void 0 ? void 0 :
+            _b.map((item) => (h("udp-button", { variant: "outlined", disabled: item.disabled, onClick: item.onClick, endIcon: item.icon }, item.label))), this.headerActionButtonLabel && (h("udp-button", { key: 'a9985bcd675163a0a3dc47ea88cfe35e98a830fb', disabled: this.headerActionButtonDisabled, onClick: this.onHeaderActionButtonClick,
+            // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+            startIcon: headerStartIcon, variant: "contained" }, this.headerActionButtonLabel))))), h("div", { key: '362358edc955be022239e6662a0403baf49a4444', class: "loader-container" }, h("udp-linear-loader", { key: '0f93c37fc52e8400fbdb2d0db0879b49eb605859', class: { 'is-loading': this.loading }, color: "primary" })), h("div", { key: 'a2e70b272eb6f02878845350b7057908fdbb0cb2', class: { content: true, padding: this.padding } }, h("slot", { key: 'c6128fac4e8549fda3c25db826ed0377759a3bbb' })), (this.primaryButtonLabel || ((_c = this.footerSecondaryButtons) === null || _c === void 0 ? void 0 : _c.length) > 0) && (h("div", { key: '2d408d1f87df636effab01487739762b52c8897f' }, h("div", { key: '2fbdee5102a9837cc26d3f0cafb37141ebcc1527', class: "loader-container" }), h("div", { key: '8ba75738ab5ac6c4d33f828988f2d1e85ae1e3d5', class: {
+                footer: true,
+            }, ref: el => (this.footerRef = el) }, !this.showOverflowButton && ((_d = this.footerSecondaryButtons) === null || _d === void 0 ? void 0 : _d.length) > 0 && (h("div", { key: '13c00f7ff092655600f11885ce39d9acd4b9b26a', class: "footer-secondary-buttons-container" }, h("div", { key: '9bc81711a693c84bdab3274e67588193dc226203', class: "footer-secondary-buttons" }, (_e = this.footerSecondaryButtons) === null || _e === void 0 ? void 0 : _e.map((item) => (h("udp-button", { variant: "outlined", disabled: item.disabled, onClick: item.onClick, endIcon: item.icon }, item.label)))))), this.showOverflowButton && (h("udp-button", { key: '92c871d74675c9fd42ac890d9c5efe8e39a6aeb2', variant: "outlined", onClick: this.onMoreActionButtonClick, color: "secondary",
+            // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+            endIcon: overflowIcon }, "More")), this.primaryButtonLabel && (h("udp-button", { key: '94acda01904ab4265ced91dd6ef6e6d9ab788784', variant: "contained", disabled: this.primaryButtonDisabled, onClick: this.onPrimaryButtonClick, endIcon: this.primaryButtonIcon }, this.primaryButtonLabel)), this.showOverflowButton && (h("udp-pop-over", { key: 'c839371b5401fb7433417cba6b705c08c2242c09', anchorElement: this.overflowMenuAnchor, isOpen: this.openOverflowMenu, popoverWidth: '200px', popoverMaxHeight: '300px', handleOnClose: this.handleCloseOverflowMenu }, h("div", { key: '368023d9643a123acfa8215dab9ceaa85e613fbf', class: "menu" }, (_f = this.footerSecondaryButtons) === null || _f === void 0 ? void 0 : _f.map(item => (h("udp-menu-item", { label: item === null || item === void 0 ? void 0 : item.label, iconName: item === null || item === void 0 ? void 0 : item.icon, onItemClick: () => {
+                item === null || item === void 0 ? void 0 : item.onClick();
+                this.handleCloseOverflowMenu();
+            }, disabled: item === null || item === void 0 ? void 0 : item.disabled })))))), h("div", { key: '2dfb53eb181826fce129e856a4427da9edaeb756', ref: el => (this.measurementContainerRef = el), style: {
+                position: 'absolute',
+                visibility: 'hidden',
+                pointerEvents: 'none',
+                display: 'flex',
+                gap: 'var(--spacing-02, 4px)',
+            }, "aria-hidden": "true" }, (_g = this.footerSecondaryButtons) === null || _g === void 0 ? void 0 :
+            _g.map((item) => (h("udp-button", { variant: "text", size: "medium", disabled: item.disabled, endIcon: item.icon }, item.label))), this.primaryButtonLabel && (h("udp-button", { key: '5e6f99245f8649cbacfee9c34a88967966c2e856', variant: "contained", size: "medium", disabled: this.primaryButtonDisabled, endIcon: this.primaryButtonIcon }, this.primaryButtonLabel)))))))));
     }
     get hostEl() { return getElement(this); }
     static get watchers() { return {
-        "open": ["handleOpenChange"]
+        "open": ["handleOpenChange"],
+        "footerSecondaryButtons": ["handleSecondaryButtonsChange"]
     }; }
 };
 UdpSideSheet.style = udpSideSheetCss;

package/dist/esm/udp-map.entry.js

@@ -93,11 +93,11 @@ const UdpMap = class {
     }
     //////////////////////////////////////////////////////////RENDER/////////////////////////////////////////////////////
     render() {
-        return (h("map-component", { key: 'b701c0b012dade16e39e23231e6e96e15e8024cf', handleSetMapComponent: this.handleSetMapComponent, data: this.data, isGeoJsonFormat: this.isGeoJsonFormat, geoJsonMappingConfig: this.geoJsonMappingConfig, enableZoom: this.enableZoom, mapZoom: this.mapZoom, mapCenter: this.mapCenter, mapHeight: this.mapHeight, crs: this.crs, mapProjection: this.mapProjection, mapDataProjection: this.mapDataProjection, getFilteredMapData: this.getFilteredMapData, getFeatureStyles: this.getFeatureStyles, getSelectedFeatureStyles: this.getSelectedFeatureStyles, filterPanel: this.filterPanel, filterPanelCallback: this.filterPanelCallback, enableTileSelection: this.enableTileSelection, tileLayersOptions: this.tileLayersOptions, defaultTileOptionName: this.defaultTileOptionName, layerOptions: this.layerOptions, initialSelectedLayers: this.initialSelectedLayers, bulkSelectedFeaturesActionPanel: this.bulkSelectedFeaturesActionPanel, handleSetSelectedFeaturesOnBulkSelect: this.handleSetSelectedFeaturesOnBulkSelect, handleSetSelectedFeatureOnSelect: this.handleSetSelectedFeatureOnSelect, filterLayersByRole: this.filterLayersByRole, layerKeys: this.layerKeys, layerKeySeparator: this.layerKeySeparator, user: this.user, layerRoles: this.layerRoles, filteredLayerOptionsByRole: this.filteredLayerOptionsByRole, handleSetFilteredLayerOptionsByRole: this.handleSetFilteredLayerOptionsByRole, readOnlyMap: this.readOnlyMap, enableViewFeature: this.enableViewFeature, handleViewFeature: this.handleViewFeature, bulkSelectionActive: this.bulkSelectionActive, splitActive: this.splitActive, enableDragBox: this.enableDragBox, selectFeatureInteraction: this.selectFeatureInteraction, handleSetSelectedFeatureProperties: this.handleSetSelectedFeatureProperties, selectedFeatureCoordinates: this.selectedFeatureCoordinates, selectedFeatureProperties: this.selectedFeatureProperties, enableAddNewFeature: this.enableAddNewFeature, handleGetZoomExtent: this.handleGetZoomExtent, selectedLayers: this.selectedLayers, handleSetSelectedLayers: val => {
+        return (h("map-component", { key: 'dbea383c45161505aff8965d3bfbd925ccce570b', handleSetMapComponent: this.handleSetMapComponent, data: this.data, isGeoJsonFormat: this.isGeoJsonFormat, geoJsonMappingConfig: this.geoJsonMappingConfig, enableZoom: this.enableZoom, mapZoom: this.mapZoom, mapCenter: this.mapCenter, mapHeight: this.mapHeight, crs: this.crs, mapProjection: this.mapProjection, mapDataProjection: this.mapDataProjection, getFilteredMapData: this.getFilteredMapData, getFeatureStyles: this.getFeatureStyles, getSelectedFeatureStyles: this.getSelectedFeatureStyles, filterPanel: this.filterPanel, filterPanelCallback: this.filterPanelCallback, enableTileSelection: this.enableTileSelection, tileLayersOptions: this.tileLayersOptions, defaultTileOptionName: this.defaultTileOptionName, layerOptions: this.layerOptions, initialSelectedLayers: this.initialSelectedLayers, bulkSelectedFeaturesActionPanel: this.bulkSelectedFeaturesActionPanel, handleSetSelectedFeaturesOnBulkSelect: this.handleSetSelectedFeaturesOnBulkSelect, handleSetSelectedFeatureOnSelect: this.handleSetSelectedFeatureOnSelect, filterLayersByRole: this.filterLayersByRole, layerKeys: this.layerKeys, layerKeySeparator: this.layerKeySeparator, user: this.user, layerRoles: this.layerRoles, filteredLayerOptionsByRole: this.filteredLayerOptionsByRole, handleSetFilteredLayerOptionsByRole: this.handleSetFilteredLayerOptionsByRole, readOnlyMap: this.readOnlyMap, enableViewFeature: this.enableViewFeature, handleViewFeature: this.handleViewFeature, bulkSelectionActive: this.bulkSelectionActive, splitActive: this.splitActive, enableDragBox: this.enableDragBox, selectFeatureInteraction: this.selectFeatureInteraction, handleSetSelectedFeatureProperties: this.handleSetSelectedFeatureProperties, selectedFeatureCoordinates: this.selectedFeatureCoordinates, selectedFeatureProperties: this.selectedFeatureProperties, enableAddNewFeature: this.enableAddNewFeature, handleGetZoomExtent: this.handleGetZoomExtent, selectedLayers: this.selectedLayers, handleSetSelectedLayers: val => {
                 this.updateSelectedLayers(val);
-            }, readOnlyLayers: this.readOnlyLayers, additionalOnclosePopover: this.additionalOnclosePopover, popoverPrimaryActions: this.popoverPrimaryActions, popoverMoreIconButtonActions: this.popoverMoreIconButtonActions, getMessagePopover: this.getMessagePopover, getMessageIconPopover: this.getMessageIconPopover, hideMessageIconPopover: this.hideMessageIconPopover, popoverCardConfig: this.cardConfig, popoverWidth: this.popoverWidth, handleGetAdditionalFeaturePropertiesOnSelect: this.handleGetAdditionalFeaturePropertiesOnSelect, minZoom: this.minZoom, maxZoom: this.maxZoom }, this.enableToolbar && (h("udp-map-toolbar", { key: '04d39770f38e442466c0c82f0feb92bfc70b1535', map: this.map, mapTitle: this.mapTitle, mapProjection: this.mapProjection, getFeatureStyles: this.getFeatureStyles, getSelectedFeatureStyles: this.getSelectedFeatureStyles, filterPanel: this.filterPanel, enableTileSelection: this.enableTileSelection, tileLayersOptions: this.tileLayersOptions, defaultTileOptionName: this.defaultTileOptionName, layerOptions: this.layerOptions, bulkSelectedFeaturesActionPanel: this.bulkSelectedFeaturesActionPanel, handleSetSelectedFeaturesOnBulkSelect: this.handleSetSelectedFeaturesOnBulkSelect, handleRefresh: this.handleRefresh, refreshButtonTooltip: this.refreshButtonTooltip, readOnlyMap: this.readOnlyMap, enableAdd: this.enableAdd, handleAddNewFeatures: this.handleAddNewFeatures, addMultipleFeatures: this.addMultipleFeatures, enableSplitFeature: this.enableSplitFeature, handleSplitFeature: this.handleSplitFeature, handleSetSelectedFeatureProperties: this.handleSetSelectedFeatureProperties, filteredLayerOptionsByRole: this.filteredLayerOptionsByRole, handleSetBulkSelectionActive: this.handleSetBulkSelectionActive, enableDragBox: this.enableDragBox, handleSetEnableDragBox: this.handleSetEnableDragBox, splitActive: this.splitActive, handleSetSplitActive: this.handleSetSplitActive, selectFeatureInteraction: this.selectFeatureInteraction, enableAddNewFeature: this.enableAddNewFeature, handleEnableAddNewFeature: this.handleEnableAddNewFeature, handleSelectLayersCallback: this.handleSelectLayersCallback, selectedLayers: this.selectedLayers, handleSetSelectedLayers: val => {
+            }, readOnlyLayers: this.readOnlyLayers, additionalOnclosePopover: this.additionalOnclosePopover, popoverPrimaryActions: this.popoverPrimaryActions, popoverMoreIconButtonActions: this.popoverMoreIconButtonActions, getMessagePopover: this.getMessagePopover, getMessageIconPopover: this.getMessageIconPopover, hideMessageIconPopover: this.hideMessageIconPopover, popoverCardConfig: this.cardConfig, popoverWidth: this.popoverWidth, handleGetAdditionalFeaturePropertiesOnSelect: this.handleGetAdditionalFeaturePropertiesOnSelect, minZoom: this.minZoom, maxZoom: this.maxZoom }, this.enableToolbar && (h("udp-map-toolbar", { key: 'd62be8bc2f358155b349688ac9ddd27c4ee95594', map: this.map, mapTitle: this.mapTitle, mapProjection: this.mapProjection, getFeatureStyles: this.getFeatureStyles, getSelectedFeatureStyles: this.getSelectedFeatureStyles, filterPanel: this.filterPanel, enableTileSelection: this.enableTileSelection, tileLayersOptions: this.tileLayersOptions, defaultTileOptionName: this.defaultTileOptionName, layerOptions: this.layerOptions, bulkSelectedFeaturesActionPanel: this.bulkSelectedFeaturesActionPanel, handleSetSelectedFeaturesOnBulkSelect: this.handleSetSelectedFeaturesOnBulkSelect, handleRefresh: this.handleRefresh, refreshButtonTooltip: this.refreshButtonTooltip, readOnlyMap: this.readOnlyMap, enableAdd: this.enableAdd, handleAddNewFeatures: this.handleAddNewFeatures, addMultipleFeatures: this.addMultipleFeatures, enableSplitFeature: this.enableSplitFeature, handleSplitFeature: this.handleSplitFeature, handleSetSelectedFeatureProperties: this.handleSetSelectedFeatureProperties, filteredLayerOptionsByRole: this.filteredLayerOptionsByRole, handleSetBulkSelectionActive: this.handleSetBulkSelectionActive, enableDragBox: this.enableDragBox, handleSetEnableDragBox: this.handleSetEnableDragBox, splitActive: this.splitActive, handleSetSplitActive: this.handleSetSplitActive, selectFeatureInteraction: this.selectFeatureInteraction, enableAddNewFeature: this.enableAddNewFeature, handleEnableAddNewFeature: this.handleEnableAddNewFeature, handleSelectLayersCallback: this.handleSelectLayersCallback, selectedLayers: this.selectedLayers, handleSetSelectedLayers: val => {
                 this.updateSelectedLayers(val);
-            }, addFeaturePanelConfig: this.addFeaturePanelConfig })), h("slot", { key: '24e6a8974bd1acda96d431dfc7fa5b8bd8129355' })));
+            }, addFeaturePanelConfig: this.addFeaturePanelConfig })), h("slot", { key: 'f2753f5f595726febc44235dbc1e728c1763da64' })));
     }
     static get watchers() { return {
         "enableDragBox": ["watchDragBoxandSelectedFeatureInteraction"],

package/dist/esm/udp-page.entry.js

@@ -20,7 +20,7 @@ const UdpPage = class {
             padding: this.padding,
             margin: '0 auto', // Centers the content if max-width is set
         };
-        return (h("div", { key: '1e21862453854a594552763318343637c1544de1', style: style }, h("slot", { key: 'fcdedce8e48062cd41721f509b5d1d034c218f7b' }), " "));
+        return (h("div", { key: '9a506250a5ee7200c405e7f3fe0a018dda294ab4', style: style }, h("slot", { key: 'eea699d0fed23736cfe071b86ac1449a52f51b0f' }), " "));
     }
 };
 UdpPage.style = udpPageCss;

package/dist/esm/udp-split-screen.entry.js

@@ -55,7 +55,7 @@ const UdpSplitScreen = class {
         }
     }
     render() {
-        return (h("div", { key: '6de7d4288cb53149ae06ed973443b31ecd898015', ref: (el) => this.element = el, class: { 'container': true, 'open': this.isOpen } }, h("div", { key: 'a47d6eb52c88ec9c52d895af81ad722c1d5b4df0', class: "panel", style: { width: `${this.panelWidth}%` } }, h("slot", { key: '8fe4023b236098476be1c7e113f94377d1396f89', name: "first-panel" })), h("div", { key: 'fb98abdfcefa4cd6e8dccd077c911033169244da', class: "resizer", onMouseDown: (event) => event.preventDefault() }, h("div", { key: '1db3f8ad5295c7feeecbe77a02af8f5cea712be6', class: "drag-handle" })), h("div", { key: '6b8a9feb47f10756bab8a3cf2fa2aac2069627b4', class: "panel", style: { width: `${100 - this.panelWidth}%` } }, h("slot", { key: '26a15ac5efaae765de72034e8359dfd2a51be80d', name: "second-panel" }, this.panelContent))));
+        return (h("div", { key: 'ca232222c0c85071eb987d373ad1541631070e3e', ref: (el) => this.element = el, class: { 'container': true, 'open': this.isOpen } }, h("div", { key: 'c221965b0e7542253986c878b05cc656289431e9', class: "panel", style: { width: `${this.panelWidth}%` } }, h("slot", { key: '4edf17b48cf6d2e89826878ede587f0a9e2ce1e8', name: "first-panel" })), h("div", { key: '51b5ea69206ebf1221cbb9dbed3f9456fbf54c59', class: "resizer", onMouseDown: (event) => event.preventDefault() }, h("div", { key: '86d906ebb8e8561e7e564b6c8b4af62a03e1653c', class: "drag-handle" })), h("div", { key: '28fba6e4b0f176b7e08c1f29a3edc045f66346e8', class: "panel", style: { width: `${100 - this.panelWidth}%` } }, h("slot", { key: 'b1215db69a194eced28d595a39322afbe4c7ccde', name: "second-panel" }, this.panelContent))));
     }
 };
 UdpSplitScreen.style = udpSplitScreenCss;

package/dist/esm/udp-stepper-demo.entry.js

@@ -92,7 +92,7 @@ const UdpStepperDemo = class {
         };
     }
     render() {
-        return (h("div", { key: 'afad6510846a9c4d5d83344d045915061c40e4da', style: { padding: '2rem' } }, h("unity-typography", { key: '39114ea64804d8441c90ab2b4bac9175509128f1', variant: "h2" }, "Horizontal Stepper with Labels bottom"), h("udp-stepper", { key: '4525e5ceb4a92ddc679690ba2762bfaff5b09218', steps: this.steps, activeStep: this.activeStep, completed: this.completed, stepChange: this.handleStepChange, orientation: "horizontal", labelDisplay: "all", labelPosition: "bottom" }), h("unity-typography", { key: 'c28dc5a2348e1af8e544a33d6f359d32d7f326ea', variant: "h2" }, "Horizontal Stepper without Labels"), h("udp-stepper", { key: 'bc50999f3a4b9f150d3f932101221c9c6b992fdc', steps: this.steps, activeStep: this.activeStep, completed: this.completed, stepChange: this.handleStepChange, orientation: "horizontal", labelDisplay: "none", labelPosition: "bottom" }), h("unity-typography", { key: 'a5fb283cd408dae5a92b5bbcb999849d29c4114e', variant: "h2" }, "Horizontal Stepper with Labels to Right"), h("udp-stepper", { key: 'cc34b5cfd9e2a29dc5f23c229e28ff6e3bb4fccd', steps: this.steps, activeStep: this.activeStep, completed: this.completed, stepChange: this.handleStepChange, orientation: "horizontal", labelDisplay: "all", labelPosition: "right" }), h("unity-typography", { key: '6d602c582f6ebc764cb46f0bc3a7b7322da22217', variant: "h2" }, "Vertical Stepper"), h("udp-stepper", { key: 'f530054751640c808efa3a1abdfea025402283a8', steps: this.steps, activeStep: this.activeStep, completed: this.completed, stepChange: this.handleStepChange, orientation: "vertical", labelDisplay: "all", labelPosition: "right" })));
+        return (h("div", { key: 'e81619ca3c31f9f6662c0b3af6c02a2db3e3f564', style: { padding: '2rem' } }, h("unity-typography", { key: '5e11e57915b6081e460f47a344dd31bf722d7e5b', variant: "h2" }, "Horizontal Stepper with Labels bottom"), h("udp-stepper", { key: 'ec35e19cc92d59c85818becd4e4d56e065df5dc3', steps: this.steps, activeStep: this.activeStep, completed: this.completed, stepChange: this.handleStepChange, orientation: "horizontal", labelDisplay: "all", labelPosition: "bottom" }), h("unity-typography", { key: 'f0011595e8eb435dd85b6c6c2570029a3cbd6afc', variant: "h2" }, "Horizontal Stepper without Labels"), h("udp-stepper", { key: 'afe54dc4d369c757dcb6ba5fe455e84c95e86f07', steps: this.steps, activeStep: this.activeStep, completed: this.completed, stepChange: this.handleStepChange, orientation: "horizontal", labelDisplay: "none", labelPosition: "bottom" }), h("unity-typography", { key: '394396ffff23cc1f4d99611bc3ccceeb096a2c1e', variant: "h2" }, "Horizontal Stepper with Labels to Right"), h("udp-stepper", { key: '104aaf080e02cd0c9da8a84cf911b721883e0a37', steps: this.steps, activeStep: this.activeStep, completed: this.completed, stepChange: this.handleStepChange, orientation: "horizontal", labelDisplay: "all", labelPosition: "right" }), h("unity-typography", { key: '90b1aaf901ca38b48c5584c0fb79d75a0f5a2a8c', variant: "h2" }, "Vertical Stepper"), h("udp-stepper", { key: '219567475d5ea693bd77641df12c20ee9360367d', steps: this.steps, activeStep: this.activeStep, completed: this.completed, stepChange: this.handleStepChange, orientation: "vertical", labelDisplay: "all", labelPosition: "right" })));
     }
 };