@genexus/genexus-ide-ui 0.0.23 → 0.0.25

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (61) hide show
  1. package/dist/cjs/ch-action-group_2.cjs.entry.js +211 -0
  2. package/dist/cjs/ch-dropdown-item.cjs.entry.js +36 -5
  3. package/dist/cjs/ch-dropdown.cjs.entry.js +50 -52
  4. package/dist/cjs/ch-test-action-group.cjs.entry.js +79 -0
  5. package/dist/cjs/ch-test-dropdown.cjs.entry.js +54 -0
  6. package/dist/cjs/ch-window_2.cjs.entry.js +25 -6
  7. package/dist/cjs/genexus-ide-ui.cjs.js +1 -1
  8. package/dist/cjs/gx-ide-team-dev-commit.cjs.entry.js +13 -13
  9. package/dist/cjs/loader.cjs.js +1 -1
  10. package/dist/collection/collection-manifest.json +4 -0
  11. package/dist/collection/components/team-dev-commit/gx-ide-assets/team-dev-commit/langs/team-dev-commit.lang.en.json +1 -1
  12. package/dist/collection/components/team-dev-commit/team-dev-commit.js +34 -15
  13. package/dist/components/action-group-item.js +54 -0
  14. package/dist/components/action-group.js +214 -0
  15. package/dist/components/ch-action-group-item.js +6 -0
  16. package/dist/components/ch-action-group.js +6 -0
  17. package/dist/components/ch-dropdown-item-separator.js +1 -28
  18. package/dist/components/ch-dropdown-item.js +1 -53
  19. package/dist/components/ch-dropdown.js +1 -284
  20. package/dist/components/ch-test-action-group.js +137 -0
  21. package/dist/components/ch-test-dropdown.js +104 -0
  22. package/dist/components/ch-window2.js +25 -6
  23. package/dist/components/dropdown-item-separator.js +30 -0
  24. package/dist/components/dropdown-item.js +109 -0
  25. package/dist/components/dropdown.js +294 -0
  26. package/dist/components/gx-ide-team-dev-commit.js +14 -13
  27. package/dist/components/index.js +4 -0
  28. package/dist/esm/ch-action-group_2.entry.js +206 -0
  29. package/dist/esm/ch-dropdown-item.entry.js +36 -5
  30. package/dist/esm/ch-dropdown.entry.js +50 -52
  31. package/dist/esm/ch-test-action-group.entry.js +75 -0
  32. package/dist/esm/ch-test-dropdown.entry.js +50 -0
  33. package/dist/esm/ch-window_2.entry.js +25 -6
  34. package/dist/esm/genexus-ide-ui.js +1 -1
  35. package/dist/esm/gx-ide-team-dev-commit.entry.js +13 -13
  36. package/dist/esm/loader.js +1 -1
  37. package/dist/genexus-ide-ui/genexus-ide-ui.esm.js +1 -1
  38. package/dist/genexus-ide-ui/gx-ide-assets/team-dev-commit/langs/team-dev-commit.lang.en.json +1 -1
  39. package/dist/genexus-ide-ui/p-097a3eeb.entry.js +1 -0
  40. package/dist/genexus-ide-ui/p-4bbe1c18.entry.js +1 -0
  41. package/dist/genexus-ide-ui/p-5c64c57f.entry.js +1 -0
  42. package/dist/genexus-ide-ui/p-5ff04ebe.entry.js +1 -0
  43. package/dist/genexus-ide-ui/p-9c82381c.entry.js +1 -0
  44. package/dist/genexus-ide-ui/p-dbebb1a0.entry.js +1 -0
  45. package/dist/genexus-ide-ui/p-f8561da6.entry.js +1 -0
  46. package/dist/node_modules/@genexus/chameleon-controls-library/dist/collection/components/action-group/action-group.css +48 -0
  47. package/dist/node_modules/@genexus/chameleon-controls-library/dist/collection/components/action-group-item/action-group-item.css +4 -0
  48. package/dist/node_modules/@genexus/chameleon-controls-library/dist/collection/components/dropdown/dropdown.css +32 -88
  49. package/dist/node_modules/@genexus/chameleon-controls-library/dist/collection/components/dropdown-item/dropdown-item.css +9 -22
  50. package/dist/node_modules/@genexus/chameleon-controls-library/dist/collection/components/test/test-action-group/test-action-group.css +52 -0
  51. package/dist/node_modules/@genexus/chameleon-controls-library/dist/collection/components/test/test-dropdown/test-dropdown.css +36 -0
  52. package/dist/node_modules/@genexus/chameleon-controls-library/dist/collection/components/window/ch-window.css +3 -1
  53. package/dist/types/common/types.d.ts +1 -0
  54. package/dist/types/components/team-dev-commit/team-dev-commit.d.ts +13 -6
  55. package/dist/types/components/team-dev-update/team-dev-update.d.ts +1 -1
  56. package/dist/types/components.d.ts +9 -1
  57. package/package.json +3 -3
  58. package/dist/genexus-ide-ui/p-04f094d1.entry.js +0 -1
  59. package/dist/genexus-ide-ui/p-192f1342.entry.js +0 -1
  60. package/dist/genexus-ide-ui/p-66072dce.entry.js +0 -1
  61. package/dist/genexus-ide-ui/p-c10d5f34.entry.js +0 -1
