p-6d0360c0.entry.js

/*!
 * Built by BASIS
 * Copyright BASIS International Ltd.
 */
import{r as t,c as r,d as e,h as o,H as i,g as s}from"./p-00e3df8e.js";import{h as a}from"./p-3e9fe89f.js";const d=class{constructor(e){t(this,e),this.resizeEvent=r(this,"dwc-splitter-resize",7),this.pointerDownState={distX:0,distY:0,parent:0,master:0,detail:0},this.autosave=!1,this.detailMinSize=void 0,this.detailMaxSize=void 0,this.disabled=!1,this.orientation="horizontal",this.masterMinSize=void 0,this.masterMaxSize=void 0,this.position=void 0,this.positionRelative=50,this.resizing=!1,this.tabTraversable=0,this.theme="default"}onPositionChanged(t){if(isNaN(t))return;const{$el:r,$master:e,$detail:o}=this.getComponents();if(!e||!o)return;const i=this.getComponentSize(r);this.updateDimensions(e,t,i),this.updateDimensions(o,i-t,i),this.position=Math.min(Math.max(this.position,0),i);const s=this.position/i*100;s!==this.positionRelative&&(this.positionRelative=s),this.saveState()}onPositionRelativeChanged(t){if(isNaN(t))return;const r=this.getComponentSize(this.el);this.positionRelative=Math.min(Math.max(t,0),100);const e=r*(t/100);e!==this.position&&(this.position=e),this.saveState()}onRulesChanged(){this.handleSlotChange()}connectedCallback(){this.handlePointerDown=this.handlePointerDown.bind(this),this.handlePointerMove=this.handlePointerMove.bind(this),this.handlePointerUp=this.handlePointerUp.bind(this),this.handleKeydown=this.handleKeydown.bind(this),this.handleSlotChange=this.handleSlotChange.bind(this)}componentDidLoad(){e((()=>{this.restoreState(),this.handleSlotChange(),window.ResizeObserver&&(this.resizeObserver=new ResizeObserver(this.handleSlotChange),this.resizeObserver.observe(this.el))})),this.$divider.addEventListener("pointerdown",this.handlePointerDown,{passive:!1}),this.loaded=!0}getComponents(){const t=this.$divider;return{$el:this.el,$master:this.el.querySelector(':scope > [slot="master"]'),$divider:t,$detail:this.el.querySelector(':scope > [slot="detail"]')}}getComponentSize(t){var r;let e=t.getBoundingClientRect()["vertical"===this.orientation?"height":"width"];return(null==t?void 0:t.isSameNode(this.el))&&(null===(r=this.$divider)||void 0===r?void 0:r.parentElement)&&(e-=this.$divider.getBoundingClientRect()["vertical"===this.orientation?"height":"width"]),e}getCurrentPosition(){const{$master:t}=this.getComponents();return t?this.getComponentSize(t):0}updateDimensions(t,r,e){const o=Math.max(0,Math.min(r,e));"vertical"===this.orientation?(t.style.height=`${o}px`,t.style.width="100%"):(t.style.width=`${o}px`,t.style.height="100%")}saveState(){if(!this.loaded||!this.autosave)return;const t=this.el.id||this.el.getAttribute("name");t?localStorage.setItem(`dwc-splitter-${t.replace(/\s/g,"")}`,this.position.toString()):console.warn("[BBjSplitter<dwc-splitter>]: Autosave is enabled but the component has no id or name attribute",this.el)}restoreState(){if(!this.autosave)return;const t=this.el.id||this.el.getAttribute("name");if(t){const r=localStorage.getItem(`dwc-splitter-${t.replace(/\s/g,"")}`);r&&(this.position=parseInt(r))}}handlePointerDown(t){if(this.disabled)return;if(2===t.button||3==t.which)return;const{$el:r,$master:e,$detail:o}=this.getComponents();r&&e&&o&&(this.pointerDownState={distX:t.clientX,distY:t.clientY,parent:this.getComponentSize(r),master:this.getComponentSize(e),detail:this.getComponentSize(o)},document.addEventListener("touchmove",this.handlePointerMove,{passive:!1}),document.addEventListener("mousemove",this.handlePointerMove,{passive:!1}),document.addEventListener("pointerup",this.handlePointerUp))}handlePointerMove(t){let r,e;t.cancelable&&t.preventDefault(),this.resizing=!0,t instanceof MouseEvent?(r=t.clientX,e=t.clientY):t instanceof TouchEvent&&(r=t.touches[0].clientX,e=t.touches[0].clientY);const{$master:o,$detail:i}=this.getComponents();if(!o||!i)return;const s=this.pointerDownState,a="vertical"===this.orientation?e-s.distY:r-s.distX;this.updateDimensions(o,s.master+a,s.parent),this.updateDimensions(i,s.detail-a,s.parent),this.position=this.getCurrentPosition(),this.resizeEvent.emit({position:this.position,positionRelative:this.positionRelative,isAdjusting:!0})}handlePointerUp(){this.resizing=!1,document.removeEventListener("touchmove",this.handlePointerMove),document.removeEventListener("mousemove",this.handlePointerMove),document.removeEventListener("pointerup",this.handlePointerUp),this.resizeEvent.emit({position:this.position,positionRelative:this.positionRelative,isAdjusting:!1})}handleKeydown(t){if(!this.disabled&&["ArrowLeft","ArrowRight","ArrowUp","ArrowDown","Home","End"].includes(t.key)){t.preventDefault();let r=this.positionRelative;const e=t.shiftKey?10:1,o="vertical"===this.orientation;("ArrowLeft"===t.key&&!o||"ArrowUp"===t.key&&o)&&(r-=e),("ArrowRight"===t.key&&!o||"ArrowDown"===t.key&&o)&&(r+=e),"Home"===t.key&&(r=0),"End"===t.key&&(r=100),r>=0&&r<=100&&(this.positionRelative=r,this.resizeEvent.emit({position:this.position,positionRelative:this.positionRelative,isAdjusting:!1}))}}handleSlotChange(){const{$master:t,$detail:r}=this.getComponents();t&&("horizontal"===this.orientation?(t.style.minWidth=this.masterMinSize,t.style.maxWidth=this.masterMaxSize):(t.style.minHeight=this.masterMinSize,t.style.maxHeight=this.masterMaxSize)),r&&("horizontal"===this.orientation?(r.style.minWidth=this.detailMinSize,r.style.maxWidth=this.detailMaxSize):(r.style.minHeight=this.detailMinSize,r.style.maxHeight=this.detailMaxSize)),t&&r&&(this.onPositionRelativeChanged(this.positionRelative),this.onPositionChanged(this.position))}render(){return o(i,{key:"8ae1d83625e3e6f69b7ac688fcbf4c38ea88acf9",class:a({BBjControl:!0,BBjSplitter:!0,"bbj-disabled":this.disabled})},o("slot",{key:"91bee8c2bd7d016691d20140ecf6b5724668c707",name:"master",onSlotchange:this.handleSlotChange}),o("div",{key:"a445657a119037481999390164a19f271af1ae4b",ref:t=>this.$divider=t,role:"separator",part:"gutter",tabIndex:this.disabled?-1:this.tabTraversable,onKeyDown:this.handleKeydown},o("dwc-icon",{key:"92ec543d2ed5583fbc61249e21014f5a62c40732",name:"grip-"+("vertical"===this.orientation?"horizontal":"vertical"),part:"gutter-handle"})),o("slot",{key:"e147f4f12b22ccb072da0b47cdaa0fec387f54d0",name:"detail",onSlotchange:this.handleSlotChange}))}get el(){return s(this)}static get watchers(){return{position:["onPositionChanged"],positionRelative:["onPositionRelativeChanged"],masterMinSize:["onRulesChanged"],masterMaxSize:["onRulesChanged"],detailMinSize:["onRulesChanged"],detailMaxSize:["onRulesChanged"],orientation:["onRulesChanged"]}}};d.style="@media (prefers-reduced-motion: reduce){*,::before,::after{animation-delay:-1ms !important;animation-duration:1ms !important;animation-iteration-count:1 !important;background-attachment:initial !important;scroll-behavior:auto !important;transition-delay:0s !important;transition-duration:0s !important}}:host{box-sizing:border-box;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;position:relative;-webkit-tap-highlight-color:transparent;text-size-adjust:100%}:host *,:host *::before,:host *::after{box-sizing:inherit}:host{--dwc-splitter-gutter-size:0.214em;--dwc-splitter-gutter-handle-height:3em;--dwc-splitter-gutter-handle-width:0.5em;display:flex;height:300px;overflow:hidden !important;width:100%}:host([orientation=horizontal]){flex-direction:row}:host([orientation=horizontal]) [part=gutter]{cursor:var(--dwc-cursor-resize-row)}:host([orientation=horizontal]) [part=gutter-handle]{height:var(--dwc-splitter-gutter-handle-height);width:var(--dwc-splitter-gutter-handle-width)}:host([orientation=vertical]){flex-direction:column}:host([orientation=vertical]) [part=gutter]{cursor:var(--dwc-cursor-resize-column)}:host([orientation=vertical]) [part=gutter-handle]{height:var(--dwc-splitter-gutter-handle-width);width:var(--dwc-splitter-gutter-handle-height)}:host([disabled]) [part=gutter]{cursor:var(--dwc-disabled-cursor);opacity:var(--dwc-disabled-opacity)}:host([resizing=true]) ::slotted(*){pointer-events:none}:host ::slotted(*){box-sizing:border-box;flex:1 1 auto;overflow:auto;-webkit-overflow-scrolling:touch}:host(.bbj-no-overflow) ::slotted(*){overflow:initial}[part=gutter]{align-items:center;background-color:var(--dwc-color-default);border-radius:var(--dwc-border-radius-pill);display:flex;flex:none;justify-content:center;min-height:var(--dwc-splitter-gutter-size);min-width:var(--dwc-splitter-gutter-size);outline:none;overflow:visible;position:relative;transition:opacity var(--dwc-transition);z-index:1}[part=gutter-handle]{background-color:var(--dwc-splitter-gutter-handle-background, var(--dwc-color-default));border:var(--dwc-splitter-gutter-handle-border, var(--dwc-border-width) solid var(--dwc-splitter-gutter-handle-border-color, var(--dwc-color-default-dark)));border-radius:var(--dwc-splitter-gutter-handle-border-radius, var(--dwc-border-radius-pill));color:var(--dwc-splitter-gutter-handle-color, var(--dwc-color-on-default-text));overflow:visible;position:absolute;transition:var(--dwc-transition) background-color, var(--dwc-transition) color, var(--dwc-transition) border}:host(.focus-visible:not([disabled])) [part=gutter-handle],:host([resizing=true]:not([disabled])) [part=gutter-handle],:host(:not([disabled])) [part=gutter]:hover [part=gutter-handle]{background-color:var(--dwc-splitter-gutter-handle-hover-background, var(--dwc-color-default-light));color:var(--dwc-splitter-gutter-handle-hover-color, var(--dwc-color-on-default-text-light))}:host(.focus-visible) [part=gutter-handle]{border-color:var(--dwc-splitter-gutter-handle-focus-border-color, var(--dwc-color-primary));box-shadow:var(--dwc-splitter-gutter-handle-focus-ring, var(--dwc-focus-ring-default))}:host([theme=primary]){--dwc-splitter-gutter-handle-background:var(--dwc-color-primary);--dwc-splitter-gutter-handle-color:var(--dwc-color-on-primary-text);--dwc-splitter-gutter-handle-border-color:var(--dwc-color-primary-dark);--dwc-splitter-gutter-handle-hover-background:var(--dwc-color-primary-light);--dwc-splitter-gutter-handle-hover-color:var(--dwc-color-on-primary-text-light);--dwc-splitter-gutter-handle-focus-border-color:var(--dwc-color-primary)}:host([theme=success]){--dwc-splitter-gutter-handle-background:var(--dwc-color-success);--dwc-splitter-gutter-handle-color:var(--dwc-color-on-success-text);--dwc-splitter-gutter-handle-border-color:var(--dwc-color-success-dark);--dwc-splitter-gutter-handle-hover-background:var(--dwc-color-success-light);--dwc-splitter-gutter-handle-hover-color:var(--dwc-color-on-success-text-light);--dwc-splitter-gutter-handle-focus-border-color:var(--dwc-color-success)}:host([theme=warning]){--dwc-splitter-gutter-handle-background:var(--dwc-color-warning);--dwc-splitter-gutter-handle-color:var(--dwc-color-on-warning-text);--dwc-splitter-gutter-handle-border-color:var(--dwc-color-warning-dark);--dwc-splitter-gutter-handle-hover-background:var(--dwc-color-warning-light);--dwc-splitter-gutter-handle-hover-color:var(--dwc-color-on-warning-text-light);--dwc-splitter-gutter-handle-focus-border-color:var(--dwc-color-warning)}:host([theme=danger]){--dwc-splitter-gutter-handle-background:var(--dwc-color-danger);--dwc-splitter-gutter-handle-color:var(--dwc-color-on-danger-text);--dwc-splitter-gutter-handle-border-color:var(--dwc-color-danger-dark);--dwc-splitter-gutter-handle-hover-background:var(--dwc-color-danger-light);--dwc-splitter-gutter-handle-hover-color:var(--dwc-color-on-danger-text-light);--dwc-splitter-gutter-handle-focus-border-color:var(--dwc-color-danger)}:host([theme=info]){--dwc-splitter-gutter-handle-background:var(--dwc-color-info);--dwc-splitter-gutter-handle-color:var(--dwc-color-on-info-text);--dwc-splitter-gutter-handle-border-color:var(--dwc-color-info-dark);--dwc-splitter-gutter-handle-hover-background:var(--dwc-color-info-light);--dwc-splitter-gutter-handle-hover-color:var(--dwc-color-on-info-text-light);--dwc-splitter-gutter-handle-focus-border-color:var(--dwc-color-info)}:host([theme=gray]){--dwc-splitter-gutter-handle-background:var(--dwc-color-gray);--dwc-splitter-gutter-handle-color:var(--dwc-color-on-gray-text);--dwc-splitter-gutter-handle-border-color:var(--dwc-color-gray-dark);--dwc-splitter-gutter-handle-hover-background:var(--dwc-color-gray-light);--dwc-splitter-gutter-handle-hover-color:var(--dwc-color-on-gray-text-light);--dwc-splitter-gutter-handle-focus-border-color:var(--dwc-color-gray)}";export{d as dwc_splitter}