@luzmo/analytics-components-kit 1.0.1-alpha.97 → 1.0.1-alpha.99
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.
- package/angular/README.md +2 -2
- package/angular/components/ai-interaction-textarea.component.ts +8 -0
- package/angular/components/{filter-data-item-picker.component.ts → data-items-select.component.ts} +34 -17
- package/angular/components/edit-filters/index.ts +1 -0
- package/angular/components/edit-filters/types.ts +10 -0
- package/angular/components/edit-filters.component.ts +41 -0
- package/angular/components/slot-contents-picker.component.ts +8 -6
- package/angular/esm/components/ai-interaction-textarea.component.d.ts +5 -1
- package/angular/esm/components/ai-interaction-textarea.component.js +22 -2
- package/angular/esm/components/data-items-select.component.d.ts +33 -0
- package/angular/esm/components/{filter-data-item-picker.component.js → data-items-select.component.js} +41 -26
- package/angular/esm/components/edit-filters/index.d.ts +1 -0
- package/angular/esm/components/edit-filters/index.js +1 -0
- package/angular/esm/components/edit-filters/types.d.ts +8 -0
- package/angular/esm/components/edit-filters/types.js +1 -0
- package/angular/esm/components/edit-filters.component.d.ts +21 -0
- package/angular/esm/components/edit-filters.component.js +89 -0
- package/angular/esm/components/slot-contents-picker.component.d.ts +7 -6
- package/angular/esm/components/slot-contents-picker.component.js +11 -6
- package/angular/esm/index.d.ts +5 -5
- package/angular/esm/index.js +6 -6
- package/angular/esm/types.d.ts +9 -0
- package/angular/index.ts +6 -6
- package/angular/types.ts +17 -0
- package/angular/utils/filters/expressions.d.ts +1 -1
- package/components/ai-interaction-textarea/ai-interaction-textarea.d.ts +21 -0
- package/components/ai-interaction-textarea/index.cjs +17 -15
- package/components/ai-interaction-textarea/index.js +90 -65
- package/components/{filter-data-item-picker/filter-data-item-picker.d.ts → data-items-select/data-items-select.d.ts} +36 -21
- package/components/data-items-select/index.cjs +39 -0
- package/components/data-items-select/index.d.ts +6 -0
- package/components/{filter-data-item-picker → data-items-select}/index.js +127 -109
- package/components/dataset-selector-list/index.cjs +1 -1
- package/components/dataset-selector-list/index.js +3 -3
- package/components/dataset-selector-row/index.cjs +1 -1
- package/components/dataset-selector-row/index.js +1 -1
- package/components/{de-COKGBX9L.cjs → de-DOYL4txr.cjs} +1 -1
- package/components/{de-DU0DlXuf.js → de-SDzGVifr.js} +10 -1
- package/components/display-settings-binning/index.cjs +1 -1
- package/components/display-settings-binning/index.js +1 -1
- package/components/display-settings-datetime/index.cjs +1 -1
- package/components/display-settings-datetime/index.js +1 -1
- package/components/display-settings-grand-totals/index.cjs +1 -1
- package/components/display-settings-grand-totals/index.js +1 -1
- package/components/display-settings-numeric/index.cjs +1 -1
- package/components/display-settings-numeric/index.js +1 -1
- package/components/display-settings-period-over-period/index.cjs +1 -1
- package/components/display-settings-period-over-period/index.js +1 -1
- package/components/draggable-data-item/index.cjs +1 -1
- package/components/draggable-data-item/index.js +1 -1
- package/components/draggable-data-item-level/index.cjs +1 -1
- package/components/draggable-data-item-level/index.js +1 -1
- package/components/droppable-slot/index.cjs +9 -9
- package/components/droppable-slot/index.js +82 -158
- package/components/edit-filters/edit-filters.d.ts +79 -0
- package/components/edit-filters/index.cjs +144 -0
- package/components/edit-filters/index.d.ts +8 -0
- package/components/edit-filters/index.js +341 -0
- package/components/edit-filters/types.d.ts +8 -0
- package/components/{es-BxR1uGKR.js → es-B1TeapPZ.js} +10 -1
- package/components/{es-CaKfa7fn.cjs → es-DcQvrHgz.cjs} +1 -1
- package/components/filter-expression-picker/index.cjs +1 -1
- package/components/filter-expression-picker/index.js +1 -1
- package/components/filter-item/filter-item.d.ts +1 -1
- package/components/filter-item/index.cjs +7 -5
- package/components/filter-item/index.js +78 -68
- package/components/filter-value-picker/index.cjs +1 -1
- package/components/filter-value-picker/index.js +1 -1
- package/components/filter-value-picker-datetime/index.cjs +2 -2
- package/components/filter-value-picker-datetime/index.js +4 -4
- package/components/filter-value-picker-hierarchy/index.cjs +1 -1
- package/components/filter-value-picker-hierarchy/index.js +2 -2
- package/components/filter-value-picker-numeric/index.cjs +2 -1
- package/components/filter-value-picker-numeric/index.js +3 -2
- package/components/{fr-DiZbjx_a.cjs → fr-D6QmA3Ve.cjs} +1 -1
- package/components/{fr-CvltYxR_.js → fr-sZFBmltf.js} +10 -1
- package/components/{get-css-variable-Pzks_rOx.cjs → get-css-variable-C0B_Sxqf.cjs} +1 -1
- package/components/{get-css-variable-Bb7TxJdX.js → get-css-variable-DgTBQV3c.js} +2 -1
- package/components/grid/index.cjs +1 -1
- package/components/grid/index.js +1 -1
- package/components/{index-DNPULp4A.js → index-BikhVAa1.js} +1 -1
- package/components/{index-CFL6gmIu.cjs → index-CAbDIHYI.cjs} +1 -1
- package/components/{index-BNAmjOkm.cjs → index-DM58h73U.cjs} +3 -3
- package/components/{index-DdyZ2g5L.js → index-DR5275fa.js} +48 -18
- package/components/index.cjs +1 -1
- package/components/index.js +105 -106
- package/components/{nl-CLs7FmRK.js → nl-BYXZ-qNp.js} +10 -1
- package/components/{nl-Bot6bJ4g.cjs → nl-D7oNsLn0.cjs} +1 -1
- package/components/{set-locale-hKTMz37h.js → set-locale-B5562CBM.js} +1 -1
- package/components/{set-locale-BRRalqne.cjs → set-locale-B8iQGfk0.cjs} +1 -1
- package/components/slot-contents-picker/index.cjs +31 -27
- package/components/slot-contents-picker/index.js +137 -124
- package/components/slot-contents-picker/slot-contents-picker.d.ts +26 -5
- package/components/slot-menu/index.cjs +6 -6
- package/components/slot-menu/index.js +76 -76
- package/components/slot-menu-list/index.cjs +1 -1
- package/components/slot-menu-list/index.js +1 -1
- package/components/slot-store-CRfN0nD3.js +98 -0
- package/components/slot-store-Dd_cPNXk.cjs +20 -0
- package/components/utils.cjs +1 -1
- package/components/utils.js +1 -1
- package/components/viz-item-menu/index.cjs +6 -6
- package/components/viz-item-menu/index.js +27 -28
- package/custom-elements.json +1922 -1631
- package/index.d.ts +1 -1
- package/package.json +12 -12
- package/types.d.ts +9 -0
- package/utils/filters/expressions.d.ts +1 -1
- package/angular/components/filter-group.component.ts +0 -29
- package/angular/esm/components/filter-data-item-picker.component.d.ts +0 -30
- package/angular/esm/components/filter-group.component.d.ts +0 -12
- package/angular/esm/components/filter-group.component.js +0 -56
- package/components/filter-data-item-picker/index.cjs +0 -47
- package/components/filter-data-item-picker/index.d.ts +0 -7
- package/components/filter-group/filter-group.d.ts +0 -26
- package/components/filter-group/index.d.ts +0 -7
|
@@ -17,9 +17,9 @@
|
|
|
17
17
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
18
18
|
* SOFTWARE.
|
|
19
19
|
* */
|
|
20
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("@luzmo/lucero/divider");const p=require("lit"),O=require("../index-BekTY3Em.cjs"),U=require("@lit-labs/signals"),P=require("@lit/context"),h=require("@luzmo/icons"),v=require("../index-CFL6gmIu.cjs"),M=require("../localize-C4zNlrwK.cjs"),n=require("lit/decorators.js"),A=require("lit/directives/guard.js"),R=require("../focusable-QLh-LlNt.cjs"),$=require("../sized-mixin-DcvJLFeo.cjs");require("../slot-menu-list/index.cjs");const X=/^(?:[0-9a-f]{8}-[0-9a-f]{4}-[1-8][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}|00000000-0000-0000-0000-000000000000|ffffffff-ffff-ffff-ffff-ffffffffffff)$/i;function Y(u){return typeof u=="string"&&X.test(u)}function N({element:u,handle:t,boundary:l=document.documentElement,onDragStart:i,onDragEnd:a}){if(!u||!t)throw new Error("makeDraggable: element and handle are required");const s=u.ownerDocument??document;let r=-1,S=0,E=0,z=0,b=0,k=0,I=0,y=0,f=0;const C=d=>{if(d.pointerId!==r)return;const c=d.clientX-S,g=d.clientY-E,m=(l??document.documentElement).getBoundingClientRect();let _=z+c,x=b+g;_=Math.min(Math.max(_,m.left),m.right-k),x=Math.min(Math.max(x,m.top),m.bottom-I);const T=_-z,L=x-b,B=y+T,q=f+L;u.style.transform=`translate3d(${B}px, ${q}px, 0)`},w=d=>{d.pointerId===r&&(s.removeEventListener("pointermove",C),s.removeEventListener("pointerup",w),r=-1,a?.())},D=d=>{if(d.button!==0)return;r=d.pointerId;const c=u.getBoundingClientRect();z=c.left,b=c.top,k=c.width,I=c.height,S=d.clientX,E=d.clientY;try{const g=s.defaultView?.getComputedStyle(u);if(g){const m=new DOMMatrixReadOnly(g.transform);y=m.m41,f=m.m42}}catch{y=0,f=0}t.setPointerCapture(r),s.addEventListener("pointermove",C),s.addEventListener("pointerup",w),i?.()};return t.addEventListener("pointerdown",D),()=>{t.removeEventListener("pointerdown",D),s.removeEventListener("pointermove",C),s.removeEventListener("pointerup",w)}}const j=":host{font-family:var(--luzmo-slot-menu-font-family, var(--luzmo-font-family));font-size:var(--luzmo-slot-menu-font-size, var(--slot-menu-font-size));color:var(--luzmo-slot-menu-font-color, var(--luzmo-font-color));display:block;width:fit-content}luzmo-slot-menu-list{min-width:var(--luzmo-slot-menu-list-min-width, var(--slot-menu-list-min-width));max-width:var(--luzmo-slot-menu-list-max-width, var(--slot-menu-list-max-width));background-color:var(--luzmo-slot-menu-list-background-color, var(--slot-menu-list-background-color));border-bottom-left-radius:var(--luzmo-slot-menu-list-border-radius, var(--slot-menu-list-border-radius))}.slot-contents-container{position:relative;border:var(--luzmo-slot-menu-border-width, var(--luzmo-border-width)) solid var(--luzmo-slot-menu-border-color, var(--luzmo-border-color));border-radius:var(--luzmo-slot-menu-border-radius, var(--luzmo-border-radius));background:var(--luzmo-slot-menu-background-color, var(--luzmo-background-color));box-shadow:var(--luzmo-slot-menu-popup-shadow-horizontal, var(--slot-menu-popup-shadow-horizontal)) var(--luzmo-slot-menu-popup-shadow-vertical, var(--slot-menu-popup-shadow-vertical)) var(--luzmo-slot-menu-popup-shadow-blur, var(--slot-menu-popup-shadow-blur)) var(--luzmo-slot-menu-popup-shadow-color, var(--slot-menu-popup-shadow-color));border-top-left-radius:0}.slot-contents-container .inner-container{display:flex}.slot-contents-container .inner-container luzmo-display-settings{min-width:var(--luzmo-slot-menu-display-settings-min-width, var(--slot-menu-display-settings-min-width));padding:var(--luzmo-slot-menu-display-settings-vertical-padding, var(--slot-menu-display-settings-vertical-padding)) var(--luzmo-slot-menu-display-settings-horizontal-padding, var(--slot-menu-display-settings-horizontal-padding))}:host([variant=popup]) .slot-contents-container{overflow:hidden;border-top-left-radius:var(--luzmo-slot-menu-border-radius, var(--luzmo-border-radius));--slot-menu-popup-filter: drop-shadow( var( --luzmo-slot-menu-popup-shadow-horizontal, var(--slot-menu-popup-shadow-horizontal) ) var( --luzmo-slot-menu-popup-shadow-vertical, var(--slot-menu-popup-shadow-vertical) ) var( --luzmo-slot-menu-popup-shadow-blur, var(--slot-menu-popup-shadow-blur) ) var( --luzmo-slot-menu-popup-shadow-color, var(--slot-menu-popup-shadow-color) ) );filter:var(--luzmo-slot-menu-popup-filter, var(--slot-menu-popup-filter))}.slot-menu-top-menu{display:flex;align-items:center;border-radius:var(--luzmo-slot-menu-border-radius, var(--luzmo-border-radius));border-bottom-left-radius:0;border-bottom-right-radius:0;overflow:hidden;width:fit-content}.drag-handle{background-color:var(--luzmo-slot-menu-drag-handle-background-color, var(--luzmo-background-color-highlight));cursor:move;width:fit-content;border:var(--luzmo-slot-menu-drag-handle-border-width, var(--slot-menu-drag-handle-border-width)) solid var(--luzmo-slot-menu-border-color, var(--luzmo-background-color-highlight));font-size:var(--luzmo-slot-menu-drag-handle-size, var(--slot-menu-drag-handle-size));padding:var(--luzmo-slot-menu-drag-handle-vertical-padding, var(--slot-menu-drag-handle-vertical-padding)) var(--luzmo-slot-menu-drag-handle-horizontal-padding, var(--slot-menu-drag-handle-horizontal-padding))}.drag-handle:hover{background-color:var(--luzmo-slot-menu-drag-handle-background-color-hover, var(--luzmo-background-color-highlight-hover))}.slot-content-action{display:flex;flex:0 1 auto;max-width:var(--luzmo-slot-menu-top-menu-label-max-width, var(--slot-menu-top-menu-label-max-width));gap:var(--luzmo-slot-menu-label-to-icon-gap, var(--slot-menu-label-to-icon-gap));background-color:var(--luzmo-slot-menu-content-label-background-color, var(--luzmo-primary));color:var(--luzmo-slot-menu-content-label-color, var(--luzmo-primary-inverse-color));border:var(--luzmo-slot-menu-border-width, var(--luzmo-border-width)) solid var(--luzmo-slot-menu-content-label-border-color, var(--luzmo-primary));padding:var(--luzmo-slot-menu-drag-handle-vertical-padding, var(--slot-menu-drag-handle-vertical-padding)) var(--luzmo-slot-menu-drag-handle-horizontal-padding, var(--slot-menu-drag-handle-horizontal-padding))}.slot-content-action:hover{background-color:var(--luzmo-slot-menu-content-label-background-color-hover, var(--luzmo-primary-hover))}.slot-content-action:focus{background-color:var(--luzmo-slot-menu-content-label-background-color-focus, var(--luzmo-primary-focus))}.slot-content-action .slot-content-label{flex:1 1 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.slot-content-action .slot-content-remove{flex:0 0 auto;cursor:pointer}.close{position:absolute;right:var(--luzmo-slot-menu-close-icon-right, var(--slot-menu-close-icon-right));cursor:pointer;top:calc(-2 * var(--luzmo-slot-menu-border-width, var(--luzmo-border-width)));background-color:var(--luzmo-slot-menu-close-button-background-color, var(--luzmo-background-color-highlight));font-size:var(--luzmo-slot-menu-close-button-size, var(--slot-menu-close-button-size));border:var(--luzmo-slot-menu-border-width, var(--luzmo-border-width)) solid var(--luzmo-slot-menu-border-color, var(--luzmo-border-color));border-radius:var(--luzmo-slot-menu-border-radius, var(--luzmo-border-radius));border-top-left-radius:0;border-top-right-radius:0;padding:var(--luzmo-slot-menu-close-button-vertical-padding, var(--slot-menu-close-button-vertical-padding)) var(--luzmo-slot-menu-close-button-horizontal-padding, var(--slot-menu-close-button-horizontal-padding))}.close:hover{background-color:var(--luzmo-slot-menu-close-button-background-color-hover, var(--luzmo-background-color-highlight-hover))}:host{--slot-menu-display-settings-min-width: 19rem;--slot-menu-min-height: calc(var(--luzmo-component-height) * 2);--slot-menu-font-size: var(--luzmo-font-size);--slot-menu-display-settings-horizontal-padding: var(--luzmo-spacing-5);--slot-menu-display-settings-vertical-padding: var(--luzmo-spacing-4);--slot-menu-top-menu-label-max-width: 12rem;--slot-menu-list-min-width: 8rem;--slot-menu-list-max-width: 12rem;--slot-menu-label-to-icon-gap: var(--luzmo-spacing-3);--slot-menu-drag-handle-size: var(--luzmo-font-size);--slot-menu-drag-handle-vertical-padding: var(--luzmo-spacing-2);--slot-menu-drag-handle-horizontal-padding: var(--luzmo-spacing-3);--slot-menu-drag-handle-border-width: var(--luzmo-border-width) --slot-menu-close-button-size: var(--luzmo-font-size-s);--slot-menu-close-button-vertical-padding: var(--luzmo-spacing-2);--slot-menu-close-button-horizontal-padding: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--slot-menu-popup-shadow-horizontal: 0;--slot-menu-popup-shadow-vertical: 1px;--slot-menu-popup-shadow-blur: 4px;--slot-menu-popup-shadow-color: var(--luzmo-border-color);--slot-menu-popup-box-shadow: var(--slot-menu-popup-shadow-horizontal) var(--slot-menu-popup-shadow-vertical) var(--slot-menu-popup-shadow-blur) var(--slot-menu-popup-shadow-color);--slot-menu-close-icon-right: 1rem;--slot-menu-list-border-radius: var(--luzmo-border-radius)}:host([size=s]){--slot-menu-display-settings-min-width: 16rem;--slot-menu-min-height: calc(var(--luzmo-component-height-s) * 2);--slot-menu-font-size: var(--luzmo-font-size-s);--slot-menu-display-settings-horizontal-padding: var(--luzmo-spacing-4);--slot-menu-display-settings-vertical-padding: var(--luzmo-spacing-3);--slot-menu-top-menu-label-max-width: 10rem;--slot-menu-list-min-width: 6rem;--slot-menu-list-max-width: 10rem;--slot-menu-label-to-icon-gap: var(--luzmo-spacing-2);--slot-menu-drag-handle-size: var(--luzmo-font-size-s);--slot-menu-drag-handle-vertical-padding: var(--luzmo-spacing-2);--slot-menu-drag-handle-horizontal-padding: var(--luzmo-spacing-3);--slot-menu-close-button-size: var(--luzmo-font-size-xs);--slot-menu-close-button-vertical-padding: var(--luzmo-spacing-2);--slot-menu-close-button-horizontal-padding: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) )}:host([size=l]){--slot-menu-display-settings-min-width: 23rem;--slot-menu-min-height: calc(var(--luzmo-component-height-l) * 2);--slot-menu-font-size: var(--luzmo-font-size-l);--slot-menu-display-settings-horizontal-padding: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-1) );--slot-menu-display-settings-vertical-padding: var(--luzmo-spacing-5);--slot-menu-top-menu-label-max-width: 14rem;--slot-menu-list-min-width: 9rem;--slot-menu-list-max-width: 14rem;--slot-menu-label-to-icon-gap: var(--luzmo-spacing-4);--slot-menu-drag-handle-size: var(--luzmo-font-size-l);--slot-menu-drag-handle-vertical-padding: var(--luzmo-spacing-3);--slot-menu-drag-handle-horizontal-padding: var(--luzmo-spacing-3);--slot-menu-close-button-size: var(--luzmo-font-size);--slot-menu-close-button-vertical-padding: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--slot-menu-close-button-horizontal-padding: var(--luzmo-spacing-3)}:host([size=xl]){--slot-menu-display-settings-min-width: 26rem;--slot-menu-min-height: calc(var(--luzmo-component-height-xl) * 2);--slot-menu-font-size: var(--luzmo-font-size-xl);--slot-menu-display-settings-horizontal-padding: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-2) );--slot-menu-display-settings-vertical-padding: var(--luzmo-spacing-5);--slot-menu-top-menu-label-max-width: 16rem;--slot-menu-list-min-width: 10rem;--slot-menu-list-max-width: 16rem;--slot-menu-label-to-icon-gap: var(--luzmo-spacing-5);--slot-menu-drag-handle-size: var(--luzmo-font-size-xl);--slot-menu-drag-handle-vertical-padding: var(--luzmo-spacing-3);--slot-menu-drag-handle-horizontal-padding: var(--luzmo-spacing-4);--slot-menu-close-button-size: var(--luzmo-font-size-l);--slot-menu-close-button-vertical-padding: var(--luzmo-spacing-3);--slot-menu-close-button-horizontal-padding: var(--luzmo-spacing-3)}";var K=Object.defineProperty,o=(u,t,l,i)=>{for(var a=void 0,s=u.length-1,r;s>=0;s--)(r=u[s])&&(a=r(t,l,a)||a);return a&&K(t,l,a),a};class e extends U.SignalWatcher($.SizedMixin(R.LuzmoElement,{validSizes:Object.values($.ElementSizes)})){constructor(){super(...arguments),this.language="en",this.contentLanguage="en",this.slotType="numeric",this.variant="draggable",this._periodOverPeriodUiType=null,this.measureColumns=[],this.apiUrl="https://api.luzmo.com",this.authKey="",this.authToken="",this._slotContents=[],this._activeIndex=this.slotIndex??0,this._linkedDatasetsIds=[]}static get styles(){return[p.unsafeCSS(j)]}get _currentSlotContent(){return this._slotContents[this.slotIndex??this._activeIndex]??{}}get _currentLabel(){return M.localize(this._currentSlotContent.label,this.contentLanguage)??"Untitled"}connectedCallback(){const t={};this.apiUrl&&(t.apiUrl=this.apiUrl),this.authKey&&this.authToken&&(t.authKey=this.authKey,t.authToken=this.authToken),v.dataBroker.configure(t),super.connectedCallback(),this._attachDragHandle()}disconnectedCallback(){super.disconnectedCallback(),this._cleanupDrag&&(this._cleanupDrag(),this._cleanupDrag=void 0)}_attachDragHandle(){if(this._cleanupDrag||this.variant!=="draggable"||this.noDrag)return;const t=this.renderRoot.querySelector(".drag-handle");if(!t)return;const l=this.dragBoundary?document.querySelector(this.dragBoundary):document.documentElement;this._cleanupDrag=N({element:this,handle:t,boundary:l})}_sendChangeEvent(){this.dispatchEvent(new CustomEvent("slot-contents-changed",{bubbles:!0,composed:!0,cancelable:!0,detail:{slotContents:[...this._slotContents],linkedDatasetsIds:[...this._linkedDatasetsIds]}}))}_sendCloseEvent(){this.dispatchEvent(new CustomEvent("close",{bubbles:!0,composed:!0,cancelable:!0}))}isArrayColumnType(t){return t.startsWith("array[")}async willUpdate(){const t=this.slotContents??this._store?.slotContents.get()??[];if(t!==this._slotContents){this._slotContents=structuredClone(t);const{set:l,column:i}=this._currentSlotContent;if(l&&Y(l)&&l!==this._lastFetchedDatasetId){if(this._lastFetchedDatasetId=l,await v.dataBroker.fetchDatasetsRecursive([l]),!this.isConnected)return;this._linkedDatasetsIds=v.dataBroker.getLinkedDatasetsIds(l)}const a=v.dataBroker.getAvailableDatasets();this.measureColumns=a.map(s=>({datasetId:s.id,datasetName:s.name,columns:s.columns?.filter(r=>r.type==="numeric"&&r.id!==i)})),this._store?.activeIndex.get()!==this._activeIndex&&this._store?.updateActive(this._activeIndex),this.slotName==="measure"&&(this._store?.setPeriodOverPeriodCondition(this.itemType,this._currentSlotContent),this._currentSlotContent.subtype==="duration"&&this.isArrayColumnType(this._currentSlotContent.type)?this._periodOverPeriodUiType=null:(this._periodOverPeriodUiType=this._store?.periodOverPeriodUiType.get(),this._store?.linkedDataset.set(a.filter(r=>r.id===l))))}}updated(){this.displaySettingsElement&&(this.displaySettingsElement.periodOverPeriodUiType=this._periodOverPeriodUiType,this.displaySettingsElement.measureColumns=this.measureColumns,this.displaySettingsElement.showRemoveButton=this.variant==="popup"&&(typeof this.slotIndex=="number"||this._slotContents?.length===1))}_handleSlotListChange(t){this._slotContents=structuredClone(t.detail.slotContents);const l=t.detail.activeIndex;l!==this._activeIndex&&(this._activeIndex=l,this._store?.updateActive(l));const i=this._slotContents[this._activeIndex],a=i?.column??i?.columnId,s=i?.set??i?.datasetId,r=i?.formula;(a||r)&&s&&(this.dispatchEvent(new CustomEvent("slot-menu-active",{bubbles:!0,composed:!0,detail:{datasetId:s}})),setTimeout(()=>{this.dispatchEvent(new CustomEvent("slot-menu-highlight",{bubbles:!0,composed:!0,detail:{datasetId:s,level:i?.level??0,...a&&{columnId:a},...r&&{formulaId:r}}}))})),this._slotContents.length<=1&&this.requestUpdate(),this._store?.setContents(this._slotContents,this.slotName),this._sendChangeEvent()}_handleSlotContentChange(t){this._slotContents[this.slotIndex??this._activeIndex]=structuredClone(t.detail.slotContent),this.slotMenuListElement&&(this.slotMenuListElement.slotContents=this._slotContents),this._store?.updateContent(t.detail.slotContent,this.slotIndex??this._activeIndex),this._sendChangeEvent()}removeSlotContent(t){this._slotContents=this._slotContents.filter((l,i)=>i!==t),this._store?.setContents(this._slotContents,this.slotName),this._slotContents.length===0&&this.dispatchEvent(new CustomEvent("slot-menu-inactive",{bubbles:!0,composed:!0})),this._sendChangeEvent(),this._sendCloseEvent(),this.requestUpdate()}close(){this._sendCloseEvent()}_removeActiveSlotContent(){this.removeSlotContent(this.slotIndex??this._activeIndex)}render(){const t=`${this.slotType}-${this._currentSlotContent?.type??""}`;return p.html`<div class="slot-menu-top-menu">
|
|
21
|
-
${this.variant==="draggable"?
|
|
22
|
-
${this._slotContents&&this._slotContents.length===1&&this.variant!=="popup"?
|
|
20
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("@luzmo/lucero/divider");const c=require("lit"),O=require("../index-BekTY3Em.cjs"),U=require("@lit-labs/signals"),P=require("@lit/context"),h=require("@luzmo/icons"),v=require("../index-CAbDIHYI.cjs"),M=require("../localize-C4zNlrwK.cjs"),n=require("lit/decorators.js"),A=require("lit/directives/guard.js"),R=require("../focusable-QLh-LlNt.cjs"),$=require("../sized-mixin-DcvJLFeo.cjs");require("../slot-menu-list/index.cjs");const X=/^(?:[0-9a-f]{8}-[0-9a-f]{4}-[1-8][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}|00000000-0000-0000-0000-000000000000|ffffffff-ffff-ffff-ffff-ffffffffffff)$/i;function Y(u){return typeof u=="string"&&X.test(u)}function N({element:u,handle:t,boundary:l=document.documentElement,onDragStart:i,onDragEnd:a}){if(!u||!t)throw new Error("makeDraggable: element and handle are required");const s=u.ownerDocument??document;let r=-1,S=0,E=0,z=0,b=0,k=0,I=0,y=0,f=0;const C=d=>{if(d.pointerId!==r)return;const p=d.clientX-S,g=d.clientY-E,m=(l??document.documentElement).getBoundingClientRect();let w=z+p,x=b+g;w=Math.min(Math.max(w,m.left),m.right-k),x=Math.min(Math.max(x,m.top),m.bottom-I);const T=w-z,L=x-b,B=y+T,q=f+L;u.style.transform=`translate3d(${B}px, ${q}px, 0)`},_=d=>{d.pointerId===r&&(s.removeEventListener("pointermove",C),s.removeEventListener("pointerup",_),r=-1,a?.())},D=d=>{if(d.button!==0)return;r=d.pointerId;const p=u.getBoundingClientRect();z=p.left,b=p.top,k=p.width,I=p.height,S=d.clientX,E=d.clientY;try{const g=s.defaultView?.getComputedStyle(u);if(g){const m=new DOMMatrixReadOnly(g.transform);y=m.m41,f=m.m42}}catch{y=0,f=0}t.setPointerCapture(r),s.addEventListener("pointermove",C),s.addEventListener("pointerup",_),i?.()};return t.addEventListener("pointerdown",D),()=>{t.removeEventListener("pointerdown",D),s.removeEventListener("pointermove",C),s.removeEventListener("pointerup",_)}}const j=":host{font-family:var(--luzmo-slot-menu-font-family, var(--luzmo-font-family));font-size:var(--luzmo-slot-menu-font-size, var(--slot-menu-font-size));color:var(--luzmo-slot-menu-font-color, var(--luzmo-font-color));display:block;width:fit-content}luzmo-slot-menu-list{min-width:var(--luzmo-slot-menu-list-min-width, var(--slot-menu-list-min-width));max-width:var(--luzmo-slot-menu-list-max-width, var(--slot-menu-list-max-width));background-color:var(--luzmo-slot-menu-list-background-color, var(--slot-menu-list-background-color));border-bottom-left-radius:var(--luzmo-slot-menu-list-border-radius, var(--slot-menu-list-border-radius))}.slot-contents-container{position:relative;border:var(--luzmo-slot-menu-border-width, var(--luzmo-border-width)) solid var(--luzmo-slot-menu-border-color, var(--luzmo-border-color));border-radius:var(--luzmo-slot-menu-border-radius, var(--luzmo-border-radius));background:var(--luzmo-slot-menu-background-color, var(--luzmo-background-color));--slot-menu-popup-filter: drop-shadow( var( --luzmo-slot-menu-popup-shadow-horizontal, var(--slot-menu-popup-shadow-horizontal) ) var( --luzmo-slot-menu-popup-shadow-vertical, var(--slot-menu-popup-shadow-vertical) ) var( --luzmo-slot-menu-popup-shadow-blur, var(--slot-menu-popup-shadow-blur) ) var( --luzmo-slot-menu-popup-shadow-color, var(--slot-menu-popup-shadow-color) ) );filter:var(--luzmo-slot-menu-popup-filter, var(--slot-menu-popup-filter));border-top-left-radius:0}.slot-contents-container .inner-container{display:flex}.slot-contents-container .inner-container luzmo-display-settings{min-width:var(--luzmo-slot-menu-display-settings-min-width, var(--slot-menu-display-settings-min-width));padding:var(--luzmo-slot-menu-display-settings-vertical-padding, var(--slot-menu-display-settings-vertical-padding)) var(--luzmo-slot-menu-display-settings-horizontal-padding, var(--slot-menu-display-settings-horizontal-padding))}:host([variant=popup]) .slot-contents-container{overflow:hidden;border-top-left-radius:var(--luzmo-slot-menu-border-radius, var(--luzmo-border-radius))}.slot-menu-top-menu{display:flex;align-items:center;border-radius:var(--luzmo-slot-menu-border-radius, var(--luzmo-border-radius));border-bottom-left-radius:0;border-bottom-right-radius:0;overflow:hidden;width:fit-content}.drag-handle{background-color:var(--luzmo-slot-menu-drag-handle-background-color, var(--luzmo-background-color-highlight));cursor:move;width:fit-content;border:var(--luzmo-slot-menu-drag-handle-border-width, var(--slot-menu-drag-handle-border-width)) solid var(--luzmo-slot-menu-border-color, var(--luzmo-background-color-highlight));font-size:var(--luzmo-slot-menu-drag-handle-size, var(--slot-menu-drag-handle-size));padding:var(--luzmo-slot-menu-drag-handle-vertical-padding, var(--slot-menu-drag-handle-vertical-padding)) var(--luzmo-slot-menu-drag-handle-horizontal-padding, var(--slot-menu-drag-handle-horizontal-padding))}.drag-handle:hover{background-color:var(--luzmo-slot-menu-drag-handle-background-color-hover, var(--luzmo-background-color-highlight-hover))}.slot-content-action{display:flex;flex:0 1 auto;max-width:var(--luzmo-slot-menu-top-menu-label-max-width, var(--slot-menu-top-menu-label-max-width));gap:var(--luzmo-slot-menu-label-to-icon-gap, var(--slot-menu-label-to-icon-gap));background-color:var(--luzmo-slot-menu-content-label-background-color, var(--luzmo-primary));color:var(--luzmo-slot-menu-content-label-color, var(--luzmo-primary-inverse-color));border:var(--luzmo-slot-menu-border-width, var(--luzmo-border-width)) solid var(--luzmo-slot-menu-content-label-border-color, var(--luzmo-primary));padding:var(--luzmo-slot-menu-drag-handle-vertical-padding, var(--slot-menu-drag-handle-vertical-padding)) var(--luzmo-slot-menu-drag-handle-horizontal-padding, var(--slot-menu-drag-handle-horizontal-padding))}.slot-content-action:hover{background-color:var(--luzmo-slot-menu-content-label-background-color-hover, var(--luzmo-primary-hover))}.slot-content-action:focus{background-color:var(--luzmo-slot-menu-content-label-background-color-focus, var(--luzmo-primary-focus))}.slot-content-action .slot-content-label{flex:1 1 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.slot-content-action .slot-content-remove{flex:0 0 auto;cursor:pointer}.close{position:absolute;right:var(--luzmo-slot-menu-close-icon-right, var(--slot-menu-close-icon-right));cursor:pointer;top:calc(-2 * var(--luzmo-slot-menu-border-width, var(--luzmo-border-width)));background-color:var(--luzmo-slot-menu-close-button-background-color, var(--luzmo-background-color-highlight));font-size:var(--luzmo-slot-menu-close-button-size, var(--slot-menu-close-button-size));border:var(--luzmo-slot-menu-border-width, var(--luzmo-border-width)) solid var(--luzmo-slot-menu-border-color, var(--luzmo-border-color));border-radius:var(--luzmo-slot-menu-border-radius, var(--luzmo-border-radius));border-top-left-radius:0;border-top-right-radius:0;padding:var(--luzmo-slot-menu-close-button-vertical-padding, var(--slot-menu-close-button-vertical-padding)) var(--luzmo-slot-menu-close-button-horizontal-padding, var(--slot-menu-close-button-horizontal-padding))}.close:hover{background-color:var(--luzmo-slot-menu-close-button-background-color-hover, var(--luzmo-background-color-highlight-hover))}:host{--slot-menu-display-settings-min-width: 19rem;--slot-menu-min-height: calc(var(--luzmo-component-height) * 2);--slot-menu-font-size: var(--luzmo-font-size);--slot-menu-display-settings-horizontal-padding: var(--luzmo-spacing-5);--slot-menu-display-settings-vertical-padding: var(--luzmo-spacing-4);--slot-menu-top-menu-label-max-width: 12rem;--slot-menu-list-min-width: 8rem;--slot-menu-list-max-width: 12rem;--slot-menu-label-to-icon-gap: var(--luzmo-spacing-3);--slot-menu-drag-handle-size: var(--luzmo-font-size);--slot-menu-drag-handle-vertical-padding: var(--luzmo-spacing-2);--slot-menu-drag-handle-horizontal-padding: var(--luzmo-spacing-3);--slot-menu-drag-handle-border-width: var(--luzmo-border-width) --slot-menu-close-button-size: var(--luzmo-font-size-s);--slot-menu-close-button-vertical-padding: var(--luzmo-spacing-2);--slot-menu-close-button-horizontal-padding: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--slot-menu-popup-shadow-horizontal: 0;--slot-menu-popup-shadow-vertical: 1px;--slot-menu-popup-shadow-blur: 4px;--slot-menu-popup-shadow-color: var(--luzmo-border-color);--slot-menu-popup-box-shadow: var(--slot-menu-popup-shadow-horizontal) var(--slot-menu-popup-shadow-vertical) var(--slot-menu-popup-shadow-blur) var(--slot-menu-popup-shadow-color);--slot-menu-close-icon-right: 1rem;--slot-menu-list-border-radius: var(--luzmo-border-radius)}:host([size=s]){--slot-menu-display-settings-min-width: 16rem;--slot-menu-min-height: calc(var(--luzmo-component-height-s) * 2);--slot-menu-font-size: var(--luzmo-font-size-s);--slot-menu-display-settings-horizontal-padding: var(--luzmo-spacing-4);--slot-menu-display-settings-vertical-padding: var(--luzmo-spacing-3);--slot-menu-top-menu-label-max-width: 10rem;--slot-menu-list-min-width: 6rem;--slot-menu-list-max-width: 10rem;--slot-menu-label-to-icon-gap: var(--luzmo-spacing-2);--slot-menu-drag-handle-size: var(--luzmo-font-size-s);--slot-menu-drag-handle-vertical-padding: var(--luzmo-spacing-2);--slot-menu-drag-handle-horizontal-padding: var(--luzmo-spacing-3);--slot-menu-close-button-size: var(--luzmo-font-size-xs);--slot-menu-close-button-vertical-padding: var(--luzmo-spacing-2);--slot-menu-close-button-horizontal-padding: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) )}:host([size=l]){--slot-menu-display-settings-min-width: 23rem;--slot-menu-min-height: calc(var(--luzmo-component-height-l) * 2);--slot-menu-font-size: var(--luzmo-font-size-l);--slot-menu-display-settings-horizontal-padding: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-1) );--slot-menu-display-settings-vertical-padding: var(--luzmo-spacing-5);--slot-menu-top-menu-label-max-width: 14rem;--slot-menu-list-min-width: 9rem;--slot-menu-list-max-width: 14rem;--slot-menu-label-to-icon-gap: var(--luzmo-spacing-4);--slot-menu-drag-handle-size: var(--luzmo-font-size-l);--slot-menu-drag-handle-vertical-padding: var(--luzmo-spacing-3);--slot-menu-drag-handle-horizontal-padding: var(--luzmo-spacing-3);--slot-menu-close-button-size: var(--luzmo-font-size);--slot-menu-close-button-vertical-padding: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--slot-menu-close-button-horizontal-padding: var(--luzmo-spacing-3)}:host([size=xl]){--slot-menu-display-settings-min-width: 26rem;--slot-menu-min-height: calc(var(--luzmo-component-height-xl) * 2);--slot-menu-font-size: var(--luzmo-font-size-xl);--slot-menu-display-settings-horizontal-padding: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-2) );--slot-menu-display-settings-vertical-padding: var(--luzmo-spacing-5);--slot-menu-top-menu-label-max-width: 16rem;--slot-menu-list-min-width: 10rem;--slot-menu-list-max-width: 16rem;--slot-menu-label-to-icon-gap: var(--luzmo-spacing-5);--slot-menu-drag-handle-size: var(--luzmo-font-size-xl);--slot-menu-drag-handle-vertical-padding: var(--luzmo-spacing-3);--slot-menu-drag-handle-horizontal-padding: var(--luzmo-spacing-4);--slot-menu-close-button-size: var(--luzmo-font-size-l);--slot-menu-close-button-vertical-padding: var(--luzmo-spacing-3);--slot-menu-close-button-horizontal-padding: var(--luzmo-spacing-3)}";var K=Object.defineProperty,o=(u,t,l,i)=>{for(var a=void 0,s=u.length-1,r;s>=0;s--)(r=u[s])&&(a=r(t,l,a)||a);return a&&K(t,l,a),a};class e extends U.SignalWatcher($.SizedMixin(R.LuzmoElement,{validSizes:Object.values($.ElementSizes)})){constructor(){super(...arguments),this.language="en",this.contentLanguage="en",this.slotType="numeric",this.variant="draggable",this._periodOverPeriodUiType=null,this.measureColumns=[],this.apiUrl="https://api.luzmo.com",this.authKey="",this.authToken="",this._slotContents=[],this._activeIndex=this.slotIndex??0,this._linkedDatasetsIds=[]}static get styles(){return[c.unsafeCSS(j)]}get _currentSlotContent(){return this._slotContents[this.slotIndex??this._activeIndex]??{}}get _currentLabel(){return M.localize(this._currentSlotContent.label,this.contentLanguage)??"Untitled"}connectedCallback(){const t={};this.apiUrl&&(t.apiUrl=this.apiUrl),this.authKey&&this.authToken&&(t.authKey=this.authKey,t.authToken=this.authToken),v.dataBroker.configure(t),super.connectedCallback(),this._attachDragHandle()}disconnectedCallback(){super.disconnectedCallback(),this._cleanupDrag&&(this._cleanupDrag(),this._cleanupDrag=void 0)}_attachDragHandle(){if(this._cleanupDrag||this.variant!=="draggable"||this.noDrag)return;const t=this.renderRoot.querySelector(".drag-handle");if(!t)return;const l=this.dragBoundary?document.querySelector(this.dragBoundary):document.documentElement;this._cleanupDrag=N({element:this,handle:t,boundary:l})}_sendChangeEvent(){this.dispatchEvent(new CustomEvent("slot-contents-changed",{bubbles:!0,composed:!0,cancelable:!0,detail:{slotContents:[...this._slotContents],linkedDatasetsIds:[...this._linkedDatasetsIds]}}))}_sendCloseEvent(){this.dispatchEvent(new CustomEvent("close",{bubbles:!0,composed:!0,cancelable:!0}))}isArrayColumnType(t){return t.startsWith("array[")}async willUpdate(){const t=this.slotContents??this._store?.slotContents.get()??[];if(t!==this._slotContents){this._slotContents=structuredClone(t);const{set:l,column:i}=this._currentSlotContent;if(l&&Y(l)&&l!==this._lastFetchedDatasetId){if(this._lastFetchedDatasetId=l,await v.dataBroker.fetchDatasetsRecursive([l]),!this.isConnected)return;this._linkedDatasetsIds=v.dataBroker.getLinkedDatasetsIds(l)}const a=v.dataBroker.getAvailableDatasets();this.measureColumns=a.map(s=>({datasetId:s.id,datasetName:s.name,columns:s.columns?.filter(r=>r.type==="numeric"&&r.id!==i)})),this._store?.activeIndex.get()!==this._activeIndex&&this._store?.updateActive(this._activeIndex),this.slotName==="measure"&&(this._store?.setPeriodOverPeriodCondition(this.itemType,this._currentSlotContent),this._currentSlotContent.subtype==="duration"&&this.isArrayColumnType(this._currentSlotContent.type)?this._periodOverPeriodUiType=null:(this._periodOverPeriodUiType=this._store?.periodOverPeriodUiType.get(),this._store?.linkedDataset.set(a.filter(r=>r.id===l))))}}updated(){this.displaySettingsElement&&(this.displaySettingsElement.periodOverPeriodUiType=this._periodOverPeriodUiType,this.displaySettingsElement.measureColumns=this.measureColumns,this.displaySettingsElement.showRemoveButton=this.variant==="popup"&&(typeof this.slotIndex=="number"||this._slotContents?.length===1))}_handleSlotListChange(t){this._slotContents=structuredClone(t.detail.slotContents);const l=t.detail.activeIndex;l!==this._activeIndex&&(this._activeIndex=l,this._store?.updateActive(l));const i=this._slotContents[this._activeIndex],a=i?.column??i?.columnId,s=i?.set??i?.datasetId,r=i?.formula;(a||r)&&s&&(this.dispatchEvent(new CustomEvent("slot-menu-active",{bubbles:!0,composed:!0,detail:{datasetId:s}})),setTimeout(()=>{this.dispatchEvent(new CustomEvent("slot-menu-highlight",{bubbles:!0,composed:!0,detail:{datasetId:s,level:i?.level??0,...a&&{columnId:a},...r&&{formulaId:r}}}))})),this._slotContents.length<=1&&this.requestUpdate(),this._store?.setContents(this._slotContents,this.slotName),this._sendChangeEvent()}_handleSlotContentChange(t){this._slotContents[this.slotIndex??this._activeIndex]=structuredClone(t.detail.slotContent),this.slotMenuListElement&&(this.slotMenuListElement.slotContents=this._slotContents),this._store?.updateContent(t.detail.slotContent,this.slotIndex??this._activeIndex),this._sendChangeEvent()}removeSlotContent(t){this._slotContents=this._slotContents.filter((l,i)=>i!==t),this._store?.setContents(this._slotContents,this.slotName),this._slotContents.length===0&&this.dispatchEvent(new CustomEvent("slot-menu-inactive",{bubbles:!0,composed:!0})),this._sendChangeEvent(),this._sendCloseEvent(),this.requestUpdate()}close(){this._sendCloseEvent()}_removeActiveSlotContent(){this.removeSlotContent(this.slotIndex??this._activeIndex)}render(){const t=`${this.slotType}-${this._currentSlotContent?.type??""}`;return c.html`<div class="slot-menu-top-menu">
|
|
21
|
+
${this.variant==="draggable"?c.html`<div class="drag-handle">${h.luzmoIcon(h.luzmoArrows)}</div>`:""}
|
|
22
|
+
${this._slotContents&&this._slotContents.length===1&&this.variant!=="popup"?c.html` <div class="slot-content-action">
|
|
23
23
|
<div class="slot-content-label">${this._currentLabel}</div>
|
|
24
24
|
<div
|
|
25
25
|
class="slot-content-remove"
|
|
@@ -32,17 +32,17 @@
|
|
|
32
32
|
<div
|
|
33
33
|
class="slot-contents-container ${this._slotContents?.length>1?"multiple":""}"
|
|
34
34
|
>
|
|
35
|
-
${this.variant==="popup"?"":
|
|
35
|
+
${this.variant==="popup"?"":c.html`<div class="close" @click=${this.close}>
|
|
36
36
|
${h.luzmoIcon(h.luzmoClose12)}
|
|
37
37
|
</div>`}
|
|
38
38
|
<div class="inner-container">
|
|
39
|
-
${this._slotContents?.length>1&&typeof this.slotIndex!="number"?
|
|
39
|
+
${this._slotContents?.length>1&&typeof this.slotIndex!="number"?c.html`<luzmo-slot-menu-list
|
|
40
40
|
.slotContents=${this._slotContents}
|
|
41
41
|
.contentLanguage=${this.contentLanguage}
|
|
42
42
|
.activeIndex=${this.slotIndex??this._activeIndex}
|
|
43
43
|
@slot-list-changed=${this._handleSlotListChange}
|
|
44
44
|
></luzmo-slot-menu-list>`:""}
|
|
45
|
-
${A.guard([this.variant,this.language,this.contentLanguage,this._periodOverPeriodUiType,t],()=>
|
|
45
|
+
${A.guard([this.variant,this.language,this.contentLanguage,this._periodOverPeriodUiType,t],()=>c.html`<luzmo-display-settings
|
|
46
46
|
.size=${this.size}
|
|
47
47
|
.language=${this.language}
|
|
48
48
|
.contentLanguage=${this.contentLanguage}
|
|
@@ -23,7 +23,7 @@ import { s as A } from "../index-CqKpf0B8.js";
|
|
|
23
23
|
import { SignalWatcher as M } from "@lit-labs/signals";
|
|
24
24
|
import { consume as R } from "@lit/context";
|
|
25
25
|
import { luzmoIcon as _, luzmoArrows as X, luzmoTrashOutline as q, luzmoClose12 as N } from "@luzmo/icons";
|
|
26
|
-
import { d as g } from "../index-
|
|
26
|
+
import { d as g } from "../index-BikhVAa1.js";
|
|
27
27
|
import { l as Y } from "../localize-CcDpq940.js";
|
|
28
28
|
import { property as n, state as k, query as T } from "lit/decorators.js";
|
|
29
29
|
import { guard as H } from "lit/directives/guard.js";
|
|
@@ -32,8 +32,8 @@ import { S as K, E as F } from "../sized-mixin-cJbo3PKR.js";
|
|
|
32
32
|
import "../slot-menu-list/index.js";
|
|
33
33
|
(function() {
|
|
34
34
|
if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
|
|
35
|
-
const
|
|
36
|
-
|
|
35
|
+
const t = document.createElement("style");
|
|
36
|
+
t.setAttribute("data-luzmo-vars", ""), t.textContent = 'html{--luzmo-animation-duration: 0.15s;--luzmo-border-color: rgba(var(--luzmo-border-color-rgb), 0.1);--luzmo-border-color-hover: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-down: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-border-color-focus: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-rgb: 0, 0, 0;--luzmo-border-color-full: rgb(180, 180, 180);--luzmo-border-color-full-hover: rgb(140, 140, 140);--luzmo-border-color-full-down: rgb(110, 110, 110);--luzmo-border-color-full-focus: rgb(140, 140, 140);--luzmo-border-color-disabled: #dddddd;--luzmo-border-radius: 6px;--luzmo-border-radius-s: 4px;--luzmo-border-radius-l: 8px;--luzmo-border-radius-xl: 12px;--luzmo-border-radius-full: 999rem;--luzmo-background-color: #ffffff;--luzmo-background-color-rgb: 255, 255, 255;--luzmo-background-color-disabled: #eeeeee;--luzmo-background-color-hover: #f0f0fc;--luzmo-background-color-down: #f1f1ff;--luzmo-background-color-focus: #f0f0fc;--luzmo-background-color-highlight: rgb(240, 240, 240);--luzmo-background-color-highlight-disabled: rgb(245, 245, 245);--luzmo-background-color-highlight-hover: rgb(225, 225, 225);--luzmo-background-color-highlight-down: rgb(215, 215, 215);--luzmo-background-color-highlight-focus: rgb(225, 225, 225);--luzmo-background-color-alt-1: rgb(250, 250, 250);--luzmo-background-color-alt-2: rgb(239, 239, 239);--luzmo-border-width: 1px;--luzmo-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif;--luzmo-font-size-xs: 10px;--luzmo-font-size-s: 12px;--luzmo-font-size-m: 14px;--luzmo-font-size: 14px;--luzmo-font-size-l: 16px;--luzmo-font-size-xl: 18px;--luzmo-font-size-xxl: 20px;--luzmo-font-style: normal;--luzmo-line-height: normal;--luzmo-font-weight: 400;--luzmo-font-weight-semibold: 500;--luzmo-font-weight-bold: 600;--luzmo-font-color: #333;--luzmo-font-color-hard: #000;--luzmo-font-color-disabled: var(--luzmo-color-disabled);--luzmo-font-color-extra-dimmed: #888;--luzmo-font-color-hover: #333;--luzmo-font-color-down: #111;--luzmo-font-color-focus: #333;--luzmo-primary: #4434ff;--luzmo-primary-hover: #4234e4;--luzmo-primary-down: #392cc7;--luzmo-primary-focus: #4234e4;--luzmo-primary-inverse-color: #ffffff;--luzmo-primary-rgb: 68, 52, 255;--luzmo-secondary: #ff00ff;--luzmo-secondary-hover: #e309e3;--luzmo-secondary-down: #c711c7;--luzmo-secondary-focus: #e309e3;--luzmo-secondary-inverse-color: #ffffff;--luzmo-secondary-rgb: 255, 0, 255;--luzmo-secondary-outline: rgba(255, 0, 255, 0.2);--luzmo-negative-color: #ca221c;--luzmo-negative-color-hover: #b3241f;--luzmo-negative-color-down: #9f231f;--luzmo-negative-color-focus: #b3241f;--luzmo-negative-color-rgb: 202, 34, 28;--luzmo-positive-color: rgb(20, 150, 101);--luzmo-positive-color-hover: rgb(17, 128, 86);--luzmo-positive-color-down: rgb(16, 105, 71);--luzmo-positive-color-focus: rgb(17, 128, 86);--luzmo-positive-color-rgb: 20, 150, 101;--luzmo-selected-color: rgb(110, 110, 110);--luzmo-selected-color-hover: rgb(70, 70, 70);--luzmo-selected-color-down: rgb(40, 40, 40);--luzmo-selected-color-focus: rgb(70, 70, 70);--luzmo-selected-color-hard: #1e1e1e;--luzmo-selected-color-hard-hover: rgb(0, 0, 0);--luzmo-selected-color-hard-down: rgb(0, 0, 0);--luzmo-selected-color-hard-focus: rgb(0, 0, 0);--luzmo-color-informative: #1a77e9;--luzmo-color-informative-rgb: 26, 119, 233;--luzmo-color-disabled: #aaaaaa;--luzmo-spacing-1: 2px;--luzmo-spacing-2: 4px;--luzmo-spacing-3: 8px;--luzmo-spacing-4: 12px;--luzmo-spacing-5: 16px;--luzmo-indicator-gap: 2px;--luzmo-indicator-width: 1px;--luzmo-indicator-color: var(--luzmo-primary);--luzmo-component-height-xxs: 20px;--luzmo-component-height-xs: 24px;--luzmo-component-height-s: 28px;--luzmo-component-height: 32px;--luzmo-component-height-l: 40px;--luzmo-component-height-xl: 48px;--luzmo-component-height-xxl: 64px;--luzmo-icon-size-xxs: 12px;--luzmo-icon-size-xs: 14px;--luzmo-icon-size-s: 16px;--luzmo-icon-size-m: 18px;--luzmo-icon-size-l: 20px;--luzmo-icon-size-xl: 22px;--luzmo-icon-size-xxl: 32px}', document.head.appendChild(t);
|
|
37
37
|
}
|
|
38
38
|
})();
|
|
39
39
|
const W = /^(?:[0-9a-f]{8}-[0-9a-f]{4}-[1-8][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}|00000000-0000-0000-0000-000000000000|ffffffff-ffff-ffff-ffff-ffffffffffff)$/i;
|
|
@@ -42,57 +42,57 @@ function j(i) {
|
|
|
42
42
|
}
|
|
43
43
|
function V({
|
|
44
44
|
element: i,
|
|
45
|
-
handle:
|
|
45
|
+
handle: t,
|
|
46
46
|
boundary: r = document.documentElement,
|
|
47
47
|
onDragStart: u,
|
|
48
48
|
onDragEnd: a
|
|
49
49
|
}) {
|
|
50
|
-
if (!i || !
|
|
50
|
+
if (!i || !t)
|
|
51
51
|
throw new Error("makeDraggable: element and handle are required");
|
|
52
52
|
const l = i.ownerDocument ?? document;
|
|
53
53
|
let s = -1, S = 0, E = 0, v = 0, z = 0, I = 0, D = 0, b = 0, f = 0;
|
|
54
|
-
const y = (
|
|
55
|
-
if (
|
|
56
|
-
const c =
|
|
54
|
+
const y = (d) => {
|
|
55
|
+
if (d.pointerId !== s) return;
|
|
56
|
+
const c = d.clientX - S, h = d.clientY - E, m = (r ?? document.documentElement).getBoundingClientRect();
|
|
57
57
|
let w = v + c, C = z + h;
|
|
58
58
|
w = Math.min(
|
|
59
|
-
Math.max(w,
|
|
60
|
-
|
|
59
|
+
Math.max(w, m.left),
|
|
60
|
+
m.right - I
|
|
61
61
|
), C = Math.min(
|
|
62
|
-
Math.max(C,
|
|
63
|
-
|
|
62
|
+
Math.max(C, m.top),
|
|
63
|
+
m.bottom - D
|
|
64
64
|
);
|
|
65
65
|
const L = w - v, U = C - z, B = b + L, O = f + U;
|
|
66
66
|
i.style.transform = `translate3d(${B}px, ${O}px, 0)`;
|
|
67
|
-
}, x = (
|
|
68
|
-
|
|
69
|
-
}, $ = (
|
|
70
|
-
if (
|
|
71
|
-
s =
|
|
67
|
+
}, x = (d) => {
|
|
68
|
+
d.pointerId === s && (l.removeEventListener("pointermove", y), l.removeEventListener("pointerup", x), s = -1, a?.());
|
|
69
|
+
}, $ = (d) => {
|
|
70
|
+
if (d.button !== 0) return;
|
|
71
|
+
s = d.pointerId;
|
|
72
72
|
const c = i.getBoundingClientRect();
|
|
73
|
-
v = c.left, z = c.top, I = c.width, D = c.height, S =
|
|
73
|
+
v = c.left, z = c.top, I = c.width, D = c.height, S = d.clientX, E = d.clientY;
|
|
74
74
|
try {
|
|
75
75
|
const h = l.defaultView?.getComputedStyle(i);
|
|
76
76
|
if (h) {
|
|
77
|
-
const
|
|
78
|
-
b =
|
|
77
|
+
const m = new DOMMatrixReadOnly(h.transform);
|
|
78
|
+
b = m.m41, f = m.m42;
|
|
79
79
|
}
|
|
80
80
|
} catch {
|
|
81
81
|
b = 0, f = 0;
|
|
82
82
|
}
|
|
83
|
-
|
|
83
|
+
t.setPointerCapture(s), l.addEventListener("pointermove", y), l.addEventListener("pointerup", x), u?.();
|
|
84
84
|
};
|
|
85
|
-
return
|
|
86
|
-
|
|
85
|
+
return t.addEventListener("pointerdown", $), () => {
|
|
86
|
+
t.removeEventListener("pointerdown", $), l.removeEventListener("pointermove", y), l.removeEventListener("pointerup", x);
|
|
87
87
|
};
|
|
88
88
|
}
|
|
89
|
-
const J = ":host{font-family:var(--luzmo-slot-menu-font-family, var(--luzmo-font-family));font-size:var(--luzmo-slot-menu-font-size, var(--slot-menu-font-size));color:var(--luzmo-slot-menu-font-color, var(--luzmo-font-color));display:block;width:fit-content}luzmo-slot-menu-list{min-width:var(--luzmo-slot-menu-list-min-width, var(--slot-menu-list-min-width));max-width:var(--luzmo-slot-menu-list-max-width, var(--slot-menu-list-max-width));background-color:var(--luzmo-slot-menu-list-background-color, var(--slot-menu-list-background-color));border-bottom-left-radius:var(--luzmo-slot-menu-list-border-radius, var(--slot-menu-list-border-radius))}.slot-contents-container{position:relative;border:var(--luzmo-slot-menu-border-width, var(--luzmo-border-width)) solid var(--luzmo-slot-menu-border-color, var(--luzmo-border-color));border-radius:var(--luzmo-slot-menu-border-radius, var(--luzmo-border-radius));background:var(--luzmo-slot-menu-background-color, var(--luzmo-background-color))
|
|
90
|
-
var Q = Object.defineProperty, e = (i,
|
|
89
|
+
const J = ":host{font-family:var(--luzmo-slot-menu-font-family, var(--luzmo-font-family));font-size:var(--luzmo-slot-menu-font-size, var(--slot-menu-font-size));color:var(--luzmo-slot-menu-font-color, var(--luzmo-font-color));display:block;width:fit-content}luzmo-slot-menu-list{min-width:var(--luzmo-slot-menu-list-min-width, var(--slot-menu-list-min-width));max-width:var(--luzmo-slot-menu-list-max-width, var(--slot-menu-list-max-width));background-color:var(--luzmo-slot-menu-list-background-color, var(--slot-menu-list-background-color));border-bottom-left-radius:var(--luzmo-slot-menu-list-border-radius, var(--slot-menu-list-border-radius))}.slot-contents-container{position:relative;border:var(--luzmo-slot-menu-border-width, var(--luzmo-border-width)) solid var(--luzmo-slot-menu-border-color, var(--luzmo-border-color));border-radius:var(--luzmo-slot-menu-border-radius, var(--luzmo-border-radius));background:var(--luzmo-slot-menu-background-color, var(--luzmo-background-color));--slot-menu-popup-filter: drop-shadow( var( --luzmo-slot-menu-popup-shadow-horizontal, var(--slot-menu-popup-shadow-horizontal) ) var( --luzmo-slot-menu-popup-shadow-vertical, var(--slot-menu-popup-shadow-vertical) ) var( --luzmo-slot-menu-popup-shadow-blur, var(--slot-menu-popup-shadow-blur) ) var( --luzmo-slot-menu-popup-shadow-color, var(--slot-menu-popup-shadow-color) ) );filter:var(--luzmo-slot-menu-popup-filter, var(--slot-menu-popup-filter));border-top-left-radius:0}.slot-contents-container .inner-container{display:flex}.slot-contents-container .inner-container luzmo-display-settings{min-width:var(--luzmo-slot-menu-display-settings-min-width, var(--slot-menu-display-settings-min-width));padding:var(--luzmo-slot-menu-display-settings-vertical-padding, var(--slot-menu-display-settings-vertical-padding)) var(--luzmo-slot-menu-display-settings-horizontal-padding, var(--slot-menu-display-settings-horizontal-padding))}:host([variant=popup]) .slot-contents-container{overflow:hidden;border-top-left-radius:var(--luzmo-slot-menu-border-radius, var(--luzmo-border-radius))}.slot-menu-top-menu{display:flex;align-items:center;border-radius:var(--luzmo-slot-menu-border-radius, var(--luzmo-border-radius));border-bottom-left-radius:0;border-bottom-right-radius:0;overflow:hidden;width:fit-content}.drag-handle{background-color:var(--luzmo-slot-menu-drag-handle-background-color, var(--luzmo-background-color-highlight));cursor:move;width:fit-content;border:var(--luzmo-slot-menu-drag-handle-border-width, var(--slot-menu-drag-handle-border-width)) solid var(--luzmo-slot-menu-border-color, var(--luzmo-background-color-highlight));font-size:var(--luzmo-slot-menu-drag-handle-size, var(--slot-menu-drag-handle-size));padding:var(--luzmo-slot-menu-drag-handle-vertical-padding, var(--slot-menu-drag-handle-vertical-padding)) var(--luzmo-slot-menu-drag-handle-horizontal-padding, var(--slot-menu-drag-handle-horizontal-padding))}.drag-handle:hover{background-color:var(--luzmo-slot-menu-drag-handle-background-color-hover, var(--luzmo-background-color-highlight-hover))}.slot-content-action{display:flex;flex:0 1 auto;max-width:var(--luzmo-slot-menu-top-menu-label-max-width, var(--slot-menu-top-menu-label-max-width));gap:var(--luzmo-slot-menu-label-to-icon-gap, var(--slot-menu-label-to-icon-gap));background-color:var(--luzmo-slot-menu-content-label-background-color, var(--luzmo-primary));color:var(--luzmo-slot-menu-content-label-color, var(--luzmo-primary-inverse-color));border:var(--luzmo-slot-menu-border-width, var(--luzmo-border-width)) solid var(--luzmo-slot-menu-content-label-border-color, var(--luzmo-primary));padding:var(--luzmo-slot-menu-drag-handle-vertical-padding, var(--slot-menu-drag-handle-vertical-padding)) var(--luzmo-slot-menu-drag-handle-horizontal-padding, var(--slot-menu-drag-handle-horizontal-padding))}.slot-content-action:hover{background-color:var(--luzmo-slot-menu-content-label-background-color-hover, var(--luzmo-primary-hover))}.slot-content-action:focus{background-color:var(--luzmo-slot-menu-content-label-background-color-focus, var(--luzmo-primary-focus))}.slot-content-action .slot-content-label{flex:1 1 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.slot-content-action .slot-content-remove{flex:0 0 auto;cursor:pointer}.close{position:absolute;right:var(--luzmo-slot-menu-close-icon-right, var(--slot-menu-close-icon-right));cursor:pointer;top:calc(-2 * var(--luzmo-slot-menu-border-width, var(--luzmo-border-width)));background-color:var(--luzmo-slot-menu-close-button-background-color, var(--luzmo-background-color-highlight));font-size:var(--luzmo-slot-menu-close-button-size, var(--slot-menu-close-button-size));border:var(--luzmo-slot-menu-border-width, var(--luzmo-border-width)) solid var(--luzmo-slot-menu-border-color, var(--luzmo-border-color));border-radius:var(--luzmo-slot-menu-border-radius, var(--luzmo-border-radius));border-top-left-radius:0;border-top-right-radius:0;padding:var(--luzmo-slot-menu-close-button-vertical-padding, var(--slot-menu-close-button-vertical-padding)) var(--luzmo-slot-menu-close-button-horizontal-padding, var(--slot-menu-close-button-horizontal-padding))}.close:hover{background-color:var(--luzmo-slot-menu-close-button-background-color-hover, var(--luzmo-background-color-highlight-hover))}:host{--slot-menu-display-settings-min-width: 19rem;--slot-menu-min-height: calc(var(--luzmo-component-height) * 2);--slot-menu-font-size: var(--luzmo-font-size);--slot-menu-display-settings-horizontal-padding: var(--luzmo-spacing-5);--slot-menu-display-settings-vertical-padding: var(--luzmo-spacing-4);--slot-menu-top-menu-label-max-width: 12rem;--slot-menu-list-min-width: 8rem;--slot-menu-list-max-width: 12rem;--slot-menu-label-to-icon-gap: var(--luzmo-spacing-3);--slot-menu-drag-handle-size: var(--luzmo-font-size);--slot-menu-drag-handle-vertical-padding: var(--luzmo-spacing-2);--slot-menu-drag-handle-horizontal-padding: var(--luzmo-spacing-3);--slot-menu-drag-handle-border-width: var(--luzmo-border-width) --slot-menu-close-button-size: var(--luzmo-font-size-s);--slot-menu-close-button-vertical-padding: var(--luzmo-spacing-2);--slot-menu-close-button-horizontal-padding: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--slot-menu-popup-shadow-horizontal: 0;--slot-menu-popup-shadow-vertical: 1px;--slot-menu-popup-shadow-blur: 4px;--slot-menu-popup-shadow-color: var(--luzmo-border-color);--slot-menu-popup-box-shadow: var(--slot-menu-popup-shadow-horizontal) var(--slot-menu-popup-shadow-vertical) var(--slot-menu-popup-shadow-blur) var(--slot-menu-popup-shadow-color);--slot-menu-close-icon-right: 1rem;--slot-menu-list-border-radius: var(--luzmo-border-radius)}:host([size=s]){--slot-menu-display-settings-min-width: 16rem;--slot-menu-min-height: calc(var(--luzmo-component-height-s) * 2);--slot-menu-font-size: var(--luzmo-font-size-s);--slot-menu-display-settings-horizontal-padding: var(--luzmo-spacing-4);--slot-menu-display-settings-vertical-padding: var(--luzmo-spacing-3);--slot-menu-top-menu-label-max-width: 10rem;--slot-menu-list-min-width: 6rem;--slot-menu-list-max-width: 10rem;--slot-menu-label-to-icon-gap: var(--luzmo-spacing-2);--slot-menu-drag-handle-size: var(--luzmo-font-size-s);--slot-menu-drag-handle-vertical-padding: var(--luzmo-spacing-2);--slot-menu-drag-handle-horizontal-padding: var(--luzmo-spacing-3);--slot-menu-close-button-size: var(--luzmo-font-size-xs);--slot-menu-close-button-vertical-padding: var(--luzmo-spacing-2);--slot-menu-close-button-horizontal-padding: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) )}:host([size=l]){--slot-menu-display-settings-min-width: 23rem;--slot-menu-min-height: calc(var(--luzmo-component-height-l) * 2);--slot-menu-font-size: var(--luzmo-font-size-l);--slot-menu-display-settings-horizontal-padding: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-1) );--slot-menu-display-settings-vertical-padding: var(--luzmo-spacing-5);--slot-menu-top-menu-label-max-width: 14rem;--slot-menu-list-min-width: 9rem;--slot-menu-list-max-width: 14rem;--slot-menu-label-to-icon-gap: var(--luzmo-spacing-4);--slot-menu-drag-handle-size: var(--luzmo-font-size-l);--slot-menu-drag-handle-vertical-padding: var(--luzmo-spacing-3);--slot-menu-drag-handle-horizontal-padding: var(--luzmo-spacing-3);--slot-menu-close-button-size: var(--luzmo-font-size);--slot-menu-close-button-vertical-padding: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--slot-menu-close-button-horizontal-padding: var(--luzmo-spacing-3)}:host([size=xl]){--slot-menu-display-settings-min-width: 26rem;--slot-menu-min-height: calc(var(--luzmo-component-height-xl) * 2);--slot-menu-font-size: var(--luzmo-font-size-xl);--slot-menu-display-settings-horizontal-padding: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-2) );--slot-menu-display-settings-vertical-padding: var(--luzmo-spacing-5);--slot-menu-top-menu-label-max-width: 16rem;--slot-menu-list-min-width: 10rem;--slot-menu-list-max-width: 16rem;--slot-menu-label-to-icon-gap: var(--luzmo-spacing-5);--slot-menu-drag-handle-size: var(--luzmo-font-size-xl);--slot-menu-drag-handle-vertical-padding: var(--luzmo-spacing-3);--slot-menu-drag-handle-horizontal-padding: var(--luzmo-spacing-4);--slot-menu-close-button-size: var(--luzmo-font-size-l);--slot-menu-close-button-vertical-padding: var(--luzmo-spacing-3);--slot-menu-close-button-horizontal-padding: var(--luzmo-spacing-3)}";
|
|
90
|
+
var Q = Object.defineProperty, e = (i, t, r, u) => {
|
|
91
91
|
for (var a = void 0, l = i.length - 1, s; l >= 0; l--)
|
|
92
|
-
(s = i[l]) && (a = s(
|
|
93
|
-
return a && Q(
|
|
92
|
+
(s = i[l]) && (a = s(t, r, a) || a);
|
|
93
|
+
return a && Q(t, r, a), a;
|
|
94
94
|
};
|
|
95
|
-
class
|
|
95
|
+
class o extends M(
|
|
96
96
|
K(G, {
|
|
97
97
|
validSizes: Object.values(F)
|
|
98
98
|
})
|
|
@@ -113,8 +113,8 @@ class t extends M(
|
|
|
113
113
|
) ?? "Untitled";
|
|
114
114
|
}
|
|
115
115
|
connectedCallback() {
|
|
116
|
-
const
|
|
117
|
-
this.apiUrl && (
|
|
116
|
+
const t = {};
|
|
117
|
+
this.apiUrl && (t.apiUrl = this.apiUrl), this.authKey && this.authToken && (t.authKey = this.authKey, t.authToken = this.authToken), g.configure(t), super.connectedCallback(), this._attachDragHandle();
|
|
118
118
|
}
|
|
119
119
|
disconnectedCallback() {
|
|
120
120
|
super.disconnectedCallback(), this._cleanupDrag && (this._cleanupDrag(), this._cleanupDrag = void 0);
|
|
@@ -125,12 +125,12 @@ class t extends M(
|
|
|
125
125
|
_attachDragHandle() {
|
|
126
126
|
if (this._cleanupDrag || this.variant !== "draggable" || this.noDrag)
|
|
127
127
|
return;
|
|
128
|
-
const
|
|
129
|
-
if (!
|
|
128
|
+
const t = this.renderRoot.querySelector(".drag-handle");
|
|
129
|
+
if (!t) return;
|
|
130
130
|
const r = this.dragBoundary ? document.querySelector(this.dragBoundary) : document.documentElement;
|
|
131
131
|
this._cleanupDrag = V({
|
|
132
132
|
element: this,
|
|
133
|
-
handle:
|
|
133
|
+
handle: t,
|
|
134
134
|
boundary: r
|
|
135
135
|
});
|
|
136
136
|
}
|
|
@@ -156,13 +156,13 @@ class t extends M(
|
|
|
156
156
|
})
|
|
157
157
|
);
|
|
158
158
|
}
|
|
159
|
-
isArrayColumnType(
|
|
160
|
-
return
|
|
159
|
+
isArrayColumnType(t) {
|
|
160
|
+
return t.startsWith("array[");
|
|
161
161
|
}
|
|
162
162
|
async willUpdate() {
|
|
163
|
-
const
|
|
164
|
-
if (
|
|
165
|
-
this._slotContents = structuredClone(
|
|
163
|
+
const t = this.slotContents ?? this._store?.slotContents.get() ?? [];
|
|
164
|
+
if (t !== this._slotContents) {
|
|
165
|
+
this._slotContents = structuredClone(t);
|
|
166
166
|
const { set: r, column: u } = this._currentSlotContent;
|
|
167
167
|
if (r && j(r) && r !== this._lastFetchedDatasetId) {
|
|
168
168
|
if (this._lastFetchedDatasetId = r, await g.fetchDatasetsRecursive([r]), !this.isConnected)
|
|
@@ -187,9 +187,9 @@ class t extends M(
|
|
|
187
187
|
updated() {
|
|
188
188
|
this.displaySettingsElement && (this.displaySettingsElement.periodOverPeriodUiType = this._periodOverPeriodUiType, this.displaySettingsElement.measureColumns = this.measureColumns, this.displaySettingsElement.showRemoveButton = this.variant === "popup" && (typeof this.slotIndex == "number" || this._slotContents?.length === 1));
|
|
189
189
|
}
|
|
190
|
-
_handleSlotListChange(
|
|
191
|
-
this._slotContents = structuredClone(
|
|
192
|
-
const r =
|
|
190
|
+
_handleSlotListChange(t) {
|
|
191
|
+
this._slotContents = structuredClone(t.detail.slotContents);
|
|
192
|
+
const r = t.detail.activeIndex;
|
|
193
193
|
r !== this._activeIndex && (this._activeIndex = r, this._store?.updateActive(r));
|
|
194
194
|
const u = this._slotContents[this._activeIndex], a = u?.column ?? u?.columnId, l = u?.set ?? u?.datasetId, s = u?.formula;
|
|
195
195
|
(a || s) && l && (this.dispatchEvent(
|
|
@@ -215,18 +215,18 @@ class t extends M(
|
|
|
215
215
|
);
|
|
216
216
|
})), this._slotContents.length <= 1 && this.requestUpdate(), this._store?.setContents(this._slotContents, this.slotName), this._sendChangeEvent();
|
|
217
217
|
}
|
|
218
|
-
_handleSlotContentChange(
|
|
218
|
+
_handleSlotContentChange(t) {
|
|
219
219
|
this._slotContents[this.slotIndex ?? this._activeIndex] = structuredClone(
|
|
220
|
-
|
|
220
|
+
t.detail.slotContent
|
|
221
221
|
), this.slotMenuListElement && (this.slotMenuListElement.slotContents = this._slotContents), this._store?.updateContent(
|
|
222
|
-
|
|
222
|
+
t.detail.slotContent,
|
|
223
223
|
this.slotIndex ?? this._activeIndex
|
|
224
224
|
), this._sendChangeEvent();
|
|
225
225
|
}
|
|
226
226
|
// Removed updateContentLabel method (label updates are handled inline)
|
|
227
|
-
removeSlotContent(
|
|
227
|
+
removeSlotContent(t) {
|
|
228
228
|
this._slotContents = this._slotContents.filter(
|
|
229
|
-
(r, u) => u !==
|
|
229
|
+
(r, u) => u !== t
|
|
230
230
|
), this._store?.setContents(this._slotContents, this.slotName), this._slotContents.length === 0 && this.dispatchEvent(
|
|
231
231
|
new CustomEvent("slot-menu-inactive", {
|
|
232
232
|
bubbles: !0,
|
|
@@ -241,7 +241,7 @@ class t extends M(
|
|
|
241
241
|
this.removeSlotContent(this.slotIndex ?? this._activeIndex);
|
|
242
242
|
}
|
|
243
243
|
render() {
|
|
244
|
-
const
|
|
244
|
+
const t = `${this.slotType}-${this._currentSlotContent?.type ?? ""}`;
|
|
245
245
|
return p`<div class="slot-menu-top-menu">
|
|
246
246
|
${this.variant === "draggable" ? p`<div class="drag-handle">${_(X)}</div>` : ""}
|
|
247
247
|
${this._slotContents && this._slotContents.length === 1 && this.variant !== "popup" ? p` <div class="slot-content-action">
|
|
@@ -273,7 +273,7 @@ class t extends M(
|
|
|
273
273
|
this.language,
|
|
274
274
|
this.contentLanguage,
|
|
275
275
|
this._periodOverPeriodUiType,
|
|
276
|
-
|
|
276
|
+
t
|
|
277
277
|
],
|
|
278
278
|
() => p`<luzmo-display-settings
|
|
279
279
|
.size=${this.size}
|
|
@@ -307,83 +307,83 @@ class t extends M(
|
|
|
307
307
|
}
|
|
308
308
|
e([
|
|
309
309
|
n({ type: String, reflect: !0 })
|
|
310
|
-
],
|
|
310
|
+
], o.prototype, "language");
|
|
311
311
|
e([
|
|
312
312
|
n({ type: String, attribute: "content-language", reflect: !0 })
|
|
313
|
-
],
|
|
313
|
+
], o.prototype, "contentLanguage");
|
|
314
314
|
e([
|
|
315
315
|
n({ type: String, attribute: "slot-type", reflect: !0 })
|
|
316
|
-
],
|
|
316
|
+
], o.prototype, "slotType");
|
|
317
317
|
e([
|
|
318
318
|
n({ type: String, attribute: "slot-name", reflect: !0 })
|
|
319
|
-
],
|
|
319
|
+
], o.prototype, "slotName");
|
|
320
320
|
e([
|
|
321
321
|
n({ type: String, attribute: "item-type", reflect: !0 })
|
|
322
|
-
],
|
|
322
|
+
], o.prototype, "itemType");
|
|
323
323
|
e([
|
|
324
324
|
n({ type: Boolean, attribute: "no-drag", reflect: !0 })
|
|
325
|
-
],
|
|
325
|
+
], o.prototype, "noDrag");
|
|
326
326
|
e([
|
|
327
327
|
n({ type: Boolean, attribute: "no-close", reflect: !0 })
|
|
328
|
-
],
|
|
328
|
+
], o.prototype, "noClose");
|
|
329
329
|
e([
|
|
330
330
|
n({ type: String, reflect: !0 })
|
|
331
|
-
],
|
|
331
|
+
], o.prototype, "variant");
|
|
332
332
|
e([
|
|
333
333
|
n({ type: Boolean, attribute: "no-top-menu-label", reflect: !0 })
|
|
334
|
-
],
|
|
334
|
+
], o.prototype, "noTopMenuLabel");
|
|
335
335
|
e([
|
|
336
336
|
R({ context: A, subscribe: !0 })
|
|
337
|
-
],
|
|
337
|
+
], o.prototype, "_store");
|
|
338
338
|
e([
|
|
339
339
|
n({ type: String, attribute: "drag-boundary", reflect: !1 })
|
|
340
|
-
],
|
|
340
|
+
], o.prototype, "dragBoundary");
|
|
341
341
|
e([
|
|
342
342
|
n({ type: Boolean })
|
|
343
|
-
],
|
|
343
|
+
], o.prototype, "areGrandTotalsEnabled");
|
|
344
344
|
e([
|
|
345
345
|
n({ type: Boolean })
|
|
346
|
-
],
|
|
346
|
+
], o.prototype, "areDatetimeOptionsEnabled");
|
|
347
347
|
e([
|
|
348
348
|
n({ type: Boolean })
|
|
349
|
-
],
|
|
349
|
+
], o.prototype, "isBinningDisabled");
|
|
350
350
|
e([
|
|
351
351
|
n({ type: Boolean })
|
|
352
|
-
],
|
|
352
|
+
], o.prototype, "isAggregationDisabled");
|
|
353
353
|
e([
|
|
354
354
|
n({ type: Boolean })
|
|
355
|
-
],
|
|
355
|
+
], o.prototype, "isCumulativeSumEnabled");
|
|
356
356
|
e([
|
|
357
357
|
n({ type: Array, reflect: !1, attribute: "slot-contents" })
|
|
358
|
-
],
|
|
358
|
+
], o.prototype, "slotContents");
|
|
359
359
|
e([
|
|
360
360
|
k()
|
|
361
|
-
],
|
|
361
|
+
], o.prototype, "_periodOverPeriodUiType");
|
|
362
362
|
e([
|
|
363
363
|
k()
|
|
364
|
-
],
|
|
364
|
+
], o.prototype, "measureColumns");
|
|
365
365
|
e([
|
|
366
366
|
n({ type: Number, reflect: !1, attribute: "slot-index" })
|
|
367
|
-
],
|
|
367
|
+
], o.prototype, "slotIndex");
|
|
368
368
|
e([
|
|
369
369
|
T("luzmo-display-settings")
|
|
370
|
-
],
|
|
370
|
+
], o.prototype, "displaySettingsElement");
|
|
371
371
|
e([
|
|
372
372
|
T("luzmo-slot-menu-list")
|
|
373
|
-
],
|
|
373
|
+
], o.prototype, "slotMenuListElement");
|
|
374
374
|
e([
|
|
375
375
|
n({ type: String, attribute: "api-url", reflect: !0 })
|
|
376
|
-
],
|
|
376
|
+
], o.prototype, "apiUrl");
|
|
377
377
|
e([
|
|
378
378
|
n({ type: String, attribute: "auth-key", reflect: !0 })
|
|
379
|
-
],
|
|
379
|
+
], o.prototype, "authKey");
|
|
380
380
|
e([
|
|
381
381
|
n({ type: String, attribute: "auth-token", reflect: !0 })
|
|
382
|
-
],
|
|
382
|
+
], o.prototype, "authToken");
|
|
383
383
|
e([
|
|
384
384
|
k()
|
|
385
|
-
],
|
|
386
|
-
customElements.get("luzmo-slot-menu") || customElements.define("luzmo-slot-menu",
|
|
385
|
+
], o.prototype, "_slotContents");
|
|
386
|
+
customElements.get("luzmo-slot-menu") || customElements.define("luzmo-slot-menu", o);
|
|
387
387
|
export {
|
|
388
|
-
|
|
388
|
+
o as LuzmoSlotMenu
|
|
389
389
|
};
|
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
18
18
|
* SOFTWARE.
|
|
19
19
|
* */
|
|
20
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const z=require("lit"),g=require("../get-css-variable-Pzks_rOx.cjs"),y=require("@luzmo/icons"),S=require("../localize-C4zNlrwK.cjs"),h=require("lit/decorators.js"),_=require("../focusable-QLh-LlNt.cjs"),x=require("../sized-mixin-DcvJLFeo.cjs");var O={large:700};function I(n){n.animate([{backgroundColor:"var(--ds-background-selected, #E9F2FF)"},{}],{duration:O.large,easing:"cubic-bezier(0.25, 0.1, 0.25, 1.0)",iterations:1})}function E(n,t){var o=Object.keys(n);if(Object.getOwnPropertySymbols){var e=Object.getOwnPropertySymbols(n);t&&(e=e.filter(function(s){return Object.getOwnPropertyDescriptor(n,s).enumerable})),o.push.apply(o,e)}return o}function C(n){for(var t=1;t<arguments.length;t++){var o=arguments[t]!=null?arguments[t]:{};t%2?E(Object(o),!0).forEach(function(e){g._defineProperty(n,e,o[e])}):Object.getOwnPropertyDescriptors?Object.defineProperties(n,Object.getOwnPropertyDescriptors(o)):E(Object(o)).forEach(function(e){Object.defineProperty(n,e,Object.getOwnPropertyDescriptor(o,e))})}return n}var P={top:function(t,o){return Math.abs(o.y-t.top)},right:function(t,o){return Math.abs(t.right-o.x)},bottom:function(t,o){return Math.abs(t.bottom-o.y)},left:function(t,o){return Math.abs(o.x-t.left)}},k=Symbol("closestEdge");function j(n,t){var o,e,s=t.element,m=t.input,l=t.allowedEdges,i={x:m.clientX,y:m.clientY},r=s.getBoundingClientRect(),a=l.map(function(c){return{edge:c,value:P[c](r,i)}}),d=(o=(e=a.sort(function(c,u){return c.value-u.value})[0])===null||e===void 0?void 0:e.edge)!==null&&o!==void 0?o:null;return C(C({},n),{},g._defineProperty({},k,d))}function f(n){var t;return(t=n[k])!==null&&t!==void 0?t:null}const D=':host{font-family:var(--luzmo-slot-menu-list-font-family, var(--luzmo-font-family));font-size:var(--luzmo-slot-menu-list-font-size, var(--slot-menu-list-font-size));color:var(--luzmo-slot-menu-listfont-color, var(--luzmo-font-color))}:host{margin:0;padding:0;list-style:none;max-height:var(--luzmo-slot-menu-list-max-height, var(--slot-menu-list-max-height));overflow-y:auto;border-right:var(--luzmo-slot-menu-list-border-right-width, var(--luzmo-border-width)) solid var(--luzmo-slot-menu-list-border-right-color, var(--luzmo-border-color))}:host li{position:relative;cursor:pointer}:host li:hover{background-color:var(--luzmo-slot-menu-list-background-color-hover, var(--slot-menu-list-background-color-hover))}:host li{border-bottom:var(--luzmo-slot-menu-list-border-bottom-width, var(--slot-menu-list-border-bottom-width)) solid var(--luzmo-slot-menu-list-border-bottom-color, var(--slot-menu-list-border-bottom-color))}:host .active{background-color:var(--luzmo-slot-menu-list-active-background-color, var(--slot-menu-list-active-background-color));color:var(--luzmo-slot-menu-list-active-color, var(--slot-menu-list-active-color))}:host .active:hover{background-color:var(--luzmo-slot-menu-list-active-background-color-hover, var(--slot-menu-list-active-background-color-hover))}.drop-indicator{position:absolute;left:0;right:0;height:var(--luzmo-slot-menu-list-drop-indicator-height, var(--slot-menu-list-drop-indicator-height));background-color:var(--luzmo-slot-menu-list-drop-indicator-color, var(--slot-menu-list-drop-indicator-color))}.drop-indicator:before{content:"";display:block;width:100%;border:var(--luzmo-slot-menu-list-drop-indicator-height, var(--slot-menu-list-drop-indicator-height)) solid var(--luzmo-slot-menu-list-drop-indicator-color, var(--slot-menu-list-drop-indicator-color));border-radius:50%;position:absolute;background:var(--luzmo-slot-menu-list-drop-indicator-background, var(--luzmo-background-color));left:calc(-.5 * (var(--luzmo-slot-menu-list-drop-indicator-circle-size, var(--slot-menu-list-drop-indicator-circle-size)) + var(--luzmo-slot-menu-list-drop-indicator-height, var(--slot-menu-list-drop-indicator-height))));top:calc(-.5 * (var(--luzmo-slot-menu-list-drop-indicator-circle-size, var(--slot-menu-list-drop-indicator-circle-size)) + var(--luzmo-slot-menu-list-drop-indicator-height, var(--slot-menu-list-drop-indicator-height))));height:var(--luzmo-slot-menu-list-drop-indicator-circle-size, var(--slot-menu-list-drop-indicator-circle-size));width:var(--luzmo-slot-menu-list-drop-indicator-circle-size, var(--slot-menu-list-drop-indicator-circle-size))}.drop-indicator[data-edge=top]{top:calc(-.5 * var(--luzmo-slot-menu-list-drop-indicator-height, var(--slot-menu-list-drop-indicator-height)))}.drop-indicator[data-edge=bottom]{bottom:calc(-.5 * var(--luzmo-slot-menu-list-drop-indicator-height, var(--slot-menu-list-drop-indicator-height)))}.draggable-slot-content{display:flex;justify-content:space-between;gap:var(--luzmo-slot-menu-label-to-icon-gap, var(--slot-menu-label-to-icon-gap));align-items:center;touch-action:none}.draggable-slot-content .draggable-slot-content-label,.draggable-slot-content .draggable-slot-content-remove{padding-block-start:var(--luzmo-slot-menu-list-item-vertical-padding, var(--slot-menu-list-item-vertical-padding));padding-block-end:var(--luzmo-slot-menu-list-item-vertical-padding, var(--slot-menu-list-item-vertical-padding))}.draggable-slot-content .draggable-slot-content-label{padding-inline-start:var(--luzmo-slot-menu-list-item-horizontal-padding, var(--slot-menu-list-item-horizontal-padding));flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.draggable-slot-content .draggable-slot-content-remove{padding-inline-end:var(--luzmo-slot-menu-list-item-horizontal-padding, var(--slot-menu-list-item-horizontal-padding));flex:0 0 auto}:host{--slot-menu-list-active-background-color: var(--luzmo-primary);--slot-menu-list-active-background-color-hover: var(--luzmo-primary-hover);--slot-menu-list-active-color: var(--luzmo-primary-inverse-color);--slot-menu-list-background-color-hover: var(--luzmo-background-color-hover);--slot-menu-list-drop-indicator-color: var(--luzmo-font-color-down);--slot-menu-list-drop-indicator-height: 2px;--slot-menu-list-drop-indicator-circle-size: 4px;--slot-menu-list-border-bottom-width: 0px;--slot-menu-list-border-bottom-color: transparent;--slot-menu-list-max-height: calc(var(--luzmo-component-height) * 4)}:host{--slot-menu-display-settings-min-width: 19rem;--slot-menu-min-height: calc(var(--luzmo-component-height) * 2);--slot-menu-font-size: var(--luzmo-font-size);--slot-menu-list-item-horizontal-padding: var(--luzmo-spacing-4);--slot-menu-list-item-vertical-padding: var(--luzmo-spacing-3);--slot-menu-label-to-icon-gap: var(--luzmo-spacing-3)}:host([size=s]){--slot-menu-display-settings-min-width: 16rem;--slot-menu-min-height: calc(var(--luzmo-component-height-s) * 2);--slot-menu-font-size: var(--luzmo-font-size-s);--slot-menu-list-item-horizontal-padding: var(--luzmo-spacing-3);--slot-menu-list-item-vertical-padding: var(--luzmo-spacing-3);--slot-menu-label-to-icon-gap: var(--luzmo-spacing-2)}:host([size=l]){--slot-menu-display-settings-min-width: 23rem;--slot-menu-min-height: calc(var(--luzmo-component-height-l) * 2);--slot-menu-font-size: var(--luzmo-font-size-l);--slot-menu-list-item-horizontal-padding: var(--luzmo-spacing-5);--slot-menu-list-item-vertical-padding: var(--luzmo-spacing-3);--slot-menu-label-to-icon-gap: var(--luzmo-spacing-4)}:host([size=xl]){--slot-menu-display-settings-min-width: 26rem;--slot-menu-min-height: calc(var(--luzmo-component-height-xl) * 2);--slot-menu-font-size: var(--luzmo-font-size-xl);--slot-menu-list-item-horizontal-padding: var(--luzmo-spacing-5);--slot-menu-list-item-vertical-padding: var(--luzmo-spacing-4);--slot-menu-label-to-icon-gap: var(--luzmo-spacing-5)}';var F=Object.defineProperty,b=(n,t,o,e)=>{for(var s=void 0,m=n.length-1,l;m>=0;m--)(l=n[m])&&(s=l(t,o,s)||s);return s&&F(t,o,s),s};class v extends x.SizedMixin(_.LuzmoElement,{validSizes:Object.values(x.ElementSizes)}){constructor(){super(...arguments),this.language="en",this.contentLanguage="en",this.slotContents=[],this.activeIndex=0,this._sendChangeEvent=()=>{this.dispatchEvent(new CustomEvent("slot-list-changed",{bubbles:!0,composed:!0,cancelable:!0,detail:{slotContents:structuredClone(this.slotContents),activeIndex:this.activeIndex}}))},this._cleanupFns=[],this._attachAll=()=>{[...this._draggableSlotContentElements].forEach(t=>{const o=this._sendChangeEvent.bind(this),e=this,s=g.draggable({element:t,onGenerateDragPreview({nativeSetDragImage:l}){g.setCustomNativeDragPreview({nativeSetDragImage:l,render({container:i}){const r=document.createElement("div");r.classList.add("drag-preview");const a={};[["borderColor","--luzmo-slot-menu-list-border-color","--luzmo-border-color"],["backgroundColor","--luzmo-slot-menu-list-background-color","--luzmo-background-color"],["color","--luzmo-slot-menu-list-font-color","--slot-menu-list-font-color"],["fontSize","--luzmo-slot-menu-list-font-size","--slot-menu-list-font-size"],["horizontalPadding","--luzmo-slot-menu-list-item-horizontal-padding","--slot-menu-list-item-horizontal-padding"],["verticalPadding","--luzmo-slot-menu-list-item-vertical-padding","--slot-menu-list-item-vertical-padding"],["borderRadius","--luzmo-slot-menu-list-border-radius","--luzmo-border-radius"],["fontFamily","--luzmo-slot-menu-list-font-family","--luzmo-font-family"]].forEach(([d,c,u])=>{const p=g.getCssVariableValue(t,c)||g.getCssVariableValue(t,u);a[d]=p}),r.textContent=t.querySelector("[data-task-content]")?.textContent??t.textContent,Object.assign(r.style,{border:`1px solid ${a.borderColor}`,backgroundColor:a.backgroundColor,borderRadius:a.borderRadius,fontFamily:a.fontFamily,fontSize:a.fontSize,color:a.color,paddingInline:`${a.horizontalPadding}`,paddingBlock:`${a.verticalPadding}`}),i.append(r)}})},getInitialData(){const l=t.parentElement;let i=0;return l&&(i=[...l.parentElement?.children??[]].indexOf(l)),{index:i}},onDragStart(){t.style.opacity="0.5"},onDrop(){t.style.opacity="1"}});this._cleanupFns.push(s);const m=g.dropTargetForElements({element:t,canDrop({source:l}){return l.element===t?!1:l?.element?.classList.contains("draggable-slot-content")},getData(l){return j({},{element:t,input:l.input,allowedEdges:["top","bottom"]})},getIsSticky(){return!0},onDragEnter({self:l}){const i=f(l.data);if(!i)return;const r=document.createElement("div");r.classList.add("drop-indicator"),r.dataset.edge=i,t.after(r)},onDrag({self:l}){const i=f(l.data);if(!i){t.nextElementSibling?.remove();return}if(t.nextElementSibling?.getAttribute("data-edge")===i)return;t.nextElementSibling?.remove();const r=document.createElement("div");r.classList.add("drop-indicator"),r.dataset.edge=i,t.after(r)},onDragLeave(){t.nextElementSibling?.remove()},onDrop({self:l,source:i}){t.nextElementSibling?.remove();const r=f(l.data),a=l.element.parentElement;if(typeof i.data.index=="number"&&a){let d=[...a.parentElement?.children??[]].indexOf(a);r==="bottom"&&i.data.index>=d&&d<(a?.parentElement?.children?.length??0)-1?d+=1:r==="top"&&d>i.data.index&&(d-=1);const c=e.activeIndex,u=i.data.index,p=d,w=e.slotContents[u];e.slotContents.splice(u,1),e.slotContents.splice(p,0,w),u===c?e.activeIndex=p:u<c&&p>=c?e.activeIndex=c-1:u>c&&p<=c&&(e.activeIndex=c+1)}r&&(I(i.element),e.requestUpdate(),o())}});this._cleanupFns.push(m)})},this._detachAll=()=>{this._cleanupFns.forEach(t=>t()),this._cleanupFns=[]}}static get styles(){return[z.unsafeCSS(D)]}willUpdate(){this._detachAll()}updated(){this._attachAll()}disconnectedCallback(){super.disconnectedCallback(),this._detachAll()}setActiveIndex(t){this.activeIndex=t,this._sendChangeEvent()}removeSlotContent(t){this.slotContents=this.slotContents.filter((o,e)=>e!==t),this.activeIndex=this.slotContents.length===0?0:Math.min(this.activeIndex,this.slotContents.length-1),this._sendChangeEvent()}render(){const t=this.slotContents.map((o,e)=>{const s=S.localize(o.label??{},this.contentLanguage);return z.html`<li class=${e===this.activeIndex?"active":""}>
|
|
20
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const z=require("lit"),g=require("../get-css-variable-C0B_Sxqf.cjs"),y=require("@luzmo/icons"),S=require("../localize-C4zNlrwK.cjs"),h=require("lit/decorators.js"),_=require("../focusable-QLh-LlNt.cjs"),x=require("../sized-mixin-DcvJLFeo.cjs");var O={large:700};function I(n){n.animate([{backgroundColor:"var(--ds-background-selected, #E9F2FF)"},{}],{duration:O.large,easing:"cubic-bezier(0.25, 0.1, 0.25, 1.0)",iterations:1})}function E(n,t){var o=Object.keys(n);if(Object.getOwnPropertySymbols){var e=Object.getOwnPropertySymbols(n);t&&(e=e.filter(function(s){return Object.getOwnPropertyDescriptor(n,s).enumerable})),o.push.apply(o,e)}return o}function C(n){for(var t=1;t<arguments.length;t++){var o=arguments[t]!=null?arguments[t]:{};t%2?E(Object(o),!0).forEach(function(e){g._defineProperty(n,e,o[e])}):Object.getOwnPropertyDescriptors?Object.defineProperties(n,Object.getOwnPropertyDescriptors(o)):E(Object(o)).forEach(function(e){Object.defineProperty(n,e,Object.getOwnPropertyDescriptor(o,e))})}return n}var P={top:function(t,o){return Math.abs(o.y-t.top)},right:function(t,o){return Math.abs(t.right-o.x)},bottom:function(t,o){return Math.abs(t.bottom-o.y)},left:function(t,o){return Math.abs(o.x-t.left)}},k=Symbol("closestEdge");function j(n,t){var o,e,s=t.element,m=t.input,l=t.allowedEdges,i={x:m.clientX,y:m.clientY},r=s.getBoundingClientRect(),a=l.map(function(c){return{edge:c,value:P[c](r,i)}}),d=(o=(e=a.sort(function(c,u){return c.value-u.value})[0])===null||e===void 0?void 0:e.edge)!==null&&o!==void 0?o:null;return C(C({},n),{},g._defineProperty({},k,d))}function f(n){var t;return(t=n[k])!==null&&t!==void 0?t:null}const D=':host{font-family:var(--luzmo-slot-menu-list-font-family, var(--luzmo-font-family));font-size:var(--luzmo-slot-menu-list-font-size, var(--slot-menu-list-font-size));color:var(--luzmo-slot-menu-listfont-color, var(--luzmo-font-color))}:host{margin:0;padding:0;list-style:none;max-height:var(--luzmo-slot-menu-list-max-height, var(--slot-menu-list-max-height));overflow-y:auto;border-right:var(--luzmo-slot-menu-list-border-right-width, var(--luzmo-border-width)) solid var(--luzmo-slot-menu-list-border-right-color, var(--luzmo-border-color))}:host li{position:relative;cursor:pointer}:host li:hover{background-color:var(--luzmo-slot-menu-list-background-color-hover, var(--slot-menu-list-background-color-hover))}:host li{border-bottom:var(--luzmo-slot-menu-list-border-bottom-width, var(--slot-menu-list-border-bottom-width)) solid var(--luzmo-slot-menu-list-border-bottom-color, var(--slot-menu-list-border-bottom-color))}:host .active{background-color:var(--luzmo-slot-menu-list-active-background-color, var(--slot-menu-list-active-background-color));color:var(--luzmo-slot-menu-list-active-color, var(--slot-menu-list-active-color))}:host .active:hover{background-color:var(--luzmo-slot-menu-list-active-background-color-hover, var(--slot-menu-list-active-background-color-hover))}.drop-indicator{position:absolute;left:0;right:0;height:var(--luzmo-slot-menu-list-drop-indicator-height, var(--slot-menu-list-drop-indicator-height));background-color:var(--luzmo-slot-menu-list-drop-indicator-color, var(--slot-menu-list-drop-indicator-color))}.drop-indicator:before{content:"";display:block;width:100%;border:var(--luzmo-slot-menu-list-drop-indicator-height, var(--slot-menu-list-drop-indicator-height)) solid var(--luzmo-slot-menu-list-drop-indicator-color, var(--slot-menu-list-drop-indicator-color));border-radius:50%;position:absolute;background:var(--luzmo-slot-menu-list-drop-indicator-background, var(--luzmo-background-color));left:calc(-.5 * (var(--luzmo-slot-menu-list-drop-indicator-circle-size, var(--slot-menu-list-drop-indicator-circle-size)) + var(--luzmo-slot-menu-list-drop-indicator-height, var(--slot-menu-list-drop-indicator-height))));top:calc(-.5 * (var(--luzmo-slot-menu-list-drop-indicator-circle-size, var(--slot-menu-list-drop-indicator-circle-size)) + var(--luzmo-slot-menu-list-drop-indicator-height, var(--slot-menu-list-drop-indicator-height))));height:var(--luzmo-slot-menu-list-drop-indicator-circle-size, var(--slot-menu-list-drop-indicator-circle-size));width:var(--luzmo-slot-menu-list-drop-indicator-circle-size, var(--slot-menu-list-drop-indicator-circle-size))}.drop-indicator[data-edge=top]{top:calc(-.5 * var(--luzmo-slot-menu-list-drop-indicator-height, var(--slot-menu-list-drop-indicator-height)))}.drop-indicator[data-edge=bottom]{bottom:calc(-.5 * var(--luzmo-slot-menu-list-drop-indicator-height, var(--slot-menu-list-drop-indicator-height)))}.draggable-slot-content{display:flex;justify-content:space-between;gap:var(--luzmo-slot-menu-label-to-icon-gap, var(--slot-menu-label-to-icon-gap));align-items:center;touch-action:none}.draggable-slot-content .draggable-slot-content-label,.draggable-slot-content .draggable-slot-content-remove{padding-block-start:var(--luzmo-slot-menu-list-item-vertical-padding, var(--slot-menu-list-item-vertical-padding));padding-block-end:var(--luzmo-slot-menu-list-item-vertical-padding, var(--slot-menu-list-item-vertical-padding))}.draggable-slot-content .draggable-slot-content-label{padding-inline-start:var(--luzmo-slot-menu-list-item-horizontal-padding, var(--slot-menu-list-item-horizontal-padding));flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.draggable-slot-content .draggable-slot-content-remove{padding-inline-end:var(--luzmo-slot-menu-list-item-horizontal-padding, var(--slot-menu-list-item-horizontal-padding));flex:0 0 auto}:host{--slot-menu-list-active-background-color: var(--luzmo-primary);--slot-menu-list-active-background-color-hover: var(--luzmo-primary-hover);--slot-menu-list-active-color: var(--luzmo-primary-inverse-color);--slot-menu-list-background-color-hover: var(--luzmo-background-color-hover);--slot-menu-list-drop-indicator-color: var(--luzmo-font-color-down);--slot-menu-list-drop-indicator-height: 2px;--slot-menu-list-drop-indicator-circle-size: 4px;--slot-menu-list-border-bottom-width: 0px;--slot-menu-list-border-bottom-color: transparent;--slot-menu-list-max-height: calc(var(--luzmo-component-height) * 4)}:host{--slot-menu-display-settings-min-width: 19rem;--slot-menu-min-height: calc(var(--luzmo-component-height) * 2);--slot-menu-font-size: var(--luzmo-font-size);--slot-menu-list-item-horizontal-padding: var(--luzmo-spacing-4);--slot-menu-list-item-vertical-padding: var(--luzmo-spacing-3);--slot-menu-label-to-icon-gap: var(--luzmo-spacing-3)}:host([size=s]){--slot-menu-display-settings-min-width: 16rem;--slot-menu-min-height: calc(var(--luzmo-component-height-s) * 2);--slot-menu-font-size: var(--luzmo-font-size-s);--slot-menu-list-item-horizontal-padding: var(--luzmo-spacing-3);--slot-menu-list-item-vertical-padding: var(--luzmo-spacing-3);--slot-menu-label-to-icon-gap: var(--luzmo-spacing-2)}:host([size=l]){--slot-menu-display-settings-min-width: 23rem;--slot-menu-min-height: calc(var(--luzmo-component-height-l) * 2);--slot-menu-font-size: var(--luzmo-font-size-l);--slot-menu-list-item-horizontal-padding: var(--luzmo-spacing-5);--slot-menu-list-item-vertical-padding: var(--luzmo-spacing-3);--slot-menu-label-to-icon-gap: var(--luzmo-spacing-4)}:host([size=xl]){--slot-menu-display-settings-min-width: 26rem;--slot-menu-min-height: calc(var(--luzmo-component-height-xl) * 2);--slot-menu-font-size: var(--luzmo-font-size-xl);--slot-menu-list-item-horizontal-padding: var(--luzmo-spacing-5);--slot-menu-list-item-vertical-padding: var(--luzmo-spacing-4);--slot-menu-label-to-icon-gap: var(--luzmo-spacing-5)}';var F=Object.defineProperty,b=(n,t,o,e)=>{for(var s=void 0,m=n.length-1,l;m>=0;m--)(l=n[m])&&(s=l(t,o,s)||s);return s&&F(t,o,s),s};class v extends x.SizedMixin(_.LuzmoElement,{validSizes:Object.values(x.ElementSizes)}){constructor(){super(...arguments),this.language="en",this.contentLanguage="en",this.slotContents=[],this.activeIndex=0,this._sendChangeEvent=()=>{this.dispatchEvent(new CustomEvent("slot-list-changed",{bubbles:!0,composed:!0,cancelable:!0,detail:{slotContents:structuredClone(this.slotContents),activeIndex:this.activeIndex}}))},this._cleanupFns=[],this._attachAll=()=>{[...this._draggableSlotContentElements].forEach(t=>{const o=this._sendChangeEvent.bind(this),e=this,s=g.draggable({element:t,onGenerateDragPreview({nativeSetDragImage:l}){g.setCustomNativeDragPreview({nativeSetDragImage:l,render({container:i}){const r=document.createElement("div");r.classList.add("drag-preview");const a={};[["borderColor","--luzmo-slot-menu-list-border-color","--luzmo-border-color"],["backgroundColor","--luzmo-slot-menu-list-background-color","--luzmo-background-color"],["color","--luzmo-slot-menu-list-font-color","--slot-menu-list-font-color"],["fontSize","--luzmo-slot-menu-list-font-size","--slot-menu-list-font-size"],["horizontalPadding","--luzmo-slot-menu-list-item-horizontal-padding","--slot-menu-list-item-horizontal-padding"],["verticalPadding","--luzmo-slot-menu-list-item-vertical-padding","--slot-menu-list-item-vertical-padding"],["borderRadius","--luzmo-slot-menu-list-border-radius","--luzmo-border-radius"],["fontFamily","--luzmo-slot-menu-list-font-family","--luzmo-font-family"]].forEach(([d,c,u])=>{const p=g.getCssVariableValue(t,c)||g.getCssVariableValue(t,u);a[d]=p}),r.textContent=t.querySelector("[data-task-content]")?.textContent??t.textContent,Object.assign(r.style,{border:`1px solid ${a.borderColor}`,backgroundColor:a.backgroundColor,borderRadius:a.borderRadius,fontFamily:a.fontFamily,fontSize:a.fontSize,color:a.color,paddingInline:`${a.horizontalPadding}`,paddingBlock:`${a.verticalPadding}`}),i.append(r)}})},getInitialData(){const l=t.parentElement;let i=0;return l&&(i=[...l.parentElement?.children??[]].indexOf(l)),{index:i}},onDragStart(){t.style.opacity="0.5"},onDrop(){t.style.opacity="1"}});this._cleanupFns.push(s);const m=g.dropTargetForElements({element:t,canDrop({source:l}){return l.element===t?!1:l?.element?.classList.contains("draggable-slot-content")},getData(l){return j({},{element:t,input:l.input,allowedEdges:["top","bottom"]})},getIsSticky(){return!0},onDragEnter({self:l}){const i=f(l.data);if(!i)return;const r=document.createElement("div");r.classList.add("drop-indicator"),r.dataset.edge=i,t.after(r)},onDrag({self:l}){const i=f(l.data);if(!i){t.nextElementSibling?.remove();return}if(t.nextElementSibling?.getAttribute("data-edge")===i)return;t.nextElementSibling?.remove();const r=document.createElement("div");r.classList.add("drop-indicator"),r.dataset.edge=i,t.after(r)},onDragLeave(){t.nextElementSibling?.remove()},onDrop({self:l,source:i}){t.nextElementSibling?.remove();const r=f(l.data),a=l.element.parentElement;if(typeof i.data.index=="number"&&a){let d=[...a.parentElement?.children??[]].indexOf(a);r==="bottom"&&i.data.index>=d&&d<(a?.parentElement?.children?.length??0)-1?d+=1:r==="top"&&d>i.data.index&&(d-=1);const c=e.activeIndex,u=i.data.index,p=d,w=e.slotContents[u];e.slotContents.splice(u,1),e.slotContents.splice(p,0,w),u===c?e.activeIndex=p:u<c&&p>=c?e.activeIndex=c-1:u>c&&p<=c&&(e.activeIndex=c+1)}r&&(I(i.element),e.requestUpdate(),o())}});this._cleanupFns.push(m)})},this._detachAll=()=>{this._cleanupFns.forEach(t=>t()),this._cleanupFns=[]}}static get styles(){return[z.unsafeCSS(D)]}willUpdate(){this._detachAll()}updated(){this._attachAll()}disconnectedCallback(){super.disconnectedCallback(),this._detachAll()}setActiveIndex(t){this.activeIndex=t,this._sendChangeEvent()}removeSlotContent(t){this.slotContents=this.slotContents.filter((o,e)=>e!==t),this.activeIndex=this.slotContents.length===0?0:Math.min(this.activeIndex,this.slotContents.length-1),this._sendChangeEvent()}render(){const t=this.slotContents.map((o,e)=>{const s=S.localize(o.label??{},this.contentLanguage);return z.html`<li class=${e===this.activeIndex?"active":""}>
|
|
21
21
|
<div class="draggable-slot-content">
|
|
22
22
|
<div
|
|
23
23
|
class="draggable-slot-content-label"
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
* SOFTWARE.
|
|
19
19
|
* */
|
|
20
20
|
import { unsafeCSS as C, html as b } from "lit";
|
|
21
|
-
import { _ as E, d as S, a as O, s as _, g as f } from "../get-css-variable-
|
|
21
|
+
import { _ as E, d as S, a as O, s as _, g as f } from "../get-css-variable-DgTBQV3c.js";
|
|
22
22
|
import { luzmoIcon as I, luzmoTrashOutline as P } from "@luzmo/icons";
|
|
23
23
|
import { l as F } from "../localize-CcDpq940.js";
|
|
24
24
|
import { property as h, queryAll as j } from "lit/decorators.js";
|