@@ -0,0 +1 @@
1
+ import{r as t,c as i,h as s,H as e,g as n}from"./p-976c3a09.js";import{C as h}from"./p-87e8eb72.js";const o=class{constructor(s){t(this,s),this.windowOpened=i(this,"windowOpened",7),this.windowClosed=i(this,"windowClosed",7),this.isContainerCssOverride=!1,this.relativeWindow=!1,this.validCssAligns=["outside-start","inside-start","center","inside-end","outside-end"],this.draggedX=0,this.draggedY=0,this.xAlign="center",this.yAlign="center",this.hidden=!0,this.modal=!0,this.caption="",this.allowDrag="no",this.showFooter=!0,this.showHeader=!0,this.mousemoveHandler=t=>{const i=this.draggedY+t.clientY-this.dragStartY;this.window.style.setProperty("--ch-window-x-drag",this.draggedX+t.clientX-this.dragStartX+"px"),this.window.style.setProperty("--ch-window-y-drag",`${i}px`)},this.mouseupHandler=()=>{document.removeEventListener("mousemove",this.mousemoveHandler),this.draggedX=parseInt(this.window.style.getPropertyValue("--ch-window-x-drag")),this.draggedY=parseInt(this.window.style.getPropertyValue("--ch-window-y-drag"))},this.maskClickHandler=t=>{t.stopPropagation()},this.updatePosition=()=>{if(!this.isContainerCssOverride&&this.container&&this.mask){const t=this.container.getBoundingClientRect();if(this.mask.style.width=`${t.width}px`,this.mask.style.height=`${t.height}px`,this.relativeWindow)return;this.mask.style.setProperty("--ch-window-inset-inline-start",`${t.left}px`),this.mask.style.setProperty("--ch-window-inset-block-start",`${t.top}px`)}else if(this.isContainerCssOverride||!this.container){if(this.mask.style.removeProperty("width"),this.mask.style.removeProperty("height"),this.relativeWindow)return;this.mask.style.removeProperty("--ch-window-inset-inline-start"),this.mask.style.removeProperty("--ch-window-inset-block-start")}},this.windowResizeHandler=()=>{this.updatePosition(),this.watchCSSAlign()},this.windowScrollHandler=()=>{this.updatePosition()},this.closeOnOutsideClickHandler=t=>{t.composedPath().includes(this.window)||(this.hidden=!0)},this.closeOnEscapeHandler=t=>{"Escape"===t.key&&(this.hidden=!0)}}containerHandler(t,i){this.checkRelativePosition(),this.containerResizeObserverHandler(t,i),this.updatePosition()}hiddenHandler(){this.hidden?(this.resetDrag(),this.removeListeners(),this.windowClosed.emit()):(this.checkRelativePosition(),this.updatePosition(),this.watchCSSAlign(),this.addListeners(),this.windowOpened.emit())}componentWillLoad(){this.containerResizeObserver=new ResizeObserver(this.updatePosition),this.containerResizeObserverHandler(this.container),this.watchCSSAlign(),this.loadGlobalStyleSheet()}mousedownHandler(t){this.isDraggable(t.composedPath())&&(this.dragStartX=t.clientX,this.dragStartY=t.clientY,document.addEventListener("mousemove",this.mousemoveHandler,{passive:!0}),document.addEventListener("mouseup",this.mouseupHandler,{once:!0}))}windowCloseClickedHandler(){this.hidden=!0}checkRelativePosition(){const t=getComputedStyle(this.el);this.relativeWindow=!!t.getPropertyValue("--ch-window-relative-position")}resetDrag(){this.dragStartX=void 0,this.dragStartY=void 0,this.draggedX=0,this.draggedY=0,this.window.style.removeProperty("--ch-window-x-drag"),this.window.style.removeProperty("--ch-window-y-drag")}isDraggable(t){return"no"!==this.allowDrag&&("header"===this.allowDrag&&t.includes(this.header)||"box"===this.allowDrag&&t.includes(this.window))}watchCSSAlign(){const t=getComputedStyle(this.el),i=t.getPropertyValue("--ch-window-container").trim(),s=t.getPropertyValue("--ch-window-align-x").trim(),e=t.getPropertyValue("--ch-window-align-y").trim();this.isContainerCssOverride=i.includes("window"),this.validCssAligns.includes(s)&&(this.xAlign=s),this.validCssAligns.includes(e)&&(this.yAlign=e)}containerResizeObserverHandler(t,i){t&&this.containerResizeObserver.observe(t),i&&this.containerResizeObserver.unobserve(i)}addListeners(){window.addEventListener("resize",this.windowResizeHandler,{passive:!0}),this.container&&document.addEventListener("scroll",this.windowScrollHandler,{capture:!0,passive:!0}),this.closeOnOutsideClick&&document.addEventListener("click",this.closeOnOutsideClickHandler,{capture:!0}),this.closeOnEscape&&document.addEventListener("keydown",this.closeOnEscapeHandler,{capture:!0})}removeListeners(){window.removeEventListener("resize",this.windowResizeHandler),document.removeEventListener("scroll",this.windowScrollHandler,{capture:!0}),document.removeEventListener("click",this.closeOnOutsideClickHandler,{capture:!0}),document.removeEventListener("keydown",this.closeOnEscapeHandler,{capture:!0})}loadGlobalStyleSheet(){this.el.shadowRoot.adoptedStyleSheets.push(h)}render(){return s(e,null,s("div",{class:"mask",part:"mask",style:this.relativeWindow&&{"--ch-window-inset-inline-start":"0px","--ch-window-inset-block-start":"0px"},ref:t=>this.mask=t,onClick:this.maskClickHandler},s("section",{class:"window",part:"window",ref:t=>this.window=t},this.showHeader&&s("header",{part:"header",ref:t=>this.header=t},s("slot",{name:"header"},s("span",{part:"caption"},this.caption),s("ch-window-close",{part:"close",title:this.closeTooltip},this.closeText))),s("div",{part:"main"},s("slot",null)),this.showFooter&&s("footer",{part:"footer"},s("slot",{name:"footer"})))))}get el(){return n(this)}static get watchers(){return{container:["containerHandler"],hidden:["hiddenHandler"]}}};o.style=':host{--ch-window-offset-x:0px;--ch-window-offset-y:0px;--ch-window-x-outside:0px;--ch-window-y-outside:0px}:host(:not([hidden])){display:contents}:host(:is(:not([modal]),[modal="false"])) .mask{pointer-events:none}.window{pointer-events:all}.mask{display:flex;position:fixed;inset:0;inset-inline-start:calc( var(--ch-window-inset-inline-start) + var(--ch-window-offset-x) );inset-block-start:calc( var(--ch-window-inset-block-start) + var(--ch-window-offset-y) );z-index:var(--ch-window-mask-z-index, 1000)}:host(:is([x-align="outside-start"],[x-align="inside-start"])) .mask{justify-content:flex-start}:host([x-align=center]) .mask{justify-content:center}:host(:is([x-align="outside-end"],[x-align="inside-end"])) .mask{justify-content:flex-end}:host(:is([y-align="outside-start"],[y-align="inside-start"])) .mask{align-items:flex-start}:host([y-align=center]) .mask{align-items:center}:host(:is([y-align="outside-end"],[y-align="inside-end"])) .mask{align-items:flex-end}.window{display:flex;flex-direction:column;transform:translate(var(--ch-window-x-outside), var(--ch-window-y-outside)) translate(var(--ch-window-x-drag, 0px), var(--ch-window-y-drag, 0px))}:host([x-align=outside-start]) .window{--ch-window-x-outside:-100%}:host([x-align=outside-end]) .window{--ch-window-x-outside:100%}:host([y-align=outside-start]) .window{--ch-window-y-outside:-100%}:host([y-align=outside-end]) .window{--ch-window-y-outside:100%}';const d=class{constructor(s){t(this,s),this.windowCloseClicked=i(this,"windowCloseClicked",7)}pressedHandler(t){t.key&&"Enter"!==t.key&&" "!==t.key||(this.windowCloseClicked.emit(),t.stopPropagation())}render(){return s(e,{role:"button",tabindex:"0",disabled:this.disabled})}};d.style="";export{o as ch_window,d as ch_window_close}
@@ -0,0 +1 @@
1
+ import{r as t,h as i,H as o}from"./p-976c3a09.js";const s=class{constructor(o){t(this,o),this.displayedItemsCount=-1,this.buttonLabel="Show options",this.expandBehavior="ClickOrHover",this.itemsOverflowBehavior="ResponsiveCollapse",this.openOnFocus=!1,this.moreActionsDropdownPosition="InsideStart_OutsideEnd",this.separation=0,this.renderItem=t=>i("ch-dropdown-item",{slot:"items",id:t.id,class:t.class,expandBehavior:this.expandBehavior,href:t.target,leftImgSrc:t.leftIcon,openOnFocus:this.openOnFocus,position:t.position||"OutsideEnd_InsideStart",rightImgSrc:t.rightIcon},t.title,null!=t.items&&t.items.map(this.renderItem)),this.firstLevelRenderItem=(t,o)=>i("ch-dropdown-item",{id:t.id,class:t.class,expandBehavior:this.expandBehavior,forceContainingBlock:!1,href:t.target,leftImgSrc:t.leftIcon,openOnFocus:this.openOnFocus,position:t.position||"Center_OutsideEnd",rightImgSrc:t.rightIcon},t.title,"ResponsiveCollapse"===this.itemsOverflowBehavior&&(-1===this.displayedItemsCount||o<this.displayedItemsCount)&&null!=t.items&&t.items.map(this.renderItem)),this.firstLevelRenderCollapsedItem=t=>i("ch-dropdown-item",{id:t.id,class:t.class,expandBehavior:this.expandBehavior,href:t.target,leftImgSrc:t.leftIcon,openOnFocus:this.openOnFocus,position:t.responsiveCollapsePosition||"OutsideEnd_InsideStart",rightImgSrc:t.rightIcon},t.title,null!=t.items&&t.items.map(this.renderItem)),this.handleDisplayedItemsCountChange=t=>{this.displayedItemsCount=t.detail}}render(){return i(o,null,i("ch-action-group",{buttonLabel:this.buttonLabel,class:"action-group",expandBehavior:this.expandBehavior,itemsOverflowBehavior:this.itemsOverflowBehavior,openOnFocus:this.openOnFocus,moreActionsDropdownPosition:this.moreActionsDropdownPosition,onDisplayedItemsCountChange:this.handleDisplayedItemsCountChange},null!=this.itemsModel&&this.itemsModel.map(((t,o)=>i("ch-action-group-item",{slot:"items"},this.firstLevelRenderItem(t,o)))),"ResponsiveCollapse"===this.itemsOverflowBehavior&&null!=this.itemsModel&&this.itemsModel.filter(((t,i)=>-1!==this.displayedItemsCount&&i>=this.displayedItemsCount)).map((t=>i("ch-action-group-item",{slot:"more-items",avoidFloating:!0},this.firstLevelRenderCollapsedItem(t))))))}};s.style="ch-test-action-group{display:flex;border:2px dashed #00000080;resize:both;overflow:auto;width:500px}.action-group{padding:20px;margin:20px;background-color:#ffffff;border:1px solid}.action-group::part(actions){gap:12px}.action-group::part(more-actions-button){border-radius:50%;width:fit-content;height:fit-content;color:#313aa1;align-self:center;margin-inline-end:8px}.dropdown-item::part(action){--separation:8px;background-color:#f3d0c3;border-radius:4px;padding-inline:16px;padding-block:8px}.dropdown-item::part(action):focus-within{outline:1px solid}.dropdown-item::part(action):hover{background-color:#d3b1a4}.action-group::part(more-actions-list),.dropdown-item::part(list){row-gap:8px;margin-block:8px}.action-group::part(more-actions-section),.dropdown-item::part(section){background-color:#edeaff;padding:8px;box-shadow:0 4px 8px 1px #22222220}";export{s as ch_test_action_group}
@@ -0,0 +1 @@
1
+ import{r as o,h as t,H as i}from"./p-976c3a09.js";const n=class{constructor(i){o(this,i),this.buttonLabel="Show options",this.expandBehavior="ClickOrHover",this.openOnFocus=!1,this.position="Center_OutsideEnd",this.separation=0,this.renderItem=o=>[t("ch-dropdown-item",{slot:"items",id:o.id,class:o.class,expandBehavior:this.expandBehavior,href:o.target,leftImgSrc:o.leftIcon,openOnFocus:this.openOnFocus,position:"OutsideEnd_InsideStart",rightImgSrc:o.rightIcon},o.title,null!=o.items&&o.items.map(this.renderItem)),o.showSeparator&&t("ch-dropdown-item-separator",{class:o.separatorClass})]}render(){return t(i,null,t("ch-dropdown",{buttonLabel:this.buttonLabel,class:"dropdown",expandBehavior:this.expandBehavior,openOnFocus:this.openOnFocus,position:this.position,style:{"--separation":`${this.separation}px`}},t("span",{slot:"action"},"User info"),t("div",{slot:"header"},t("h1",null,"John Doe"),t("span",null,"johndoe@example.com")),null!=this.itemsModel&&this.itemsModel.map(this.renderItem),t("div",{slot:"footer"},"Footer")))}};n.style=".dropdown::part(expandable-button){background-color:aliceblue;border:1px solid;border-radius:4px;padding-block:4px;padding-inline:16px}.dropdown::part(expandable-button):focus{box-shadow:0 0 0 1px black}.dropdown-item::part(action){--separation:8px;background-color:#f3d0c3;border-radius:4px;padding-inline:16px;padding-block:8px}.dropdown-item::part(action):focus-within{outline:1px solid}.dropdown-item::part(action):hover{background-color:#d3b1a4}.dropdown::part(section),.dropdown-item::part(section){background-color:#edeaff;padding:8px;box-shadow:0 4px 8px 1px #22222220}.dropdown::part(list),.dropdown-item::part(list){row-gap:8px;margin-block:8px}";export{n as ch_test_dropdown}
@@ -0,0 +1 @@
1
+ import{r as i,c as t,h as e,H as o,g as a}from"./p-976c3a09.js";import{L as l}from"./p-26957490.js";import{f as s,r}from"./p-72303355.js";const n=class{constructor(o){i(this,o),this.componentDidLoadEvent=t(this,"componentDidLoadEvent",7),this.loadDataCalledFirstTime=!1,this.markAllPendingCommitsRows=()=>{this.chGridPendingCommitsEl.markAllRows()},this.togglePendingCommitsCheckboxes=async i=>{if(this.chGridPendingCommitsEl){const t=i.itemsToCheck,e=i.itemsToUncheck;for(const i of t)await this.chGridPendingCommitsEl.markRow(i,!0);for(const i of e)await this.chGridPendingCommitsEl.markRow(i,!1)}},this.revertPendingCommitsCheckboxes=async(i,t)=>{if(this.chGridPendingCommitsEl){for(const t of i)await this.chGridPendingCommitsEl.markRow(t,!1);for(const i of t)await this.chGridPendingCommitsEl.markRow(i,!0)}},this.renderIconState=i=>{let t,o;switch(i){case"inserted":t="gx-server/new",o="success";break;case"modified":t="gx-server/changes-commit-pending",o="primary-active";break;case"deleted":t="gx-server/delete",o="error";break;case"conflicted":t="gx-server/conflict",o="warning"}return e("gxg-icon",{type:t,color:o})},this.pendingCommitsRowMarkingChangedHandler=async i=>{if(this.chGridPendingCommitsEl.removeEventListener("rowMarkingChanged",this.pendingCommitsRowMarkingChangedHandler),this.chGridPendingCommitsEl){const t=i.detail.addedRowsId,e=i.detail.removedRowsId,o=await this.pendingItemCheckedCallback({itemsChecked:t,itemsUnchecked:e});void 0===o?await this.revertPendingCommitsCheckboxes(t,e):await this.togglePendingCommitsCheckboxes(o),this.chGridPendingCommitsEl.addEventListener("rowMarkingChanged",this.pendingCommitsRowMarkingChangedHandler)}},this.gridOnContextMenuCallbackHandler=i=>async t=>{t.preventDefault(),t.stopPropagation(),this.gridContextMenuCallback&&await this.gridContextMenuCallback(i,t.detail)},this.gridOnSelectionChangedCallbackHandler=i=>async t=>{this.selectCallback&&await this.selectCallback(i,t.detail.rowsId)},this.renderPendingCommitsGrid=()=>e("gxg-grid",null,e("ch-grid",{rowSelectionMode:"multiple",ref:i=>this.chGridPendingCommitsEl=i,part:"ch-grid-pending-commits",class:"no-border",onRowContextMenu:this.gridOnContextMenuCallbackHandler("commit"),onSelectionChanged:this.gridOnSelectionChangedCallbackHandler("commit")},e("ch-grid-columnset",null,e("ch-grid-column",{columnType:"rich",richRowSelector:!0,richRowSelectorMode:"mark",settingable:!1,sortable:!1,size:"auto"}),e("ch-grid-column",{columnName:"State",settingable:!1,sortable:!1,size:"auto"}),e("ch-grid-column",{settingable:!1,sortable:!1,size:"auto"}),e("ch-grid-column",{sortable:!0,columnName:"Name",settingable:!1,size:"auto"}),e("ch-grid-column",{sortable:!0,columnName:"Type",settingable:!1,size:"auto"}),e("ch-grid-column",{columnName:"Description",settingable:!1,size:"auto"}),e("ch-grid-column",{sortable:!0,columnName:"Modified On",settingable:!1}),e("ch-grid-column",{columnName:"Module",settingable:!1,size:"auto"}),e("ch-grid-column",{columnName:"Local State",settingable:!1,size:"auto"}),e("ch-grid-column",{columnName:"Last Synchronized",settingable:!1,size:"150px"}),e("ch-grid-column",{sortable:!0,columnName:"User",settingable:!1,size:"auto"})),this.pendingCommits.map((i=>e("ch-grid-row",{rowid:i.id},e("ch-grid-cell",{"cell-type":"rich","row-selector":!0}),e("ch-grid-cell",null," ",this.renderIconState(i.state)," "),e("ch-grid-cell",null,e("gxg-icon",{color:"auto",type:i.iconType})),e("ch-grid-cell",null," ",i.name," "),e("ch-grid-cell",null," ",i.type," "),e("ch-grid-cell",null," ",i.description," "),e("ch-grid-cell",null,`${s(i.modifiedOn)}`),e("ch-grid-cell",null," ",i.module," "),e("ch-grid-cell",null," ",i.localState," "),e("ch-grid-cell",null,`${s(i.lastSynchronized)}`),e("ch-grid-cell",null," ",i.user," ")))))),this.renderIgnoredObjectsGrid=()=>e("gxg-grid",null,e("ch-grid",{rowSelectionMode:"multiple",part:"ch-grid-pending-commits",onRowContextMenu:this.gridOnContextMenuCallbackHandler("ignored"),onSelectionChanged:this.gridOnSelectionChangedCallbackHandler("ignored")},e("ch-grid-columnset",null,e("ch-grid-column",{columnName:"",settingable:!1}),e("ch-grid-column",{columnName:"TypeIcon",settingable:!1}),e("ch-grid-column",{columnName:"Name",settingable:!1,sortable:!0}),e("ch-grid-column",{columnName:"Type",settingable:!1}),e("ch-grid-column",{columnName:"Description",settingable:!1}),e("ch-grid-column",{columnName:"Modified On",settingable:!1}),e("ch-grid-column",{columnName:"Module",settingable:!1}),e("ch-grid-column",{columnName:"Local State",settingable:!1}),e("ch-grid-column",{columnName:"Last Synchronized",settingable:!1}),e("ch-grid-column",{columnName:"User",settingable:!1})),this.ignoredObjects.map((i=>e("ch-grid-row",{"row-id":i.id,selected:!0},e("ch-grid-cell",null," ",this.renderIconState(i.state)," "),e("ch-grid-cell",null,e("gxg-icon",{color:"auto",type:i.iconType})),e("ch-grid-cell",null," ",i.name," "),e("ch-grid-cell",null," ",i.type," "),e("ch-grid-cell",null," ",i.description," "),e("ch-grid-cell",null,`${s(i.modifiedOn)}`),e("ch-grid-cell",null," ",i.module," "),e("ch-grid-cell",null," ",i.localState," "),e("ch-grid-cell",null,`${s(i.lastSynchronized)}`),e("ch-grid-cell",null," ",i.user," ")))))),this.getRecentCommentHandler=async()=>{if(this.getRecentCommentCallback){const i=await this.getRecentCommentCallback();i&&(this.comment=i)}},this.commitCallbackHandler=async()=>{const i=this.commitComment.value;this.chGridPendingCommitsEl.getMarkedRows().then((async t=>{await this.commitCallback(t,i)}))},this.loadData=async()=>{const i={pattern:this.patternEl.value,changeSet:this.changeSetEl.value,folder:this.foldersEl.value,category:this.categoriesEl.value,type:this.typesEl.value};return await this.loadCallback(i).then((async({pending:i,ignored:t})=>{this.pendingCommits=i,this.ignoredObjects=t,this.loadDataCalledFirstTime||(this.loadDataCalledFirstTime=!0)}))},this.toggleFiltersHandler=()=>{this.filtersHidden=!this.filtersHidden},this.filtersHidden=!0,this.comment="",this.pendingCommits=[],this.ignoredObjects=[],this.changeSet=void 0,this.types=void 0,this.folders=void 0,this.categories=void 0,this.getRecentCommentCallback=void 0,this.loadCallback=void 0,this.commitCallback=void 0,this.selectCallback=void 0,this.pendingItemCheckedCallback=void 0,this.gridContextMenuCallback=void 0}async componentWillLoad(){this._componentLocale=await l.getComponentStrings(this.el)}async componentDidLoad(){await this.loadData(),this.componentDidLoadEvent.emit(!0)}async componentDidRender(){this.loadDataCalledFirstTime&&(await this.markAllPendingCommitsRows(),this.chGridPendingCommitsEl.addEventListener("rowMarkingChanged",this.pendingCommitsRowMarkingChangedHandler),this.loadDataCalledFirstTime=!1)}async reload(){this.loadData()}render(){return e(o,{class:"gx-ide-component"},e("div",{class:"gx-ide-main-wrapper gx-ide-overflow"},e("gxg-container",null,e("header",{class:"header grid"},e("gxg-form-textarea",{id:"gxg-textarea",height:"100px",label:this._componentLocale.topMenu.commentLabel,value:this.comment,ref:i=>this.commitComment=i,placeholder:this._componentLocale.topMenu.commentPlaceholder}),e("gxg-button",{type:"outlined",part:"location",onClick:this.getRecentCommentHandler},this._componentLocale.topMenu.recentCommentsButton))),e("main",{class:"main"},e("gxg-container",{fieldset:!0,noContentPadding:!!this.filtersHidden},e("div",{class:"grid second-grid"},e("div",{class:"actions-row grid"},e("gxg-form-text",{class:this.filtersHidden?"hidden":null,"disable-filter":!0,label:this._componentLocale.filtersMenu.patternLabel,labelPosition:"start",value:"",ref:i=>this.patternEl=i,"display-validation-styles":!0,"display-validation-message":!0,part:"pattern",onInput:this.loadData}),e("div",{class:"action-buttons",slot:"tab-bar"},e("gxg-button",{onClick:this.toggleFiltersHandler,type:"secondary-icon-only",icon:"patterns/filters",part:"gxg-button gxg-button--show-filter"}),e("gxg-button",{type:"secondary-icon-only",icon:"gemini-tools/reset",onClick:this.loadData,part:"gxg-button gxg-button--reload"}))),e("div",{class:"filters-grid grid "+(this.filtersHidden?"hidden":null)},e("div",{class:"first-row grid"},e("gxg-combo-box",{labelPosition:"start","disable-filter":!0,label:this._componentLocale.filtersMenu.changesetLabel,value:this.changeSet[0].id,ref:i=>this.changeSetEl=i,part:"change-set","display-validation-styles":!0,"display-validation-message":!0,onValueChanged:this.loadData},r(this.changeSet)),e("gxg-combo-box",{labelPosition:"start","disable-filter":!0,label:this._componentLocale.filtersMenu.typeLabel,value:this.types[0].id,ref:i=>this.typesEl=i,part:"type",onValueChanged:this.loadData},r(this.types))),e("div",{class:"second-row grid"},e("gxg-combo-box",{labelPosition:"start","disable-filter":!0,label:this._componentLocale.filtersMenu.folderLabel,value:this.folders[0].id,ref:i=>this.foldersEl=i,part:"folder","display-validation-styles":!0,"display-validation-message":!0,onValueChanged:this.loadData},r(this.folders)),e("gxg-combo-box",{labelPosition:"start","disable-filter":!0,label:this._componentLocale.filtersMenu.categoryLabel,value:this.categories[0].id,ref:i=>this.categoriesEl=i,part:"categories",onValueChanged:this.loadData},r(this.categories)))))),e("gxg-container",null,e("gxg-tabs",{height:"100%",position:"top",class:"gxg-tabs"},e("gxg-tab-bar",{slot:"tab-bar-container"},e("gxg-tab-button",{slot:"tab-bar","tab-label":`${this._componentLocale.tabs.pendingCommits} (${this.pendingCommits.length})`,tab:"pending-commits","is-selected":!0}),e("gxg-tab-button",{slot:"tab-bar","tab-label":`${this._componentLocale.tabs.ignoredObjects} (${this.ignoredObjects.length})`,tab:"ignored-objects"})),e("gxg-tab",{tab:"pending-commits","no-padding":!0},this.renderPendingCommitsGrid()),e("gxg-tab",{tab:"ignored-objects","no-padding":!0},this.renderIgnoredObjectsGrid())),e("gxg-button",{slot:"footer",type:"primary-text-only",onClick:this.commitCallbackHandler,part:"commit-button"},this._componentLocale.footer.commitButton)))))}static get assetsDirs(){return["gx-ide-assets/team-dev-commit"]}get el(){return a(this)}};n.style=".gxi-hidden{display:none !important}.gxi-full-height{height:100%}.align-start{display:flex;align-items:start}.align-center{display:flex;align-items:center}.align-end{display:flex;align-items:end}.grid{display:grid;grid-row-gap:var(--gx-ide-grid-row-gap);grid-column-gap:var(--gx-ide-grid-column-gap);grid-template-rows:auto}:host(.gx-ide-component){box-shadow:var(--box-shadow-01) !important;height:100% !important;display:flex !important;flex-direction:column !important}:host(:focus-within) gx-ide-top-bar::part(wrapper){background-color:var(--color-secondary-enabled)}.gx-ide-main-wrapper{color:var(--gx-ide-component-text-color);font-weight:var(--font-weight-regular);font-size:var(--font-size-lg);line-height:1.6em;height:100%;background-color:var(--gx-ide-component-background-color);display:flex;flex-direction:column;flex-grow:1}.gx-ide-main{flex-grow:1;overflow-y:auto;}.gx-ide-main::-webkit-scrollbar{width:6px;height:6px}.gx-ide-main::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gx-ide-main::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gx-ide-main::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}.gx-ide-main .gxg-scroll{display:block;overflow-y:auto;padding-inline-end:2px}.gx-ide-overflow{overflow-y:auto;}.gx-ide-overflow::-webkit-scrollbar{width:6px;height:6px}.gx-ide-overflow::-webkit-scrollbar-track{background-color:var(--gray-02);border-radius:10px}.gx-ide-overflow::-webkit-scrollbar-thumb{background:var(--gray-05);border-radius:10px}.gx-ide-overflow::-webkit-scrollbar-thumb:hover{background:var(--gray-04);cursor:pointer}.gx-ide-overflow .gxg-scroll{display:block;overflow-y:auto;padding-inline-end:2px}:host{display:block}.main-wrapper{width:100%}.gxg-tabs{margin-top:0;box-shadow:none}.header{grid-template-columns:4fr auto}.second-grid{grid-template-rows:1fr auto}.second-grid .actions-row{grid-template-columns:1fr auto}.action-buttons{justify-self:flex-end}.hidden{display:none}.filters-grid{grid-template-rows:repeat(2, 1fr)}.filters-grid .first-row{grid-template-columns:repeat(2, 1fr)}.filters-grid .second-row{grid-template-columns:repeat(2, 1fr)}";export{n as gx_ide_team_dev_commit}
@@ -0,0 +1 @@
1
+ import{r as t,c as i,h as s,H as e,g as o}from"./p-976c3a09.js";const a={OutsideStart:"outside-start",InsideStart:"inside-start",Center:"center",InsideEnd:"inside-end",OutsideEnd:"outside-end"},n="ch-dropdown-item",r=`:scope > ${n}`,h=class{constructor(s){t(this,s),this.expandedChange=i(this,"expandedChange",7),this.keyEventsDictionary={ArrowDown:t=>{if(t.preventDefault(),!this.currentFocusedItem)return void this.focusFirstDropDownItem();const i=this.findNextDropDownItemSibling();i&&i.handleFocusElement()},ArrowUp:t=>{if(t.preventDefault(),!this.currentFocusedItem)return void this.focusFirstDropDownItem();const i=this.findPreviousDropDownItemSibling();i&&i.handleFocusElement()},Escape:()=>{this.closeDropdown(),this.returnFocusToButton()}},this.showHeader=!1,this.showFooter=!1,this.expanded=!1,this.expandedWithHover=!1,this.buttonLabel="Show options",this.expandBehavior="ClickOrHover",this.nestedDropdown=!1,this.openOnFocus=!1,this.position="Center_OutsideEnd",this.closeDropdown=()=>{this.closeDropdownWithHover(),this.expanded=!1,this.expandedChange.emit(!1)},this.closeDropdownWithHover=()=>{this.expandedWithHover=!1,this.expanded||this.expandedChange.emit(!1)},this.closeDropdownWhenClickingOutside=t=>{void 0===t.composedPath().find((t=>t===this.el))&&this.closeDropdown()},this.handleKeyDownEvents=t=>{const i=this.keyEventsDictionary[t.code];i&&i(t)},this.handleKeyUpEvents=t=>{"Tab"===t.code&&(t.composedPath().includes(this.el)||this.closeDropdown())},this.handleMouseLeave=()=>{document.activeElement.closest("ch-dropdown")===this.el&&(this.expanded=!0),this.closeDropdownWithHover()},this.handleMouseEnter=()=>{this.expandedWithHover||(this.expandedWithHover=!0,this.expanded||this.expandedChange.emit(!0))},this.handleButtonClick=t=>{t.stopPropagation(),this.expandedChange.emit(!this.expanded),this.expanded=!this.expanded},this.handleButtonFocus=t=>{t.stopPropagation(),this.expanded||(this.expanded=!0,this.expandedWithHover||this.expandedChange.emit(!0))}}handleExpandedChange(t){t?(this.currentFocusedItem=void 0,document.body.addEventListener("click",this.closeDropdownWhenClickingOutside,{capture:!0}),this.nestedDropdown||document.body.addEventListener("keydown",this.handleKeyDownEvents,{capture:!0}),document.body.addEventListener("keyup",this.handleKeyUpEvents,{capture:!0})):(document.body.removeEventListener("click",this.closeDropdownWhenClickingOutside,{capture:!0}),this.nestedDropdown||document.body.removeEventListener("keydown",this.handleKeyDownEvents,{capture:!0}),document.body.removeEventListener("keyup",this.handleKeyUpEvents,{capture:!0}))}handleActionClick(){this.closeDropdown()}handleDropDownItemFocusChange(t){this.currentFocusedItem=t.target}focusFirstDropDownItem(){this.currentFocusedItem=this.el.querySelector(r),this.currentFocusedItem&&this.currentFocusedItem.handleFocusElement()}findNextDropDownItemSibling(){let t=this.currentFocusedItem.nextElementSibling;for(;t&&t.tagName.toLowerCase()!==n;)t=t.nextElementSibling;return t}findPreviousDropDownItemSibling(){let t=this.currentFocusedItem.previousElementSibling;for(;t&&t.tagName.toLowerCase()!==n;)t=t.previousElementSibling;return t}returnFocusToButton(){this.openOnFocus||this.nestedDropdown||this.expandableButton.focus()}componentWillLoad(){this.showHeader=!!this.el.querySelector(':scope > [slot="header"]'),this.showFooter=!!this.el.querySelector(':scope > [slot="footer"]')}render(){const t=this.position.split("_"),i=t[1],o="OutsideStart"===i||"OutsideEnd"===i,n=a[t[0]],r=a[i],h=this.expanded||this.expandedWithHover;return s(e,{onMouseLeave:"ClickOrHover"===this.expandBehavior?this.handleMouseLeave:void 0},s("button",{id:"expandable-button","aria-controls":"section","aria-expanded":this.expanded.toString(),"aria-haspopup":"true","aria-label":this.buttonLabel,class:"expandable-button",part:"expandable-button",type:"button",onClick:this.handleButtonClick,onFocus:this.openOnFocus?this.handleButtonFocus:void 0,onMouseEnter:"ClickOrHover"===this.expandBehavior?this.handleMouseEnter:void 0,ref:t=>this.expandableButton=t},s("slot",{name:"action"})),"ClickOrHover"===this.expandBehavior&&s("div",{"aria-hidden":"true",class:{separation:!0,[`separation--y separation--y-${r}`]:o,[`separation--x separation--x-${n}`]:!o},part:"separation"}),s("ch-window",{part:"window",exportparts:"window:section,mask,header,footer",container:this.el,closeOnEscape:!0,hidden:!h,modal:!1,showFooter:this.showFooter,showHeader:this.showHeader,xAlign:n,yAlign:r},this.showHeader&&s("slot",{name:"header",slot:"header"}),s("div",{role:"list",class:"list",part:"list"},s("slot",{name:"items"})),this.showFooter&&s("slot",{name:"footer",slot:"footer"})))}get el(){return o(this)}static get watchers(){return{expanded:["handleExpandedChange"]}}};h.style=":where(button){all:unset}*,::before,::after{box-sizing:border-box}:host{--separation:0px;--separation-x:var(--separation);--separation-y:var(--separation);display:flex;position:relative;width:100%;height:100%}.expandable-button{display:flex;align-items:center;justify-content:center;position:relative;width:100%;height:100%;cursor:pointer;z-index:108}.expandable-button:focus-within{transition:box-shadow 250ms}::slotted([slot=action]){pointer-events:none}.separation{display:flex;position:absolute;z-index:107}.separation--y{width:100%;height:var(--separation-y)}.separation--y-outside-start{inset-block-start:calc(var(--separation-y) * -1)}.separation--y-outside-start+ch-window{--ch-window-offset-y:calc(var(--separation-y) * -1)}.separation--y-outside-end{inset-block-end:calc(var(--separation-y) * -1)}.separation--y-outside-end+ch-window{--ch-window-offset-y:var(--separation-y)}.separation--x{width:var(--separation-x);height:100%}.separation--x-outside-start{inset-inline-start:calc(var(--separation-x) * -1)}.separation--x-outside-start+ch-window{--ch-window-offset-x:calc(var(--separation-x) * -1)}.separation--x-outside-end{inset-inline-end:calc(var(--separation-x) * -1)}.separation--x-outside-end+ch-window{--ch-window-offset-x:var(--separation-x)}.list{display:flex;flex-direction:column}";export{h as ch_dropdown}
@@ -0,0 +1,48 @@
1
+ *,
2
+ ::after,
3
+ ::before {
4
+ box-sizing: border-box;
5
+ }
6
+
7
+ :host {
8
+ display: grid;
9
+ position: relative;
10
+ width: 100%;
11
+ grid-template: "more-actions actions" 1fr/min-content 1fr;
12
+ overflow: hidden;
13
+ }
14
+
15
+ .more-actions {
16
+ grid-area: more-actions;
17
+ }
18
+ .more-actions::part(expandable-button) {
19
+ width: 1.375em;
20
+ height: 1.375em;
21
+ }
22
+ .more-actions::part(expandable-button)::before {
23
+ content: "";
24
+ width: 100%;
25
+ height: 100%;
26
+ background-color: currentColor;
27
+ -webkit-mask: url('data:image/svg+xml,<svg viewBox="0 0 25 25" xmlns="http://www.w3.org/2000/svg"><path d="M5.26837 10.5625C4.16837 10.5625 3.26837 11.4625 3.26837 12.5625C3.26837 13.6625 4.16837 14.5625 5.26837 14.5625C6.36837 14.5625 7.26837 13.6625 7.26837 12.5625C7.26837 11.4625 6.36837 10.5625 5.26837 10.5625ZM19.2684 10.5625C18.1684 10.5625 17.2684 11.4625 17.2684 12.5625C17.2684 13.6625 18.1684 14.5625 19.2684 14.5625C20.3684 14.5625 21.2684 13.6625 21.2684 12.5625C21.2684 11.4625 20.3684 10.5625 19.2684 10.5625ZM12.2684 10.5625C11.1684 10.5625 10.2684 11.4625 10.2684 12.5625C10.2684 13.6625 11.1684 14.5625 12.2684 14.5625C13.3684 14.5625 14.2684 13.6625 14.2684 12.5625C14.2684 11.4625 13.3684 10.5625 12.2684 10.5625Z"/></svg>') 50% 50%/1.25em 1.25em no-repeat;
28
+ }
29
+
30
+ .actions {
31
+ grid-area: actions;
32
+ display: grid;
33
+ grid-auto-flow: column;
34
+ grid-auto-columns: max-content;
35
+ width: 100%;
36
+ max-width: 100%;
37
+ }
38
+ .actions--responsive {
39
+ position: absolute;
40
+ inset: 0;
41
+ }
42
+ .actions--scroll {
43
+ overflow-x: auto;
44
+ }
45
+ .actions--multiline {
46
+ display: flex;
47
+ flex-wrap: wrap;
48
+ }
@@ -0,0 +1,4 @@
1
+ ch-action-group-item[floating] {
2
+ position: absolute;
3
+ visibility: hidden;
4
+ }
@@ -8,22 +8,10 @@
8
8
  box-sizing: border-box;
