tp-elements/tp-splitter
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add methods to set width/height programatically

Browse Source
This commit is contained in:
trading_peter 2025-01-28 12:21:45 +01:00
parent 5453201b67
commit 0ddea54621
3 changed files with 9 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "@tp/tp-splitter", "name": "@tp/tp-splitter",
"version": "1.4.0", "version": "1.5.0",
"description": "", "description": "",
"main": "tp-splitter.js", "main": "tp-splitter.js",
"scripts": { "scripts": {

4
tp-hsplitter.js
View File

@ -102,6 +102,10 @@ class TpHSplitter extends LitElement {
document.body.style['userSelect'] = ''; document.body.style['userSelect'] = '';
} }
setHeight(height) {
this.style.gridTemplateRows = `${height} var(--tp-splitter-width, 5px) 1fr`;
}
_enableDrag(e) { _enableDrag(e) {
document.addEventListener('mouseup', this._disableDrag) document.addEventListener('mouseup', this._disableDrag)
document.addEventListener('mousemove', this._resize); document.addEventListener('mousemove', this._resize);

4
tp-vsplitter.js
View File

@ -97,6 +97,10 @@ class TpVSplitter extends LitElement {
document.body.style['userSelect'] = ''; document.body.style['userSelect'] = '';
} }
setWidth(width) {
this.style.gridTemplateColumns = `${width} var(--tp-splitter-width, 5px) 1fr`;
}
_enableDrag(e) { _enableDrag(e) {
document.addEventListener('mouseup', this._disableDrag) document.addEventListener('mouseup', this._disableDrag)
document.addEventListener('mousemove', this._resize); document.addEventListener('mousemove', this._resize);