{"version":3,"sources":["webpack:///./src/components/ResizableSplit.vue?f127","webpack:///./src/components/ResizableSplit.vue?1777","webpack:///src/components/ResizableSplit.vue","webpack:///./src/components/ResizableSplit.vue?6b83","webpack:///./src/components/ResizableSplit.vue"],"names":["render","_vm","this","_h","$createElement","_c","_self","staticClass","style","width","leftPaneWidth","backgroundColor","resolveColor","leftPaneColor","_t","on","startResize","rightPaneColor","staticRenderFns","props","startWidthPercent","type","Number","default","String","data","isResizing","startX","startWidth","methods","event","clientX","document","addEventListener","resize","stopResize","Math","max","min","newWidth","removeEventListener","component"],"mappings":"kHAAA,yBAA6e,EAAG,G,kECAhf,IAAIA,EAAS,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,MAAM,CAACE,YAAY,mBAAmB,CAACF,EAAG,MAAM,CAACE,YAAY,YAAYC,MAAM,CAC5KC,MAAOR,EAAIS,cAAgB,IAC3BC,gBAAiBV,EAAIW,aAAaX,EAAIY,iBACpC,CAACR,EAAG,MAAM,CAACE,YAAY,gBAAgB,CAACN,EAAIa,GAAG,SAAS,KAAKT,EAAG,MAAM,CAACE,YAAY,UAAUQ,GAAG,CAAC,UAAYd,EAAIe,eAAeX,EAAG,MAAM,CAACE,YAAY,aAAaC,MAAM,CAAGG,gBAAiBV,EAAIW,aAAaX,EAAIgB,kBAAoB,CAACZ,EAAG,MAAM,CAACE,YAAY,gBAAgB,CAACN,EAAIa,GAAG,UAAU,QACnSI,EAAkB,GC2BtB,G,8BAAA,CACEC,MAAO,CACLC,kBAAmB,CACjBC,KAAMC,OACNC,QAAS,IAEXV,cAAe,CACbQ,KAAMG,OACND,QAAS,kBAEXN,eAAgB,CACdI,KAAMG,OACND,QAAS,mBAGbE,KAfF,WAgBI,MAAO,CACLf,cAAeR,KAAKkB,kBACpBM,YAAY,EACZC,OAAQ,EACRC,WAAY,IAGhBC,QAAS,CACPb,YADJ,SACA,GACMd,KAAKwB,YAAa,EAClBxB,KAAKyB,OAASG,EAAMC,QACpB7B,KAAK0B,WAAa1B,KAAKQ,cACvBsB,SAASC,iBAAiB,YAAa/B,KAAKgC,QAC5CF,SAASC,iBAAiB,UAAW/B,KAAKiC,aAE5CD,OARJ,SAQA,GACM,GAAKhC,KAAKwB,WAAV,CAEA,IAAN,oBACA,wBACA,UACA,oBAEMxB,KAAKQ,cAAgB0B,KAAKC,IAAI,GAAID,KAAKE,IAAIC,EAAU,OAEvDJ,WAlBJ,WAmBMjC,KAAKwB,YAAa,EAClBM,SAASQ,oBAAoB,YAAatC,KAAKgC,QAC/CF,SAASQ,oBAAoB,UAAWtC,KAAKiC,aAE/CvB,aAvBJ,SAuBA,GACM,IAAN,6CACM,OACN,gEACA,MCjFwV,I,wBCQpV6B,EAAY,eACd,EACAzC,EACAkB,GACA,EACA,KACA,WACA,MAIa,aAAAuB,E","file":"js/chunk-498ad086.422753e0.js","sourcesContent":["import mod from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--6-oneOf-1-2!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ResizableSplit.vue?vue&type=style&index=0&id=a9a789e4&scoped=true&lang=css&\"; export default mod; export * from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--6-oneOf-1-2!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ResizableSplit.vue?vue&type=style&index=0&id=a9a789e4&scoped=true&lang=css&\"","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"split-container\"},[_c('div',{staticClass:\"left-pane\",style:({\n      width: _vm.leftPaneWidth + '%',\n      backgroundColor: _vm.resolveColor(_vm.leftPaneColor)\n    })},[_c('div',{staticClass:\"pane-content\"},[_vm._t(\"left\")],2)]),_c('div',{staticClass:\"divider\",on:{\"mousedown\":_vm.startResize}}),_c('div',{staticClass:\"right-pane\",style:({ backgroundColor: _vm.resolveColor(_vm.rightPaneColor) })},[_c('div',{staticClass:\"pane-content\"},[_vm._t(\"right\")],2)])])}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n  <div class=\"split-container\">\r\n    <!-- Left Pane (Resizable) -->\r\n    <div\r\n      :style=\"{\r\n        width: leftPaneWidth + '%',\r\n        backgroundColor: resolveColor(leftPaneColor)\r\n      }\"\r\n      class=\"left-pane\"\r\n    >\r\n      <div class=\"pane-content\">\r\n        <slot name=\"left\"></slot>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- Movable Divider -->\r\n    <div class=\"divider\" @mousedown=\"startResize\"></div>\r\n\r\n    <!-- Right Pane (Fills Remaining Space) -->\r\n    <div\r\n      :style=\"{ backgroundColor: resolveColor(rightPaneColor) }\"\r\n      class=\"right-pane\"\r\n    >\r\n      <div class=\"pane-content\">\r\n        <slot name=\"right\"></slot>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nexport default {\r\n  props: {\r\n    startWidthPercent: {\r\n      type: Number,\r\n      default: 30\r\n    },\r\n    leftPaneColor: {\r\n      type: String,\r\n      default: \"grey lighten-3\"\r\n    },\r\n    rightPaneColor: {\r\n      type: String,\r\n      default: \"grey lighten-1\"\r\n    }\r\n  },\r\n  data() {\r\n    return {\r\n      leftPaneWidth: this.startWidthPercent,\r\n      isResizing: false,\r\n      startX: 0,\r\n      startWidth: 0\r\n    };\r\n  },\r\n  methods: {\r\n    startResize(event) {\r\n      this.isResizing = true;\r\n      this.startX = event.clientX;\r\n      this.startWidth = this.leftPaneWidth;\r\n      document.addEventListener(\"mousemove\", this.resize);\r\n      document.addEventListener(\"mouseup\", this.stopResize);\r\n    },\r\n    resize(event) {\r\n      if (!this.isResizing) return;\r\n\r\n      const screenWidth = window.innerWidth;\r\n      const deltaX = event.clientX - this.startX;\r\n      const deltaPercent = (deltaX / screenWidth) * 100;\r\n      const newWidth = this.startWidth + deltaPercent;\r\n\r\n      this.leftPaneWidth = Math.max(10, Math.min(newWidth, 90));\r\n    },\r\n    stopResize() {\r\n      this.isResizing = false;\r\n      document.removeEventListener(\"mousemove\", this.resize);\r\n      document.removeEventListener(\"mouseup\", this.stopResize);\r\n    },\r\n    resolveColor(color) {\r\n      const style = getComputedStyle(document.documentElement);\r\n      return (\r\n        style.getPropertyValue(`--v-theme-${color.replace(/\\s+/g, \"-\")}`) ||\r\n        color\r\n      );\r\n    }\r\n  }\r\n};\r\n</script>\r\n\r\n<style scoped>\r\n/* ✅ Full Parent Height Instead of 100vh */\r\n.split-container {\r\n  display: flex;\r\n  height: 100%; /* Takes full height of parent container */\r\n  flex-grow: 1; /* Ensures it expands fully */\r\n  overflow: hidden;\r\n}\r\n\r\n/* Left Pane (Resizable) */\r\n.left-pane {\r\n  height: 100%;\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: flex-start;\r\n  justify-content: flex-start;\r\n  border-right: 1px solid #ddd;\r\n  user-select: none;\r\n}\r\n\r\n/* Right Pane (Takes Remaining Space) */\r\n.right-pane {\r\n  flex: 1; /* Ensures right pane takes full remaining space */\r\n  height: 100%;\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: flex-start;\r\n  justify-content: flex-start;\r\n  user-select: none;\r\n}\r\n\r\n/* Child container inside the pane should be full width */\r\n.pane-content {\r\n  width: 100%;\r\n  height: 100%;\r\n  padding: 10px;\r\n}\r\n\r\n/* Divider (Resizing Handle) */\r\n.divider {\r\n  width: 6px;\r\n  cursor: ew-resize;\r\n  background: #aaa;\r\n  transition: background 0.3s;\r\n  position: relative;\r\n  z-index: 2;\r\n}\r\n\r\n.divider:hover {\r\n  background: #777;\r\n}\r\n</style>\r\n","import mod from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ResizableSplit.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ResizableSplit.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./ResizableSplit.vue?vue&type=template&id=a9a789e4&scoped=true&\"\nimport script from \"./ResizableSplit.vue?vue&type=script&lang=js&\"\nexport * from \"./ResizableSplit.vue?vue&type=script&lang=js&\"\nimport style0 from \"./ResizableSplit.vue?vue&type=style&index=0&id=a9a789e4&scoped=true&lang=css&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"a9a789e4\",\n  null\n  \n)\n\nexport default component.exports"],"sourceRoot":""}