9
9
  }
10
10
 
11
- @media (prefers-color-scheme: light) {
12
- .section {
13
- background-color: #fbfbfb;
14
- color: #000;
15
- }
16
- }
17
- @media (prefers-color-scheme: dark) {
18
- .section {
19
- background-color: #242426;
20
- color: #e9e9e9;
21
- }
22
- }
23
11
  :host {
24
- --ch-dropdown-rtl-initial-X: 1;
25
- --ch-dropdown-translateX: 0;
26
- --ch-dropdown-translateY: 0;
12
+ --separation: 0px;
13
+ --separation-x: var(--separation);
14
+ --separation-y: var(--separation);
27
15
  display: flex;
28
16
  position: relative;
29
17
  width: 100%;
@@ -32,6 +20,8 @@
32
20
 
33
21
  .expandable-button {
34
22
  display: flex;
23
+ align-items: center;
24
+ justify-content: center;
35
25
  position: relative;
36
26
  width: 100%;
37
27
  height: 100%;
@@ -39,98 +29,52 @@
39
29
  z-index: 108;
40
30
  }
41
31
  .expandable-button:focus-within {
42
- box-shadow: 0px 0px 0 1px currentColor;
43
32
  transition: box-shadow 250ms;
44
33
  }
45
34
 
46
- .dummy-separation {
35
+ ::slotted([slot=action]) {
36
+ pointer-events: none;
37
+ }
38
+
39
+ .separation {
47
40
  display: flex;
48
41
  position: absolute;
49
42
  z-index: 107;
50
43
  }
51
- .dummy-separation--vertical {
44
+ .separation--y {
52
45
  width: 100%;
53
- height: var(--separation-between-button-size);
46
+ height: var(--separation-y);
47
+ }
48
+ .separation--y-outside-start {
49
+ inset-block-start: calc(var(--separation-y) * -1);
54
50
  }
55
- .dummy-separation--top {
56
- inset-block-start: var(--separation-between-button);
51
+ .separation--y-outside-start + ch-window {
52
+ --ch-window-offset-y: calc(var(--separation-y) * -1);
57
53
  }
58
- .dummy-separation--bottom {
59
- inset-block-end: var(--separation-between-button);
54
+ .separation--y-outside-end {
55
+ inset-block-end: calc(var(--separation-y) * -1);
60
56
  }
61
- .dummy-separation--horizontal {
62
- width: var(--separation-between-button-size);
57
+ .separation--y-outside-end + ch-window {
58
+ --ch-window-offset-y: var(--separation-y);
59
+ }
60
+ .separation--x {
61
+ width: var(--separation-x);
63
62
  height: 100%;
64
63
  }
65
- .dummy-separation--left {
66
- inset-inline-start: var(--separation-between-button);
64
+ .separation--x-outside-start {
65
+ inset-inline-start: calc(var(--separation-x) * -1);
67
66
  }
68
- .dummy-separation--right {
69
- inset-inline-end: var(--separation-between-button);
67
+ .separation--x-outside-start + ch-window {
68
+ --ch-window-offset-x: calc(var(--separation-x) * -1);
70
69
  }
71
-
72
- .section {
73
- position: absolute;
74
- border-radius: 5px;
75
- box-shadow: 0 3px 4px #80808024, 0 3px 3px -2px #8080801f, 0 1px 8px #80808030;
76
- width: max-content;
77
- max-width: 350px;
78
- z-index: 107;
70
+ .separation--x-outside-end {
71
+ inset-inline-end: calc(var(--separation-x) * -1);
79
72
  }
80
-
81
- .header + .list,
82
- .list + .footer {
83
- margin-block-start: 8px;
73
+ .separation--x-outside-end + ch-window {
74
+ --ch-window-offset-x: var(--separation-x);
84
75
  }
85
76
 
86
77
  .list {
87
78
  display: flex;
88
79
  flex-direction: column;
89
- gap: 4px;
90
- }
91
-
92
- .position--top {
93
- inset-block-start: var(--separation-between-button);
94
- transform: translate(var(--ch-dropdown-translateX), -100%);
95
- }
96
-
97
- .position--right {
98
- inset-inline-end: var(--separation-between-button);
99
- transform: translate(calc(100% * var(--ch-dropdown-rtl-initial-X)), var(--ch-dropdown-translateY));
100
- }
101
-
102
- .position--bottom {
103
- inset-block-end: var(--separation-between-button);
104
- transform: translate(var(--ch-dropdown-translateX), 100%);
105
- }
106
-
107
- .position--left {
108
- inset-inline-start: var(--separation-between-button);
109
- transform: translate(calc(-100% * var(--ch-dropdown-rtl-initial-X)), var(--ch-dropdown-translateY));
110
- }
111
-
112
- .align--left {
113
- inset-inline-start: 0;
114
- }
115
-
116
- .align--center {
117
- inset-inline-start: 50%;
118
- --ch-dropdown-translateX: calc(-50% * var(--ch-dropdown-rtl-initial-X));
119
- }
120
-
121
- .align--right {
122
- inset-inline-end: 0;
123
- }
124
-
125
- .valign--top {
126
- inset-block-start: 0;
127
- }
128
-
129
- .valign--middle {
130
- inset-block-start: 50%;
131
- --ch-dropdown-translateY: calc(-50% * var(--ch-dropdown-rtl-initial-X));
132
- }
133
-
134
- .valign--bottom {
135
- inset-block-end: 0;
136
80
  }
@@ -8,41 +8,24 @@
8
8
  box-sizing: border-box;
9
9
  }
10
10
 
11
- @media (prefers-color-scheme: light) {
12
- .action:focus, .action:hover {
13
- background-color: #ccc;
14
- }
15
- .action:active {
16
- background-color: #e9e9e9;
17
- }
18
- }
19
- @media (prefers-color-scheme: dark) {
20
- .action:focus, .action:hover {
21
- background-color: #3e3e40;
22
- }
23
- .action:active {
24
- background-color: #575965;
25
- }
26
- }
27
11
  :host {
28
12
  display: flex;
29
13
  width: 100%;
30
14
  height: 100%;
31
15
  }
32
16
 
17
+ :host([force-containing-block]) {
18
+ transform: translateX(0);
19
+ --ch-window-relative-position: true;
20
+ }
21
+
33
22
  .action {
34
23
  display: flex;
35
24
  align-items: center;
36
- column-gap: 8px;
37
25
  width: 100%;
38
26
  height: 100%;
39
27
  cursor: pointer;
40
- padding-block: 8px;
41
- padding-inline: 16px;
42
- font-size: 0.875em;
43
28
  text-align: start;
44
- transition-property: background-color, border-color, box-shadow, color, filter, opacity;
45
- transition-duration: 250ms;
46
29
  }
47
30
 
48
31
  .left-img,
@@ -55,4 +38,8 @@
55
38
 
56
39
  .content {
57
40
  width: 100%;
41
+ }
42
+
43
+ .dummy-wrapper {
44
+ display: contents;
58
45
  }
@@ -0,0 +1,52 @@
1
+ ch-test-action-group {
2
+ display: flex;
3
+ border: 2px dashed #00000080;
4
+ resize: both;
5
+ overflow: auto;
6
+ width: 500px;
7
+ }
8
+
9
+ .action-group {
10
+ padding: 20px;
11
+ margin: 20px;
12
+ background-color: #ffffff;
13
+ border: 1px solid;
14
+ }
15
+ .action-group::part(actions) {
16
+ gap: 12px;
17
+ }
18
+ .action-group::part(more-actions-button) {
19
+ border-radius: 50%;
20
+ width: fit-content;
21
+ height: fit-content;
22
+ color: #313aa1;
23
+ align-self: center;
24
+ margin-inline-end: 8px;
25
+ }
26
+
27
+ .dropdown-item::part(action) {
28
+ --separation: 8px;
29
+ background-color: #f3d0c3;
30
+ border-radius: 4px;
31
+ padding-inline: 16px;
32
+ padding-block: 8px;
33
+ }
34
+ .dropdown-item::part(action):focus-within {
35
+ outline: 1px solid;
36
+ }
37
+ .dropdown-item::part(action):hover {
38
+ background-color: #d3b1a4;
39
+ }
40
+
41
+ .action-group::part(more-actions-list),
42
+ .dropdown-item::part(list) {
43
+ row-gap: 8px;
44
+ margin-block: 8px;
45
+ }
46
+
47
+ .action-group::part(more-actions-section),
48
+ .dropdown-item::part(section) {
49
+ background-color: #edeaff;
50
+ padding: 8px;
51
+ box-shadow: 0 4px 8px 1px #22222220;
52
+ }
@@ -0,0 +1,36 @@
1
+ .dropdown::part(expandable-button) {
2
+ background-color: aliceblue;
3
+ border: 1px solid;
4
+ border-radius: 4px;
5
+ padding-block: 4px;
6
+ padding-inline: 16px;
7
+ }
8
+ .dropdown::part(expandable-button):focus {
9
+ box-shadow: 0 0 0 1px black;
10
+ }
11
+
12
+ .dropdown-item::part(action) {
13
+ --separation: 8px;
14
+ background-color: #f3d0c3;
15
+ border-radius: 4px;
16
+ padding-inline: 16px;
17
+ padding-block: 8px;
18
+ }
19
+ .dropdown-item::part(action):focus-within {
20
+ outline: 1px solid;
21
+ }
22
+ .dropdown-item::part(action):hover {
23
+ background-color: #d3b1a4;
24
+ }
25
+
26
+ .dropdown::part(section),
27
+ .dropdown-item::part(section) {
28
+ background-color: #edeaff;
29
+ padding: 8px;
30
+ box-shadow: 0 4px 8px 1px #22222220;
31
+ }
32
+ .dropdown::part(list),
33
+ .dropdown-item::part(list) {
34
+ row-gap: 8px;
35
+ margin-block: 8px;
36
+ }
@@ -1,6 +1,8 @@
1
1
  :host {
2
2
  --ch-window-offset-x: 0px;
3
3
  --ch-window-offset-y: 0px;
4
+ --ch-window-x-outside: 0px;
5
+ --ch-window-y-outside: 0px;
4
6
  }
5
7
 
6
8
  :host(:not([hidden])) {
@@ -45,7 +47,7 @@
45
47
  .window {
46
48
  display: flex;
47
49
  flex-direction: column;
48
- transform: translate(var(--ch-window-x-outside, 0px), var(--ch-window-y-outside, 0px)) translate(var(--ch-window-x-drag, 0px), var(--ch-window-y-drag, 0px));
50
+ transform: translate(var(--ch-window-x-outside), var(--ch-window-y-outside)) translate(var(--ch-window-x-drag, 0px), var(--ch-window-y-drag, 0px));
49
51
  }
50
52
  :host([x-align=outside-start]) .window {
51
53
  --ch-window-x-outside: -100%;
@@ -23,3 +23,4 @@ export type FormSubmitResult = {
23
23
  success: boolean;
24
24
  fieldErrors: FormElementValidation[];
25
25
  };
26
+ export type ObjectState = "inserted" | "modified" | "deleted" | "conflicted";
@@ -1,5 +1,6 @@
1
1
  import { EventEmitter } from "../../stencil-public-runtime";
2
- import { GxOption } from "../../common/types";
2
+ import { ChGridRowContextMenuEvent } from "@genexus/chameleon-controls-library/dist/types/components/grid/ch-grid-types";
3
+ import { GxOption, ObjectState } from "../../common/types";
3
4
  export declare class GxIdeTeamDevCommit {
4
5
  /**
5
6
  * The component hard-coded strings translations.
@@ -13,7 +14,7 @@ export declare class GxIdeTeamDevCommit {
13
14
  private foldersEl;
14
15
  private categoriesEl;
15
16
  private chGridPendingCommitsEl;
16
- private chIgnoredObjectsEl;
17
+ private commitComment;
17
18
  filtersHidden: boolean;
18
19
  comment: string;
19
20
  pendingCommits: ModifiedObjectData[];
@@ -46,6 +47,10 @@ export declare class GxIdeTeamDevCommit {
46
47
  * Callback invoked when user starts the commit process
47
48
  */
48
49
  readonly commitCallback: CommitCallback;
50
+ /**
51
+ * Callback that should be invoked when the user selects rows from the grids
52
+ */
53
+ readonly selectCallback: SelectCallback;
49
54
  /**
50
55
  * Callback invoked when user check/uncheck any item from the 'Pending to Commit' grid
51
56
  */
@@ -70,7 +75,8 @@ export declare class GxIdeTeamDevCommit {
70
75
  private revertPendingCommitsCheckboxes;
71
76
  private renderIconState;
72
77
  private pendingCommitsRowMarkingChangedHandler;
73
- private gridContextMenuCallbackHandler;
78
+ private gridOnContextMenuCallbackHandler;
79
+ private gridOnSelectionChangedCallbackHandler;
74
80
  private renderPendingCommitsGrid;
75
81
  private renderIgnoredObjectsGrid;
76
82
  private getRecentCommentHandler;
@@ -86,9 +92,11 @@ export type ObjetType = {
86
92
  };
87
93
  export type GetRecentComment = () => Promise<string | undefined>;
88
94
  export type LoadCallback = (filters: FiltersData) => Promise<CommitData>;
89
- export type CommitCallback = (selection: string[]) => Promise<boolean>;
95
+ export type CommitCallback = (selection: string[], commitComment: string) => Promise<boolean>;
96
+ export type SelectCallback = (grid: gridType, selectionIds: string[]) => Promise<void>;
90
97
  export type PendingItemCheckedCallback = (checkedItemIds: string[]) => Promise<PendingItemCheckedResult | undefined>;
91
- export type GridContextMenuCallback = (markedRowsIds: string[], grid: "commit" | "ignored") => Promise<void>;
98
+ export type GridContextMenuCallback = (grid: gridType, eventInfo: ChGridRowContextMenuEvent) => Promise<void>;
99
+ export type gridType = "commit" | "ignored";
92
100
  export type CommitData = {
93
101
  pending: ModifiedObjectData[];
94
102
  ignored: ModifiedObjectData[];
@@ -121,4 +129,3 @@ export type PendingItemsCheckedState = {
121
129
  itemsChecked: string[];
122
130
  itemsUnchecked: string[];
123
131
  };
124
- export type ObjectState = "inserted" | "modified" | "deleted" | "conflicted";
@@ -1,4 +1,5 @@
1
1
  import { EventEmitter } from "../../stencil-public-runtime";
2
+ import { ObjectState } from "../../common/types";
2
3
  export declare class GxIdeTeamDevUpdate {
3
4
  /**
4
5
  * The component hard-coded strings translations.
@@ -146,7 +147,6 @@ export interface ModifiedObject {
146
147
  status?: string;
147
148
  action?: string;
148
149
  }
149
- export type ObjectState = "inserted" | "modified" | "deleted" | "conflicted";
150
150
  export interface UpdateResultData {
151
151
  id: string;
152
152
  result: ResultState;
@@ -15,7 +15,7 @@ import { GxOption } from "./common/types";
15
15
  import { CancelCallback, ChangedCallback, CreateCallback } from "./components/new-environment/new-environment";
16
16
  import { CancelCallback as CancelCallback1, CreateCallback as CreateCallback1, SelectLocationCallback } from "./components/new-kb/new-kb";
17
17
  import { LoadReferencesCallback, ObjectData, OpenObjectCallback, OpenSelectorDialogCallback, SelectorSourceCallback, SelectReferenceCallback } from "./components/references/references";
18
- import { CommitCallback, GetRecentComment, GridContextMenuCallback, LoadCallback, ObjetType, PendingItemCheckedResult, PendingItemsCheckedState } from "./components/team-dev-commit/team-dev-commit";
18
+ import { CommitCallback, GetRecentComment, GridContextMenuCallback, LoadCallback, ObjetType, PendingItemCheckedResult, PendingItemsCheckedState, SelectCallback } from "./components/team-dev-commit/team-dev-commit";
19
19
  import { cancelCallback, confirmCallback } from "./components/team-dev-select-recent-comment/team-dev-select-recent-comment";
20
20
  import { ConfirmCallback, GridContextMenuCallback as GridContextMenuCallback1, LoadCallback as LoadCallback1, ObjectType, PendingItemCheckedCallback, UpdateCallback, UpdateFromData } from "./components/team-dev-update/team-dev-update";
21
21
  import { AddCallbackFn, CancelCallbackFn, ConfirmCallbackFn, ObjectData as ObjectData1 } from "./components/team-dev-update-partial-selection/team-dev-update-partial-selection";
@@ -405,6 +405,10 @@ export namespace Components {
405
405
  * The method used by the Host to instruct the component to force a data refresh in the grids.
406
406
  */
407
407
  "reload": () => Promise<void>;
408
+ /**
409
+ * Callback that should be invoked when the user selects rows from the grids
410
+ */
411
+ "selectCallback": SelectCallback;
408
412
  /**
409
413
  * Possible values for Type filter
410
414
  */
@@ -1113,6 +1117,10 @@ declare namespace LocalJSX {
1113
1117
  "pendingItemCheckedCallback"?: (
1114
1118
  pendingItemsCheckedState: PendingItemsCheckedState
1115
1119
  ) => Promise<PendingItemCheckedResult | undefined>;
1120
+ /**
1121
+ * Callback that should be invoked when the user selects rows from the grids
1122
+ */
1123
+ "selectCallback"?: SelectCallback;
1116
1124
  /**
1117
1125
  * Possible values for Type filter
1118
1126
  */
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@genexus/genexus-ide-ui",
3
3
  "license": "Apache-2.0",
4
- "version": "0.0.23",
4
+ "version": "0.0.25",
5
5
  "description": "GeneXus IDE UI components",
6
6
  "main": "dist/index.cjs.js",
7
7
  "module": "dist/index.js",
@@ -36,10 +36,10 @@
36
36
  "@types/react": "^18.2.8"
37
37
  },
38
38
  "peerDependencies": {
39
- "@genexus/gemini": "*0.1.442"
39
+ "@genexus/gemini": "*0.1.443"
40
40
  },
41
41
  "devDependencies": {
42
- "@genexus/gemini": "*0.1.442",
42
+ "@genexus/gemini": "*0.1.443",
43
43
  "@stencil-community/eslint-plugin": "^0.5.0",
44
44
  "@stencil/core": "^2.17.0",
45
45
  "@stencil/sass": "^2.0.1",
@@ -1 +0,0 @@
1
- import{r as t,c as i,h as s,H as e,g as n}from"./p-976c3a09.js";import{C as h}from"./p-87e8eb72.js";const o=class{constructor(s){t(this,s),this.windowOpened=i(this,"windowOpened",7),this.windowClosed=i(this,"windowClosed",7),this.isContainerCssOverride=!1,this.validCssAligns=["outside-start","inside-start","center","inside-end","outside-end"],this.draggedX=0,this.draggedY=0,this.xAlign="center",this.yAlign="center",this.hidden=!0,this.modal=!0,this.caption="",this.allowDrag="no",this.showFooter=!0,this.showHeader=!0,this.mousemoveHandler=t=>{const i=this.draggedY+t.clientY-this.dragStartY;this.window.style.setProperty("--ch-window-x-drag",this.draggedX+t.clientX-this.dragStartX+"px"),this.window.style.setProperty("--ch-window-y-drag",`${i}px`)},this.mouseupHandler=()=>{document.removeEventListener("mousemove",this.mousemoveHandler),this.draggedX=parseInt(this.window.style.getPropertyValue("--ch-window-x-drag")),this.draggedY=parseInt(this.window.style.getPropertyValue("--ch-window-y-drag"))},this.maskClickHandler=t=>{t.stopPropagation()},this.updatePosition=()=>{if(!this.isContainerCssOverride&&this.container&&this.mask){const t=this.container.getBoundingClientRect();this.mask.style.setProperty("--ch-window-inset-inline-start",`${t.left}px`),this.mask.style.setProperty("--ch-window-inset-block-start",`${t.top}px`),this.mask.style.width=`${t.width}px`,this.mask.style.height=`${t.height}px`}else!this.isContainerCssOverride&&this.container||(this.mask.style.removeProperty("--ch-window-inset-inline-start"),this.mask.style.removeProperty("--ch-window-inset-block-start"),this.mask.style.removeProperty("width"),this.mask.style.removeProperty("height"))},this.windowResizeHandler=()=>{this.updatePosition(),this.watchCSSAlign()},this.windowScrollHandler=()=>{this.updatePosition()},this.closeOnOutsideClickHandler=t=>{t.composedPath().includes(this.window)||(this.hidden=!0)},this.closeOnEscapeHandler=t=>{"Escape"===t.key&&(this.hidden=!0)}}containerHandler(t,i){this.containerResizeObserverHandler(t,i),this.updatePosition()}hiddenHandler(){this.hidden?(this.resetDrag(),this.removeListeners(),this.windowClosed.emit()):(this.updatePosition(),this.watchCSSAlign(),this.addListeners(),this.windowOpened.emit())}componentWillLoad(){this.containerResizeObserver=new ResizeObserver(this.updatePosition),this.containerResizeObserverHandler(this.container),this.watchCSSAlign(),this.loadGlobalStyleSheet()}mousedownHandler(t){this.isDraggable(t.composedPath())&&(this.dragStartX=t.clientX,this.dragStartY=t.clientY,document.addEventListener("mousemove",this.mousemoveHandler,{passive:!0}),document.addEventListener("mouseup",this.mouseupHandler,{once:!0}))}windowCloseClickedHandler(){this.hidden=!0}resetDrag(){this.dragStartX=void 0,this.dragStartY=void 0,this.draggedX=0,this.draggedY=0,this.window.style.removeProperty("--ch-window-x-drag"),this.window.style.removeProperty("--ch-window-y-drag")}isDraggable(t){return"no"!==this.allowDrag&&("header"===this.allowDrag&&t.includes(this.header)||"box"===this.allowDrag&&t.includes(this.window))}watchCSSAlign(){const t=getComputedStyle(this.el),i=t.getPropertyValue("--ch-window-container").trim(),s=t.getPropertyValue("--ch-window-align-x").trim(),e=t.getPropertyValue("--ch-window-align-y").trim();this.isContainerCssOverride=i.includes("window"),this.validCssAligns.includes(s)&&(this.xAlign=s),this.validCssAligns.includes(e)&&(this.yAlign=e)}containerResizeObserverHandler(t,i){t&&this.containerResizeObserver.observe(t),i&&this.containerResizeObserver.unobserve(i)}addListeners(){window.addEventListener("resize",this.windowResizeHandler,{passive:!0}),this.container&&document.addEventListener("scroll",this.windowScrollHandler,{capture:!0,passive:!0}),this.closeOnOutsideClick&&document.addEventListener("click",this.closeOnOutsideClickHandler,{capture:!0}),this.closeOnEscape&&document.addEventListener("keydown",this.closeOnEscapeHandler,{capture:!0})}removeListeners(){window.removeEventListener("resize",this.windowResizeHandler),document.removeEventListener("scroll",this.windowScrollHandler,{capture:!0}),document.removeEventListener("click",this.closeOnOutsideClickHandler,{capture:!0}),document.removeEventListener("keydown",this.closeOnEscapeHandler,{capture:!0})}loadGlobalStyleSheet(){this.el.shadowRoot.adoptedStyleSheets.push(h)}render(){return s(e,null,s("div",{class:"mask",part:"mask",ref:t=>this.mask=t,onClick:this.maskClickHandler},s("section",{class:"window",part:"window",ref:t=>this.window=t},this.showHeader&&s("header",{part:"header",ref:t=>this.header=t},s("slot",{name:"header"},s("span",{part:"caption"},this.caption),s("ch-window-close",{part:"close",title:this.closeTooltip},this.closeText))),s("div",{part:"main"},s("slot",null)),this.showFooter&&s("footer",{part:"footer"},s("slot",{name:"footer"})))))}get el(){return n(this)}static get watchers(){return{container:["containerHandler"],hidden:["hiddenHandler"]}}};o.style=':host{--ch-window-offset-x:0px;--ch-window-offset-y:0px}:host(:not([hidden])){display:contents}:host(:is(:not([modal]),[modal="false"])) .mask{pointer-events:none}.window{pointer-events:all}.mask{display:flex;position:fixed;inset:0;inset-inline-start:calc( var(--ch-window-inset-inline-start) + var(--ch-window-offset-x) );inset-block-start:calc( var(--ch-window-inset-block-start) + var(--ch-window-offset-y) );z-index:var(--ch-window-mask-z-index, 1000)}:host(:is([x-align="outside-start"],[x-align="inside-start"])) .mask{justify-content:flex-start}:host([x-align=center]) .mask{justify-content:center}:host(:is([x-align="outside-end"],[x-align="inside-end"])) .mask{justify-content:flex-end}:host(:is([y-align="outside-start"],[y-align="inside-start"])) .mask{align-items:flex-start}:host([y-align=center]) .mask{align-items:center}:host(:is([y-align="outside-end"],[y-align="inside-end"])) .mask{align-items:flex-end}.window{display:flex;flex-direction:column;transform:translate(var(--ch-window-x-outside, 0px), var(--ch-window-y-outside, 0px)) translate(var(--ch-window-x-drag, 0px), var(--ch-window-y-drag, 0px))}:host([x-align=outside-start]) .window{--ch-window-x-outside:-100%}:host([x-align=outside-end]) .window{--ch-window-x-outside:100%}:host([y-align=outside-start]) .window{--ch-window-y-outside:-100%}:host([y-align=outside-end]) .window{--ch-window-y-outside:100%}';const d=class{constructor(s){t(this,s),this.windowCloseClicked=i(this,"windowCloseClicked",7)}pressedHandler(t){t.key&&"Enter"!==t.key&&" "!==t.key||(this.windowCloseClicked.emit(),t.stopPropagation())}render(){return s(e,{role:"button",tabindex:"0",disabled:this.disabled})}};d.style="";export{o as ch_window,d as ch_window_close}
@@ -1 +0,0 @@
1
- import{r as t,c as i,h as e,H as o,g as s}from"./p-976c3a09.js";const n="expandable-button",a="section",r="ch-dropdown-item",h=`:scope > ${r}`,d=class{constructor(e){t(this,e),this.expandedChange=i(this,"expandedChange",7),this.keyEventsDictionary={ArrowDown:t=>{if(t.preventDefault(),!this.currentFocusedItem)return void this.focusFirstDropDownItem();const i=this.findNextDropDownItemSibling();i&&i.handleFocusElement()},ArrowUp:t=>{if(t.preventDefault(),!this.currentFocusedItem)return void this.focusFirstDropDownItem();const i=this.findPreviousDropDownItemSibling();i&&i.handleFocusElement()},Escape:()=>{this.closeDropdown(),this.returnFocusToButton()}},this.showHeader=!1,this.showFooter=!1,this.expanded=!1,this.expandedWithHover=!1,this.align="Center",this.buttonLabel="Show options",this.expandBehavior="Click or Hover",this.openOnFocus=!1,this.position="Bottom",this.dropdownSeparation=12,this.valign="Middle",this.closeDropdown=()=>{this.closeDropdownWithHover(),this.expanded=!1,this.expandedChange.emit(!1)},this.closeDropdownWithHover=()=>{this.expandedWithHover=!1,this.expanded||this.expandedChange.emit(!1)},this.closeDropdownWhenClickingOutside=t=>{void 0===t.composedPath().find((t=>t===this.element))&&this.closeDropdown()},this.handleKeyDownEvents=t=>{const i=this.keyEventsDictionary[t.code];i&&i(t)},this.handleKeyUpEvents=t=>{"Tab"===t.code&&(t.target.closest("ch-dropdown")===this.element||this.closeDropdown())},this.handleMouseLeave=()=>{document.activeElement.closest("ch-dropdown")===this.element&&(this.expanded=!0),this.closeDropdownWithHover()},this.handleMouseEnter=()=>{this.expandedWithHover||(this.expandedWithHover=!0,this.expanded||this.expandedChange.emit(!0))},this.handleButtonClick=()=>{this.expandedChange.emit(!this.expanded),this.expanded=!this.expanded},this.handleButtonFocus=()=>{this.expanded||(this.expanded=!0,this.expandedWithHover||this.expandedChange.emit(!0))}}handleExpandedChange(t){t?(this.currentFocusedItem=void 0,document.body.addEventListener("click",this.closeDropdownWhenClickingOutside,{capture:!0}),document.body.addEventListener("keydown",this.handleKeyDownEvents,{capture:!0}),document.body.addEventListener("keyup",this.handleKeyUpEvents,{capture:!0})):(document.body.removeEventListener("click",this.closeDropdownWhenClickingOutside,{capture:!0}),document.body.removeEventListener("keydown",this.handleKeyDownEvents,{capture:!0}),document.body.removeEventListener("keyup",this.handleKeyUpEvents,{capture:!0}))}handleActionClick(){this.closeDropdown()}handleDropDownItemFocusChange(t){this.currentFocusedItem=t.target}focusFirstDropDownItem(){this.currentFocusedItem=this.element.querySelector(h),this.currentFocusedItem&&this.currentFocusedItem.handleFocusElement()}findNextDropDownItemSibling(){let t=this.currentFocusedItem.nextElementSibling;for(;t&&t.tagName.toLowerCase()!==r;)t=t.nextElementSibling;return t}findPreviousDropDownItemSibling(){let t=this.currentFocusedItem.previousElementSibling;for(;t&&t.tagName.toLowerCase()!==r;)t=t.previousElementSibling;return t}returnFocusToButton(){this.openOnFocus||this.expandableButton.focus()}componentWillLoad(){this.showHeader=!!this.element.querySelector(':scope > [slot="header"]'),this.showFooter=!!this.element.querySelector(':scope > [slot="footer"]')}render(){const t="Bottom"===this.position||"Top"===this.position,i=this.expanded||this.expandedWithHover;return e(o,{onMouseLeave:"Click or Hover"===this.expandBehavior?this.handleMouseLeave:void 0,style:{"--separation-between-button":`-${this.dropdownSeparation}px`,"--separation-between-button-size":`${this.dropdownSeparation}px`}},e("button",{id:n,"aria-controls":a,"aria-expanded":this.expanded.toString(),"aria-haspopup":"true","aria-label":this.buttonLabel,class:"expandable-button",part:"dropdown__expandable-button",type:"button",onClick:this.handleButtonClick,onFocus:this.openOnFocus?this.handleButtonFocus:void 0,onMouseEnter:"Click or Hover"===this.expandBehavior?this.handleMouseEnter:void 0,ref:t=>this.expandableButton=t},e("slot",{name:"action"})),"Click or Hover"===this.expandBehavior&&this.expandedWithHover&&e("div",{"aria-hidden":"true",class:{"dummy-separation":!0,[`dummy-separation--${this.position.toLowerCase()}`]:!0,"dummy-separation--vertical":t,"dummy-separation--horizontal":!t},part:"dropdown__separation"}),e("section",{id:a,"aria-labelledby":n,class:{section:!0,[`position--${this.position.toLowerCase()}`]:!0,[`align--${this.align.toLowerCase()}`]:t,[`valign--${this.valign.toLowerCase()}`]:!t},part:"dropdown__section",hidden:!i},this.showHeader&&e("header",{class:"header",part:"dropdown__header"},e("slot",{name:"header"})),e("div",{role:"list",class:"list",part:"dropdown__list"},e("slot",{name:"items"})),this.showFooter&&e("footer",{class:"footer",part:"dropdown__footer"},e("slot",{name:"footer"}))))}get element(){return s(this)}static get watchers(){return{expanded:["handleExpandedChange"]}}};d.style=":where(button){all:unset}*,::before,::after{box-sizing:border-box}@media (prefers-color-scheme: light){.section{background-color:#fbfbfb;color:#000}}@media (prefers-color-scheme: dark){.section{background-color:#242426;color:#e9e9e9}}:host{--ch-dropdown-rtl-initial-X:1;--ch-dropdown-translateX:0;--ch-dropdown-translateY:0;display:flex;position:relative;width:100%;height:100%}.expandable-button{display:flex;position:relative;width:100%;height:100%;cursor:pointer;z-index:108}.expandable-button:focus-within{box-shadow:0px 0px 0 1px currentColor;transition:box-shadow 250ms}.dummy-separation{display:flex;position:absolute;z-index:107}.dummy-separation--vertical{width:100%;height:var(--separation-between-button-size)}.dummy-separation--top{inset-block-start:var(--separation-between-button)}.dummy-separation--bottom{inset-block-end:var(--separation-between-button)}.dummy-separation--horizontal{width:var(--separation-between-button-size);height:100%}.dummy-separation--left{inset-inline-start:var(--separation-between-button)}.dummy-separation--right{inset-inline-end:var(--separation-between-button)}.section{position:absolute;border-radius:5px;box-shadow:0 3px 4px #80808024, 0 3px 3px -2px #8080801f, 0 1px 8px #80808030;width:max-content;max-width:350px;z-index:107}.header+.list,.list+.footer{margin-block-start:8px}.list{display:flex;flex-direction:column;gap:4px}.position--top{inset-block-start:var(--separation-between-button);transform:translate(var(--ch-dropdown-translateX), -100%)}.position--right{inset-inline-end:var(--separation-between-button);transform:translate(calc(100% * var(--ch-dropdown-rtl-initial-X)), var(--ch-dropdown-translateY))}.position--bottom{inset-block-end:var(--separation-between-button);transform:translate(var(--ch-dropdown-translateX), 100%)}.position--left{inset-inline-start:var(--separation-between-button);transform:translate(calc(-100% * var(--ch-dropdown-rtl-initial-X)), var(--ch-dropdown-translateY))}.align--left{inset-inline-start:0}.align--center{inset-inline-start:50%;--ch-dropdown-translateX:calc(-50% * var(--ch-dropdown-rtl-initial-X))}.align--right{inset-inline-end:0}.valign--top{inset-block-start:0}.valign--middle{inset-block-start:50%;--ch-dropdown-translateY:calc(-50% * var(--ch-dropdown-rtl-initial-X))}.valign--bottom{inset-block-end:0}";export{d as ch_dropdown}